Comment les entreprises belges ou implantées chez nous luttent contre la crise et promeuvent l’emploi ? Il y a du travail, c’est sûr! Lisez: il y a du pain sur la planche pour optimiser les interfaces et, par exemple, enfin intégrer le Web 2.0… Agoria, Altran, Colruyt, ING, La Poste, SNCB à la loupe…

Médias sociaux et contenus de recommandation

Telles sont les principales faiblesses des sections Emploi de quelques sites d’entreprises de chez nous ou implantées chez nous. En prévision de la relance tant annoncée, j’invite les recruteurs à optimiser leur espace Emploi: mettez-vous (enfin) au Web 2.0, aux médias sociaux et arrêtez de prendre les gens pour des idiots: si vous faites témoigner vos collaborateurs, faites-leur dire des choses vraies et vraiment intéressantes.

Y a pas que les employeurs qui recommandent les employés…

Les employés recommandent aussi les employeurs. Il ne semble pas que cela soit bien compris côté annonceurs. Pas un site où les annonces peuvent être « envoyées à un ami », par exemple. Et à part ING, pas une organisation qui exploite les réseaux sociaux pour faire circuler ses petites annonces au cœur des places fréquentées par sa cible. Il y a encore du travail maintenant que le travail revient… Voici, en condensé, mon article paru dans Inside 117.

• Agoria, c’est un peu court, non?
• Altran, apprivoisez l’outil
• Colruyt, top site pour un top employeur
• ING, « Il y a de belles perspectives d’avenir… »
• La Poste, c’était écrit!
• SNCB, le train en marche

Agoria, c’est un peu court, non?

Une section JOBS, c’est pour publier DES jobs, certes. Mais sur la page d’entrée JOBS chez Agoria, on ne trouve QUE ça : une liste de titres d’annonces d’emploi. Quelques pistes d’amélioration:

1. Classez les annonces par employeur : toutes les annonces AGORIA sous le titre « Travailler chez AGORIA » (par exemple), toutes les annonces SIRRIS sous le titre « Travailler chez SIRRIS », et ainsi de suite. Cela évite la répétition du nom de l’employeur et facilite le tri visuel.
2. Décrivez les employeurs en quelques mots: je viens sur le site pour bosser chez AGORIA, et on me propose du SIRRIS, ISIS-CONSULT, SYNERGICS, en veux-tu en voilà… Et j’ai beau chercher partout sur le site (via la navigation et la recherche), pas moyen de mettre la main sur une présentation de ces structures (partenaires, filiales, départements?).
3. Ajoutez quelques détails pour chaque poste vacant. Où irai-je travailler ? Quand l’annonce a-t-elle paru? Quelle expérience est souhaitée. Autant de filtres qui m’assureront que si je clique, c’est sur une annonce qui me convient a priori.
4. Ajoutez des outils qui aident à la conversion et à la viralité: un compte Twitter, des témoignages de nouveaux employés, une procédure d’embauche, une carte géographique des sites d’emploi, un lien vers « Qui sommes-nous », des contenus assurant l’influence d’AGORIA en tant qu’employeur, un glossaire sur les métiers, des fonctionnalités Web 2. : les annonces les plus consultées, un formulaire en ligne pour déposer son CV… etc.

• Les pages Emploi sur Agoria.be
• Haut de la page

Altran, apprivoisez l’outil

De prime abord, compliqué et surabondant, le site emploi  d’Altran devient vraiment intéressant une fois qu’on a compris la mécanique… Super: un espace « Mon Altran ». Je paramètre mon outil de recherche, je coche et décoche mes critères, en fonction des résultats qui apparaissent, je dépose une candidature spontanée pour mettre toutes les chances de mon côté, je crée une alerte pour recevoir les offres qui me correspondent ; je soumets ma candidature en ligne. Et le tour est joué !

L’expérience utilisateur est très satisfaisante: je recevrai des annonces qui me correspondent, j’en serai alertée par e-mail, et pour les autres annonces qui passeraient à travers les mailles de mes filtres, j’ai rempli le formulaire en ligne. Je peux aller fureter à la recherche d’infos sur l’employeur et ce qu’en disent les employés.

