En train de glander à 4h du mat, et n'ayant tjr pas fait ce %$#%!% d'upload en PHP (oui c'est rapide à faire mais je suis un glandu né, ca fait 1 semaine que je dois m'y mettre.
 
Je me suis dit qu'on pourrait faire un topic unique qui regrouperai les méthodes et outils de chacun pour créer de A à Z sa mise en page. Je ne parle de là que d'un résumé bref du comment qu'on fait et de ce qu'on utilise.
 
Ex moi :  
 
- Maquette sous Fireworks
- Ensuite imagination des blocs sur papier pour faire la mise en page de la maquette  
- Création du Model HTML avec topstyle Pro, attention NO TABLE svp
- Utilisation de Topstyle Pro pour les styles, soit je joint une feuille CSS à la maquette HTML, soit j'attaque directement dans les balises Style et ensuite après je copie tout dans une CSS.
 
Pourquoi ces 2 logiciels :
- Fireworks, je l'aime bien, je l'utilise depuis deux ans et il ne m'a pas fait faux bon
- TopStyles Pro, à ne pas confondre avec le lite. Il est très puissant, permet de zapper entre le moteur IE, et Gecko pour la prévisualisation. Gère très bien les standards pour la complétion au niveau des styles c'est super aussi.
 
Bon il est 4H du matin, pardon de mal m'exprimer mais j'ai un peu mal à la tête, je rééditerai mon post un peu plus tard.

Comme chez moi la création du code PHP (ou autre) est intimement liée à l'interface, je vais en dire 2 mots.  
 
En général, je commence à coder rapidement une sorte de maquette pour voir au plus vite comment mon système va s'articuler. A ce stade c'est encore en xhtml pur, CSS sert juste à la navigabilité (aligner le menu par ex). Ensuite, je reprends le code PHP/SQL/HTML pour faire quelque de bien propre, c'est l'étape la plus longue et de loin ! Le papier et le crayon me sont indispensables, du moins pour trouver l'"architecture".
Une fois que je suis satisfait du code, je passe aux CSS, généralement les idées me sont venues en codant et testant le reste. Puis je passe un temps fou à me décider pour une bordure bleue ou grise . Mais pas autant qu'à dégueulasser mes styles pour qu'ils fonctionnent sous IE.  
 
Les outils ?
Sous windows :

• Context pour les fichiers PHP et CSS. Je trouve qu'il n'en fait ni trop, ni trop peu, c'est parfait.
• SQLyog pour gérer les bases MySQL et éditer les requêtes, c'est vraiment génial !

Sous Linux :

• Kate, très complet et se configure bien.

Sous le deux :

• The Gimp, moins bon que Photoshop (AMHA), mais je préfère son interface (je suis le seul ?!!).

Ca c'est pas bon, parce que du coup du fait des blocs pour la mise en page... combien de fois on voit des trucs du coup genre <div id="col_gauche">, etc... Faut commencer par la structure et le contenu, et une fois que t'as ça, tu mets tout en forme...

Ok mon colonel

Humm pardonnez la naïveté de ma question mais quel est le problème avec un <div id="col_gauche"> (FlorentG) ?
J'utilise cela et d'après ce qui vient de se dire, ce n'est pas bon. Que fait-on à la place svp ?

Le code xhtml doit representer la structure du document et en aucun cas avoir des informations conernant le mise en page.
 
La mise en page est faite uniquement grace aux CSS.
 
Le fait d'avoir un "<div id='col_gauche'>" est mauvais, car cela est une information graphique "colonne de gauche". Si la css en question veut metre les informations contenues dans ce div a droit, alors l'id n'as plus de sens.

Exactement Quand on dit pas de présentation dans le document XHTML, ça compte aussi pour les attributs genre classes ou ids

Ok, je crois avoir compris, c'est juste un problème de nom, si on l'avait appelé menu (par exemple), cela n'aurait pas posé de problème, oui ?

Voilà

Tiens, une excellente méthode pour designer un site, posté par Masklinn dans BlaBla :