Responsive

Comprendre les règles du responsive

L’éditeur Gutenberg est un outil capable d’adapter vos contenus pour qu’ils soient visibles et agréables sur toutes les tailles d’écrans. En revanche, il y a des bonnes pratiques à adopter afin que les sites aient un maximum de visiteurs comme :

Ne pas donner des tailles fixes en pixels aux images en largeur et hauteur. Vous pouvez ajuster augmenter la largeur comme vous le souhaitez (à savoir qu’au-delà de 1200px cela ne changera rien car le contenu est sur 1200px max. Si vous voulez que votre image soit plus grande, optez pour les options d’alignements “Grande largeur” ou “Pleine largeur”
Ne pas utiliser de marges internes ou externes trop grandes. En effet, les marges ne sont pas pratiques pour les téléphones, car le contenu est déjà resserré. Si vous utilisez des marges, n’hésitez pas à prévisualiser en mode téléphone et tablette pour vérifier si l’expérience utilisateur est optimal ou non.
Si vous souhaitez que le contenu soit plus petit ou plus resserrer, optez pour le bloc Colonne, passez le nombre de Colonne à 1, puis jouer avec la taille de la Colonne qui est en %, donc adapté pour le responsive.
Pensez à beaucoup vérifier les contenus sur les différentes tailles d’écrans, voir même construire votre site sur du mobile dans un premier temps. En effet, cette approche du “mobile first” est privilégier par de nombreux développeurs car la majeure partie des visites sur le web proviennent des téléphones. Il est donc important de ne pas négliger tout l’aspect responsive.