jeudi 17 novembre 2011

Une mise en page pour mon blog partie 2

Nous allons découvrir à travers quelques exemples comment les bases de mise en page ont été respectées pour une lecture voulue :

Exemple 1
    Ordre de lecture
  1. LE LOGO a été placé à gauche dans un fond blanc proportionnel au 1/4 de la hauteur de la page, la lecture se fait de gauche à droite, la masse que représente le logo entraîne l'oeil sur le titre du blog.
  2. LE MESSAGE La force du filet blanc découpant la page en 3 parties répond au logo et apporte plus de légèreté à la photo se trouvant sous un petit tramé blanc qui équilibre nos proportions en largeur.
  3. LE MENU se trouve à gauche sous le titre, la hiérarchie est installée. La mise en page a été axée sur les photos de qualité.
  4. Conclusion Mise en page simple avec pour originalité la possibilité de faire défiler les images de fleurs à l'aide d'un bouton bleu situé sur la gauche de l'écran au milieu


Exemple 2
    Ordre de lecture
  1. LE LOGO a été placé sur toute la largeur de la page et centré, il introduit l'image et le menu qui en fait partie.
  2. LE MENU fait paire avec l'image qui souligne le sujet du blog, la place de la photo est importante mais nécessaire au sujet : les fleurs, le côté esthétique doit être mis en avant. Le menu vient bien en deuxième lecture avec son fond blanc qui est de la même couleur que le mot "fleurs" du logo
  3. LE MESSAGE est sur fond blanc, rappel de couleur blanche du logo.
  4. Conclusion Mise en page structurée, facilité de lecture, présentation harmonieuse, unité des couleurs. Message clair et fort


Exemple 3
    Ordre de lecture
  1. LE LOGO est placé dans le bandeau haut sur un fond bordeau qui ressort bien du fond blanc de la page, le logo n'a pas besoin d'être trop imposant du fait qu'il est en négatif, la lecture se fait immédiatement, l'oeil est attiré sur cette tache blanche isolé et particulière.
  2. LE MENU vient en deux parties : dans le bandeau annonçant les grandes rubriques, utilitaires, comme un sous titre. puis un menu soulignant le header avec la hiérarchie du site découpée en rubriques et sous-rubriques
  3. LE MESSAGE est sur fond blanc avec ses articles composé de titre, photo, sous-titres, chapô, inter, texte.
  4. Conclusion Mise en page claire et précise, hiéarchie des titres pour ce site d'actualité, biensûr une partie réservé à la publicité pour ce site qui a une audience élevée. L'importance de cet encart pub vient en deuxième lecture en même temps que la lecture du logo.

Exemple 4
    Ordre de lecture
  1. LE LOGO est placé dans le bandeau haut sur un fond blanc comme dans l'exemple ci-dessus, la couleur rouge et bleu du logo attire l'oeil souligné par le menu (bandeau orange. Dans le bandeau du header, deux masses identiques : le logo EDF et le logo des jeux olympique à gauche, la lecture se faisant de gauche à droite, le logo est mis en valeur, renforcé par les proportions du blanc tournant autour du logo, sobriété efficace.
  2. LE MENU souligne le titre et trouve sa place en deuxième lecture avec des photos qui arrivent en fondu enchaîné
  3. LE MESSAGE est sur fond blanc avec le développé des fonctions du site avec un encart droit sur les actualités mis en avant par son texte dynamique. Message lié au menu par l'image : les encarts blanc mangent le bas de l'image
  4. Conclusion Site fonctionnel, ses informations sont classées, sobriété de la mise en page, c'est de l'institutionnel.


Avant de commencer votre mise en page
vous devez vous posez 3 questions
  1. Quel est mon message (directement lié à votre activité)
  2. A qui je m'adresse (cible)
  3. Quel est la finalité de ma communication
Dans un deuxième temps : Choix de votre logo, de la police de caractère, de vos couleurs (charte graphique)

Aucun commentaire:

Enregistrer un commentaire

A vous, vous pouvez parler ici