Hello,
Combien d’heures : ca depend des formations, 14h dans certaines, 3h + des videos dans d’autres, 10h encore dans une autre, dans tous les cas, PAS ASSEZ :/
Résultat : c’est une introduction le but c’est de faire une simple page, et surtout de comprendre quand ils vont devoir utiliser un CMS ou lire un cahier des charges les tenants et aboutissants.
Groupes : entre 7 et 25
Niveau : Licence 3, Master 1, et des gens en formation (aka des gens qui travaillent dans des agences par exemple)

Pour Flexbox je suis d’accord, c’est la prochaine étape faire évoluer le cours pour ajouter du flexbox MAIS mon nombre d’heures n’est pas extensible, ça veut dire retirer des choses. En fait je pense que pour le moment encore, beaucoup de sites sur lesquels vont intervenir les étudiants on été construits en flottants, du coup ne pas leur enseigner les flottants serait un handicape s’ils doivent intervenir sur de l’existant (dans leurs stages ou apprentissages).
Un exemple tout con : beaucoup d’étudiants travaillent avec du WordPress et vont utiliser l’éditeur pour aligner des images. Ils ont donc besoin des flottants pour comprendre ce genre de choses. Float ne va pas disparaitre, on va juste s’en servir à l’avenir pour ce pour quoi c’était fait à savoir des alignements d’image (comme dans l’exemple de mes cours), et pas forcement pour les layouts, effectivement. J’ai aussi l’impression que pleins de devs se jettent dans flexbox sans comprendre les autres propriétés.
Pareil pour les position: absolute pour faire des modales ou des effets, fixed pour les menus. Bref on peut pas tout faire avec flexbox, j’aimerai l’ajouter un jour, mais il faudrait ajouter des heures :/ De toute façon souvent ils ont un cours plus avancé ensuite, mon cours c’est vraiment un cours de HTML et de CSS, au sens très brut comprendre le langage pas un cours d’intégration web.
J’enseigne pas le responsive mais je leur propose dans un des layouts une mise en page fluide, et je leur explique qu’avec ca ils ont les bases, le responsive ensuite c’est surtout déplacer des blocs en fonction du contenu dans le navigateur :)
Je sais pas si tu fais fausse route, ce n’est pas à moi de juger, je connais pas tes étudiants et leurs besoins.

Merci Stéphanie pour ce diaporama très instructif.
Je donne également un cours d’initiation à des étudiants exactement dans la situation que tu décris (non spécialistes, n’ont jamais vu une ligne de code, ne seront probablement pas intégrateurs), et à la lecture de ton diaporama je me suis posé plein de questions, de deux ordres: pédagogie, et technique.
Pédagogie :
– combien d’heures as-tu pour donner ce cours?
– le résultat auquel doivent arriver les étudiants est-il un site fini (statique, de quelques pages)?
– ce sont des étudiants en quelle année (licence 1,2, ou 3) ou master?
– tu as des groupes de combien d’étudiants en moyenne ?

Technique
Je suis très attentif à ce que tu proposes car je suis venu à l’idée d’enseigner le HTML/CSS après avoir commencé les cours avec un CMS; je me suis rendu compte que le CMS était un « trompe l’œil » pour les étudiants et ne les sortait pas assez de la logique pousse-bouton. Je me suis aussi rendu compte que la motivation à créer quelque chose soi-même à partir de son code est très forte chez les étudiants, passé la première appréhension. Mais sur un cours de 25h, j’ai fait des choix, et j’ai l’impression que les tiens sont différents (et justement, ça m’intéresse de savoir pourquoi):
– sur le positionnement, c’est un vrai arrache cheveux; j’ai décidé de leur apprendre directement flexbox, qui simplifie je trouve énormément la donne; pourquoi est-ce que tu l’as laissé hors champ, alors que les navigateurs l’acceptent tous?
– de même, je leur ai demandé de faire un site (3 pages mini) responsive, partant du principe qu’il serait plus vu sur un tél que sur un grand écran: tu penses que c’est une bonne idée?
– je projette même de faire la prochaine initiation en mobile first (partant de l’idée que le mobile est plus contraint, et qu’on peut associer « amélioration progressive » et « complexité progressive de l’apprentissage »…
En fait, je me dis que si ils ont l’occasion de se servir de ses connaissances, ce sera dans les 3/4 prochaines années, et qu’il vaut mieux qu’ils aient en main les standards d’aujourd’hui. Ma à lire ton diaporama, je me demande vraiment : est-ce que je fais fausse route?

Merci :)
En fait le public de ces cours sont des débutants, souvent dans des formations qui n’ont pas toujours grand chose à voir avec le web (com’, formations de langue), le genre de personnes qui ont déjà du mal parfois avec un ordinateur (j’ai du expliquer comment dézipper les exercices en fois en cours). Je ne souhaitais donc pas les effrayer en commençant par leur expliquer le DOM. Je voulais du concret, qu’ils jouent avec le code dans le navigateur avant de faire de l’abstrait. Encore une fois, le but est pas d’en faire des intégrateurs, mais qu’ils comprennent comment ça fonctionne, à eux de continuer s’ils veulent ensuite aller plus loins vers des ressources plus complètes et complexes.
Si j’ai bien compris tu as survolé les slides et la table des matières. Je t’encourage à jeter un nouveau oeil aux slides plus en détail cette fois et surtout à la partie sur le CSS. J’y évoque le DOM, toute la partie sur la descendance des sélecteurs, le principe de representer son code HTML comme un arbre, je parle du DOM et du concept sans vraiment le nommer au final. Mais je préfère en parler après plusieurs heures de pratique, c’est moins effrayant.