Description

Cet enseignement pratique porte sur les bases de la création de pages web statiques fondé sur une utilisation sémantique du langage HTML pour organiser les contenus rédactionnels et l’application de feuilles de style CSS afin de produire une présentation visuelle agréable, ergonomique et adaptée à différents supports (ordinateur, tablette, smartphone). Il constitue une première introduction aux deux langages : aucune connaissance préalable n’est requise et l’usage d’outils d’intelligence artificielle générative n’est pas mobilisé dans ce cours, afin de permettre aux étudiants d’acquérir les fondamentaux de manière autonome.

Compétences visées

Langage HTML

• connaître la structure d’un document HTML5
• savoir valider une page HTML
• connaître les principales balises HTML, leur sémantique, leur usage et leurs propriétés structurelles :

     ○     titres et paragraphes

     ○     images

     ○     liens

     ○     listes

     ○     tableaux

     ○     formulaires

     ○     balises sémantiques HTML5 (header, nav, main, section, article, aside, footer)

Les feuilles de style CSS

• savoir appliquer une feuille de style externe ou interne à une page
• connaître les principaux sélecteurs :

     ○     sélecteurs d’éléments

     ○     sélecteurs de classes et d’identifiants

     ○     pseudo-classes et pseudo-éléments

     ○     sélecteurs d’attributs

     ○     opérateurs (descendant, enfant, successeur)

• connaître les principales propriétés CSS :

     ○     marges et dimensions

     ○     couleurs et images de fond

     ○     propriétés des polices

     ○     bordures (y compris bordures arrondies)

     ○     propriétés display et position

     ○     transitions et transformations

Mise en page et adaptabilité

• comprendre et utiliser le modèle Flexbox pour structurer une page
• avoir une vision d’ensemble du modèle CSS Grid
• concevoir des pages responsive à l’aide des media queries
• appliquer une approche mobile-first

Disciplines

• Informatique