Le 14 septembre 2017, nous avons publié une version actualisée de notre Politique de confidentialité. En utilisant video2brain.com vous vous engagez à respecter ces documents mis à jour. Veuillez donc prendre quelques minutes pour les consulter.

Découvrir le design responsive

Utiliser des grilles fluides

TESTEZ LINKEDIN LEARNING GRATUITEMENT ET SANS ENGAGEMENT

Tester maintenant Afficher tous les abonnements
Initiez-vous au principe des grilles fluides pour une mise en forme adaptative, en fonction du nombre de colonnes affichées à l'écran.

Transcription

Nous allons dans cette vidéo voir la méthode qui consiste à utiliser des grilles fluides pour littéralement servir notre contenu. Aujourd'hui, une des analogies les plus pertinentes sur le design responsive est qu'il devient pratiquement évident Ce contenu doit avoir la capacité de pouvoir circuler dans n'importe quel conteneur où il va être visualisé. Si vous vous limitez à créer des mises en page fixes pour chacun de vos points d'arrêt, vous ignorez la grande variété des tailles d'écran dans la gamme que vous allez cibler. Une des meilleures façons de vous assurer que votre contenu fonctionne indépendamment des écrans visualisés puisse être modifié et redimensionné en fonction des différents points de rupture, des points d'arrêt que vous avez définis. Comme vous pouvez l'imaginer, créer des mises en page distinctes pour chaque point d'arrêt va créer beaucoup plus de travail que d'élaborer une seule disposition qui va être fluide. C'est pour cette raison que les concepteurs ont adopté l'utilisation de griffes fluides pour créer de multiples mises en page qui vont être plus rapides et plus précises. Les grilles fluides sont basées essentiellement sur un système où on va définir un nombre de colonnes et on va définir ensuite des gouttières. Le nombre de ces colonnes et puis la largeur de base de ces colonnes et les gouttières est généralement décidée par le concepteur et elle va être liée en principe à une taille de police par défaut, mais ça peut être également par rapport à un ratio ou une largeur d'écran idéale. Beaucoup de concepteurs vont travailler avec une grille de seize pixels parce que c'est en général la taille de la police par défaut pour la plupart des navigateurs. Mais on peut également utiliser une valeur de base qui soit différente. Une fois que la grille est établie, les éléments de la page vont être mappés aux coordonnées de la grille et avec des valeurs de dimension qui vont être attribuées en fonction de leur position dans la grille. Pour rendre les grilles plus fluides, on peut également utiliser des unités de mesure relatives comme les ems ou des valeurs de pourcentage pour déterminer la largeur des colonnes et des gouttières. Ensuite on va placer les différents éléments sur la page et ceux-ci vont être mesurés en fonction de ces valeurs relatives. Pour faciliter notre travail, il existe des frameworks, des environnements de travail que l'on peut télécharger et qui vont être constitués des éléments qui vont être nécessaires, de colonnes qui vont être ensuite adaptés à chaque type d'écran en fonction des points d'arrêt que l'on aura définis. Dans une vidéo ultérieure, nous allons explorer ces frameworks de manière à ce que vous puissiez vous rendre compte de ce qu'ils nous proposent et puis que vous puissiez les télécharger de manière à les tester et voir s'ils correspondent à votre méthode de travail et puis également à vos objectifs. que l'on peut penser ce contenu comme à un liquide. est donc d'utiliser une disposition fluide pour que ce contenu de manière à définir le nombre

Découvrir le design responsive

Abordez les principes du design responsive. Comprenez la problématique des écrans haute densité, analysez les grilles fluides, explorez les outils de prototypage, etc.

Aucun commentaire n´est disponible actuellement
 
Spécial abonnés
Date de parution :6 sept. 2017

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !