Formation Créer facilement des interfaces Web responsives avec Dreamweaver CC

Programme de la formation
Créer facilement des interfaces Web responsives avec Dreamweaver CC

• Introduction à Dreamweaver CC et l'environnement de développement web

  - Présentation de Dreamweaver CC : fonctionnalités clés et interface utilisateur
  - Notions fondamentales du web : HTML, CSS, JavaScript (rôles et interactions)
  - Configuration de l'espace de travail : préférences, panneaux et espaces personnalisés

• Bases du HTML5 : Structure et sémantique d'une page web

  - Éléments et attributs HTML : balises courantes (div, p, a, img, ul, li)
  - Structuration sémantique avec HTML5 : header, nav, main, article, section, footer
  - Liens (internes, externes, ancres) et insertion d'images

• Fondamentaux du CSS3 : Style et mise en page

  - Sélecteurs CSS : type, classe, ID, attribut, pseudo-classes
  - Propriétés CSS essentielles : couleur, typographie, marges, padding, bordures
  - L'approche Caisse (Box Model) : Comprendre le flux de document

• Création de mises en page avec Dreamweaver CC : Outils visuels

  - Utilisation du mode Design et du mode Code : synchronisation et collaboration
  - Panneau Propriétés de l'élément et Inspecteur CSS
  - Insertion de blocs DIV et organisation du contenu

• Flexbox pour des designs responsives avancés

  - Introduction à Flexbox : conteneur et éléments flexibles
  - Propriétés Flexbox pour l'alignement, la distribution et l'ordre
  - Création de layouts adaptatifs avec Flexbox

• Media Queries : Adapter le design aux différentes tailles d'écran

  - Comprendre les Media Queries : syntaxe et conditions
  - Points d'arrêt (breakpoints) courants pour mobile, tablette, desktop
  - Application de styles spécifiques selon la taille de l'écran

• Images et vidéos responsives : Optimisation pour le web

  - Balise picture et srcset pour des images adaptatives
  - Optimisation du poids des images et formats modernes (WebP)
  - Intégration de vidéos responsives (Youtube, Vimeo, vidéo locale)

• Conception et intégration de formulaires HTML5

  - Types d'input HTML5 : text, email, password, number, date, etc.
  - Attributs de validation HTML5 : required, pattern, min, max
  - Stylisation des formulaires avec CSS

• Navigation et menus responsives

  - Création de menus de navigation classiques (ul, li, a)
  - Mise en œuvre de menus hamburger pour les petits écrans
  - Techniques CSS pour une navigation adaptative

• Gestion des feuilles de style et bonnes pratiques CSS

  - Organisation du code CSS : commentaires, conventions de nommage (BEM)
  - Préprocesseurs CSS (Sass/Less) : introduction et avantages
  - Optimisation des performances CSS : regroupement et minification

• Tester et déboguer des interfaces responsives

  - Utilisation de l'Inspecteur de code et des outils de développement du navigateur
  - Test sur différents périphériques et simulateurs
  - Résolution des problèmes de rendu et de compatibilité

• Déploiement et maintenance d'un site Dreamweaver

  - Publication du site via FTP/SFTP depuis Dreamweaver
  - Notions de référencement (SEO technique) et accessibilité de base
  - Suivi et mise à jour d'un site web