C’est rassurant de voir que l’organisation a pensé que je voudrais savoir tout cela:  comment Altran soutient la carrière de ses collaborateurs, comment se déroule le processus de recrutement, quelles sont les possibilités de formation, les solutions de mobilité, …

• Les pages Emploi d’Altran Belgique
• Haut de la page

Colruyt, top site pour un top employeur

« ON PEUT TOUJOURS MIEUX FAIRE! » lit-on dans le bandeau en haut de la page d’accueil du site Emploi de Colruyt. Certes. Mais ils se débrouillent déjà très bien!

Des contenus à valeur ajoutée, orientés futur collaborateur, des témoignages, des portraits actifs, souriants, vraisemblables sur chaque page ou presque, des incitants colorés et musclés, une remontée des dernières vacances, un beau bloc célébrant le titre 2010 « Colruyt Top Employeur » et une recherche rapide, simple et… rapide!

On peut toujours faire mieux, c’est vrai. Quelques pistes…

1. Activez le bouton « Back » du navigateur.
2. Traduisez les métadonnées des titres des pages sur la version FR du site.
3. Veillez à la cohérence des visuels sur les pages où remontent les contenus – surtout pour les témoignages ou les emplois vacants : le portrait d’un réassortisseur au-dessus d’une annonce pour dirigeant de magasin amortit la force éditoriale ; changer totalement de photo entre la page d’aperçu qui annonce l’interview d’une simplificatrice de processus et la page de détail où la simplificatrice en question a changé de look, de visage et de coiffure, ça diminue un peu plus votre force de frappe.
4. Relookez vos pages d’article : augmentez la taille des polices par défaut, mettez du relief, soignez la présentation (les blocs sur la droite sont très pertinents, mais trop éloignés du contenu). Ces pages pourraient aussi recevoir les outils conventionnels : envoyer à un ami, retenir dans les favoris, imprimer, etc.

Enfin, outre l’absence des liens vers les médias sociaux (LinkedIn, Twitter et Facebook, a minima), on se demande comment un si gros, si top employeur tarde à proposer une fonctionnalité « Mon Colruyt Emploi ».

• Le site Jobs chez Colruyt
• Haut de la page

ING, « Il y a de belles perspectives d’avenir…

… et de nombreuses possibilités d’évolution » (sic). Cette citation épinglée en haut de page, où se succèdent des témoignages de collaborateurs ING, m’ laissée pantoise. Je ne peux pas croire que ces gens qui travaillent chez ING ont vraiment prononcé ces poncifs qui défilent dans le carrousel. Vous admettrez que des « je participe à la mise en place de nouveaux projets » et autres « Nous fournissons des conseils avisés à nos clients », ça sonne creux, non? Je dirais même plus : manquerait plus que ça qu’ils mettent en place de nouveaux projets et que leurs conseils sont avisés!!!

Certes, les candidats apprécient de pouvoir découvrir l’ambiance de travail, le vécu des employés, le statut de l’employeur, ses qualités de recruteur, etc. Ce type d’information est, précisément, ce qu’on appelle un contenu à valeur ajoutée. C’est  important de donner envie aux postulants de travailler chez ING. Et c’est vrai qu’ING met le paquet pour enthousiasmer ses potentiels futurs employés… Mais il faut que ce soit vrai, authentique. C’est le principal reproche que je ferais au site: ça manque de vrais contenus de recommandation.

Sinon, la structure générale est assez claire et efficace. Dommage que certaines rubriques s’ouvrent dans une nouvelle fenêtre de navigateur, notamment les « Jobs à la loupe » et « Accéder à Mon espace Carrière ». Côté Emploi précisément, à l’inverse de Agoria, ING met beaucoup de choses en avant, sauf les dernières annonces : 3 seulement sous Jobs à la loupe.

Enfin, un employeur sur LinkedIn, Twitter et autres réseaux sociaux.

• Le site ING emploi
• Haut de la page

