Initiation à HTML & CSS: le programme dévoilé!

Initiation à HTML & CSS: le programme dévoilé!

La date de la sortie de ma formation « Initiation à HTML & CSS » approche à grand pas ! Vous êtes déjà plus de 100 à avoir manifesté votre intérêt. Merci à vous tous! Aujourd’hui, je vous propose de découvrir son contenu en détails.

  • Quel est le programme de cette formation ?
  • Que pouvez-vous y apprendre ?
  • Que saurez-vous faire après l’avoir suivi ?
  • Les nouveautés de cette version

Introduction : HTML et CSS, mais à quoi ça sert ?

Durée: 7min47

Ce que vous allez apprendre:

  • Définiton du vocabulaire de base
  • Les rôles respectifs de HTML et CSS
  • Comment HTML et CSS se combinent pour donner aux pages web le rendu qu’on leur connaît
  • Quelles sont les parties qui composent le squelette d’une page web

Ce que vous saurez faire:

  • Vous serez en mesure de comprendre les informations glanées sur les forums et dans les tutoriels. La maitrise du langage est un pré-requis vers l’autonomie.
  • Vous saurez quel fichier de votre site web vous devez modifiez pour agir au choix sur le contenu ou sur le design: fini de tout confondre et de chercher à l’éveugle dans tout votre site!

Module 1 – HTML Théorie : Le langage de conception des pages web

Durée: 7min40

Ce que vous allez apprendre:

  • La syntaxe des balises HTML
  • Le rôle des attributs HTML
  • La spécificité de l’attribut « id »
  • Les éléments de types « block » et « en ligne » : leurs différences, leurs intérêts et leurs dangers
  • Comment et pourquoi écrire un commentaire en HTML ?
  • Analyse d’une page web : comprendre tout ce code qui ne s’affiche pas sur votre écran mais qui est bien présent sur les fichiers « .html »

Ce que vous saurez faire:

  • Vous pourrez facilement ajouter des codes à copier-coller (comme le code de Google Analytics) dans vos pages, sans risquer de tout casser!
  • Vous pourrez lire votre code et repérer les erreurs de syntaxe à l’origine d’un dysfonctionnement
  • Vous comprendrez enfin pourquoi il est impossible de placer une image et un paragraphe de texte côte à côte (sans ajouter un peu de CSS)
  • Vous pourrez identifier n’importe quel élément HTML

Module 1 – HTML Pratique : Utiliser HTML pour améliorer votre référencement

Durée: 23min39

  • Tutoriel N°1: Les liens dofollow et nofollow
  • Tutoriel N°2: Ancrer vos liens internes
  • Tutoriel N°3: Le backlinking
  • Tutoriel N°4: Comment organiser son contenu pour améliorer son référencement
  • Tutoriel N°5: La triplette du bourrin

Ce que vous allez apprendre:

  • La balise à la base du web: la plus importante à connaître
  • La différence entre une ancre et un backlink
  • Les balises à utiliser obligatoirement pour assurer une bonne compréhension de vos pages par Google
  • Un moyen mnémotechnique pour référencer correctement vos images

Ce que vous saurez faire:

  • Créer un lien en dofollow ou en nofollow
  • Des boutons pour atteindre directement une section d’une page
  • Optimiser vos campagnes de backlinking pour qu’elles soient vraiment efficaces
  • Organiser votre contenu correctement pour vous positionner sur les mots-clefs désirés
  • Référencer les images de vos pages

Module 2 – CSS Théorie : Le langage de mise en forme des pages web

Durée: 12min09

Ce que vous allez apprendre:

  • La syntaxe du CSS
  • Les sélecteurs : balises, class et id
  • Où écrire le CSS ?
  • Les règles de priorités de CSS
  • Comment lier le fichier CSS au fichier HTML ?

