bonjour a tous
 
je me pose plusieurs questions a propos du design des sites web.
en gros comment fait on ?    
 
on le dessine sous photoshop et ensuite on le decoupe en petits morceaux et on les places sur la page ? ? (mais comment ? )
 
j'ai aussi entendu parler du CSS et j'ai d'ailleurs telecharger top style , mais je vois pas trop ce que c'est du CSS par rapport a du html ou php par exemple ...
 
en fait ce que je cherche si ca existe, c'est un tutorial pour faire une page web( et pas pour apprendre le html ou le php)
 
edit: tant que j'y pense, est ce qu il faut faire un design différent pour toutes les résolutions ?
 
 
merci d'avance

Va sur http://forum.titaxium.com
Ils te font le design de ton site gratuitement et avec un délai très raisonnable. Il y a une section où tu peux poser des questions  des designers très compétents...

ok merci je vais aller y faire un tour  

J'irai peut-être leur soumettre mon site, car je sis à la recherche d'un nouveau design, et autant niveau ergonomie et dev je n'ai aucun problème, autant pour le deign pur et dure, j'ai vraiment du mal
 
Par contre, le design de leur site euh... Il m'inspire vraiment pas confiance... Pas beau et pas ergonomique... Pas gagné en somme

et en plus il fait très mal au yeux  . Enfin, comme on dit, l'habit ne fait pas le moine...(mais il y contribu)

C'est un forum où ils font le concours de la signature la plus gigantesque et du plus mauvais gout  
 
Enfin, bon, leurs kits cassent pas trois pattes à un canard non plus.

 
oui enfin ca depend y a certains qui sont pas mal
 
mais de toute facon j'aimerais le faire moi meme donc je cherche des infos sur la facon de faire un designe, et sur le CSS
 
 

Heu... non ça c'est à éviter. Ça produit au final des sites lourds et peu accessibles. Et tu constateras que finalement peu de sites sont fait comme ça.

http://openweb.eu.org/css/
 
Actuellement on encourage l'utilisation des CSS pour tout ce qui concerne la présentation et la mise en page du site. En gros le HTML ne devrait servir qu'à structurer les données d'une page. On utilise alors les CSS pour définir les couleurs, les polices, la disposition du texte (colonnes, positionnement des éléments).
 
L'avantage est que le jour où tu veux changer complètement l'apparence de ton site, il suffit de changer les propriétés CSS. Comme sur http://www.csszengarden.com/ par exemple (on change de feuille de style avec les designs proposés dans la colonne de droite). À chaque fois on ne change que le fichier CSS attaché à la page, jamais le code HTML lui-même.
 
On gagne donc du temps en maintenance et on produit des pages plus légères et plus accessibles.
 

Voir sur Openweb et les liens donnés dans la FAQ.

Oui : soit tu fais un site qui occupe toute la largeur de l'écran (comme le forum HFR par exemple) soit tu te contraints à rester dans un cadre général qui passe en 800x600 (très peu de monde à une résolution inférieure à ça).
 
La première solution est tout de même préférable.

d'abord merci bcp gm_superstar pour toutes ces infos    
 
c'est impressionant les css , je pensais que ca servait uniquement a changer l'aspect (couleur, polices ,....) mais apparement c'est carrément tout la disposition    
 
mais si ce n'est pas en découpant comment dessiner le design alors ? on fait les éléments séparément , un menu, une baniere?
prenons l'exemple du site HFR , comment faire pour ecrire sur le graphisme (le menu, la date ... )
 
 
mais bon tout ca est peutetre expliquer dans les liens que tu m'a donné, je vais aller y jeter un coup d'oeil
 
 a bientot  

si je peux te donner quelques conseils quand au design de ton site :
j'ai débuté il y a quelques mois seulement, et j'ai compris pas mal de choses qui pourrait t'aider.
 
->le design de ton site
comme tu l'as signalé, il faut que tu le conçoives quasi-entièrement sous photoshop.
a propos de ta question sur les resolutions, je te suggère de monter un site en 780/500 (environ), pour qu'il passe aussi bien sur les resolutions 800/600 que les resolutions plus elevés (site multi-resolution koi)
sous photoshop, tu dessineras donc sur un document de la taille de ton site web. il représentera la "maquette".
 
->
la découpe : comme tu l'a compris, il faudra que tu decoupes cette maquette en tranches. ces tranches seront ensuite à intégrer dans ta page web.
La solution que j'emploie est de créer un site en tableaux, que tu découpes en céllules qui comporteront chaque partie de ta maquette.
a ce propos, n'hésites pas à faire de nombreuses cellules en differenciant bien chaque element de ta maquette (le logo, le titre, chaque bouton etc.), ainsi, quand tu modifieras une partie de ta maquette (la police du titre par ex), tu n'auras qu'a modifier cette tranche et donc la cellule correpondante dans ta page web.
la decoupe en tranche est assez delicate au debut mais tu finis par comprendre très rapidement son fonctionnement sous photoshop.
 
->concernant les .css, pour "reduire" un peu son fonctionnement mais surtout reduire le principe, la feuille css servira a lister et referencer tous les styles que tu veux utiliser sous ta page (un style pour le titre, pour le contenu, pour les liens, pour les autres titres, les dates etc), et les pages de ton site s'y referont.
ainsi quand tu voudras changer la police de ton site, tu n'auras pas a le faire dans chaque page, mais uniquement sur ta feuille css de reference.

 
    C'est le passé tout ça, complétement obsolete comme solution, mettez vous aux normes bon sang et faites les choses proprement    

 
soit précis    
c koi qui est obsolète ?
on fait comment maintenant ?
 
moi en tout cas j'ai bossé comme ça en utilisant les conseils de "specialistes", et on m'a jamais dit que ct obsolète    
 
