1.1 Le domaine

L'expression et la communication visuelle
La création graphique pour le Web - principales contraintes et spécificités

1.2 Le message visuel et ses éléments constitutifs

1.3 les enjeux et les impératifs de la communication par l'image

1.4 La démarche de création

Les maillons de la chaîne graphique Web

2.1 Les bases de la typographie

Les familles de caractères, l'anatomie du caractère, les attributs de caractère, les attributs de paragraphe
La composition du texte : niveaux de texte, alignements, largeur de justification, espacements verticaux, multicolonnage, corps, interlignage, interlettrage, inter mots...

2.2 Le sens des mots

La pertinence des choix typographiques au plan sémantique et graphique

2.3 La typo numérique

L'affichage du texte à l'écran et sa lisibilité, les polices utilisateur, les polices embarquées, les réglages typographiques fins, le recours au texte-image (anti aliasing).

3.1 La couleur pour l'écran

La synthèse additive, l'espace colorimétrique et les profils RVB, et - dans ce cadre:
le cercle chromatique, les couleurs primaires, secondaires, complémentaires, la balance des couleurs, la teinte, la saturation, la luminosité, la température de couleur, la gamme de tons

3.2 La couleur au plan sémantique

L'impact d'une couleur, les nuances d'une couleur, l'association de plusieurs couleurs

3.3 Graphisme et couleur

La couleur isolée et l'interaction de plusieurs couleurs
L'accord coloré, l'unité, la dominante couleur, les nuances, les différents types de contrastes

4.1 L'utilisation des images

Les fonctions de l'image (expliquer, impliquer, illustrer, attirer, établir une complicité), les types d'images, le rapport texte/image (le texte comme complément ou relais), l'utilisation de l'image (accroche, illustration, document, arrière plan), la combinaison texte-image

4.2 Le choix des images

Le cadrage, la composition, l'angle de vue, la profondeur de champ, l'exposition, la couleur, la texture…

4.3 Le traitement et l'optimisation des images

L'histogramme et les informations, le réglage de la gamme de tons, la balance des couleurs, la création de tranches

4.4 Le dessin

Les images vectorielles: logos, pictos, illustrations, schémas, cartes, graphiques
Les éléments graphiques d'un site Web, illustrations, titrages, logos, pictos, panneaux, boutons, navigation

4.5 La création d'images

Le montage d'image, le montage-imbrication, le mixage, la fusion, l'utilisation de filtres, de textures, de motifs, de formes et d'images vectorisées, la combinaison pixel-vectoriel

5.1 De l'idée de composition à celle de design Web

L'idée de composition concerne tous les secteurs des arts visuels. Elle vaut aussi bien pour l'art que pour la communication, elle vaut pour la peinture, pour l'affiche et pour les sites Web. Elle peut être entendue comme l'agencement de surfaces et de couleurs dans un format, ou, pour le dire autrement, il s'agit de définir et de combiner les différents éléments formels qui s'inscrivent dans une surface donnée.
Quelque soit le support et les éléments constitutif de l'image, la composition peut être organisée en fonction de règles bien établies. L'emploi de lignes de force comme en photographie, l'appui sur des lignes directrices,sur la circulation de la lumière ou sur l'arabesque comme en peinture. Les règles que l'on pourrait rapporter sont nombreuses, mais ne sont jamais miraculeuses. Que ce soit en établissant un axe central ou par l'inscription dans une forme géométrique ou encore par l'emploi d'une grille... Dans tous les cas il s'agit de trouver le rapport pertinent, la cohérence entre toutes les parties de la production, que ce soit pour un dessin ou pour une page Web.
Pour en rester ou pour en revenir au Web, considérons une page Web : elle doit afficher des éléments de nature différentes. Il s'agit donc de travailler la typographie, les couleurs et d'associer un certain nombre de zones de nature distincte. Réussir l'assemblage ou la combinaison d'éléments relevant de la typographie, de la couleur, du dessin (logo, pictos, symboles, illustrations), de la photo, réunir des éléments textuels, des images fixes, des animations interactives, des vidéos, des éléments de navigation et des formulaires, n'est pas une sinécure. Il est bien question de design, d'un design global, clair, cohérent et porteur de sens.

5.2 L'indispensable Gabarit

Le gabarit constitue la possibilité de structurer un contenu spécifique, parfois riche et hétérogène. Il nous permet d'agencer, par l'utilisation de sections et de colonnes, les différents éléments d'une page Web dans un format ou une résolution déterminée. Il représente une étape indispensable au plan de la mise en forme.

Le mockup (ou zoning) :
Les différentes zones du site (logo, navigation, sidebar, header, footer...)
Les fonctionnalités attendues (menu déroulant, slideshow, animation...)
Le recensement des éléments (icônes, boutons, images, input...)
L'agencement du contenu (niveaux de titres, citations, accroche...)

5.3 La grille

Le gabarit peut s'appuyer sur une grille, on obtiendra ainsi un multicolonnage toujours cohérent. Plus la grille sera fine, plus les possibilités qu'elle offre seront nombreuses.

5.4 La création d'une maquette

Bien que les 2 termes soient parfois utilisés indifféremment, la maquette peut-être distinguée du gabarit. Il s'agit cette fois de réaliser l'interface complète d'1 site dans Photoshop ou Illustrator, de créer les éléments graphiques et de proposer leur agencement avec les zones de contenu. Au delà de la recherche d'alignements et d'aplombs, de la recherche d'équilibre et de dynamisme, c'est du juste rapport des couleurs et des surfaces dont il s'agit. L'ensemble doit cette fois être poussé dans son détail et ne pas constituer un genre de schéma, si précis soit ce dernier.
Une fois la maquette validée par le client, elle peut être remise au développeur. Les éléments de maquette qui ne peuvent être réalisés grâce au code (boutons, images d'arrière-plan, symboles...) seront optimisés depuis la maquette, puis intégrés dans la page Web elle-même.
On doit se soucier de la "faisabilité" de cette maquette et anticiper les apports dynamiques et les possibilités d'affichage sur différentes plates-formes.

5.5 Les chartes

De la maquette on peut déduire la charte graphique, la charte typographique, le nuancier du site et le code couleur, si l'on utilise un code couleur.

6.1 Interactivité

6.2 Apports dynamiques

Affichage dynamique, remplacement de contenu, événements, images qui s'adaptent a la taille du conteneur, caches-sections...

6.3 Animations et vidéos

Animations par clic, animations automatiques, galeries & diaporamas, caroussels

6.4 Motion design

Le design graphique (ou graphisme) est la capacité à créer, adapter et développer des identités visuelles. Le design d'animation est l'art d'étendre cette identité à la production de contenus animés, audiovisuels et interactifs. Les applications du design animé sont de plus en plus présentes dans notre quotidien. L'avenir du design d'animation résidera certainement dans la fusion des médias (télévision, Internet, téléphone mobile...) Extrêmement gourmand en contenus visuels d'habillages.
http://fr.wikipedia.org