Ce que vous saurez faire:

  • Ecrire et lire du code en CSS
  • Comprendre les différences entre les différents types de CSS
  • Utiliser les codes CSS trouvé sur le net et les adapter pour qu’ils fonctionnent TOUJOURS sur votre design
  • Etre capable de débugger du code CSS

Module 2 – CSS Pratique : Utiliser CSS pour personnaliser votre design

Pour la partie pratique de ce module, vous en connaissez suffisamment pour que nous abordions des applications poussées!

J’ai découpé ce module en 8 vidéos pour faciliter votre apprentissage.

  • Introduction
    Durée : 2min20
  • Présentation des outils employés dans les exercices
    Durée : 3min04
  • Tutoriel N°1 : Styler le texte
    Durée: 11min52
  • Tutoriel N°2 : Styler les boites
    Durée: 7min34
  • Tutoriel N°3 : Changer la couleur du texte des liens
    Durée: 4min27
  • Tutoriel N°4 : Changer la couleur de fond des champs de formulaire
    Durée: 2min31
  • Tutoriel N°5 : Créer un contexte de positionnement
    Durée: 7min31
  • Tutoriel complémentaire en bonus:
    Comment utiliser CSS dans un CMS ? Je vous donne une astuce incontournable qui marche dans 95% des cas pour que votre code CSS

    fonctionne toujours!
    Durée: 5min54

Ce que vous allez apprendre:

  • Les propriétés CSS les plus couramment employées et comment les configurer
  • Comment styler une action en CSS (clic, survol avec la souris…)
  • Le rôle et l’impact du « flux » dans la construction de vos pages web

Ce que vous saurez faire:

  • Modifier votre texte pour qu’il apparaissent en gras, pour le souligner ou en changer la couleur
  • Mettre en forme vos paragraphes en y ajoutant des coins arrondis, des images de fond ou en changeant sa taille
  • Changer dynamiquement l’apparence d’un champ de formulaire quand votre visiteur commencer à écrire dedans
  • Le tutoriel ultime : afficher ce que vous voulez où vous voulez sur votre page! Fini les casses-têtes grâce à cette méthode que peu emploie.
  • Rendre votre code fonctionnel dans quasiment tous les cas et prendre le contrôle sur votre site!

Les nouveautés de cette version

  • Un exercice bilan pour vous permettre de tester vos nouvelles compétences.
  • A la demande d’un ancien stagiaire : le guide ultime pour maîtriser la syntaxe de HTML et CSS (18 pages)
  • Un accès à vie à la formation et à tous ses avantages.
  • Les mises à jour de la formation vous sont offertes gratuitement, année après année.
  • Les vidéos sont téléchargeables sur votre ordinateur: ne soyez plus dépendants de la connexion web!
  • Le son a été nettoyé et optimisé pour votre confort.
  • Les vidéos tutoriels ont été découpées en plusieurs vidéos de courte durée, afin de faciliter votre entraînement
  • Et bien sûr, les avis des premiers stagiaires.

Au total

Plus de 1h40 de vidéos contenant des informations détaillées, pédagogiques et directement applicables sur votre site.

Maintenant que vous connaissez le programme, vous avez sûrement des questions….

Permettez-moi d’éclaircir quelques points en vous présentant les principes de cette formation:

Ce que cette formation n’est pas:

  • Un guide pour construire votre site web de A à Z
  • Un cours destinée aux utilisateurs de WordPress uniquement
  • Une explication théorique de type « cours magistral »
  • Une formation de fond destinée à faire de vous des webmasters ou des intégrateurs professionnels
  • Un panel d’exercices divers et variés pour tout connaître de HTML et CSS

Ce que cette formation est:

  • Un guide pour comprendre les langages qui composent vos pages web, tant au niveau du contenu que du design
  • Un cours destinée à tous ceux qui possèdent un site web ou un blog
  • Une explication théorique légère applicable immédiatement à votre cas
  • Une initiation destinée à vous faire comprendre le rôle de HTML et CSS dans le référencement et le graphisme de votre site
  • Une sélection d’applications adaptables très simplement à votre cas

