Archive dans 28 juillet 2019

Comment rédiger pour le Web?

Il est essentiel de bien rédiger pour le Web. Ecrire un article sur la page d’un site nécessite de respecter quelques règles. En fait, la façon de lire sur un écran diffère de celle avec un livre. Il faut penser aux différents supports utilisables (contenu responsive), et favoriser le référencement en utilisant des mots clés, balises de titres, etc. Bref, nous allons voir toutes ces astuces dans cet article!

L'apparence de votre article

Le contenu textuel de votre article doit être séquencé en paragraphes. 2 paragraphes sont séparés par un retour à la ligne. Chacun d’eux ne doit pas dépasser 150 mots. Il est fortement recommandé d’utiliser des titres, facilement visualisables et qui « chapeautent » un ensemble de paragraphes. La longueur globale d’un article ou d’une page doit être suffisamment consistante et avoir plus de 400 mots. Cependant, il ne faut pas oublier que les internautes lisent rarement les articles en entier. L’essentiel doit donc être écrit au début ou les différentes parties identifiables rapidement.

Notamment, le 1er paragraphe doit résumer succinctement  le sujet de la page. D’ailleurs, il est essentiel d’avoir un seul sujet par page. Par contre, il peut y avoir des notions secondaires liées. De même, on déconseille d’avoir plusieurs pages qui ont le même sujet principal.

Sur l’apparence globale, il faut aussi que la lecture soit agréable. On privilégie pour ça des polices de caractères simples et lisibles, des tailles de caractères suffisamment grandes mais pas trop non plus, un interligne adapté et la présence d’illustrations, citations et images pour agrémenter. Vous pouvez lire à ce sujet l’article « Les images d’un site Web ».

Mettez les mots importants en gras, ils apporteront de l’information pour le référencement.

D’un point de vue purement esthétique, contrairement au format papier où le justifié est souvent de rigueur, dans le numérique on n’aime pas trop l’utiliser. On préfère mettre du justifié gauche qui n’impactera pas la mise en page. En effet, si l’apparence peut être bonne sur grand écran, elle peut ne pas satisfaire sur un écran plus petit comme un smartphone.

J’ai fait un exemple ici, en mettant ce paragraphe en justifié…
Paragraphe en justifié

Sur le smartphone, le 1er paragraphe qui est justifié passe bien mais le 2nd a des espaces entre les mots de taille variable. Ce n’est pas joli et c’est plus difficile à lire, surtout sur un texte entier.

En aligné gauche, le problème ne se pose pas car l’alignement est à gauche, peu importe comment se termine la ligne.

smartphone en aligne gauche: l'espace entre les mots est régulier mais il n'y a plus d'alignement à droite
Paragraphe en aligné gauche

Un autre petit détail si vous faites référence à un événement, écrivez explicitement la date avec l’année et non le temps écoulé ou à venir. Je m’explique: on dit le 12 août 2009 et non il y a  10 ans. La raison est simple: le temps passe et le contenu de votre page reste… le même! A moins que vous ne souhaitiez changer le contenu tous les mois!! Et il est important de spécifier l’année parce que ce qui semble évident pour le rédacteur sur le moment ne l’est pas forcément pour le visiteur.

Les titres

Les titres ont une balise particulière, nommée H (pour Header en anglais). Ils vont de H1 à H6, H1 étant celui de la plus grande importance. Ce sera le titre de la page. Il ne faut pas l’utiliser dans le contenu-même et il doit correspondre au sujet principal. On parle de mot-clé. Ce mot-clé peut avoir un ou plusieurs mots.

La balise H2 est également très importante. Elle est placée  sur les titres principaux de la page. On peut y mettre le mot clé principal, ou des expressions proches en termes d’écriture (pluriel, singulier, adjectif, etc;) ou de synonymes.

Les balises de titre de niveaux inférieurs sont ajoutées ensuite. Elles doivent respecter une hiérarchisation logique: H3 est sous H2, H4 sous H3, etc.

