{"id":6417,"date":"2024-02-01T14:35:12","date_gmt":"2024-02-01T13:35:12","guid":{"rendered":"https:\/\/www.swash-formation.fr\/?post_type=formation&#038;p=6417"},"modified":"2026-03-04T16:49:02","modified_gmt":"2026-03-04T15:49:02","slug":"html5-css3-reussir-sa-prise-en-main","status":"publish","type":"formation","link":"https:\/\/www.swash-formation.fr\/formation\/html5-css3-reussir-sa-prise-en-main\/","title":{"rendered":"HTML5 \/ CSS3&nbsp;: r\u00e9ussir sa prise en main"},"template":"","domaine":[12],"motcle":[23,364,22,365],"metier":[],"etiquette":[],"type_ra":[80],"logiciel":[],"class_list":["post-6417","formation","type-formation","status-publish","hentry","domaine-formation-ux-ui-webdesign","motcle-interface","motcle-newsletter","motcle-projet","motcle-site","type_ra-inter","no-post-thumbnail"],"acf":{"FOR_Format":"80","FOR_SousTitre":"S\u2019initier au langage HTML et aux styles CSS pour \u00eatre en mesure d'appr\u00e9hender la syntaxe et d'intervenir sur des contenus existants (pages Web, newsletter, applications\u2026)","FOR_Jours":2,"FOR_Heures":14,"FOR_Duree":"","FOR_DureeTxt":"2 jours \/ 14 heures","FOR_Prix":1400,"FOR_Ref":"W12","FOR_Niveau":"Initiation","FOR_PrixComplet":"1 400 euros HT %2F Soit 1 680 euros TTC","FOR_PrixCourt":"1 400 \u20ac HT","FOR_Support":"","FOR_ProgPdf":"","FOR_Intervenants":"","FOR_Comp":"<p><span style=\"font-weight: 400;\">Structurer, mettre en forme et modifier des contenus HTML. G\u00e9rer les styles et sa mise en pages avec les CSS.<\/span><\/p>","FOR_Obj":"<ul>\r\n\t<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Contextualiser le HTML et les CSS<\/span><\/li>\r\n\t<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Structurer une page HTML<\/span><\/li>\r\n\t<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Mettre en forme une page HTML<\/span><\/li>\r\n\t<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Ajouter de l\u2019animation et de l\u2019interactivit\u00e9<\/span><\/li>\r\n\t<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Mettre en ligne une page HTML<\/span><\/li>\r\n<\/ul>","FOR_Valider":"<ul>\r\n\t<li>votre projet et le contexte de votre demande pour co-construire le programme d\u00e9finitif<\/li>\r\n\t<li>le format\u00a0: pr\u00e9sentiel et\/ou distanciel<\/li>\r\n\t<li>le tarif\u00a0: calcul\u00e9 selon le temps de pr\u00e9paration, les moyens \u00e0 mobiliser, le nombre de jours, le lieu de la formation\u2026<\/li>\r\n\t<li>*la dur\u00e9e\u00a0: \u00e0 confirmer selon les pr\u00e9requis et les objectifs \u00e0 atteindre par les apprenants<\/li>\r\n<\/ul>","FOR_5Raisons":"","FOR_Public":"<p><span style=\"font-weight: 400;\">Cette formation s\u2019adresse \u00e0 tous les professionnels du design graphique et de la communication visuelle.<\/span><\/p>","FOR_Prerequis":"<p><span style=\"font-weight: 400;\">Ma\u00eetrise de l'outil informatique et bonne connaissance de la navigation \/ du vocabulaire Web.<\/span><\/p>","FOR_Programme":"<h3 class=\"chapitre\">Contextualiser le HTML et les CSS<\/h3>\r\n<ul>\r\n\t<li>D\u00e9finir le r\u00f4le de chacun des acteurs : HTML \/ CSS \/ JavaScript<\/li>\r\n\t<li>Expliquer les principes du Responsive Web Design<\/li>\r\n\t<li>Hi\u00e9rarchiser les fichiers d\u2019un site Web<\/li>\r\n\t<li>Choisir un \u00e9diteur (textedit, Intellij ou VS Code selon le besoin)<\/li>\r\n<\/ul>\r\n<div class=\"exo\"><em>\u2192 Analyse de sites Web<\/em><\/div>\r\n<h3 class=\"chapitre\">Structurer une page HTML<\/h3>\r\n<ul>\r\n\t<li>Diff\u00e9rencier les parties d\u2019une page Web<\/li>\r\n\t<li>Formater le texte : titre, gras, italique, listes\u2026<\/li>\r\n\t<li>D\u00e9couvrir les balises s\u00e9mantiques<\/li>\r\n\t<li>Identifier et manipuler les balises principales : main, nav, header, footer, section, article, div, table, form, inputs\u2026<\/li>\r\n<\/ul>\r\n<div class=\"exo\"><em>\u2192 Exercice : monter sa premi\u00e8re page Web<\/em><\/div>\r\n<h3 class=\"chapitre\">Mettre en forme une page HTML<\/h3>\r\n<ul>\r\n\t<li>Cr\u00e9er une feuille de styles CSS<\/li>\r\n\t<li>Lier le fichier CSS \u00e0 sa page HTML<\/li>\r\n\t<li>Identifier les s\u00e9lecteurs de balises<\/li>\r\n\t<li>D\u00e9couvrir et tester l\u2019inspecteur HTML\/CSS<\/li>\r\n\t<li>G\u00e9rer les polices<\/li>\r\n\t<li>Modifier les \u00e9l\u00e9ments de sa page<\/li>\r\n<\/ul>\r\n<div class=\"exo\"><em>\u2192 Exercice : habiller sa page Web \/ Modifier des pages existantes<\/em><\/div>\r\n<h3 class=\"chapitre\">Ajouter de l\u2019animation et de l\u2019interactivit\u00e9<\/h3>\r\n<ul>\r\n\t<li>Cr\u00e9er des liens<\/li>\r\n\t<li>Ajouter un fichier JavaScript<\/li>\r\n\t<li>Utiliser les styles avanc\u00e9s (ombres, coins arrondis, transitions)<\/li>\r\n<\/ul>\r\n<div class=\"exo\"><em>\u2192 Exercice : ajouter de l\u2019animation et des liens sur un menu<\/em><\/div>\r\n<h3 class=\"chapitre\">Mettre en ligne une page HTML<\/h3>\r\n<ul>\r\n\t<li>Diff\u00e9rencier les notions de clients \/ serveurs<\/li>\r\n\t<li>S\u00e9lectionner un nom de domaine et planifier l\u2019h\u00e9bergement<\/li>\r\n\t<li>Se connecter via FTP<\/li>\r\n<\/ul>\r\n<div class=\"exo\"><em>\u2192 Exercice : mettre en ligne sa page Web et la modifier<\/em><\/div>","FOR_Profil":"<p><span style=\"font-weight: 400;\">UI designer avec plus de 10 ans d\u2019exp\u00e9rience en animation de formation.<\/span><\/p>","FOR_Ressources":"<ul>\r\n\t<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Supports de cours d\u00e9mat\u00e9rialis\u00e9s<\/span><\/li>\r\n\t<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Abonnement de 3 mois \u00e0 <a href=\"https:\/\/fr.tuto.com\" target=\"_blank\" rel=\"noopener\">tuto.com<\/a><\/span><\/li>\r\n\t<li style=\"font-weight: 400;\">Acc\u00e8s illimit\u00e9 par mail \u00e0 la hotline Swash<\/li>\r\n<\/ul>","FOR_ModPres":"<h4><strong>Parcours p\u00e9dagogique\u00a0: <\/strong><\/h4>\r\n<p><span style=\"font-weight: 400;\">Quiz de positionnement <span class=\"flechD\">\u276f\u00a0<\/span>2 jours continus en pr\u00e9sentiel <span class=\"flechD\">\u276f <\/span><\/span><span class=\"s1\">\u00c9valuation des acquis<\/span><\/p>\r\n<h4><strong>M\u00e9thode p\u00e9dagogique : <\/strong><\/h4>\r\n<p><span style=\"font-weight: 400;\">Expositive + d\u00e9monstrative : expos\u00e9s th\u00e9oriques, d\u00e9monstrations, mise en pratique, feedbacks personnalis\u00e9s<\/span><\/p>\r\n<h4><strong>Moyens techniques : <\/strong><\/h4>\r\n<ul>\r\n\t<li><span style=\"font-weight: 400;\">1 poste par participant (Mac ou PC, selon votre choix)<\/span>, fourni par nos soins, \u00e9quip\u00e9 des logiciels utiles<\/li>\r\n\t<li>Poste de l\u2019intervenant reli\u00e9 \u00e0 un grand \u00e9cran ou vid\u00e9oprojecteur<\/li>\r\n<\/ul>","FOR_ModDist":"<h4>Parcours p\u00e9dagogique\u00a0:<\/h4>\r\n<p><span style=\"font-weight: 400;\">Quiz de positionnement <span class=\"flechD\">\u276f<\/span> 2 classes virtuelles discontinues (2 x 1 jour) <span class=\"flechD\">\u276f<\/span> <\/span><span class=\"s1\">\u00c9valuation des acquis<\/span><\/p>\r\n<h4>M\u00e9thode p\u00e9dagogique :<\/h4>\r\n<p><span style=\"font-weight: 400;\">Expositive + d\u00e9monstrative : expos\u00e9s th\u00e9oriques, d\u00e9monstrations, mise en pratique, travail individuel inter-sessions, feedbacks personnalis\u00e9s<\/span><\/p>\r\n<h4>Moyens techniques\u00a0:<\/h4>\r\n<ul>\r\n\t<li>Classe virtuelle cr\u00e9\u00e9e par nos soins\u00a0<\/li>\r\n\t<li>Chaque apprenant participe \u00e0 la session avec son ordinateur, connect\u00e9 \u00e0 Internet, et \u00e9quip\u00e9 :\r\n\r\n<ul>\r\n\t<li>d\u2019un micro et d\u2019une cam\u00e9ra<\/li>\r\n\t<li><span style=\"font-weight: 400;\">des outils \/ logiciels utiles (\u00e9diteurs gratuits \u00e0 installer en amont \/ informations pr\u00e9cis\u00e9es \u00e0 l\u2019inscription)<\/span><\/li>\r\n<\/ul>\r\n<\/li>\r\n<\/ul>","FOR_Eval":"<ul>\r\n\t<li><span style=\"font-weight: 400;\">Validation des acquis pendant la formation gr\u00e2ce \u00e0 des quiz et \u00e0 la r\u00e9alisation d\u2019exercices pratiques<\/span><\/li>\r\n\t<li>Suivi d'acquisition des objectifs p\u00e9dagogiques par l'intervenant<\/li>\r\n\t<li><span style=\"font-weight: 400;\"> \u00c9valuation \u00e0 chaud (remplie en fin de formation) et \u00e0 froid (\u00e0 60 jours)<\/span><\/li>\r\n<\/ul>","for_pourquoi":"","FOR_PlanCond":1,"FOR_PlanDist":[{"FOR_Dates":"les 14 et 21 f\u00e9vrier 2025","FOR_Mentorat":null,"FOR_DateOff":"20250214"},{"FOR_Dates":"les 5 et 12 d\u00e9cembre 2025","FOR_Mentorat":null,"FOR_DateOff":"20251205"},{"FOR_Dates":"les 29 mai et 8 juin 2026","FOR_Mentorat":null,"FOR_DateOff":"20260529"},{"FOR_Dates":"les 23 et 30 novembre 2026","FOR_Mentorat":null,"FOR_DateOff":"20261123"}],"FOR_PlanPres":[{"FOR_Dates":"les 17 et 18 mars 2025","FOR_Mentorat":null,"FOR_DateOff":"20250317"},{"FOR_Dates":"les 10 et 11 juin 2025","FOR_Mentorat":null,"FOR_DateOff":"20250610"},{"FOR_Dates":"les 29 et 30 septembre 2025","FOR_Mentorat":null,"FOR_DateOff":"20250929"},{"FOR_Dates":"les 24 et 25 novembre 2025","FOR_Mentorat":null,"FOR_DateOff":"20251124"},{"FOR_Dates":"les 19 et 20 f\u00e9vrier 2026","FOR_Mentorat":null,"FOR_DateOff":"20260219"},{"FOR_Dates":"les 19 et 20 mai 2026","FOR_Mentorat":null,"FOR_DateOff":"20260519"},{"FOR_Dates":"les 14 et 15 septembre 2026","FOR_Mentorat":null,"FOR_DateOff":"20260914"},{"FOR_Dates":"les 21 et 22 d\u00e9cembre 2026","FOR_Mentorat":null,"FOR_DateOff":"20261221"}],"for_tag-new":false,"for_tag-update":false},"_links":{"self":[{"href":"https:\/\/www.swash-formation.fr\/sw-connect\/wp\/v2\/formation\/6417","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.swash-formation.fr\/sw-connect\/wp\/v2\/formation"}],"about":[{"href":"https:\/\/www.swash-formation.fr\/sw-connect\/wp\/v2\/types\/formation"}],"wp:attachment":[{"href":"https:\/\/www.swash-formation.fr\/sw-connect\/wp\/v2\/media?parent=6417"}],"wp:term":[{"taxonomy":"domaine","embeddable":true,"href":"https:\/\/www.swash-formation.fr\/sw-connect\/wp\/v2\/domaine?post=6417"},{"taxonomy":"motcle","embeddable":true,"href":"https:\/\/www.swash-formation.fr\/sw-connect\/wp\/v2\/motcle?post=6417"},{"taxonomy":"metier","embeddable":true,"href":"https:\/\/www.swash-formation.fr\/sw-connect\/wp\/v2\/metier?post=6417"},{"taxonomy":"etiquette","embeddable":true,"href":"https:\/\/www.swash-formation.fr\/sw-connect\/wp\/v2\/etiquette?post=6417"},{"taxonomy":"type_ra","embeddable":true,"href":"https:\/\/www.swash-formation.fr\/sw-connect\/wp\/v2\/type_ra?post=6417"},{"taxonomy":"logiciel","embeddable":true,"href":"https:\/\/www.swash-formation.fr\/sw-connect\/wp\/v2\/logiciel?post=6417"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}