La Poste, c’était écrit!

« La poste s’engage résolument sur la voie de la modernité »: entonne le slogan en tête de chaque annonce d’emploi sur le site de la Poste. Voici quelques astuces pour s’engager plus avant, également, sur la voie de l’ergonomie Web et d’une bonne expérience utilisateur…

1. Titrez vos annonces sur l’essentiel, plutôt que par un slogan sur votre propre image. Dites ce qui est proposé et demandé.
2. Mettez du relief, de la hiérarchie dans vos contenus. Vos pages sont certes aérées, structurées et pas trop longues, mais elles pourraient mieux épouser le comportement de balayage de l’internaute.
3. Revoyez complètement la navigation : un 1er menu en néerlandais, un accès aux emplois vacants par catégorie d’emploi, des raccourcis peu clairs (Sollicitation Guichetier, … ), des pages de détail sans plus de navigation (seul le bouton Back du navigateur permet de revenir au site, …). Ensuite, sur la page d’orientation, les annonces sont triées par activité, mais lorsque vous cliquez sur le 1er menu « Vacatures », les annonces apparaissent par intitulé. Sans d’autres infos: pas de date, pas de lieu, pas de nombre d’années d’expérience ou de diplôme requis…
4. Nettoyez vos contenus de recommandation: les témoignages des collaborateurs existants comportent beaucoup de blabla du genre « Il est vraiment motivant de constater que chaque collaborateur peut apporter concrètement sa pierre à l’édifice ».).

Certes, on apprécie la variété et la richesse de contenus et incitants pour les jeunes diplômés, pour découvrir les atouts ou connaître la procédure de sélection. Mais à nouveau, tout se passe comme si la section avait été conçue selon des « faux » besoins projetés par l’organisation sur son utilisateur.

• Les pages Emploi sur La Poste
• Haut de la page

SNCB, le train en marche

Le site du plus gros recruteur du pays n’en reste pas moins modeste, trop modeste. Certes, je peux chercher un emploi par diplôme, par métier ou secteur d’activité. Par contre, sauf la rubrique « Job de la semaine » (qui n’avait pas été mise à jour depuis 3 semaines au moment où je consultais ces pages), les derniers postes vacants ne sont pas mis en évidence sur la page d’accueil.

Les contenus de recommandation sont, cette fois, de qualité. Parce qu’il y a aussi des vidéos? Cela ferait plus authentique, plus fidèle ? Peut-être. Mais aussi parce qu’on se contente des portraits pour faire passer que la diversité a toute sa place au sein du holding. Pas besoin de le dire littéralement.

Appréciables aussi les liens « Votre formation », « Votre parcours professionnel », « Diversité et égalité des chances » et « Statutaires et non statutaires »…

La navigation peut être améliorée, notamment les labels « Nous vous proposons », « nos collaborateurs » (encore un employeur qui met dans la navigation ses collaborateurs existants en avant? Ceci n’est pas un intranet!) et surtout « En savoir plus »… qui est vide!

De manière générale, c’est surtout l’ergonomie des contenus qui doit être priorisée. Les pages d’articles ne sont pas du tout adaptées à une lecture en ligne. Cela manque de relief sur les mots clés, de saillance et d’organisation dans l’information. Et les outils coutumiers n’y sont pas: Imprimer, Envoyer à un ami, ajouter à ses favoris, …

Côté outils, justement, puisque la SNCB va recruter 15000 personnes dans les 10 prochaines années, il lui faut aussi, rapidement, envisager de mettre en place « Mon espace Job SNCB »…

• L’espace Jobs sur le site SNCB
• Haut de la page

Sur le même sujet

• Record Bank est une garce (sic)
• Comment Google peut détecter les « mauvais » contenus?
• Quatre critères éditoriaux de crédibilité
• Qui sont les usines à contenu : les agences ou les utilisateurs?
• Ecrire pour convaincre: des contenus Web fiables et efficaces