Les moteurs de recherches identifient ces balises, les analysent et les comparent pour obtenir la solution à leur requête. Ainsi, ils trouvent les pages les plus pertinentes par rapport à la demande de l’internaute. C’est le référencement!

Les mots clés

Comme nous venons de le voir, chaque page a 1 seul mot-clé (1 mot ou 1 expression de quelques mots). On doit le retrouver plusieurs fois dans l’article, au niveau de certains titres et aussi dans le contenu textuel. Il faut l’agrémenter de synonymes et de formes grammaticales différentes. Il ne faut pas non plus surcharger sa présence. Les moteurs de recherche sont de plus en plus sensibles au langage naturel. Ce mot-clé peut apparaître également des la balise alt des images, une fois encore pour améliorer le référencement.

Les liens

Toujours pour des raisons de référencement, il faut créer des liens internes et externes dans votre page. Le vrai nom est lien hypertexte ou hyperlien. Un lien externe, comme le précédent, ouvre un contenu d’un autre site. Plus les liens sont actifs, plus le référencement augmente. De même, plus le site pointé est populaire (c’est-à-dire bien référencé, bien connu des moteurs de recherche), plus votre propre popularité augmente. Un lien interne fait référence à un contenu du même site.

 

J’espère que cet article a répondu à vos attentes. Si vous avez besoin de précisions ou que vous souhaitez faire une remarque, n’hésitez pas à laisser un commentaire.

Et si vous souhaitez avoir un article sur un sujet particulier (dans le domaine du web quand même!)  ou si vous avez une demande de prestation, n’hésitez pas à me contacter.

Je vous souhaite une excellente journée et vous dis à très bientôt!

Marianne Ducassou - emoji écrit à l'ordi

Le bon choix des paramètres des images pour le web

superposition d'images et de critères de qualité d'images avec un gros point d'interrogation dur un écran

Un bon contenu sur un site web doit effectivement contenir des images. En effet, un internaute sera davantage attiré par un beau visuel que par un contenu uniquement textuel. Les illustrations sont donc indispensables mais attention il faut respecter des règles… Utiliser les bons paramètres pour les images d’un site web est essentiel.

En quoi l'utilisation d'images sur un site pourrait être un problème?

En fait chaque image est régie par différents paramètres. Les valeurs de ces paramètres vont directement être liées à sa qualité visuelle mais aussi « à son poids ». Plus une image est lourde, plus elle longue à charger. Et comme nous sommes des impatients nés, quand c’est trop long on s’en va ailleurs! On s’entend, long signifie ici plus de 5 secondes… pour les personnes les plus patientes!

Cependant, les images sont nécessaires voire indispensables à la bonne lisibilité et compréhension d’un contenu. Il faut donc utiliser les bons paramètres pour chaque image et déterminer les valeurs suffisantes.

Quels sont les paramètres qui caractérisent les images numériques?

Un petit avant propos pour définir ce qu’est un pixel, élément essentiel de l’image. Un pixel est un élément unitaire qui contient une information de couleur et de transparence. Cet élément ne peut pas être divisé et n’a pas de taille prédéfinie. Par exemple si on affiche une image sur un écran, chaque pixel de l’image représente un pixel de l’écran. Plus les pixels sont nombreux et petits, plus l’image sera « lisse » et moins elle sera « pixellisée ». On entend par là que le pixel est alors visible et l’image apparaît comme un ensemble de carrés collés.

La définition

La définition d’une image correspond au nombre de pixels dans l’image. Elle s’exprime donc en pixels et elle s’obtient en multipliant le nombre de pixels en largeur et en hauteur.

La résolution

La résolution d’une image est le nombre de pixels par unité de longueur. Elle s’exprime en ppp (pixel par pouce) ou en anglais en dpi (dot per inch). 

La taille

La taille de l’image donne sa largeur et sa hauteur, en pixels ou en cm (ou mm, ou inch…) 

Le format

On connaît le format d’une image en regardant son extension. En général, il détermine le taux et la méthode de compression. Plus une image est compressée, plus sa qualité diminue et son poids aussi. Certains formats portent aussi des informations de transparence ou d’animation.

