Version imprimable
Bonjour, parfois je tombe sur des sites et je l'ai trouvé exceptionnellement magnifiques !
J'aimerais savoir quelles sont les règles de design d'un site ?
Quelles sont les grandes lignes pour faire de beaux sites ? Je sais qu'il ne faut pas centrer son texte, garder les même couleurs, etc... Pourriez vous me donner le fil conducteur ?
:merci:
A mon avis, il faut se réferer aux principes de création d'interfaces homme-machine de manière générale.
Oui j'ai déjà ces éléments ! Le site ne doit pas être très coloré ! Juste quelle couleur au rollover, les images doivent etre simples, clean, etc. Le site doit être vraiment classe avec un design soigné ! voila...
J'ai pas envie de m'orienter vers des freelayout, j'ai envie de le faire moi -meme et j'aurais voulu des conseils !
:merci:
Citation:
Le webdesign désigne la création du support visuel à destination d’un site Web. Il s’agit d’une phase prépondérante dans la conception d’un tel site. L’identité d’un site Web, après avoir été conceptualisée, sera transformée en lignes de code et images pour s’afficher dans un navigateur Web. Comme pour l’infographie et le graphisme, le webdesign n’a pas encore acquis son indépendance à part entière comme activité artistique. Les raisons sont nombreuses, autant que les affinités qu’elle exige ; le webdesign concerne la création de la charte graphique, l’interface et la navigation du site, l’arborescence. Ce qui demande de nombreuses compétences en graphisme, programmation, animation ainsi qu'une bonne connaissances des contraintes techniques liées à ce domaine (respect des standards W3C, accessibilité, portabilité ...).
L’objet du webdesign est de valoriser l’image du propriétaire du site par le biais d’éléments graphiques afin d’en renforcer son identité visuelle, néanmoins plusieurs contraintes liée à l’ergonomie et à l'accessibilité réduisent les possibilités et les libertés du designer. Un site doit avant tout répondre aux attentes des utilisateurs. Généralement un compromis doit être trouvé entre le graphisme et la sobriété nécessaires à la lecture et la navigation.
Question de gout et de feeling , toute façon le site que tu as trouvé tres beau ton voisin le trouvera degueu ....
Les seuls conseils que je peux te filer : evite tout ce qui est gif animés telechargés sur les sites , du genre 'En construction' etc .... toutes ces petites animations filent envie de gerber !
Evite les gros blocs de couleurs unies et opposées , genre l entete vert fluo , la partie affichage rouge petante !
Evite les 2000 bannieres publicitaires aux formats tous differents (a la limite une seule banniere proprement placée des fois se fond dans le design....)
Voili voilou
Juste une adresse avec quelques trucs sympas:
:fleche: A complete guide to designing web sites that work
J'ajouterais une règle qui me semble fondamentale : le design, ce n'est pas de la "déco" pour faire joli. Une page Web, comme une chaise, a d'abord une utilité pratique (transmettre de l'info ou faire agir le visiteur) et l'organisation de la page doit être pensée dans ce sens.
Il faut donc, comme le dit BrYs, une réflexion préalable et en général un vrai cahier des charges qui reprend :
- les objectifs généraux/commerciaux du site : générer des ventes pour une boutique, faire venir des clients pour un café, faire lire des news pour un site d'infos
- les cibles : qui sont les visiteurs ? Pourquoi viendraient-ils ? Quelles sont leurs connaissances et compétences ?
- les concurrents : quels autres sites ont le même but ? Qu'est-ce que j'apporte de plus ? Quels sont les "codes" du secteur (couleurs, visuels, vocabulaire) et puis-je les casser ou dois-je m'y plier ?
De manière générale, un site "esthétique" est un site minimal, où aucune image n'est en trop. Chaque élément doit servir le message. Si je choisis du rouge pour une marque de yaourts, je risque de choquer mes visiteurs. Mais pour une marque de voiture de sports, c'est peut-être approprié.
Après, tu rentres dans le design au sens large avec beaucoup, beaucoup de choses à apprendre dans plein de domaines :
- l'organisation de l'information (cheminement de l'oeil, zones chaudes et froides)
- la typographie (succession de blocs, hiérarchie, lisibilité)
- la rédaction de contenus textes pour le Web (longueur, vocabulaire)
- la théorie des couleurs (quelles associations, quel impact psychologique selon les visiteurs et leur culture ?)
- le marketing et la communication (mise en valeur de produits, maximisation des ventes)
- l'usabilité et l'accessibilité des contenus
- le (X)HTML + CSS
- le scripting JS-DOM-Ajax
- etc.
Il y a énormément de ressources en anglais sur ces thèmes. Si tu es particulièrement intéressé par l'un de ceux-ci, je peux t'aiguiller. Par contre en français il y a des lacunes pour la partie théorique, je trouve.
J'ai quelques liens sur mon site aussi si tu veux.
Bon courage.
Le meilleur exemple de graphisme au service des objectifs, ce sont les "redesigns" d'Andy Rutledge :
* CarMax
* La Maison Blanche
Ensuite il y a plein d'articles sur le design en général sur ces sites :
* A List Apart (standards Web, CSS, accessibilité)
* Useit.com Alertbox (usabilité, accessibilité)
* Digital Web (Web, design, études)
* Boxes and arrows (réflexion sur le design Web et d'applications)
* UXMatters (expérience utilisateur)
Ce lien est aussi très intéressant pour ceux qui souhaite ne pas faire d'erreur dans leur design :
:fleche: Les Erreurs du web design
:ccool:
Je vous propose encore un ptit document très pratique pour les standards :
Ergonomie Web
Voici un article intéressant (en anglais) sur les 10 commandements du webdesign.
http://www.businessweek.com/innovate...623_750025.htm
Pas mal les dix commandements ;)
Je vous propose un résumé des Bonnes pratiques en ergonomie Web :
http://arnolem.developpez.com/ergono...les-ergonomie/
Hello,
Je suis tombé sur ce topic qui résume quelques idées du webdesign. Je pense que c'est un bon complément aux liens déjà mentionnés !
http://www.superbibi.net/web-marketi...-pour-les-nuls
Bonjour à tous,
Ce topic m'a inspiré et j'ai également souhaité partager mes 10 commandements en WebDesign.
J’espère que mon article vous plaira, merci à Dsphinx pour l'idée :)
Merci pour les liens de renseignement donné :D
Un site peut être beau et inefficace.Citation:
Envoyé par Dsphinx
D'autres sites sont moches mais très efficaces.
Tout est une question d'objectif.
Quand on est ambitieux, on veut le must !
Mais faire un site beau et efficace, c'est beaucoup de boulot...
Ça passe non pas seulement pas les "10 commandements du webdesign" qui ne sont qu'une large vulgarisation d'études ergonomique, cognitive et marketing. Ça passe pas la lecture des études originelles, car leurs conclusions sont souvent vecteurs d'interprétations. Ce baser sur les vulgarisations c'est ne faire vivre qu'une seule des interprétations possibles et la porter en vérité.
Un bon début c'est de lire des bouquins en ergonomie web. Les bouquins ou le site d'Amélie Boucher (une ergonome web) sont par exemple une bonne approche.
Ensuite il faut être curieux et s’intéresser aux conclusions de recherche en psychologie cognitive. En entend souvent parler de "règles des trois clics" par exemple mais il est bon de savoir d'où ça vient et quel est la limite à de telle règle. La vulgarisation l'a promulgué au rang de règle absolue alors que les études scientifiques d'où elle provient sont plus souple (et ont tenté de quantifier cette souplesse).
Il y a également les études d'eye-tracking qui sont intéressantes (bien qu'à toujours remettre dans leur contexte).
Les questions d'accessibilités sont aussi à prendre en compte. Un bon site doit être utilisable et compréhensible pour un maximum de personnes.
Enfin, il faut se gaver de sites et les analyser sous différents angles (graphique/ergonomique).
Bref, c'est un métier. Quand on veut faire du top, il faut s'en donner les moyens. :)
Tu as plusieurs critères à respecter, comme le code couleur (couleur à respecter en fonction du domaine d'activité), l'arborescence (créer une rubrique pour chaque activité ou domaine d'activité), un bon développement et un contenu unique et personnalisé pour qu'il puisse être référencé,
en espérant t'avoir aidé ;)
Incomm.
=> Ton lien ne fonctionne pas :(Citation:
Envoyé par Fildz