La mise en page est une chose d'essentielle dans la rédaction d'un site Internet. Il faut à la fois réfléchir au confort du lecteur, ainsi qu'au bon fonctionnement du site sur un téléphone portable. Pour ce faire, plutôt qu'écrire de manière linéaire, il est d'usage de raisonner en blocs est en grilles. 

Un bloc ?

En webdesign, un bloc, aussi appelé DIV, est utilisé pour délimiter une partie du contenu d'une page. On peut lui donner une taille, une couleur, un style... C'est très pratique pour mettre en page un site parfaitement !

Comment faire ?

OnlineCreation propose un outil appelé Modèle qui permet d'insérer des aides à la mise en page en quelques clics. Parmi eux, vous trouverez des alignements de deux, trois ou quatre blocs. Ce sont eux que nous utiliserons.

Ouvrez le module de rédaction sur la page de votre choix, placez votre curseur là où vous souhaitez placer plusieurs éléments en vis-a-vis puis cliquez sur Insérer > Insérer un modèle. Dans la liste, choisissez la taille des blocs à insérer : "2 colonnes" pour deux blocs prenant chacun la moitié de la largeur de votre page, "2 colonnes 2/3 + 1/3" pour deux blocs, dont celui de droite qui prend les 2/3 de la largeur de la page et celui de gauche 1/3, etc.

Une fois créés, vous pouvez utiliser les blocs comme bon vous semble : y insérer une image, du texte... Voici quelques usages courants.

• Quatre colonnes

• Alternances 2 colonnes 2/3 + 1/3

Et sur mobile ?

Sur les écrans étroits, vos blocs seront placés les uns au-dessus des autres dans le sens de lecture occidental : le bloc le plus à gauche se retrouvant au le bloc le plus adroit se retrouve en bas. Magique, ou presque !