Le poids

Le poids d’une image est la résultante de tous ces paramètres. Il s’exprime en octets (ko ou Mo) appelés aussi des bites (kb ou Mb). Plus une image est de grosse résolution, avec une grande taille et un format non compressé, plus l’image est lourde.

Quels sont les bons paramètres des images pour votre site?

Les bons réglages pour une image dépendent évidemment de ce que l’on souhaite en faire. Pour une impression, il faut une grande résolution, typiquement 300dpi Pour un écran, peu importe, 72dpi ou 300dpi, ce qui compte c’est la taille en pixels, autrement dit la définition. On va donc mettre l’image aux dimensions proches de ce que  l’on veut voir à l’écran. En général, pour du contenu, on est aux alentours de 700 pixels. Pour un bandeau d’en-tête qui doit faire toute la largeur de l’écran, 1500 pixels doivent convenir.

 

Image de fond marin
Taille en pixels: 800x600
Poids: 547 ko
Taille: 200x150 pixels
Poids: 44,9 ko
Taille: 800x600
Compression: 70
Poids: 211ko

Visuellement, avec la compression, on ne voit pas de différence mais le poids, lui, est largement diminué.

Même pour un grande image, on ne devrait pas dépasser 1Mo. Il faut savoir que pour un bon chargement, chaque page avec tout son contenu ne devrait pas dépasser 2Mb.

Pour le format, on a beaucoup de jpg, notamment pour les photos. Le png est utilisé pour les logos, quand il n’y a pas trop de nuance de couleurs, et quand on a besoin de transparence. Le gif, quant à lui permet d’avoir des images animées. Pour chacun d’eux on peut aussi jouer sur le taux de compression ou le nombre de couleurs pour minimiser le poids. Il s’agit alors de compromis entre le poids de l’image et sa qualité.

 

gif animé - poids 25ko
logo ekm - Marianne Ducassou WebKomoMai - création de sites internet
format png, fond transparent

La balise "alt"

Indépendamment des différents paramètres qui constituent l’image, il y a, entre autre, le « texte alternatif« . C’est la balise « alt » de l’image. Les moteurs de recherches y sont très sensibles. Initialement, elle existe pour permettre aux malvoyants de comprendre les images « lues » quand ils ne peuvent pas les voir. Faut-il encore la renseigner… Pour améliorer le référencement on peut y mettre un mot clé mais attention, il faut qu’il reste pertinent par rapport au contenu.

J’espère que cet article a répondu à vos attentes. Si vous avez besoin de précisions ou que vous souhaitez faire une remarque, n’hésitez pas à laisser un commentaire.

Et si vous avoir un article sur un sujet particulier (dans le domaine du web quand même!)  ou si vous avez une demande de prestation, n’hésitez pas à me contacter.

Je vous souhaite une excellente journée et vous dis à très bientôt!

Audrey Lutz

Page d'Accueil du site de Audrey Lutz

- AUDREY LUTZ -

Audrey LUTZ a vécu un événement qui a bouleversé sa vie et dont elle s’est remise avec une force et une rapidité étonnante. Elle a su reconnecter avec son corps et son esprit grâce à un accompagnement par la danse. Maintenant, Audrey souhaite partager cette expérience et apporter au plus grand nombre épanouissement et sérénité à travers la Danse du Mouvement de la Vie (DMLV) et Be&Move.

Le but était de créer un site professionnel pour présenter les 2 concepts portés par Audrey Lutz: Be&Move et la DMLV à l’aide de textes, vidéos, photos et témoignages. L’ambiance est à la fois sereine et dynamique.

On y trouve les événements organisés sous forme de liste et de calendrier, filtrable par catégorie. Chaque événement a sa propre fiche descriptive avec, entre autre, le lieu, la date, le coût et les modalités d’inscription, qui peuvent se faire en ligne. On peut consulter des articles qui relatent les événements passés avec parfois des liens vers les vidéos réalisées.

Les visiteurs peuvent s’inscrire à la newsletter. Ils recevront alors une notification à la parution d’un nouvel article ou événement.