docMiu CHARTE GRAPHIQUE 2TIWA2 Jennifer
download 
Plainte Transcription
Miu CHARTE GRAPHIQUE 2TIWA2 Jennifer
CHARTE GRAPHIQUE PLACEBO Brian . Molko Jennifer Miu 2TIWA2 1 PLACEBO Brian . Molko CHARTE WEBDESIGN Sommaire I. Univers Graphique Introduction P. 3 II. Famille Chromatique Nuance dominante P. 4 Justification P. 5 III. Typographie Menu P. 6 Titre - Légende P. 7 Contenu P. 8 Justification P. 9 IV. Eléments graphiques P. 10 V. Structure des gabarits P. 11 2 PLACEBO Brian . Molko CHARTE WEBDESIGN I. Univers Graphique Introduction Né d’un père américain d’origines franco-italiennes, et d’une mère écossaise, Brian Molko voit le jour le 10 décembre 1972, à Bruxelles, en Belgique. Petit dernier d’une famille de trois garçons, il suit son père, grand banquier évoluant dans le domaine des finances internationales. C’est ainsi qu’il réside durant les trois premières années de sa vie au Liban puis au Libéria, avant d’emménager définitivement au Luxembourg, terre où les grosses boîtes américaines envoient leurs meilleurs employés. Le site doit à la fois véhiculer l’image du groupe Placebo, c’est à dire un groupe entre power pop et rock alternatif avec une très forte personnalité. Ce site est avant tout informatif, destiné au fan du chanteur. Le public doit pouvoir naviguer sur le site de manière très claire. 3 PLACEBO Brian . Molko CHARTE WEBDESIGN II. Famille Chromatique Nuance dominante Blanc Gris clair Gris foncé Bordeaux Noir 0-0-0-0 19 - 13 -10 - 1 49 - 36 - 35 - 22 15 - 94 - 60 - 4 0 - 0 - 0 - 100 #FFFFFF #CCCCCC #666666 #CC1233 #000000 4 PLACEBO Brian . Molko CHARTE WEBDESIGN II. Famille Chromatique Justification: Choix Chromatique Toutes les couleurs sont utilisées en aplat pour éviter le surchargement du site. Chaque couleur est présente pour créer un contraste. Blanc : Utilisé en arrière plan pour donner un effet de simplicité, sobriété. Gris clair : Utilisé pour l’arrière plan du texte, pour donner un léger contraste avec le blanc et rester dans l’esprit classe. Gris foncé : Utilisé dans les effets graphiques pour que ça soit à la fois discret et visible sur l’arrière plan gris clair. Bordeaux : Utilisé pour la typographie ainsi que pour certains éléments graphiques. Pour donner un peu d’énergie, de gaieté au site. Assure un contraste. Noir : Utilisé pour la typographie, pour faciliter la lecture. Le noir est fort visible et permet d’avoir un fort contraste. 5 PLACEBO Brian . Molko CHARTE WEBDESIGN III. Typographie Menu Verdana Arial Black Verdana Verdana Verdana Arial Black Bold Regular Regular Bold 24 px 12 px 12 px 12 px Bold 36 px Regular 9 px T 125 % 200 px 6 PLACEBO Brian . Molko CHARTE WEBDESIGN III. Typographie Titre Verdana Souligné Contour épaisseur 2px Bold 24 px 0-0-0- centré 168 - 40 - 75 Légende Verdana Regular 7 px 0-0-0 centré 7 PLACEBO Brian . Molko CHARTE WEBDESIGN III. Typographie Contenu Contenu Verdana Regular 12 px Justifié avec la derniere ligne aligné à gauche Lettrine 3 lignes Accroche Verdana Regular Verdana Regular 48px 12 px 0-0-0 0-0-0 14,5 168 -40 - 75 8 PLACEBO Brian . Molko CHARTE WEBDESIGN III. Typographie Justification: Choix typographique Le choix typographique s’est porté sur la Verdana, elle doit être utilisée pour le texte courant, elle peut être utilisée dans ses différentes graisses. Verdana est une police sans serif conçue pour la lecture à l’écran, c’est pour cela que j’ai choisi de l’utiliser. Chaque paragraphe est également constitué de lettrines facilitant la lecture. La typographie du menu qui est sélectionné se colore en bordeaux. Tout le reste du menu est coloré en noir. La premiére lettre de Brian et de Molko est colorée en bordeaux. Extrait typographique Verdana: Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz 9 PLACEBO Brian . Molko CHARTE WEBDESIGN IV. Eléments graphiques Les éléments graphiques présent sur ce site ne seront utilisés seulement pour encadrer du texte. Un élément sera toujours composé de deux barres rouges collées ensembles et de deux barres grises plus éloignées les unes des autres. L’élément sera disposé à 9 px du texte. Il bordera en somme le texte. Les barres pourront varier de taille suivant la longueur du texte et de l’effet recherché. L’élément graphique, constitué de 4 lignes de couleur noir, devra toujours être perpendiculaire au bord de la page. Donc disposé verticalement sur les bords hauts et bas et horizontalement sur les bords droits et gauches. :: Deux petits points en double. Police Verdana 12. Utilisé comme puce pour mettre devant le menu. 10 PLACEBO Brian . Molko CHARTE WEBDESIGN V. Structure des gabarits 8.5 px 19 px 52.5 px 1024 px 800 px 113 px 900 px 8.5 px 323 px 24 px 83 px 83 px 42.5 px 38 px 16.5 px 37 px 43 px 80 px 40 px 9 px 9 px 9 px 37 px 64 px 41 px 11 PLACEBO Brian . Molko CHARTE WEBDESIGN V. Structure des gabarits 9 px 43 px 19.5 px 40 px 19.5 px 41 px 41 px 57 px 19.5 px 12 PLACEBO Brian . Molko CHARTE WEBDESIGN V. Structure des gabarits 19.5 px 9 px 19.5 px 13 PLACEBO Brian . Molko CHARTE WEBDESIGN V. Structure des gabarits 27 px 27 px 20 px 30 px 19.5 px 19.5 px 14 PLACEBO Brian . Molko CHARTE WEBDESIGN V. Structure des gabarits 20 px 30 px 19.5 px 44 px 11.5 px 15