Cette formation ne vous promet ni la richesse ni le succès sans effort. Tout apprentissage mérite investissement et travail personnel. Mais je vous garantis que les principes abordés vous seront utiles pour comprendre le fonctionnement de votre site.

« Le fondement de la théorie c’est la pratique.  »
Mao Tsé-Toung

Vous pourrez appliquer ce que vous aurez appris, et je vous encourage à le faire!

EDIT le 04 Juin : la formation est à présent en vente, découvrez-là sans attendre :

Combien coûte la formation « Initiation à HTML et CSS » ?

Si vous avez encore des questions, je serais ravie d’y répondre dans les commentaires.

Image courtesy of http://www.freedigitalphotos.net

CSS, développeur, formation, webmaster

A propos de MarieEve Louvel

Depuis 3 ans, je partage mes connaissances sur ce blog, pour les entrepreneurs désireux de créer leur site vitrine et/ou leur blog professionnel avec WordPress. Mon expérience professionnelle va de l'accompagnement à la formation, en passant par de la création de site ou de logiciel. Retrouvez mes cours en ligne sur mon site FeelWeb Formation [http://feelwebformation.com]

45 commentaires

  1. Un très bon tuto de référence pour débuter en HTML & CSS MarieEve comme toujours tes articles sont ingénieux et me sert de temps en temps comme aide mémoire. Je suis vraiment fasciné par ton énergie. bonne continuation et a+ pour tes articles

    Répondre
    • Merci Paul pour ton soutien :) Bonne continuation aussi!

      Répondre
  2. Bonjour Marie-Eve

    Je voulais savoir quel sera le cout de cet formation?

    Merci!

    Répondre
    • Bonjour Daniel,

      Je vais laisser encore planer le mystère quelques jours… 😉

      Répondre
  3. Bonjour Marie-Eve,

    J’aime beaucoup le Tutoriel N°5: La triplette du bourrin XD

    ça m’a fait beaucoup rire,le titre est percutant et drôle, merci pour ce moment de rigolade

    Je ne sais pas ce qui ce cache derrière ce module mais ça donne envie d’en savoir plus…( la magie du copywriting ;-))

    Plus sérieusement, est-ce que tu pourrais nous donner une idée du prix de cette formation ou il est encore trop tôt ?

    Répondre
    • Bonjour David,
      « Je ne sais pas ce qui ce cache derrière ce module mais ça donne envie d’en savoir plus… »
      >> encore un peu de patience, je me débats avec les finitions…c’est pour bientôt! 😉 Et le prix viendra en même temps!

      Répondre
  4. Bonsoir,
    La formation m’intéresse beaucoup, je viens de m’inscrire. Merci pour cette initiative et bonne continuation

    Répondre
    • Merci à vous :)
      A très bientôt,

      Répondre
  5. Bonsoir,
    Je dois avouer que quelque soit le prix je dois assister à cette formation, tout d’abord cette formation est très indispensable pour moi de plus d’après vos articles il est clair que vous êtes très sérieuse.
    Emma

    Répondre
    • Bonjour,

      Merci pour votre commentaire. J’ai pris un peu de retard mais je devrais pouvoir ouvrir les ventes en fin de semaine.

      A très vite!

      Répondre
  6. Bonjour,
    Je trouve cotre article très intéressant ainsi que votre blog, on remarque qu’il y’a du travail derrière je vous souhaite bonne continuation

    Répondre
  7. je trouve intéressant de regrouper les principales questions que l’on se pose en une formation pratique.
    une bonne façon de gagner du temps!
    Au fait, venez participer à l’évènement « 3 astuces pour gagner du temps », ouvert au blogueurs et non blogueurs
    La pêche aux idées pour sortir la tête de l’ordi en s’accordant un peu plus de temps!
    Hélène

    Répondre
    • Bonjour Hélène,

      « je trouve intéressant de regrouper les principales questions que l’on se pose en une formation pratique.
      une bonne façon de gagner du temps! »
      >> oui c’est justement ce que j’ai voulu faire: enseigner les bases théoriques tout en restant très pratique, très « utile ».

      Sympa ton évènement, j’aurais un peu plus de temps, j’y participerais mais là…

      Répondre
  8. Cette initiation aidera beaucoup de webmasters en manque d’informations et de connaissances pour faire tourner efficacement leur site internet.
    Encore merci pour votre blog, on voit qu’il y a des heure set des heures de travail derrière tout cela, bravo et bonne continuation à vous !

    Répondre
  9. Bonjour,
    Bon courage MarieEve, vous êtes en train de faire un travail exceptionnel, je vous souhaite la réussite.
    Ce genre d’initiatives sont très importantes surtout pour les débutants qui ont besoin de l’aide pour avancer dans leur travail.
    Alex

    Répondre
  10. Très bonnes informations.Bravo!Je vous remercie énormément Marie Eve,c’est très utile pour les débutants tout comme moi dans le domaine du web. Il faut y avoir des programmes spécifiques de chaque formation, mais en règle générale une excellente motivation est essentielle !

    Répondre
    • Bonjour,
      Merci à vous!

      A bientôt,

      Répondre
  11. Personne sérieuse + prix imbattable : Je viens d’acheter la formation !

    Vacances studieuses en perspective, mais j’ai confiance dans les talents pédagogiques de Marie-Eve, à qui je souhaite beaucoup de succès.

    Répondre
    • Bonjour Emanuelle,

      Merci pour votre confiance! J’espère que la formation sera à la hauteur^^ et je vous souhaite de bonne vacances studieuses! :)

      Amicalement,

      Répondre
  12. Bonjour Marie-Eve,

    Ca y est je me suis jeté à l’eau et j’ai commandé ta formation ! (avant la fin du monde y parait) J’espère ainsi avoir une bonne vue d’ensemble du html et du css et ne pas rester cyberdépendant des autres. De plus c’est toujours plus agréable d’écouter une personne que de plonger tête baissée dans des ebooks pour commencer.

    Amicalement,
    François

    Répondre
    • Bonjour François,

      Félicitations pour t’être jeté à l’eau! Bonne formation et merci pour ta confiance ! :)

      Répondre
  13. Bonjour,

    Formation achetée et la qualité est au rendez-vous, je n’en doutais pas.

    Le prix est tout à fait raisonnable.

    Quelques connaissances en plus en cette fin d’année ne peuvent pas faire de mal.
    Après il faudra mettre tout cela en application sur mon site.

    Bonne fêtes à tous.

    Répondre
    • Bonjour Alex
      Merci pour ton témoignage, bonne formation et bonnes fêtes a toi aussi. :)

      Répondre
  14. Bonjour Marie-Eve,
    je tenais à te féliciter pour cette grande avancée dans ton projet, tu finis cette année en beauté !

    Bonne continuation !

    Répondre
  15. Bonjour Marie Eve,

    Je suis très intéressé par vos tutoriels mais quel est leur coût ? Merci d’avance pour vos informations

    Répondre
    • Bonjour,
      Merci de votre intérêt. :)

      Le lien vers la page de vente sera bientôt en ligne 😉 La patience est de mise encore quelques jours…

      Répondre
  16. Elle est très bien cette formation! J’espère que tu ne t’arrêtera pas en si bon chemin, tu pourrais nous proposer des modules de programmation plus avancés en 2013, là je serais vraiment intéressé.

    Répondre
    • Bonjour Romaric,

      Ok, je note que certains sont prêts pour du code plus compliqué. 2013 verra de belles formations voir le jour! :)

      J’ai édité ton message, les commentaires ne sont pas un lieu de promotion. 😉

      Merci pour ton avis,

      Répondre
  17. Vraiment c’est très intéressant ce guide, Merci pour cette formation utile surtout pour les débutants ça sera un bon plan pour avancer dans leur travail.
    Merci pour cet article pertinent.
    Bonne continuation.

    Répondre
  18. Bonsoir,

    Bien ton teasing.
    Tu as vraiment réussis à nous mettre l’eau à la bouche.
    On n’attend donc plus que la page de vente et le lien pour accéder à la formation.

    Je ne suis pas certain d’avoir une réponse, ce que je comprends, mais je pose tout de même ma question.

    Concernant le prix, sera-t-il équivalent à celui de ta 1ère formation ?

    A très bientôt

    Emmanuel

    Répondre
    • Bonsoir,
      Merci :) je suis assez contente des pré-inscriptions, le lancement devrait bien se passer.

      Pour le prix…un poil plus cher que l’éditions 2012, mais elle reste encore très accessible.

      La suite très bientôt ! :)

      Répondre
  19. Une bonne nouvelle, une guide riche et bien détaillé c’est ce que tout le monde attends de vous Marie Eve, là je te fais une ovation pour ce travail titanesque

    Répondre
    • Merci, j’espère que la formation te plaira autant que sa présentation !

      Répondre
  20. Bonsoir Marie-Eve,

    En forme? Est-ce que cette formation est la mise à jour de ta formation lancée en décembre?Est-ce que les premiers membres y ont un accès automatique?Ou est ce une nouvelle formation?

    François

    Répondre
    • Bonsoir François,

      Oui exactement, c’est une mise à jour. Bien sûr, ceux qui l’ont acheté en Décembre y auront accès gratuitement, avec ses nouveaux bonus et la possibilité de télécharger les vidéos !

      Bien à toi,

      Répondre
  21. Bonjour Marie-Eve,

    Un grand merci pour cet article qui est très complet :-)

    A l’heure où le web se développe, c’est important de savoir et surtout comprendre r le langage d’une page web !

    JM.

    Répondre
  22. Bonjour et merci pour l’article et pour la formation je suis vraiment très intéressé d’apprendre HTML5 & CSS en plus je fait de l’auto-formation dans ce domaine mais malheureusement j’ai pas le temps pour faire des formations pour le moment :(

    Répondre
  23. Bonjour Marie-Eve,

    J’avoue être intrigué par le tutoriel « La triplette du bourrin »! Qu’est ce qu’il se cache derrière un intitulé aussi amusant?

    Répondre
    • Bonjour Laurent,

      Mystère mystère 😀

      Répondre
  24. Bonjour,
    J’ai acheté la formation et je viens de voir une grande partie des vidéos. Je la trouve très claire et très interessante.
    Mais je trouve très dommage de ne pas l’avoir adaptée de façon plus spécifique à wordpress. Comment peut-on modifier les styles wordpress??? C’est cela qui m’aurait vraiment intéressé. Et je ne vois aucune mention de cela sur vos tutos…
    Serait-il envisageable de faire un tuto spécialement là-dessus dans le futur pour des novices comme moi?
    Merci.
    Gabrielle

    Répondre
    • Bonjour Gabrielle,

      En effet, la formation est généraliste. Vous pouvez appliquer tous ces « astuces » ou façons de faire au fichier style.css de votre thème (en fin de fichier) en prenant garde de respecter les règles de priorités de la cascade décrites dans la formation. Vous trouverez un exemple d’application dans la vidéo bonus « Comment utiliser CSS dans un CMS ? » (dans la partie Bonus de la formation).

      Parfois les thèmes WordPress utilisent plus d’une feuille de style. Le sujet à lui seul mériterait encore 2 heures de formation pour que mes explications s’adaptent à tous les cas. 😉

      Répondre

Trackbacks/Pingbacks

  1. "Initiation à HTML & CSS":... - [...] La blogueuse très sérieuse Marie-Eve vient de dévoiler le programme de sa formation complète sur le HTML et le…

Soumettre un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

This Blog will give regular Commentators DoFollow Status. Implemented from IT Blögg

EmailEmail
PrintPrint