Cours

Responsive Web Design

Remarque : certaines extensions de navigateur, telles que les bloqueurs de publicité et les extensions de mode sombre, peuvent interférer avec les tests. Si vous rencontrez des problèmes, nous vous recommandons de désactiver les extensions qui modifient le contenu ou la présentation des pages, tout en suivant le cours.

Dans ce cours de Responsive Web Design, vous apprendrez les langages que les développeurs utilisent pour créer des pages Web : HTML (Hypertext Markup Language) pour le contenu, et CSS (Cascading Style Sheets) pour la conception.

Tout d'abord, vous construirez une application de photos de chats pour apprendre les bases du HTML et du CSS. Ensuite, vous apprendrez des techniques modernes comme les variables CSS en construisant un pingouin, et les meilleures pratiques en matière d'accessibilité en construisant un formulaire Web.

Enfin, vous apprendrez à créer des pages Web qui s'adaptent à différentes tailles d'écran en créant une carte Twitter avec Flexbox et une mise en page de blog complexe avec CSS Grid.

Progression globale

0% achevé


Syllabus

Le HTML est un langage de balisage qui utilise une syntaxe ou une notation spéciale pour décrire la structure d'une page Web au navigateur. Les éléments HTML ont généralement des balises d'ouverture et de fermeture qui entourent et donnent un sens au contenu. Par exemple, différents éléments peuvent décrire un texte comme un titre, un paragraphe ou un élément de liste.

Dans ce cours, vous construirez une application de photos de chats afin d'apprendre certains des éléments HTML les plus courants, qui constituent la base de toute page Web.


Le CSS, ou feuilles de style en cascade, indiquent au navigateur comment afficher le texte et les autres contenus que vous écrivez en HTML. Avec le CSS, vous pouvez contrôler la couleur, la police, la taille, l'espacement et de nombreux autres aspects des éléments HTML.

Maintenant que vous avez décrit la structure de votre application de photos de chats, donnez-lui du style avec le CSS.


La conception visuelle est une combinaison de la typographie, de la théorie des couleurs, du graphisme, de l'animation, de la mise en page et d'autres éléments pour vous aider à transmettre votre message unique.

Dans ce cours, vous apprendrez à appliquer différents éléments de conception visuelle à vos pages Web.


Dans le domaine du développement Web, l'accessibilité fait référence à un contenu Web et à une interface utilisateur (IU) qui peuvent être compris, navigués et utilisés par un large public. Cela inclut les personnes souffrant de handicaps visuels, auditifs, de mobilité ou cognitifs.

Dans ce cours, vous apprendrez les meilleures pratiques pour créer des pages Web accessibles à tous.


De nombreux appareils peuvent accéder au web, et ils sont de toutes formes et de toutes tailles. Le responsive web design est la pratique consistant à concevoir des sites web flexibles qui peuvent répondre à différentes tailles, orientations et résolutions d'écran.

Dans ce cours, vous apprendrez à utiliser les feuilles de style en cascade (CSS) pour améliorer l'apparence de vos pages Web, quel que soit l'appareil sur lequel elles sont affichées.


Flexbox est une méthode de mise en page puissante et bien supportée qui a été introduite avec la dernière version de CSS, CSS3. Avec flexbox, il est facile de centrer les éléments sur la page et de créer des interfaces utilisateur dynamiques qui se rétrécissent et s'étendent automatiquement.

Dans ce cours, vous apprendrez les principes fondamentaux de la flexbox et des mises en page dynamiques en créant une carte Twitter.


La grille CSS est une nouvelle norme qui facilite la création de mises en page complexes et réactives. Elle transforme un élément HTML en une grille et vous permet de placer des éléments enfants n'importe où à l'intérieur.

Dans ce cours, vous apprendrez les principes fondamentaux de la grille CSS en construisant différentes mises en page complexes, dont un blog.