logo-s StartiVia


S’inscrire à la formation

Responsive Design

Le Responsive Design a été conçu pour pallier aux aléas qu’apportent l’évolution technologique et la diversification des tailles d’écran. Le Responsive Design a pour but de rendre un site Web adaptatif en optimisant l’affichage et la fluidité d’un site Web afin qu’il soit parfaitement visible et lisible sur n’importe quel support (smartphone, tablette, ordinateur portable, TV…).

Les objectifs

A l’issue du stage, diverses compétences vous seront transmises, notamment :

  • Améliorer sa culture sur les langages Web
  • Intégrez un design Web sur tous les terminaux mobiles (smartphones, tablettes)
  • Connaitre les balises HTML5 et attributs CSS3

Les pré-requis

Connaître la micro-informatique, la bureautique, être à l’aise avec Internet.

Public concerné

Cette formation est destinée à toute personne souhaitant maîtriser le Responsive Design.

Contenu de la formation

L’environnement Web

  • Internet, le Web et son fonctionnement
  • Distinguer les principaux navigateurs : Google Chrome, Mozilla Firefox, Opera, Safari, Internet Explorer
  • L’importance du référencement
  • Connaitre les principaux : Google, Yahoo, Bing
  • Les sites vitrines / sites de ventes en ligne

Rappel des fondamentaux

  • Inventaire des différents langages existants (Php, JavaScript, MySQL…)
  • Choisir un type de développement pour un type de site
  • Changements, interprétations de chaque navigateur
  • Les normes W3C
  • Notions de référencement interne
  • La structure des documents html : head, body…
  • Les balises obsolètes
  • Les nouvelles balises

Les différents terminaux

  • Quels sont-ils ? (mobile, tablette, tv, liseuse…)
  • Caractéristiques techniques, résolution, périphériques, OS, navigateurs
  • Le marché mobile et parts de marché.

La conception en Responsive

  • Les différents types de design (fluide, liquide…)
  • Le Viewport
  • Grilles fluides (Bootstrap)
  • Récapitulatif des techniques de design adaptative
  • Comprendre et savoir adapter les unités pixel (em et %)
  • Visualiser les contraintes fonctionnelles et ergonomiques
  • Adapter selon le mode : modes portrait et paysage

CSS3 Media Queries

  • Se servir des médias en CSS
  • Mettre en place des règles conditionnelles
  • Compatibilité navigateurs Web
  • Visualiser l’ensemble des critères mobiles ( device-width, width, height…)
  • Points de rupture

Design et rendu Responsive

  • Penser box (contenu/contenant, unité de mesure, CSS3…)
  • Penser flexibilité (les fonds, polices fluides, menus adaptables, création de supports adaptés…)
  • Écran Retina
  • Les outils de tests
  • Menus adaptables, carrousel adaptatif
  • Thème Responsive avec un CMS (WordPress…)

Optimiser les performances

  • Pratiques courantes, pratiques clés
  • Savoir optimiser son temps de chargement
  • Améliorer sa feuille de style CSS
  • Se servir de Mediaqueries exclusifs
  • Gérer la compression des images

--Télécharger Formation Développement Web Responsive Design en PDF --