Ce n’est pas parce qu’on est rédacteur Web qu’on est un as de l’html. Je sais de quoi je parle. Pourtant, il nous arrive à tous de devoir, un jour ou l’autre, mettre les mains dans le cambouis – lisez: intégrer du texte dans un éditeur html. Voici donc quelques codes html essentiels au webwriter.

Langage et balises

Pour rappel, HTML est un langage de balisage qui permet d’écrire de l’hypertexte. Les balises sont des marqueurs ou commandes HTML constitués d’une directive. Encadrée par les signes inférieur à (<) et supérieur à (>), cette directive permet de mettre en forme le texte, et indique au navigateur Web comment doit être affiché le document concerné.

Généralement, il y a 2 balises:

1. La balise ouvrante indique à partir de quel endroit la directive doit être prise en compte : <p>.
2. La balise fermante précise à quel endroit la directive prend fin : (</p>).

Rudiments de vocabulaire

Nous vous proposons ci-dessous quelques balises particulièrement intéressantes pour optimiser vos contenus Web.

Ci-dessous, les balises sont mises entre parenthèses pour éviter leur mise en forme.

Les titres

Il y a 6 niveaux de titres en html : de h1 à h6, h1 correspondant à la typographie la plus grande et h6, la plus petite. Ainsi, vous placerez vos titres de premier niveau entre les balises (<h1>) et (</h1>).

Utilisez des titres pour

• organiser votre information,
• hiérarchiser visuellement vos contenus,
• créer de la saillance,
• permettre un balayage facile.

Le gras

Le gras est indiqué par les balises (<strong>) et (</strong>) ou (<b>) et (</b>). Ces balises sont intéressantes pour mettre vos mots-clés en évidence. De cette manière, ils ont une meilleure saillance et sont plus facilement repérables dans le texte.

Utilisez le gras pour

• mettre vos mots-clés en évidence (qui n’apparaissent pas déjà dans votre titre),
• faire ressortir les concepts et mots qui comptent dans vos pages
• créer de la saillance,
• permettre un balayage facile,
• aider au référencement.

Les listes à puces

Les balises utilisées pour créer une liste à puces sont : (<ul>)(<li>)(</li>)…(<li>)(</li>)(</ul>). Utilisez le (<ul>) pour ouvrir la liste, le (</ul>) pour la fermer et les (<li>)(</li>) pour créer les lignes de votre liste.

Utilisez les listes à puces pour

• mettre une énumération en évidence,
• organiser et structurer vos contenus
• créer de la saillance,
• permettre un balayage facile,
• aider au référencement.

N’exagérez pas dans vos énumérations : ne dépassez pas 6 à 7 lignes, regroupez logiquement les éléments de vos listes et évitez les répétitions dans les premiers mots de vos lignes.

Les hyperliens

