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 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.

Méthode d'évaluation

Tout au long de la formation, les exercices et mises en situation permettent de valider et contrôler les acquis du stagiaire. En fin de formation, le stagiaire complète un QCM d'auto-évaluation.

Suivre cette formation à distance

  • Un ordinateur avec webcam, micro, haut-parleur et un navigateur (de préférence Chrome ou Firefox). Un casque n'est pas nécessaire suivant l'environnement.
  • Une connexion Internet de type ADSL ou supérieure. Attention, une connexion Internet ne permettant pas, par exemple, de recevoir la télévision par Internet, ne sera pas suffisante, cela engendrera des déconnexions intempestives du stagiaire et dérangera toute la classe.
  • Privilégier une connexion filaire plutôt que le Wifi.
  • Avoir accès au poste depuis lequel vous suivrez le cours à distance au moins 2 jours avant la formation pour effectuer les tests de connexion préalables.
  • Votre numéro de téléphone portable (pour l'envoi du mot de passe d'accès aux supports de cours et pour une messagerie instantanée autre que celle intégrée à la classe virtuelle).
  • Selon la formation, une configuration spécifique de votre machine peut être attendue, merci de nous contacter.
  • Pour les formations incluant le passage d'une certification la dernière journée, un voucher vous est fourni pour passer l'examen en ligne.
  • Pour les formations logiciel (Adobe, Microsoft Office...), il est nécessaire d'avoir le logiciel installé sur votre machine, nous ne fournissons pas de licence ou de version test.
  • Horaires identiques au présentiel.