Accueil > Technologies WEB > Créer un Site Web : de la maquette Photoshop à l’intégration HTML/CSS
Formation #TWC03

Formation Créer un Site Web : de la maquette Photoshop à l’intégration HTML/CSS

Durée : 4 jours

Code : TWC03


Prochaines dates programmées :

Du 23 au 26 Avril 2024

Du 16 au 19 Juil. 2024

Du 22 au 25 Oct. 2024

Fin d'Inscription :
Le Bulletin d'Inscription doit être rempli, cacheté, signé et envoyé par email : Au minimum 15 JOURS OUVRÉS avant la date de formation.
Si vous avez un besoin URGENT et que vous souhaitez une date de formation plus proche que les sessions programmées (minimum 15 à 20 jours ouvrés à date de votre demande)

Objectifs

  • Acquérir les qualifications nécessaires pour créer un site Web depuis la livraison d'un fichier Photoshop PSD jusqu'à la construction de sa structure et de ses pages modèles côté client
Programme
1/ L’ergonomie d’un site web
  • Qu’est-ce que l’ergonomie ?
  • 10 préjugés à démonter
  • Découvrir puis appliquer la Gestalt, la loi de Fitts et de Hick
  • Comprendre l’affordance
  • Accessibilité visuelle et lisibilité
  • Empathie et personas
2/ Appliquer l’ergonomie dans un web design
  • Le site ainsi que ses pages sont bien organisés
  • Le graphisme aide et dirige l’internaute
  • L’internaute ne perd pas son temps
  • L’internaute est satisfait et séduit
  • Conduire un audit graphique et ergonomique
3/ Les documents de projet
  • Le zoning afin d’organiser l’espace
  • Le wireframe : chaque zone est détaillée
  • Quels logiciels pour réaliser zonings et maquettes ?
4/ L’apparence d’un site Web
  • La charte graphique et le logo
  • Règles d’utilisation de la charte
  • Couleurs et typographies web safe
  • Dimension des pages et grilles modulaires
  • Les animations et les liens
5/ Analyses de design : symboliques et ambiances
  • Par secteurs d’activité
  • Par styles graphiques
  • Les templates : formatés ou non ?
6/ Organiser son projet
  • Analyse du fichier Photoshop PSD. Le zoning
  • Choix des outils de développement
  • L'environnement de développement
  • Méthodologie. Prise en compte des contraintes
7/ Bien découper dans Photoshop
  • Conceptualiser le passage de Photoshop à CSS
  • Découper les arrière-plans
  • Gérer les transparences
  • Comprendre le découpage en boîtes
8/ L'intégration XHTML
  • Rappel de la syntaxe HTML. Choix du Doctype
  • Les principales balises HTML
  • Utiliser les bonnes balises. Valider son code
9/ CSS en action
  • Les navigateurs ciblés
  • Localisation du CSS
  • Les principaux sélecteurs CSS
  • Les principales propriétés
  • Le flux CSS. La notion de boîtes. Les fusions de marges. La notion de conteneur
  • Priorité des sélecteurs. Les balises block et inline
  • Le commentaire conditionnel
10/ Meilleurs pratiques
  • Respecter les normes de développement en CSS
  • Bien cibler les éléments HTML
  • La syntaxe raccourcie
  • Le regroupement des sélecteurs
  • Valider son code CSS. Commenter son code
  • Convention d'écriture du code CSS
11/ Carousel jQuery
  • Installation de jQuery
  • Installation de jquery.jcarousel.pack
  • Intégration d'un slider au site
Approche Pédagogique

Approche Pédagogique

  • Pédagogie très opérationnelle fondée sur l'alternance entre théorie et pratique
  • Cas pratiques
  • Remise d’outils
  • Echanges d’expériences
Public Cible

Personnes Visées

  • Graphistes
  • Intégrateurs
Dates

Dates

  • Du 23 au 26 Avril 2024
  • Du 16 au 19 Juil. 2024
  • Du 22 au 25 Oct. 2024
  • Fin d'Inscription :
    Le Bulletin d'Inscription doit être rempli, cacheté, signé et envoyé par email : Au minimum 15 JOURS OUVRÉS avant la date de formation.