Recherche avancée
Par formation
Par date
Par ville
logo HUB Formation
Organisme de Formation
aux Technologies et métiers de L'informatique
La pédagogie au service de la technologie
Accueil > Domaines > Développement > BootStrap - Développement de pages Web Responsive

BootStrap - Développement de pages Web Responsive

Réaliser des pages Web qui s'adaptent à tous types d'écrans

Parce que les Smartphones et autres tablettes sont de plus en plus performants, nous n'hésitons plus à les utiliser pour consulter des sites web. Mais c'est parfois mission impossible tant certains sites ne sont pas adaptés à ce type d'usage. Les concepteurs doivent donc aujourd'hui s'assurer que les outils qu'ils développent soient adaptés à une grande variété de terminaux. S'il fut un temps envisageable de créer 2 sites distincts (1 pour les appareils mobiles et 1 pour les PC), l'apparition de techniques rendant l'ajustement des pages possible en fonction des écrans (Web Responsive) tend à mettre fin à cette pratique. Doté notamment d'une collection d'outils très performants sur les champs du design et de l'interactivité avec les utilisateurs, BootStrap est le Framework Web Responsive de prédilection pour le développement de sites web de dernière génération.

Objectifs

  • Connaître les spécificités de Bootstrap
  • Rendre des pages responsives avec Bootstrap
  • Comprendre comment manipuler les objets de base et les composants
  • Découvrir des frameworks concurrents

Public

  • Développeurs web souhaitant utiliser Bootstrap pour le développement de sites

Prérequis

  • Avoir suivi la formation "Les fondamentaux du développement d'interfaces graphiques avec HTML5, CSS3 et JavaScript" (CE999) ou disposer des compétences équivalentes

Programme de la formation

Introduction

  • Historique du produit, licence
  • Les apports de Bootstrap
  • Navigateurs et devices compatibles

Affichage

  • Définition de grilles
  • Gestion de contenus responsive (images, tableaux, schémas, ..)
  • Typographie, paramétrage des polices

Composants

  • Présentation des composants standards : messages d'alertes, boutons, carrousels, barres de navigation, etc...
  • Travaux pratiques : réalisation d'un site de démonstration avec les composants classiques

Gestion des thèmes

  • Principe de Sass, structure des fichiers
  • Travaux pratiques : import des fichiers sources Sass
  • Modification des variables Sass par défaut
  • Configuration d'un thème personnalisé
  • Utilisation des fonctions Sass de gestion des couleurs, des contrastes
  • Principales options de Sass

Accessibilité

  • Possibilités de bootstrap
  • Compatibilité WCAG 2.0
  • Gestion des composants interactifs, du contraste,...

JavaScript

  • Plugins basés sur jQuery, API JavaScript
  • Fonctionnalités disponibles
  • Travaux pratiques : exemples avec les plugins fournis en standard

Compléments

  • Fichiers CSS précompilés
  • Outils disponibles : sources et fichiers compilés JSS et JavaScript
  • Compilateur Sass
  • BootstrapCDN
  • Packages NPM, YARN et RubyGems, Composer, NuGet, …
  • Packs d'icônes, Tooltip

Méthode pédagogique

Une pédagogie rythmée et variée fondée sur une alternance d'apports méthodologiques, d'ateliers pratiques et de phases d'échanges.
L'apprentissage par résolution de problèmes : 40% de cours théoriques, 60% d'exercices.
Un projet fil rouge sera maintenu tout au long de la formation.
Les retours d'expériences et conseils de consultants experts.