recherche

Recherche

espace stagiaire

Espace stagiaire

Nous contacter
 

Catalogue de formations

RESPONSIVE WEB DESIGN Créer des interfaces Web ergonomiques et adaptatives Mixte : présentiel / à distance

Dernière mise à jour : 30/08/2024

Grâce à cette formation, vous saurez concevoir des interfaces Web à l'aide des techniques standards définies en CSS et du framework Bootstrap.

M'inscrire à la formation

Ajouter au panier

Public visé

  • Toute personne souhaitant se perfectionner dans le domaine concerné

Prérequis

  • Avoir des bases en création de contenu pour le web en HTML5 et CSS3

Objectifs de la formation

A l'issue de cette formation, l'apprenant sera capable de :

  • Mettre en place une interface HTML5 et CSS3 ;
  • Créer un site web responsive ;
  • Utiliser l'ensemble de la bibliothèque Bootstrap 3.

Contenu de la formation

visuel

Partie 1 - Responsive Web Design - fondamentaux et bonnes pratiques

Introduction

  • Principes fondamentaux
  • Approche Mobile First
  • Penser grilles fluides
  • Les différents terminaux
  • Navigateurs PC, smartphone et tablettes

 

Rappels sur HTML5 et CSS3

  • Structure d'une page HTML 5 et CSS 3
  • Les éléments et attributs HTML5
  • Notions fondamentales CSS
  • Nouveautés CSS3

 

Structure fluide et positionnement

  • Unités de mesure : % em pixel
  • Mise en page avec les colonnes
  • Propriétés CSS3 des grilles fluides : position - float - clear - width - max-width - overflow
  • Mise en page a l'aides des " Flexbox "
  • Optimisation de la taille et la résolution des images

 

Résolutions d'écrans et Media Queries

  • Résolutions des principaux mobiles
  • Viewport et Zoom

Critères (width, height, device-width, orientation, etc.)Points de ruptures et grilles

 

Travaux pratiques

  • Conception de pages utilisant les principales techniques CSS :
  • Structure fixe
  • Structure fluide à base de " Flexbox "
  • Structure fluide à l'aide de " Media Queries "

 

Partie 2 - Optimiser la conception Web avec le framework Bootstrap

 

Présentation du framework Bootstrap 3

  • Présentation du framework Bootstrap 3
  • Télécharger et installer Bootstrap 3
  • Créer une première page HTML utilisant Bootstrap 3

 

Présentation du contenu dans une grille Responsive

  • Concept de grilles de Bootstrap 3
  • 4 grilles pour 4 types de supports
  • Créer une page multi-grilles
  • Manipuler les grilles
  • Afficher et cacher des zones en fonction du support
  • Changer l'ordre des zones
  • Décaler les éléments d'une grille

 

Composants et mise en forme prédéfinis

  • Disposition du texte
  • Mise en forme contextuelle
  • Bibliothèque Glyphicons
  • Listes simples et Listes regroupées
  • Boutons simples, à états, groupés
  • Menus déroulants
  • Alertes et Messages
  • Tableaux
  • Formulaires

 

Travaux pratiques

  • Construction d'une page Web à partir du système de grille
  • Mise en place d'un menu de navigation "Responsive"
  • Mise en forme d'un formulaire
  • Mise en forme d'un tableau de données

 

Concepteur : ENI SERVICES - Diffuseur : Groupe Arkesys

Compétences acquises à l'issue de la formation

  • Mettre en place une interface HTML5 et CSS3
  • Créer un site web responsive
  • Utiliser l'ensemble de la bibliothèque Bootstrap 3

Modalités pédagogiques

  • Explications théoriques suivies de pratiques guidées puis de mises en autonomie.
  • Exercices autonomes et réguliers pour assurer l'assimilation

Moyens et supports pédagogiques

Votre formation a lieu en présentiel :

  • 1 vidéoprojecteur par salle
  • 1 ordinateur

 

Votre formation se déroule à distance avec :

  • 1 ordinateur
  • 1 connexion Internet
  • 1 adresse e-mail valide
  • 1 équipement audio (micro et enceintes ou casque)
  • 1 Webcam (facultatif – dans l'idéal)
  • 1 deuxième écran (facultatif – dans l'idéal)

 

Votre formation se déroule sur notre plate-forme de formation avec :

  • 1 ordinateur
  • 1 connexion Internet
  • 1 adresse e-mail valide
  • 1 équipement audio (micro et enceintes ou casque - facultatif)

 

Support stagiaire :

À l'issue de la formation, les exercices et travaux pratiques réalisés, leurs corrigés ainsi qu'un support de cours dématérialisé sera fourni à chaque stagiaire par e-mail ou via la plate-forme FOAD.

Modalités d'évaluation et de suivi

L'acquisition des compétences de la formation se fait à travers le suivi du formateur tout au long de la formation (séquences synchrones et asynchrones). Elle s'appuie également sur la réalisation d'exercices et de TP. Enfin, des quiz s'ajoutent aux différents outils de validation de l'acquisition des compétences visées. Une évaluation est systématiquement réalisée par chaque stagiaire, à l'issue de la formation.

Profil du formateur

Nos formateurs sont certifiés à l'issue d'un parcours organisé par nos soins. Ils bénéficient d'un suivi de maintien et d'évolution de leurs compétences aussi bien au niveau technique que pédagogique.
Chacun de nos formateurs a bénéficié d'une formation spécifique à l'animation de classe virtuelle et à l'utilisation des solutions de formation à distance du Groupe ARKESYS.

Informations sur l'accessibilité

Cette formation est accessible à toute personne en situation de handicap. Notre référent handicap prendra contact avec les stagiaires concernés pour adapter l'animation à leurs besoins et rendre l'apprentissage accessible à tous. Enfin, nos centres de formation sont accessibles aux personnes à mobilité réduite.

Prochaines Sessions

  • Aucune formation INTER-ENTREPRISE n'est programmée pour le moment. Contactez-nous via le formulaire ou par téléphone au 04.37.24.36.78 afin de connaitre les dates possibles ou les autres modalités d'inscription.

Dans la même catégorie

Partager cette formation

Notre nouveau catalogue est en cours de déploiement. Aussi, pour connaître tous nos indicateurs, veuillez nous contacter directement.

 

Catalogue de formation propulsé par Dendreo,
logiciel de gestion pour les OF