Cursus métier : Web Designer

Conception et Ergonomie 

L'ergonomie d'un site web :

• Les temps d'attente ;
• Le système de navigation ;
• La navigation en 3 clics ;
• La navigation libre ;
• La navigation dirigée.

La lisibilité :

• Hiérarchiser l'information ;
• La typographie pour le web ;
• L'intégration des visuels ;
• Les animations et les liens.

L'apparence d'un site web :

• La charte graphique ;
• Le choix des couleurs ;
• L'analyse visuelle des pages ;
• La dimension des pages ;
• La grille modulaire du site.

La page d'accueil :

• Le rôle de la page d'accueil ;
• Son organisation ;
• Son ergonomie.

Analyses de design :

• Les secteurs d'activité ;
• Les designs par secteurs ;
• Vérifier ses liens ;
• Normes WC3.

Photoshop pour le Web 

Interface de Photoshop :

• Explorateur de fichiers ;
• Options et formes d’outils ;
• Utilisation des calques ;
• Création et utilisation des calques ;
• Masques de fusion, masques vectoriels ;
• Transformation par souris ;
• Export ;
• Optimisation pour le Web ;
• Tranches.

Gifs animés :

• Sélection et détourage ;
• Méthodes de détourage, détourage par tracés ;
• Réglages des images RVB et couleurs ;
• Réglages automatiques ;
• Réglages par niveaux ;
• Utilisation des calques ;
• Création et gestion des calques ;
• Transparences ;
• Effets de calques ;
• Optimisation Web : enjeux généraux et contraintes ;
• Rappel des notions générales de taille, de définition, de colorimétrie et de format d’image ;
• Techniques et contraintes de mise en page Web : tableaux, balise, CSS ;
• Production.

Création de tranche :

• Modification des tranches ;
• Insertion de liens (URL) ;
• Préparation pour l’exportation ;
• Automatisation ;
• Création et utilisation de scripts.

Traitement par lot :

• Création de galerie (mini-sites) Web ;
• Exportation ;
• Optimisation des images pour le Web (taille, définition, GIF, JPEG, PNG) ;
• Paramètres d’exportation (HTML, XHTML, CSS).

Exportation des tranches

   Apprendre XHTML et CSS

Premier Contact avec HTML et CSS :

• Qu’est-ce qu’une page web ?
• A quoi servent les feuilles de style ?
• HTML : Du contenu et des balises ;
• Les Principales balises HTML pour le texte ;
• Les Commentaires en HTML ;
• Styles CSS : attribut style et élément style, sélecteur d’éléments ;
• Styles CSS : Utiliser des classes et identifiants ;
• Des images pour les pages web.

Introduction à la mise en page en CSS :

• Eléments de type bloc et éléments de type en ligne ;
• Le modèle de boite CSS :

• Hauteur et largeur ;
• Les Marges ;
• Bordures et Padding ;

• Le positionnement absolu ;
• Le positionnement flottant.

Standards et validité :

• Validité du code XHTML ;
• Les standards XHTML et CSS : spécifications et références.

Mise en page d’un design simple :

• Présentation de l’exercice : Réalisation d’un site web complet ;
• Mise en place du projet ;
• Mise en forme de l’entête du site ;
• Analyse de design et création de blocs conteneurs (Eléments DIV) ;
• Positionnement des principaux blocs ;
• Un point sur les couleurs pour le Web (Couleurs en CSS, outils pratiques) ;
• Décorer un bloc avec des images de fond  (Propriété background).

Des Menus de navigations en HTML et CSS :

• Qu’est-ce qu’un menu de navigation ? ;
• Analyse du design du menu principal d’un site web ;
• Styles CSS du menu principal.

L’encodage des caractères :

• Qu’est ce qu’un encodage de caractères ?
• Quel encodage choisir ?
• Comment bien déclarer l’encodage d’une page ?
• Les entités HTML.

Mise en forme du contenu :

• Mise en forme des contenus de l’accueil : Boites pour le texte ;
• Mise en forme des contenus de l’accueil : Styles du texte ;
• Récapitulatifs des propriétés CSS pour le texte.

Tableaux et formulaires en HTML et CSS :

• Construire et mettre en forme un tableau ;
• Créer un formulaire simple en HTML ;
• Mise en forme du formulaire.