Pré-requis : Être à l'aise avec l'utilisation de son environnement informatique.
-
Utiliser les langages HTML et CSS dans leurs dernières versions pour concevoir
-
Habiller des documents ainsi que des sites statiques avec les standards du Web et adaptés à tous les terminaux (responsive)
-
Générer des pages dynamiquement et adapter un thème sur le CMS WordPress
Introduction
-
Définition et utilité de HTML/CSS/JavaScript, les langages du web
-
Concepts généraux de la conception de documents WEB
-
Le navigateur, outil de diffusion et de développement
Hébergement - Publier son document sur le Web
-
Notions de serveurs/clients
-
Choisir un nom de domaine et un hébergement
-
Se connecter via FTP avec Filezilla
Wordpress ? Utiliser un CMS pour générer des pages dynamiquement
-
Notions de CMS et de sites dynamiques
-
Notions de bases de données
-
Notions de PHP et MySql
-
BackEnd et FrontEnd
HTML ? La structure d?un document HTML
-
Les balises sémantiques de HTML5
-
Différentes parties d'un document HTML (header, footer, main, nav, ?)
-
Les principales balises et leurs attributs
HTML ? Utiliser des balises sémantiques
-
Balises title et meta
-
Insertions des feuilles de styles CSS et des scripts JavaScript
-
Les balises principales de contenu : titres, paragraphe, listes ...
HTML ? Multimédia et interactivité
-
Notion de lien absolu et de lien relatif
-
Créer des menus et des ancres
-
Ajouter des formulaires
-
Les images et les règles à respecter
-
Vidéo et audio (sans Flash)
CSS ? Habiller le document
-
Les sélecteurs de balise
-
Utilisation des attributs HTML « id » et « class »
-
Utilisation des pseudo-classes et mise en forme des liens
-
Utilisation des sélecteurs d'attributs
-
Calculer les règles de priorité
CSS ? Positionner les éléments
-
Principe des « boites » et leur positionnement
-
Display : inline / block / inlineblock
-
Dimensions, marges, espacements et bordures
-
Positionnement classique : float / clear
-
Les pièges des float et l'astuce du clearfix
-
Positionnements spéciaux (relatif, absolu, fixe)
-
Positionnements par Grille ou via Flexbox
CSS ? Animations et effets
-
Coins arrondis
-
Ombres portées
-
Transparence
-
Filtres graphiques
-
Transformations 2D
-
Animations autonomes
-
Valeurs dynamiques : calc()
CSS ? Adapter la police et ajouter des couleurs
-
Polices et textes
-
Unités de mesure
-
Couleurs
-
Fonds
-
Styles des listes
CSS ? Adapter le document aux appareils
-
Principes du Responsive Web Design (RWD)
-
Différence entre résolution et taille d'affichage
-
Mise en page fluide et adaptative
-
Principe des media queries CSS
-
Points de rupture et règles conditionnelles
-
Menus adaptatifs
Wordpress - Adapter un thème
-
Fonctionnement d?un thème et hiérarchie des templates
-
Les outils PHP de Wordpress pour dynamiser une page HTML
-
Apprendre à se repérer dans un template écrit en PHP
-
La Boucle Wordpress et les fonctions de base
-
Adapter les templates d?un thème à l?aide de HTML et CSS