Comment créer un design de site Web?.

Tout propriétaire de site Web rêve d'un design unique pour sa ressource. Tout le monde sait qu'une personne est accueillie par ses vêtements. Il en va de même pour le site, car le visiteur est d'abord attentif à la conception du projet, puis au contenu. Si le design est trop brillant ou, au contraire, terne, l'utilisateur quittera bientôt la ressource. Ne surchargez pas le site Web avec des éléments inutiles, car les ressources Web au design minimaliste semblent souvent beaucoup plus intéressantes. Comment créer une conception de site Web?

En fait, l'ensemble du processus de conception peut être divisé en trois étapes: création d'un croquis, création d'une mise en page dans un éditeur graphique, mise en page du design. Un croquis de conception peut être dessiné dans un simple éditeur de photos ou avec un crayon ordinaire sur une feuille de papier. En ce qui concerne la mise en page, la plupart des concepteurs utilisent Photoshop comme l'éditeur graphique le plus puissant qui existe. Pour la conception de la mise en page, vous aurez besoin de connaissances en langage de balisage hypertexte et en CSS. Avant de créer votre propre design, posez-vous quelques questions simples: est-ce que je connais HTML et CSS, et puis-je également travailler avec un éditeur graphique?

Si vous répondez non, le processus de conception ne dépassera pas la première étape. Il n'est pas difficile de dessiner un croquis, mais tous les utilisateurs ne peuvent pas créer une mise en page et créer le design fini. En conséquence, il est recommandé d'apprendre d'abord les bases du HTML | CSS, ainsi que de regarder quelques vidéos tutorielles sur Photoshop, afin de savoir où se trouve chaque outil, comment appliquer des filtres et bien plus encore.

Avant de commencer à dessiner, créez une image du futur design dans votre tête. Veuillez noter que tout design se compose des parties suivantes:

  • "En-tête" du site - la partie supérieure de tout design, qui comprend généralement un logo, le nom du site et quelques boutons (contacts, A propos de l'auteur). L'en-tête peut être de différentes hauteurs, mais généralement ce paramètre ne dépasse pas 300 pixels. Les formulaires de recherche et les bannières publicitaires se trouvent souvent en haut du site.

  • "Sidebar" - le menu latéral du site. La barre latérale contient des informations secondaires et des éléments supplémentaires: un bloc avec de nouveaux articles, un formulaire de recherche, divers sondages et calendriers, des liens, des annonces et des éléments de navigation dans les ressources. Plusieurs barres latérales peuvent être utilisées dans la conception du site, mais il existe des conceptions sans barres latérales.
  • "Sous-sol" - la partie inférieure du site. Il contient généralement un lien vers la ressource principale et le droit d'auteur dans le style "(c) 2014 Le meilleur site". Mais ces dernières années, le concept de conception de « sous-sol » a changé avec l'avènement des appareils mobiles. Au "sous-sol", des éléments qui sont habituellement placés dans des barres latérales ont commencé à s'installer.

  • "Partie principale" - un bloc dans lequel se trouve le contenu principal. La plupart des concepteurs placent la partie principale du site au centre pour faciliter la lecture du matériel.

Ainsi, vous savez maintenant de quels blocs se compose le site. Il est temps de commencer à résoudre la question de savoir comment créer vous-même une conception de site Web. Ouvrez l'éditeur de photos le plus simple (la peinture suffit) et créez un nouveau modèle avec une résolution de 1280x1024. Il convient de rappeler tout de suite que lors de la création de sites, les mesures métriques ne sont pas utilisées. Tous les blocs sont "mesurés" en pixels.

Par exemple, vous avez décidé de dessiner avec une barre latérale. Marquez les bordures du pied de page, de l'en-tête du site et de la barre latérale dans un éditeur graphique.

Avez-vous une idée pour faire des colonnes latérales et placer le contenu au centre? Génial, mais tenez compte de la largeur des barres latérales et de l'espace pour le contenu principal lorsque vous marquez. Les colonnes latérales ne doivent pas être trop larges (pas plus de 300 pixels), et au moins 500 pixels doivent être laissés pour le contenu principal, sinon le texte sera gênant à lire.

Maintenant que les principales marques sont réparties, il est temps d'ajouter quelques éléments à l'esquisse de conception. Ajoutez des droits d'auteur dans le pied de page, le champ de recherche, le titre, etc. L'esquisse de conception prendra un aspect plus intéressant et ne sera pas une collection de formes géométriques.

Si vous avez appris à travailler dans Photoshop, il est temps de convertir l'esquisse en mise en page. Mais avant cela, décidez des couleurs du site. Pour les sites d'actualités, les couleurs d'arrière-plan blanches, les couleurs de texte noires et les liens bleus sont plus appropriés. Si le design est créé pour un site de femmes ou de voyage, utilisez des couleurs plus vives. Dans le même temps, vous ne devez pas faire un arbre de Noël avec le design, car l'abondance de fleurs interfère avec la perception du contenu principal.

Commencez à remplir chaque bloc de la mise en page avec des graphiques. Expérimentez avec les couleurs et les arrière-plans, créez vos propres éléments et boutons. Cependant, sur Internet, il existe un grand nombre d'arrière-plans différents, des boutons pour créer un design.

Lorsque la mise en page est enfin prête, découpez-la en blocs et faites-en un dessin. En même temps, signez chaque couche pour faciliter la composition.

Avec l'avènement des appareils mobiles, la popularité des conceptions "en caoutchouc" réactives a augmenté. Chaque utilisateur peut créer un thème pour son site, mais seul un vrai designer peut l'adapter pour tous les appareils. Au début de votre carrière de designer, essayez de commencer avec un modèle simple.

Souvenez-vous de trois règles simples d'un « grand design »:

  • le texte doit être bien lisible même avec des images désactivées dans le navigateur;
  • essaient de ne pas utiliser de couleurs « en vrac »;
  • Créer une navigation de site conviviale.

Après avoir créé le design et l'avoir transféré sur le site, assurez-vous de le tester dans différents navigateurs. Invitez des amis et des connaissances à tester, car la critique de quelqu'un d'autre a un effet positif sur une personne. N'oubliez pas la règle de base: le design du site doit plaire non seulement à vous, mais aussi aux autres utilisateurs. Par conséquent, écoutez toujours les opinions des visiteurs de votre projet.

.