(<a href= »http://www.wearethewords.com »>We are the words a un nouveau site Web ! (</a>) est la syntaxe de la balise utilisée pour indiquer un hyperlien. Dans cette structure, l’adresse elle-même est invisible pour l’utilisateur, qui ne voit que la mention « We are the words a un nouveau site Web ! ».

Utilisez les hyperliens pour

• permettre la navigation interne dans une longue page (via les ancres),
• donner plus d’informations à l’utilisateur (en lui suggérant, par exemple, d’autres ressources via une série de liens du type « En savoir plus »)
• favoriser le côté « acteur » de l’internaute. L’internaute est un utilisateur ; une page Web sans hyperlien n’est donc pas une page Web optimisée en termes d’utilité, d’utilisation et d’action.
• aider au référencement.

Vous veillerez à regrouper les hyperliens en bas de la page ou sur le côté lorsque les pages en comptent beaucoup. Vous veillerez également à toujours prévoir un « titre » pour votre hyperlien (ici : We are the words a un nouveau site Web) plutôt que de fournir l’adresse web « en dur ».

Les paragraphes

Les balises de paragraphe sont (<p>) qui se place avant la première lettre du paragraphe et (</p>) à la fin du paragraphe.

Utilisez les paragraphes pour

• « aérer » vos pages Web,
• « découper » l’information en paquets de 2 à 3 idées max. pour s’adapter à la « capacité d’appréhension immédiate » de l’internaute
• organiser son information par thèmes.

Vous n’hésiterez pas à prévoir un titre tous les 2, 3 paragraphes pour que l’internaute suive le développement. Vous veillerez à placer les éléments les plus informatifs dès le début des paragraphes. De cette manière, si, à la lecture de la première phrase, l’utilisateur ne se sent pas concerné par tel paragraphe, il pourra passer directement au paragraphe suivant. Cela lui permet de parcourir une page en diagonale et d’évacuer directement les éléments qui ne l’intéressent pas.

Le saut de ligne

La balise « saut de ligne » est une mono-balise (elle fonctionne seule, sans balise ouvrante). Le marqueur est  (<br />). Il se place en fin de la phrase, avant celle que vous souhaitez forcer de passer à la ligne.

Utilisez le saut de ligne pour

• réduire la largeur de vos textes. Une ligne de texte à l’écran doit faire env. 60 à 100 ca pour être lue confortablement.
• corriger visuellement un bloc de texte trop confus sans alignement à droite. En général, un texte à l’écran n’est pas justifié, mais seulement aligné à gauche. Parfois, il convient de « tricher » un peu la présentation, notamment, des listes à puces ou paragraphes pour que le balayage de la page reste facile.

Petit bonus

En début d’article, j’ai utilisé la balise Acronyme pour expliquer le sigle HTML. Son marqueur est (<acronym title= »HyperText Mark-up Language »>HTML(</acronym>).

Poursuivre votre lecture

1. Sur les contraintes formelles de l’écriture Web
2. Sur les contraintes fonctionnelles de l’écriture Web
3. Sur le référencement

Vous êtes rédacteur Web ? Avez-vous acquis le langage HTML ? Quelles sont les balises que vous utilisez le plus ?

Sur le même sujet

• Rédaction Web et brand content: tout est dans l’ADN!
• Ecrivez pour l’internet mobile
• Promener l’utilisateur au bout de vos liens
• Ringarde, la blogoliste?
• Comment Google peut détecter les « mauvais » contenus?

Louer une voiture peut devenir une véritable épreuve : les conditions du contrat, les couvertures assurées, les options nombreuses et sophistiquées qui font fortement grimper les prix de base, autant de critères à prendre en compte dans son choix… Comment les grands loueurs de voiture pallient-ils au manque d’interactivité immédiate sur le Web ?

Quelle est l’efficacité de leur module de réservation? Avis et Sixt au départ… Le premier pourrait avoir plus de puissance dans le moteur ! Et le second, plus d’options au tableau de bord.

NDLR : Cet article est paru dans le magazine Inside 109 du mois de mai. L’objectif de la présente rubrique est de mettre en évidence certaines faiblesses et certains points forts ponctuels d’une série de sites internet. Il ne s’agit en aucun cas d’une évaluation globale et définitive des sites web.

La page d’accueil de P&V

(prise d’écran effectuée le 6 avril 2009, cliquez dessus pour agrandir)

Appréciation d’ensemble :

Malgré la simplicité graphique de la page d’accueil, on déplore, après un premier balayage de la page, une navigation opaque, une bruyante littérature et un manque d’intuitivité. Il faudrait quelques élagages et une optimisation des labels et de la structure pour remplir l’apparent pari de simplicité du site Web de P&V.

La page d’accueil de Touring Assurances

(prise d’écran effectuée le 6 avril 2009, cliquez dessus pour agrandir)

Appréciation d’ensemble :

Un outil pour calculer le coût de son assurance, 3 onglets aux labels super efficaces, 3 incitants à l’action bien distincts, une carte de la Belgique pour trouver son contact le plus proche, … Le site Web de Touring Assurances va à l’essentiel tout en répondant aux besoins des clients. En tout cas, l’assureur tient la promesse de son slogan : économie (de moyens), qualité (d’utilisation) et simplicité (des contenus).

Sur le même sujet

• Webdesign à la loupe! Le face à face: Avis – Sixt
• Stratégie de contenu Web, parution chez Eyrolles
• Téléchargez notre modèle d’analyse éditoriale comparative
• Recevez gratuitement le guide WAW du blogging corporate
• Découvrez nos outils d’aide à la stratégie de contenu

Ici, ergonomie du contenu rime avec référencement. Annonçons, d’entrée de jeu, le sujet principal de la page. Forçons-nous à placer nos mots-clés tout en haut du texte (cf. pyramide inversée), et ce à l’échelle de toute la page, mais aussi à celle des autres entités: paragraphes et phrases. Les robots, aussi, aiment être informés rapidement.

Le maître mot du jour, c’est l’exergue. N’était que le côté formel, j’utiliserais le mot « saillance ». Mais pour l’heure, nous causons référencement. Et donc, aussi, contenu et mots-clés (pertinents pour vos utilisateurs, bien évidemment).

Une idée par entité

1. Limitez les thématiques.
2. Divisez en paragraphes.
3. Ne lésinez pas sur les titres internes et les sous-titres.

Soyez descriptifs

Les titres « bateaux », comme « Bienvenue sur notre site » sont à proscrire. Réfléchissez toujours en termes de lisibilité et de sens.

De manière générale, veillez à avoir des pages monothématiques. Pourquoi ? D’abord, parce que chaque page aura une balise <title> unique (voir ci-dessus), et sera donc pleinement optimisée. Ensuite, parce que cela permet d’augmenter le nombre et la visibilité des mots-clés de contenu. Enfin : deux pages, c’est une chance de plus d’être trouvé.

Dans la même série

• Optimisez votre contenu pour le référencement (5) Balisez et hiérarchisez votre contenu
• Optimisez votre contenu pour le référencement (4) : Ecrivez beaucoup et souvent
• Optimisez votre contenu pour le référencement (3) : Titrez intelligent
• Optimisez votre contenu pour le référencement (2) : SEO & SEF, c’est quoi?
  
• Optimisez votre contenu pour le référencement (1) : les 3 mots-clés du référencement
  
• Contenu et référencement, la série de l’été
• A propos de référencement

Dans le genre

• Identifiez les bons mots clés
• La pyramide inversée
• Mes billets sur la saillance
• L’origine de la photo

Cette série a été réalisée en collaboration avec Philippe Hoevenaeghel, ex. spécialiste SEO chez Emakina

Sur le même sujet

• Ringarde, la blogoliste?
• Comment Google peut détecter les « mauvais » contenus?
• Concevez vos textes en mode hypertexte
• Conseils SEO pour les éditeurs de contenu
• Un ouvrage amusant sur le référencement

Webwriters, rédacteurs web, journalistes web, copywriters, agences web, agences de pub, bureaux de contenu éditorial, blogueurs, …

… podcasteurs, webmasters, formateurs, chargés et chefs de projet éditorial web, et autres, je vous invite à poursuivre l’aventure à cette nouvelle adresse.

Le projet du blog reste le même: vous prodiguer des conseils gratuits, études de cas pratiques, documents à télécharger, … pour vous aider à construire et mettre à jour le contenu de votre site Internet. Je vous rappelle les principales catégories de ce blog:

1. Contraintes de fond
2. Contraintes fonctionnelles
3. Contraintes formelles

Pour une analyse ou un conseil personnalisé, écrivez-moi. Vous pouvez également m’appeler au +32 496 553 442. Ou me retrouver sur Skype : murielvandermeulen

Sur le même sujet

• 3 rendez-vous autour de la stratégie de contenu Web
• La stratégie de contenu, nouveau né du marketing digital?
• Gagnez 40€ et deux entrées Kinepolis: participez à notre enquête Internet
• Formation « Ecrivez pour vos audiences », 7 juin (m.à.j. 20.07.10)
• Do we « Speak » Content Strategy in France?

Après m’être étendue sur notre mode de lecture tout court, je reviens brièvement sur notre comportement de lecture à l’écran. Pour rappel, ce billet fait suite, en ricochet, à un article de Slate, que Jean-Marc Hardy et Denis Balencourt.

On ne lit pas, on balaie les pages

J’ai constaté, en préparant cet article, que j’ai déjà consacré un bon nombre de billets aux contraintes formelles de l’écriture pour le Web, dues, notamment au fait que le support de lecture est un écran d’ordinateur. Un des derniers en date m’avait été inspiré par une bonne vieille référence de l’ergonomie Web : le réputé « Don’t make me think » de Steve Krug. Qu’avais-je épinglé ? Que, précisément, on ne lit pas les pages Web, mais qu’on les scanne, on les balaie. Pourquoi ? Parce que généralement:

• Nous sommes pressés.
• Nous n’éprouvons pas le besoin de lire tout le contenu de la page.
• Notre œil est un excellent « scanner.

En images…

Je vous propose d’illustrer l’importance du visuel dans le contenu web par quelques captures d’écran. Ces exemples sont issus d’une mission de coaching pour un client. Ma tâche consiste à accompagner et former les rédacteurs amenés à revoir le contenu de leur intranet.

Soyez direct et concis

Le texte original

Le texte final

La transformation

Mon conseil : écrivez comme pense votre utilisateur : en termes d’informations (qui, quoi, pourquoi, comment, etc.). Qu’est-ce que cette assurance, pour qui a-t-elle été conçue, sous quelles conditions, etc.

Tenez compte du balayage dans la présentation de votre contenu: donnez de la saillance aux mots importants.

Structurez votre contenu

Le texte original

Le texte final

La transformation

Mon conseil : en organisant logiquement votre contenu, vous écrivez comme votre utilisateur pense. Utilisez des titres, des sous-titres et des listes pour donner cette structure. Vous facilitez le balayage.

Le tableau, contenu visuel par excellence

L’original

Le résultat final

La transformation

Mon conseil: Soyez toujours visuel quand vous rédigez pour le Web. Aux mots, préférez les chiffres, les signes et symboles universels quand vous le pouvez. Exemples:

• Ecrivez les chiffres en chiffres et non en lettres
• Préférez les V et les X au oui et au non
• Evitez les répétitions.

Sources

• New eyetrack research can help online editors (article EN)
• How do we use the Web (article EN, Steve Krug, Don’t make me think)
• How we read online (l’article de Slate, qui a instigué ce billet)
• Les conseils de Jakob Nielsen (sur son terrible site Useit.com)
• Le vu et le lu (1)
• Mon billet précédent sur Steve Krug et « Comment ne lit-on pas sur le Web »
• Retrouvez l’image sur Flickr

Sur le même sujet

• Variez les niveaux de lecture et d’écriture sur vos pages Web
• Écrire pour le Web mobile
• Mettez du style dans vos contenus
• Des besoins des utilisateurs (#2) – Comportements
• Utilisez des tableaux (Lisibilité des procédures#4)

Les contraintes formelles

Ces contraintes qui touchent à la mise en page ainsi qu’à l’appréciation visuelle de votre newsletter sont essentielles. Car, plus encore dans sa messagerie que sur la page Web, le lecteur est exigeant dans son strict mode de balayage.

• Rubricage & colonnage ; compatibilité avec les tailles d’écran.
• Lisibilité : saillance, titres, accroches, liens
• Typographie : fonte sans empattement, assez grande, sombre, justifiée à gauche, pas d’italique, pas de capitales (sauf pour les rubriques & titres), pas de souligné (sauf pour les liens)
• Fond : clair, uni
• Respect de la charte graphique du site
• Pas d’éléments animés dans le contenu ; Pas de Flash
• Limiter le nombre et la taille des illustrations

Liens rapides

• La photo sur Flickr
• Modèles de newsletters
• check-list Newsletter 1
• check-list Newsletter 2

Sur le même sujet

• Variez les niveaux de lecture et d’écriture sur vos pages Web
• Utilisez des tableaux (Lisibilité des procédures#4)
• Limitez les niveaux hiérarchiques (Lisibilité des procédures #3)
• Testez la lisibilité de votre blog
• Quelle taille, votre contenu ?