Bonjour tout le monde !
Alors voila aujourd'hui j'ai esayer de realiser un tutorial avec tout les astuce que j'ai pu trouver sur le web ou que l'on ma donner alors voila un petit recapitulatif , attention c'est long !
Ps
Oo il neige a gros flocon et sa a l'air de tenir !
-Introduction-
Voila nous allons commencer notre site web mais pour que notre site web soi beau et appresiable il lui faut de la "cohérence" !
Et la cohérence n'est pour le visiteur qu'une simple question de gout, ce qui ce traduit par le design.
Le design doit-être en rapport avec le sujet qui correspond au site (Les tux,un site d'expositio,, d'entreprise...) mais il doit rester clair car c'est le plus important !
Imaginez vous un instan arivez sur un site avec plus de chose differente tout confuse un peu de flou par ici un peu trop claire par la , un bonshomme par ici , une mascote par la ,ceci est trop dur a regarder et on se lasse vite !
Néanmoins le web évolue, ses normes aussi et il y as nombres de site qui ont un design plus ou moins hors sujet !
Il faut donc savoir s'adapter et rester à jours, mais c'est un tout autre sujet.
Nous allons donc dans ce tutorial Enbelir notre site en lui creean un design propre mais avant tout :
?Un design ce compose de quoi ?
-->Un design ce compose d'un minimum de quatres éléments.
-->Un fond !
-->C'est plus commun de l'appler background . Cela parait anodin, mais il fait une bonne partie de la cohérence de votre futur site !
-->Une bannière (ou header).
Ce dernier élément doit être l'emblème de votre site.C'est la clé de la réussite mais à la place de ce header vous pouvez aussi utiliser un logo tout est bon mais ceci est très important car comme dit plus haut il represente votre site !
-->Un menu pour dirigez les personne visitant votre site !.
Cela paraît logique, mais sans lui, il n'y as pas d'interet !!. Ce menu doit etre dernière lisible, beau et manifique enfin qui donne envie d'etre regarder !
-->Une zone de texte !
C'est là que le contenu sera affiché ( un texte une image , un tutoriel !
.C'est un élément à garder sobre et sur lequel le texte doit rester très lisible.
-->En extra, il y as le pied du site pour y faire apparaître les copyrights et autre droits d'auteur (après tout ce boulot, ce serai quand même idiot de ce faire piquer notre design !
.
Par la suite, la découpe de votre interface ce présente. Après tant de travail, il serait vraiment bête de négliger cette partie simpliste, mais qui demande de la rigueur...
-le tutoriel !-
Pour creer un design il vous fau une base !
Une base pour moi c'est une idee !
Donc vous avez qu'a dessinez sur une feuille de dessin au crayon a papier votre design pour plus tard l'incorporer sur photoshop !
Voila sur se sujets je ne peut pas trop vous aidez car un design depent de tout et donc c'est assez dificile de faire un tuto sur la creation de design !
Plus tard je rajouterais peut etre des effets sympa a utiliser dans vos design et si vous en avez donnez les je me ferai un plaisir de les rajoutez !
Voila se tuto se tourne donc plus vers l'aide et la decoupe de design donc toute demende n'est pas la bienvenue mais l'aide l'est !
!!-La découpe-!!
La decoupe d'un site est tres importante car elle donne vie au site sans elle le site n'existe plus surtout que grace au codage vous pourez rendre un bouton de votre menu cliquable !
Donc nous allons commencez !
Prennez l'outil tranche (K) puis cliquez sur votre design (cela devrai créer une tranche de la taille de votre design,mais si cela ne marche pas ne vous inquietez pas elle apparetra plus tard !
.
Ensuite decoute votre design avec inteligence !
C'est à dire de faire une tranche sur les bouton , le header , la parti texte tout sa est tres important car cela rendra le parti clicquable et codable !
La découpe est finie, passons à l'enregistrement...
Allez dans fichier puis Enregistrer pour le web... Réglez les parametre comme vous le voulez sachant bien sur que internet explorer ne gere pas le png et mets un fond deriere une image et rendra votre design inutilisable sur ie se qui est dommage !
Donc reflechissez a deux fois pour le format de mon coter je conseil le .gif !
Puis passez sur "Enregistrer" et changer le "Type" en "HTML et images (*.html).
Cela vous fera un dosier d'images (les tranches) et un fichier web en .html .
Que vous pourez admirez de suite ! Alors votre travail et digne d'un chef ??
Il ne reste plus qu'à coder et remplir votre interface, mais ceci est une toute autre histoire.
Je vous conseille quand meme d'aller faire un tour ici où vous apprendrer le php,xhtml et le css !
-Partage d'effet-
Ici je placerai tout les effets sympa a utiliser !
Alors profitez s'en et si vous pouvez en faire partager allez y !
Juju -Copyright 2006 ! 