Développement d’interfaces 2 – CSS

Horaire: mardi – 15h15 à 16h45
Classe: ID301
Acronyme cours: EEDEV
Catégorie: Elaboration du design
Enseignant: Manuel Schmalstieg
Lien: https://eracom-id301.github.io/cours-dev2-css/

Introduction

Dans ce cours d’approfondissement CSS, vous allez:

  • vous familiariser avec la logique de ce langage.
  • apprendre de nombreuses fonctions du CSS.
  • styler des interfaces web

Le langage CSS, inventé quelques années après la création du World Wide Web (en 1996), est ce qui a fait du web un medium visuel, coloré, vivant. Ce langage a sa propre logique, et ce cours vous aidera à l’apprivoiser. Grace à votre maîtrise du CSS, vous pourrez donner forme à des designs variés, des plus traditionnels aux plus innovants.

Notre progression au cours du semestre est rythmée en cinq chapitres. Au passage, vous apprendrez à utiliser un outil devenu incontournable dans les métiers du web: il s’agit de GIT, un logiciel de versionnage (et plus encore).

Structure

Le cours est structuré en 5 chapitres.

Chapitre 1 : Standards

Chapitre 2 : The New Layout

CSS est un langage en évolution. Depuis 2010, de nombreuses nouvelles fonctions ont révolutionné la manière de penser les mises en page CSS (et ont rendu obsolètes tous les livres écrits auparavant). Nous allons étudier quelques unes des nouveautés les plus significatives: Grid Layout (module de mise en page), Feature Queries, et les unités Minmax et Clamp (qui permettent de nouvelles approches du responsive).

Intermède: Generated Content - 5 octobre

Le “Generated Content” est une fonctionnalité CSS pratique et de plus en plus utilisée.

Chapitre 3 : Shiny things

Un langage visuel comme CSS est un outil d’expression, qui donne une place à la créativité et permet des choix audacieux et novateurs. Nous abordons trois modules CSS qui ont pour rôle d’étendre les possibilités créatives:

Chapitre 4 : A11Y

Le sigle A11Y est une abbréviation pour “accessibility”. Concevoir des sites web, c’est assumer une responsabilité: assurer la lisibilité et l’usabilité pour toute personne voulant accéder au contenu. Pour ne pas créer (involontairement) des barrières techniques, il est important de connaître la nature de ces obstacles et les moyens de les éviter. Nous accorderons une attention particulière aux balises “input” qui doivent permettre les interactions en toutes circonstances.

Chapitre 5 : GIT

Vous apprendrez à utiliser un outil devenu incontournable dans les métiers du web: il s’agit de GIT, un logiciel de versionnage.

  • GIT : Intro GIT - 7 décembre
  • GIT : Publier avec Github Pages - 14 décembre
  • GIT : Collaborer avec Git - 21 décembre

Petit bonus pour la fin

  • SVG, format vectoriel du web - 11 janvier

Evaluations

Trois évaluations seront réalisées au courant du semestre:

  • Réaliser les challenges (1/3).
  • Test théorique (qui reprend les questions des quiz de révision hebdomadaires sur Podsie) (1/3). Peut être effectué dès le 30 novembre, au plus tard le 11 janvier.
  • Présenter votre documentation personnelle avec Github Pages (une page avec des liens et exemples de code, sur Replit, Codepen, etc). (1/3). Date d’évaluation recommandée: 21 décembre.

Pour plus de précisions, voir Evaluations.