Voir la source de Webdev


NB : utiliser un outil de génération tout cuit permet d'éviter de se taper toutes les complexités du webdesign. Le tout reste de dégoter un bon outil.


== webdev : design ==
* https://www.google.com/webmasters/tools/mobile-friendly/ : service google pour évaluer si un site passe bien en mobile ou pas
* même si un website n'est pas envisagé pour mobile, on a probablement quand même intérêt à designer responsive tout de suite, çàd pas forcément via les techniques responsives, mais déjà au moins au niveau du look. ie ne pas pondre un look qui serait impossible à porter sur mobile/tablette
* ainsi, pour le bandeau supérieur, et pour les bandeaux en général, il ne faut pas aligner trop de trucs dedans. 2 ou 3 éléments sont probablement un maximum (... et non pas 5 comme je le tente !) 
* 1 ou 2 éléments fixes (eg image) sont un maximum dans un bandeau, plus éventuellement un élément textuel susceptible de faire amortisseur
* dans le bandeau supérieur de xxx , il y a un seul élément image à gauche, et en plus il rétrécit avec le rétrécissement de la fenêtre
* Pour le format général d'une page, un empilement de blocs horizontaux, assez indépendants, et centrés, ça simplifie la vie ... et 99,9% des sites semblent procéder ainsi.

== Dev ==
* pour des A/R rapides entre codage et visu, le plus simple est de rédiger sous forme de fichier *.html, et de visualiser directement avec le navigateur. Si on code en php, c'est plus compliqué. On peut alors uploader sur le serveur, puis visualiser, mais il faut donc se taper un upload à chaque modification. à la longue, c'est lassant.
* une fois que le fichier *.htm est quasi au point, rien n'empêche alors de l'enregistrer en *.php et d'y rajouter du code php. Mais au moins le gros du codage html aura été fait (avec des A/R plus rapides).


== Fontes de caractères ==
* firefox, ne semble pas posséder des masses de fontes par défaut. Si c'est pour un titre dans un bandeau de homepage, il vaut peut-être mieux carrément le pondre en tant qu'image. (C'est sans doute pas par hasard que beaucoup de websites procèdent ainsi).
* https://developer.mozilla.org/fr/docs/Web/CSS/font-family bien
* https://www.w3.org/Style/Examples/007/fonts.fr.html bien
* GIMP 2.8 comment ajouter de nouvelles polices d'écriture https://youtu.be/yRg2Wmwa1BQ bien

== Couleurs ==
* pour la lecture du texte, il faut, évidemment, avoir du **contraste** par rapport au fond
* http://www.css-faciles.com/couleurs-css.php couleurs css , bien
* http://stylescss.free.fr/v2-tutoriels/colors.php bien , la palette de couleurs est bien visible
* https://www.cssdebutant.com/coder-en-css-couleur-espace-alignement-texte.html bien. Nous rappelle que firefox propose en standard dans le menu développement une loupe/pipette qui indique le code couleur !