Objectifs
Programme
Pré-requis : Avoir une bonne connaissance de l'environnement informatique (pratique courante d'OS X ou de Windows). La pratique d'un logiciel de création d'images est fortement souhaitée.
- Réaliser des sites Internet
- Créer des pages formatées avec des balises HTML 5 et des CSS
- Importer et formater les textes
- Placer, recadrer, optimiser les images
- Placer des médias sons, vidéos et animations
- Mettre en place un système de navigation
- Créer des formulaires et gérer les envois de données
- Envoyer le site chez un hébergeur
- Tester l'apparence du site sur des tablettes, mobiles et tous supports.
Lire la suite
Typologie de sites
- Les langages du Web
- Les formats de médias
- Les choix techniques
- Le rôle des navigateurs
- Sites statiques et sites dynamiques
- L'organisation des fichiers
Dreamweaver
- La chaîne logicielle Adobe
- Positionnement de Dreamweaver
- Workflow et méthodologie
L'interface
- Les palettes
- La palette de gestion des sites
- La personnalisation de l'espace de travail
- Les modes d'affichage
- Code
- En direct
- Fractionner
- Zoom, repères, tailles de fenêtre prédéfinies
- Régler les préférences
Structure d'un projet
- Contenus et médias
- Hiérarchie des pages et navigation
- Charte ergonomique et graphique
- Les types d'hébergement
Le langage HTML
- L'outil Brackets
- Principe de l'hypertexte
- Balises et attributs
- Structure d'une page et imbrication
- Balisage sémantique et référencement
Création de pages Web
- La notion de page
- Largeur et hauteur d'une page
- Les propriétés spécifiques aux pages
Organiser les éléments HTML
- Titres et paragraphes
- Listes et tableaux
- Liens
- Images
- Les nouvelles balises HTML 5
- Best practices
Les styles CSS
- Stockage des styles : interne vs externe
- Les propriétés des éléments HTML
- Cascade et héritage de propriétés
- Les sélecteurs
- Balise
- ID
- Classe
- Sélecteurs composés
- Les pseudo-classes
- Les transitions CSS
Mise en page avec des CSS
- La palette CSS Designer
- Les unités de taille
- Positionnement en CSS
- Eléments flottants
- La propriété Display
- La propriété Position
Responsive et Adaptative Design
- Le point sur les supports mobiles
- Médias et viewports
- Comprendre les Media Queries
- L'outil Requêtes multimédias visuelles
- Multiscreen Preview
La couleur
- Les couleurs sur le Web
- Les formats de codage des couleurs
Le texte
- Importation de fichiers Word
- Modes de copier / coller
- Polices système et familles de polices
- Règle CSS @font-face
- Utilisation des polices distantes Typekit
- Les propriétés CSS liées au texte
- Gestion des liens hypertexte
- Pseudo-classes CSS de liens
Images
- Les formats Web
- GIF
- JPEG
- PNG
- La transparence dans les images
- Les attributs d'images
- Le rôle de la balise ALT
- Optimisation et manipulations avec les outils de la palette Propriétés
- Liens avec Photoshop
- Initiation à Extract
Médias riches
- Insertion audio
- Insertion de vidéos
Gestion des médias
- La palette des actifs
- Bibliothèque
- Création d'objets de bibliothèque
- Insertion d'objets de bibliothèque dans les pages
- Modification d'objets : mise à jour des pages créées à partir d'objets de bibliothèques
Formulaires
- Insertion et paramétrage des objets de formulaire
- Typage et contrôle des éléments de formulaire
JavaScript
- Le rôle du langage JavaScript
- Ajouts de comportements JavaScript
Gestion du site
- Rapport sur le site
- Vérification des liens
- Les règles de mise en ligne
- Utilisation du FTP interne
- Vérification selon les navigateurs et sur les tablettes, ordinateurs et mobiles
Lire la suite