dis moi tout    

Regarde la FAQ    
 
La présentation en tableau est obsolète, la présentation doit être séparée du contenu HTML dans les CSS .
 
Regarde la réponse de GM_superstar plus haut dans le topic !
 
Quelques liens utiles :
 
http://forum.hardware.fr/forum2.ph [...] 941&cat=10
 
http://openweb.eu.org/
 
http://www.pompage.net/

Mais tout dépend de ce que tu veux mettre dans ton site web... Il N'y a PAS de règle unique. Il ne faut pas croire ceux qui disent ça.
 
Admettons que tu aies un site du type www.hardware.fr à monter. La première étape est de déterminer les grandes parties qui composent la page. On a un grand bloc principal d'une largeur connue, un en-tete, un menu, un bandeau de pub et enfin le contenu lui même. Dans ce contenu on peut distinguer le menu latéral, les news, l'article "à la une", les derniers articles et les crédits.
Chacune de ces parties devrait constituer un bloc au niveau HTML :
 

 
Bon ça c'est juste la structure principale de la page. Il y a encore beaucoup de chose à mettre à la place des "..." mais c'est une bonne base de travail pour commencer à appliquer les CSS.
 
La seconde étape pourra consister à utiliser les CSS pour disposer ces blocs comme ils le sont sur la page actuelle de hardware.fr. Car tous les DIV qui sont définis la dessus ne font que s'empiler les uns sur les autres par défaut.
 
Alors seulement on pourra s'intéresser au contenu de chacun des DIV et travailler en parrallèle avec les CSS pour le positionnement et le style.
 
Voilà c'est UNE méthode. Adaptée au cas www.hardware.fr mais il y en a sans doute d'autre. Tout dépend du type de site que tu veux concevoir...

Dis moi, pour toi un site web ça se résume à une page principale avec une image découpée en morceaux et le tout rentrant au chausse-pied dans l'écran ?

Les tableaux, utiliser le HTML pour la mise en page.

On utilise les CSS pour tout : le style, le positionnement, l'accessibilité, etc... (cf FAQ)
 
Bref le but c'est d'arriver à une séparation contenu (le HTML) et présentation (les CSS). Dans le but de gagner du temps en maintenance (l'exemple de zengarden est très parlant) et en légèreté.

Désolé mais tes "spécialistes" en sont restés à des méthodes de conception de site web vieilles de 5/6 ans. Le HTML et les CSS ont évolué depuis.

Non, le CSS et le HTML n'ont pas évolué depuis 5-6 ans (ils datent respectivement de 98 et 00 pour la seconde édition aux changement mineures).
Ce sont surtout les browsers qui ont évolués.

 
oui d'un point de vue du design oui    

Honte à moi. Je vais de ce pas me flageller avec des orties pour expier cette impardonable faute.

Je comprends mieux alors
 
Bon tu conviendras que ce genre de design ne représente qu'une toute petite partie de ce qu'on trouve sur le Net

 
ok
 
je savais pas tout ça
 
comme je l'ai dit, je suis débutant
j'ai appris a monté des sites (et surtout un site) en venant sur le forum, et notament sur graphisme.
 
honnetement, quand on me parlait de css au depart, je savais pas de koi il sagissait.
celui qui a ouvert le topic semble débuter, et je me retrouve complètement dans ces questions.
je cherche donc à lui a apporter les réponses simples que j'aurais aimé avoir quand des notions evidentes pour certains le sont bcp moins poour ceux qui debutent.
 
je sais par contre que tout ça evolue très vite.
j'ai l'autre fois visité un site qui démontrait qu'avec la simple utilisation des css, le site pouvait changer totalement d'apparence, rien qu'en cliquant sur un lien.
 
maintenant, je dois d'admettre que ce que tu dis m'interesse enormement (separation contenu/présentation), mais je pige pas concrètement comment ça fonctionne
je dois pas assez connaitre les possibilités des css, que je limite aux propriétés de mes polices.
t'as pas un lien ou un site qui explique cette "nouvelle" façon de préparer/composer son site web    
 
pour les spécialistes que j'evoquais, ce sont principalement des designer, pas forcément férus de code  

j'aurais préféré des ronces mais les orties feront l'affaire (faute de grives...)
 
 
 
 

dans ces cas-là faut faire attention de pas induire d'autres débutants à l'erreur    
si tu n'es pas sur de tes dires, précise-le

Oui, il est clair que sur graphisme, le discours qu'on peut tenir ici a beaucoup plus de mal à passer... Et c'est pas faute d'essayer

D'accord, mais je pense que quitte à débuter autant débuter en apprenant les techniques actuelles et pas celles d'il y a 5 ans.
Même si j'en conviens les agences web ont du mal à franchir le pas

Commence par explorer Openweb et les liens proposés dans la FAQ. Il y en a pour les débutants (faut juste les trouver dans le bazar   )
 
Et puis n'hésite pas à revenir et à créer un sujet pour une mise en pratique concrète. C'est encore le meilleur moyen d'apprendre.
 
Jette un oeil aussi à la FAQ de temps en temps je vais bientôt ajouter un "article" sur la manière de concevoir un site en respectant les standards du web (XHTML, CSS...) à partir d'un site existant (celui Carrefour.fr)

Oui c'est un autre problème Pourtant il n'y a rien de compliqué derrière les CSS... Mais les outils WYSIWYG (type Dreamweaver, Frontpage...) devraient être meilleurs dans leurs futures versions pour le support des CSS.

merci a tous pour les infos/conseils
je commence a mieux comprendre l'utilité des CSS
 
now j'ai de la lecture je vous montrerai l'etat d'avancement (et j'aurai plus que probablement des questions )