La formation Dreamweaver permet de se lancer dans la création de sites web, avec une immersion simplifiée dans le HTML / CSS. Dreamweaver est en effet doté d’un mode création hyper puissant, consistant en une interface guidée en WYSIWYG et des panneaux complets. Le logiciel pourrait presque autoriser de faire l’impasse sur l’apprentissage des balises HTML, mais ce n’est définitivement pas conseillé.
Avec ce cours pour débutants, vous apprendrez donc bien la syntaxe HTML, ainsi que les règles CSS pour une autonomie totale. Dreamweaver démontrera sa puissance lorsqu’il s’agira de développer rapidement des structures de pages, des mises en formes et des formulaires. Il sera aussi très utile pour concevoir et mettre en ligne des sites dynamiques.
Les Objectifs
de la formation Dreamweaver CC
en quoi Dreamweaver améliore la productivité ;
du HTML 5 ;
les principales propriétés CSS ;
le modèle de boîte ;
de recourir au JQuery et aux media queries ;
puis mettre en ligne son site web ;
La Formation Dreamweaver CC
en détails : contenus, dates et prix
Dernière actualisation le 16 septembre 2022
Chargé de communication, webmaster, informaticien ou graphiste souhaitant apprendre l’utilisation de Dreamweaver pour créer des sites web.
Cette formation n’est ni certifiante, ni éligible au CPF, mais peut être prise en charge au titre du plan de formation entreprise (renseignements auprès de votre OPCO ou de votre conseil comptable)
- Avoir un bon niveau de pratique en informatique et un goût affirmé pour le web
- De 2 à 4 en inter-entreprises
- De 1 à 6 en intra
Les apports professionnels de la formation DreamWeaver
La formation DreamWeaver débutant s’organise sur 3 jours consécutifs afin de permettre une immersion totale dans l’outil et les langages du web.
Jour 1 : les bases de la conception de site internet avec Dreamweaver
La matinée commence par un rappel des notions préalables à la création de site internet : comment fonctionnent les navigateurs ? Qu’est-ce que le protocole HTTPS ? … Puis le formateur présente l’interface Dreamweaver et ses premiers paramétrages.
L’après-midi est ensuite consacré à l’initiation au code HTML5 ; les stagiaires apprennent à créer leurs premières pages internet.
Jour 2 : HTML couplé à CSS !
Les stagiaires débutent la journée avec l’intégration des éléments média. Ils préparent leurs images puis apprennent à utiliser la balise <img />. Le formateur explique également comment intégrer les vidéos et les sons. Il abordera ensuite la création de tableaux avec Dreamweaver dans l’unique but de présenter des données tabulaires.
Puis il proposera en fin de journée une initiation au CSS : sélecteurs et attributs sont les 1res notions à acquérir.
Jour 3 : interactivité et mise en page
Cette dernière journée permet de finir l’intégration du site internet. Le formateur explique en matinée de nouvelles notions de CSS, plus avancées, permettant d’apporter la structure visuelle aux pages et d’y insérer des arrière plans.
Puis il aborde dans l’après-midi les effets interactifs en s’appuyant sur les librairies déjà embarquées au coeur même de Dreamweaver : JQuery, Bootstrap et les media queries, ainsi que le panneau Extract. Enfin, les participants apprendront à tester leur site puis à le mettre en ligne.
Pour les utilisateurs déjà initiés, un programme Dreamweaver avancé (sur-mesure) peut être proposé après audit de vos acquis et besoins.
Admission à la formation Dreamweaver CC :
- Entretien téléphonique afin de vérifier l’adéquation de la formation Dreamweaver aux besoins du stagiaire
- Test d’évaluation des pré-requis dans le cas d’un perfectionnement (programme réadapté)
Utilisez notre questionnaire pour faire le tour de vos acquis actuels et anticiper vos besoins de formation
- 3 jours, soit 21h00.
- 60% de théorie, 40% de pratique.
Pas de date programmée pour le moment
Horaires : 9h-12h30 / 14h-17h30
Formation inter déjà programmée :
- 10 jours ouvrés avec un auto-financement ;
- 4 semaines minimum avec un financement externe, selon délais d’instruction des dossiers de financement chez votre OPCO.
Formation intra :
- 4 semaines minimum avec un auto-financement ;
- 5 à 10 semaines en cas de financement avec votre OPCO.
- Formation inter-entreprise : 3 jours 1890€HT
4 places restantes - Formation intra-entreprise : 3 jours 3255€HT
Immersion
dans le code
La formation Dreamweaver CC se déroule sur 3 jours d’affilée, l’immersion est totale et permet de mémoriser durablement les notions essentielles du logiciel.
La mallette
pédagogique
Le diaporama projeté en formation est un résumé des notions incontournables. Il est complété d’un support de cours rédigé, d’une liste de livres et de sites de référence.
Et après,
en cas de soucis ?
Temps de support de 1h30 offert dans le mois qui suit la formation (intra) ; à utiliser pour la correction de pages codées, ou la recherche d’erreurs bloquantes.
Le programme de formation
Dreamweaver CC
Actualisé le 13 juillet 2020
Créer un site avec Dreamweaver : notions préalables
- Comment un site fonctionne-t-il exactement ?
- Structure de base d’un site : dossiers, fichiers HTML, CSS et images
- Configuration des navigateurs et installation d’extensions utiles
- Comprendre la notion de serveur et les protocoles du web : HTTP, HTTPS, FTP
- Différences entre les sites statiques et les sites dynamiques
Adobe Dreamweaver : découverte de l’interface
- Faire connaissance avec la suite Adobe, et le logiciel Dreamweaver
- Premiers paramétrages dans Dreamweaver
- Découvertes des modèles de page au démarrage
- Ouvrir et configurer des sites dans Dreamweaver
- Paramétrer son espace de travail : code/ création, palettes utiles
Évaluation Objectif 01 : QCM sur les fonctionnalités de productivité de Dreamweaver
Initiation au code HTML5 dans Dreamweaver
- Comprendre la structure de base d’une page : ,
- Utiliser le panneau insertion pour créer les premières balises texte (block)
- Utiliser les balises éditoriales de type en ligne (inline)
- Créer des liens vers des sites, vers des mails
- Ajouter des liens relatifs pour le maillage interne
- Observation en mode développeur : comprendre la syntaxe du HTML5
Évaluation Objectif 02 - 1re partie : construire sa 1re page HTML
Travailler avec les images
- Préparer ses images pour le web
- Règles d’insertion des images dans une page web
- Les attributs HTML de la balise
- Ajout de vidéos et autres médias
Évaluation Objectif 02 - 2e partie : insérer des liens et des images dans la page web
Tableaux : uniquement afin de présenter des données
- Créer un tableau dans Dreamweaver
- Travailler avec les cellules
- Cas d’utilisation des tableaux
Évaluation Objectif 02 - 3e partie : créer une page HTML complète en respectant la sémantique
Comprendre puis utiliser les CSS
- Comprendre CSS et la notion de sélecteur de style
- Créer et utiliser les feuilles de style externes
- Utiliser la puissance du panneau CSS Designer
- Mettre en forme les attributs de caractère et de paragraphe
- Créer et utiliser les sélecteurs CSS de classe et de pseudo-classe
- Insérer des webfonts
Évaluation Objectif 03 : exercice de mise en style CSS des textes
Créer des mises en page CSS
- Comprendre le modèle de boîte avec les balises structurantes du HTML5
- Ajouter des sélecteurs identifiants uniques
- Comprendre les positionnements de boîtes
- Maîtriser les propriétés de marge, d’arrière-plan, de bordures
- Découvrir les nouvelles propriétés CSS3 et les préfixes navigateur
Évaluation Objectif 04 : créer une mise en page avec CSS
Ajouter de l’interactivité au site : JQuery et responsive design
- Les effets interactifs : utiliser les librairies JQuery intégrées à Dreamweaver
- Introduction au Responsive design et aux media queries
- Les requêtes de media et les points d’arrêts
- Bonus : Bootstrap et le panneau Extract
Évaluation Objectif 05 : adapter sa maquette desktop en résolution smartphone.
Gérer, tester puis publier un site
- Tester ses pages et consulte le rapport
- Publier ses pages sur un serveur distant
- Le cas des CMS
Évaluation Objectif 06 : vérifier son développement avec le W3C et publier en ligne.
- L’intervenante alternera découverte des notions techniques, explications pédagogiques illustrées et travaux pratiques.
- De nombreux exercices vont permettre d’apprendre le codage HTML et CSS progressivement, et de créer des pages web de plus en plus graphiques au fur et à mesure de la formation.
- L’utilisation de l’interface de Dreamweaver permettra d’augmenter sa productivité, une fois la syntaxe des langages acquis
- Feuille d’émargement : les stagiaires émargeront par demi-journée.
- Attestation de formation remise aux stagiaires ayant suivi la formation avec assiduité.
- Une évaluation écrite portant sur l’atteinte des objectifs sera réalisée par les participants en fin de formation.
- Quiz et exercices réalisés en continu sur les 3 jours, afin de valider chacun des objectifs de formation
- Chez le client ou le centre de formation partenaire
- ou dans les locaux de Web Créatif : salle de formation de 33m² (6 stagiaires maximum) équipée de tableau blanc, internet en connexion Wifi et grand écran TV
- Notre salle de formation est accessible PMR et dispose d'une place de parking attenante, réservée PSH. Au besoin, nous pourrons délocaliser la formation dans une salle disposant de sanitaires accessibles PMR.
- N’hésitez pas à nous signaler tout besoin particulier en amont de la formation. Nous adapterons au mieux le programme et les exercices pour faciliter votre apprentissage.
- Une formation sur-mesure est fortement recommandée pour les professionnels malvoyants ou malentendants. N’hésitez pas à contacter notre centre de formation, nous réaliserons ensemble une session adaptée à votre situation.
- Le registre d'accessibilité est disponible sur simple demande.
La formatrice
dédiée à « Dreamweaver CC »
Sabrina Échappé
Sabrina a appris HTML et CSS sur Dreamweaver en 2004, quand il était encore édité par Macromédia. Elle avait appris à utiliser en premier son interface WYSIWYG. Ce fut une erreur de son point de vue car la facilité apparente du logiciel lui avait fait sous-estimer la difficulté du code !
Dreamweaver est impressionnant quand on le laisse créer le code à la volée, il offre une interface ultra-guidée et une librairie de composants très complète. Pour autant, il ne faut pas chercher à éviter la partie code, sans quoi votre autonomie serait trop limitée. D’ailleurs, la formation se soldera par le test de l’onglet « Développeur »…
Mémo et outils
pour se former sur Dreamweaver
- Pensez à apporter votre ordinateur avec chargeur, et de quoi prendre des notes (papier /crayon recommandés) ;
- Veillez à installer au préalable Dreamweaver (de CS3 à CC), ainsi que les navigateurs usuels : Chrome, Firefox, Safari, Edge;
- Apportez un smartphone, voire une tablette, pour tester en réel l’affichage responsive sur smartphone ;
- Vous pouvez également demander à intégrer votre propre maquette dans le cadre d’un intra-entreprise ;
Formation
présentielle
Sur Mesure
Possible
Mise à jour
j-7 à J-1
Distanciel
non réalisable
