Tortilla B
Concevoir un seul et unique site Internet dont le contenu viendra automatiquement s’adapter à la taille de l’écran sur lequel il est consulté (écran d’ordinateur de bureau, d’ordinateur portable, tablette ou Smartphone).
 

Lieu

Marseille, Aix-en-Provence, Toulouse, Montpellier.

Durée

2 jours

Programme

Etat des lieux du Web mobile

Périphériques, OS, navigateurs et moteurs

Le marché mobile et ses statistiques

Rappels sur HTML5

Les bases

Allègement du code

Les nouvelles balises sémantiques

Les nouveaux attributs pour les formulaires

Technologies liées à HTML5

Pour bien démarrer un projet HTML5

Présentation du Responsive Web

Design

Définition du Responsive Web Design

Rapprochement mobile – desktop : un seul développement

Définir les tailles d’écran

Résolutions d’écran « critiques » (points de ruptures)

Les modes portrait et paysage

Les unités d’affichage

Les unités pixel, em et % : pour quel usage ?

L’unité px

La typographie et les unités relatives Les limites de l’unité em

L’unité rem

Les unités relatives au viewport

Un contenu fluide

Gérer les débordements de contenus

Gérer les débordements de médias

Les tailles standards d’un mobile

Les tailles indiquées sont erronées

Travaux pratiques

Comment tester sur mobile

Les émulateurs

Les installations officielles

Les tests réels

Adapter le design : les CSS3 Media

Queries

Les bases

L’astuce indispensable

Exploiter les médias en CSS

Ajouter des conditions avec Media Queries

Les critères pour cibler les mobiles

Compatibilité des Media Queries

Travaux pratiques

Mise en page : Elastique vs. Liquide vs. Fixe

Mise en page : Fixe

Mise en page : Liquide (ou Fluide)

Mise en page : Elastique

Quelques liens

Travaux pratiques

Tableaux de données responsive

Barres de navigation : stratégies d’adaptation

Travaux pratiques

Performances et Web mobile

Généralités

Utiliser les principes de minification

Compresser les images et les sprites

Généralités (bonnes pratiques)

Testez vos performances mobiles

Les images en Responsive Web Design

Rappels

La balise

Les problèmes des densités de pixels

Cibler par densité de pixels

Les problèmes des densités de pixels Cibler par densité de pixel

Le Responsive Web Design dans les emails


Dominique CASSAN
Carré à Bulles - 24 Rue du communal - 11230 Saint Benoit - Siret 53018999200015 - N° Enregistrement 91 11 01218 11 Twitter facebook google + fil Rss