<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:media="http://search.yahoo.com/mrss/"
	>

<channel>
	<title>Ecrire pour le web</title>
	<atom:link href="http://ecrirepourleweb.wordpress.com/feed/" rel="self" type="application/rss+xml" />
	<link>http://ecrirepourleweb.wordpress.com</link>
	<description>The Belgian blog about Webwriting</description>
	<pubDate>Fri, 04 Jul 2008 11:31:36 +0000</pubDate>
	<generator>http://wordpress.org/?v=MU</generator>
	<language>fr</language>
			<item>
		<title>Ecrire pour le Web déménage</title>
		<link>http://ecrirepourleweb.wordpress.com/2008/07/04/ecrire-pour-le-web-demenage/</link>
		<comments>http://ecrirepourleweb.wordpress.com/2008/07/04/ecrire-pour-le-web-demenage/#comments</comments>
		<pubDate>Fri, 04 Jul 2008 11:31:36 +0000</pubDate>
		<dc:creator>muriel vandermeulen</dc:creator>
		
		<category><![CDATA[Blogging]]></category>

		<guid isPermaLink="false">http://ecrirepourleweb.wordpress.com/?p=579</guid>
		<description><![CDATA[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&#8217;aventure à cette nouvelle adresse.
http://ecrirepourleweb.com
Le projet du blog reste le même: vous prodiguer des conseils gratuits, études de cas pratiques, documents à [...]]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p>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&#8217;aventure à cette nouvelle adresse.</p>
<h1 style="text-align:center;"><a href="http://ecrirepourleweb.com">http://ecrirepourleweb.com</a></h1>
<p>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:</p>
<ol>
<li><a title="Voir tous les articles classés dans Contraintes de fond" href="http://ecrirepourleweb.com/category/contraintes-de-fond" target="_blank">Contraintes de fond</a></li>
<li><a title="Voir tous les articles classés dans Contraintes fonctionnelles" href="http://ecrirepourleweb.com/category/contraintes-fonctionnelles" target="_blank">Contraintes fonctionnelles</a></li>
<li><a title="Voir tous les articles classés dans Contraintes formelles" href="http://ecrirepourleweb.com/category/contraintes-formelles" target="_blank">Contraintes formelles</a></li>
</ol>
<div class="accordion">
<div class="hidden" style="display:none;">
<p>Logique et structure comptent parmi les maîtres mots de l’organisation des contenus Web. Dans ces pages je vous propose 3 grands axes de conseil:</p>
<ol>
<li>les contraintes <strong>fonctionnelles</strong> (l’hyperlien, la navigation, l’architecture des pages)</li>
<li>les contraintes <strong>formelles</strong> (la balayabilité, la lisibilité, la saillance, …)</li>
<li>les contraintes <strong>de fond</strong> (le contenu, le langage, le “tone of voice”, l’interaction, …)</li>
</ol>
</div>
</div>
<p>Pour une analyse ou <strong>un conseil personnalisé</strong>, <a href="mailto:wearethewords@skynet.be">écrivez-moi</a>. Vous pouvez également m’appeler au +32 496 553 442. Ou me retrouver sur Skype : murielvandermeulen</p>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/ecrirepourleweb.wordpress.com/579/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/ecrirepourleweb.wordpress.com/579/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/ecrirepourleweb.wordpress.com/579/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/ecrirepourleweb.wordpress.com/579/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/ecrirepourleweb.wordpress.com/579/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/ecrirepourleweb.wordpress.com/579/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/ecrirepourleweb.wordpress.com/579/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/ecrirepourleweb.wordpress.com/579/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/ecrirepourleweb.wordpress.com/579/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/ecrirepourleweb.wordpress.com/579/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/ecrirepourleweb.wordpress.com/579/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/ecrirepourleweb.wordpress.com/579/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=ecrirepourleweb.wordpress.com&blog=617858&post=579&subd=ecrirepourleweb&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://ecrirepourleweb.wordpress.com/2008/07/04/ecrire-pour-le-web-demenage/feed/</wfw:commentRss>
	
		<media:content url="http://a.wordpress.com/avatar/murielv-128.jpg" medium="image">
			<media:title type="html">muriel v</media:title>
		</media:content>
	</item>
		<item>
		<title>De la personnalisation à la recommandation des contenus</title>
		<link>http://ecrirepourleweb.wordpress.com/2008/06/30/de-la-personnalisation-a-la-recommandation-des-contenus/</link>
		<comments>http://ecrirepourleweb.wordpress.com/2008/06/30/de-la-personnalisation-a-la-recommandation-des-contenus/#comments</comments>
		<pubDate>Mon, 30 Jun 2008 08:12:10 +0000</pubDate>
		<dc:creator>muriel vandermeulen</dc:creator>
		
		<category><![CDATA[Blogging]]></category>

		<category><![CDATA[Outils &amp; Widgets]]></category>

		<category><![CDATA[Quoi de neuf sur le Web?]]></category>

		<category><![CDATA[Web 2.0]]></category>

		<category><![CDATA[flux RSS]]></category>

		<category><![CDATA[longue traîne]]></category>

		<category><![CDATA[recommandation de contenu]]></category>

		<category><![CDATA[social networking]]></category>

		<guid isPermaLink="false">http://ecrirepourleweb.wordpress.com/?p=414</guid>
		<description><![CDATA[
Retour sur une réflexion un peu datée (fin 2007), mais qui reste, selon moi d&#8217;actualité. Le Web 2.0 a depuis longtemps introduit la notion de personnalisation de contenu, avec des services comme NetVibes par exemple. Mais il est un autre volet qui prend de plus en plus d&#8217;ampleur (et semble plus prometteur) : la recommandation [...]]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p><img class="alignnone" src="http://farm2.static.flickr.com/1234/727825483_7ea05d2f05_m.jpg" alt="" align="right" /></p>
<p><strong><em>Retour sur une réflexion un peu datée (fin 2007), mais qui reste, selon moi d&#8217;actualité. Le Web 2.0 a depuis longtemps introduit la notion de personnalisation de contenu, avec des services comme NetVibes par exemple. Mais il est un autre volet qui prend de plus en plus d&#8217;ampleur (et semble plus prometteur) : la recommandation automatisée.</em></strong></p>
<p>On est peut-être en effet loin de la Terre Promise que devaient procurer les solutions de pages personnelles à moduler avec des flux de notre choix. Est-ce si social ? Pas vraiment, si l&#8217;on considère que <strong>chacun lit ses flux dans son coin</strong>, et ne les partage finalement qu&#8217;avec lui-même.</p>
<p>La <strong>rotation des contenus</strong> est elle aussi limitée. Les plus populaires passent entre les mailles du filet, mais peut-on en dire autant des sources plus discrètes, voire plus obscures ? Cela demanderait beaucoup plus de temps et d&#8217;investissement personnel.</p>
<h2>Forcer le social et la diversité</h2>
<p>La recommandation de contenus a l&#8217;avantage de remonter des contenus et de provoquer des découvertes et des réseaux qui, autrement, ne verraient pas le jour.</p>
<p>Le principe de la recommandation de contenus repose sur 2 axes:</p>
<p>1. Le système enregistre les<strong> votes/opinions</strong> de vos visiteurs, et sur cette base, les met en <strong>contact direct et automatique </strong>avec des gens qu&#8217;ils n&#8217;auraient peut-être jamais rencontré autrement sur la toile. C&#8217;est ce qui en fait d&#8217;emblée un outil plus social. <strong>Du pur Web 2.0</strong> : le pouvoir est laissé aux internautes.</p>
<p>2. Le système a ses propres règles de recommandation de contenu, qui permettent de conseiller du contenu aux visiteurs de votre site Web. Les règles de recommandation conseillent par exemple du contenu en fonction des interactions passées des utilisateurs avec votre site Web. <strong>Du Web 2.0 contrôlé</strong> : vous générez la socialisation des contenus, vous organisez les remontées d&#8217;information.</p>
<p>Les avantages de la recommandation des contenus se situent surtout&#8230; au niveau du contenu. Il est vrai qu&#8217;avec les outils de personnalisation traditionnels, les utilisateurs peuvent explorer des contenus, notamment via leurs amis. Mais avec la recommandation &#8220;forcée&#8221;, <strong>l&#8217;éventail des possibilités</strong> est élargi. En termes de variété et de profondeur des informations, en terme de portée des réseaux, etc.</p>
<h2>Plus loin dans la &#8220;longue traîne&#8221;</h2>
<p>Le fonctionnement est très simple : vos internautes se contentent de dire &#8220;j&#8217;aime&#8221;, &#8220;j&#8217;aime pas&#8221;. Les <strong>algorithmes</strong> se chargent du reste. Sous ces aspects un peu barbares, se cachent en fait des systèmes puissants de <strong>mise en relation</strong>.</p>
<p>On trouve, pour eux, d&#8217;autres internautes ayant les mêmes goûts ou étant intéressés par les mêmes tendances. Le système leur suggère alors le contenu qu&#8217;ils ont aussi apprécié et qu&#8217;ils ne connaissent peut-être pas encore. Vous leur offrez un service, vous stimulez la navigation croisée, boostez la recherche suggestive et optimisez votre taux de conversion auprès des leads et premiers visiteurs.</p>
<p>Autrement dit, la particularité de la recommandation de contenu est de<strong> <span style="font-weight:normal;">c</span></strong>ombiner les deux principes phares du Web 2.0 : la <strong>force de la masse</strong> ou intelligence collective et le <strong>besoin de reconnaissance sociale</strong> de chaque individu pris isolément</p>
<p>On enrichit et on s&#8217;enfonce <strong>plus loin dans la fameuse &#8220;longue traîne&#8221;</strong> : les contenus rendus accessibles ne sont pas forcément brassés par des grandes communautés, mais peut-être par des petits groupes qui partagent des intérêts spécifiques.</p>
<h2>Quelques sites de recommandation de contenu</h2>
<ul>
<li><a href="http://www.stumbleupon.com/" target="_blank">Stumble Upon</a> : recommande des sites web selon vos intérêts</li>
<li><a href="http://www.last.fm/" target="_blank">Last.fm</a> : recommande des playlists sur base de vos goûts musicaux</li>
<li><a href="http://www.netflix.com/?lnkctr=nmhdef" target="_blank">Netflix.com</a> : même chose, avec des locations de DVD</li>
<li><a href="http://www.geekomatik.com/" target="_blank">Geekomatik</a> : recommande des blogs sur l&#8217;actualité informatique</li>
<li><a href="http://del.icio.us/">Del.icio.us</a> : site de classement et de partage de sites Web et de blogs favoris</li>
<li><a href="http://www.amazon.com" target="_blank">Amazon.com</a> (ou <a href="http://www.amazon.fr" target="_blank">.fr</a>): l&#8217;exemple type d&#8217;un site de recommandation des contenus.</li>
</ul>
<h2>Liens pratiques</h2>
<ul>
<li><a href="http://www.encoreungeek.com/recommandation-personnalisation-de-contenu-avenir-du-web" target="_blank">L&#8217;avis d&#8217;Encoreungeek.com</a></li>
<li><a href="http://ecrirepourleweb.wordpress.com/2008/05/09/les-blogs-de-salaries/" target="_blank">Les blogs de salariés</a></li>
<li><a href="http://ecrirepourleweb.wordpress.com/2007/07/06/comment-exploiter-le-web-20/" target="_blank">Comment exploiter le Web 2.0 &#8230; ?</a></li>
<li><a href="http://ecrirepourleweb.wordpress.com/2007/11/09/le-web-europeen-fait-partie-du-quotidien/" target="_blank">Le Web européen fait partie du quotidien</a></li>
<li><a href="http://ecrirepourleweb.wordpress.com/?s=longue+tra%C3%AEne" target="_blank">Précédents articles abordant la &#8220;longue traîne&#8221;</a></li>
<li><a title="Explications claires et efficaces" href="http://www.geekomatik.com/guide/le-systeme-de-recommandation-de-contenu" target="_blank">Comment fonctionne Geekomatik</a></li>
<li><a title="L'article date de février 2007" href="http://www.deuxzero.com/2007/02/le_web_20_selon_marc_thouvenin.html" target="_blank">Le fondateur de NetVibes explique la notion de Web 2.0</a></li>
</ul>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/ecrirepourleweb.wordpress.com/414/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/ecrirepourleweb.wordpress.com/414/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/ecrirepourleweb.wordpress.com/414/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/ecrirepourleweb.wordpress.com/414/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/ecrirepourleweb.wordpress.com/414/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/ecrirepourleweb.wordpress.com/414/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/ecrirepourleweb.wordpress.com/414/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/ecrirepourleweb.wordpress.com/414/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/ecrirepourleweb.wordpress.com/414/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/ecrirepourleweb.wordpress.com/414/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/ecrirepourleweb.wordpress.com/414/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/ecrirepourleweb.wordpress.com/414/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=ecrirepourleweb.wordpress.com&blog=617858&post=414&subd=ecrirepourleweb&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://ecrirepourleweb.wordpress.com/2008/06/30/de-la-personnalisation-a-la-recommandation-des-contenus/feed/</wfw:commentRss>
	
		<media:content url="http://a.wordpress.com/avatar/murielv-128.jpg" medium="image">
			<media:title type="html">muriel v</media:title>
		</media:content>

		<media:content url="http://farm2.static.flickr.com/1234/727825483_7ea05d2f05_m.jpg" medium="image" />
	</item>
		<item>
		<title>Le vu et le lu (2)</title>
		<link>http://ecrirepourleweb.wordpress.com/2008/06/27/le-vu-et-le-lu-2/</link>
		<comments>http://ecrirepourleweb.wordpress.com/2008/06/27/le-vu-et-le-lu-2/#comments</comments>
		<pubDate>Fri, 27 Jun 2008 08:26:26 +0000</pubDate>
		<dc:creator>muriel vandermeulen</dc:creator>
		
		<category><![CDATA[Contraintes formelles]]></category>

		<category><![CDATA[Lisibilité]]></category>

		<category><![CDATA[Utilisabilité]]></category>

		<category><![CDATA[balayage]]></category>

		<guid isPermaLink="false">http://ecrirepourleweb.wordpress.com/?p=558</guid>
		<description><![CDATA[Après m&#8217;être étendue sur notre mode de lecture tout court, je reviens brièvement sur notre comportement de lecture à l&#8217;é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&#8217;ai constaté, en préparant cet article, que j&#8217;ai déjà consacré [...]]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/leluetlevu2.png"><img class="size-medium wp-image-569 alignright" style="float:right;" src="http://ecrirepourleweb.files.wordpress.com/2008/06/leluetlevu2.png?w=300&h=169" alt="" width="300" height="169" /></a><em><strong>Après m&#8217;être étendue sur notre mode de lecture tout court, je reviens brièvement sur notre comportement de lecture à l&#8217;écran. Pour rappel, ce billet fait suite, en ricochet, à un article de Slate, que Jean-Marc Hardy et Denis Balencourt.</strong></em></p>
<h2>On ne lit pas, on balaie les pages</h2>
<p>J&#8217;ai constaté, en préparant cet article, que j&#8217;ai déjà consacré un <a title="Consultez les précédents billets sur le sujet" href="http://ecrirepourleweb.wordpress.com/category/contraintes-formelles/" target="_blank">bon nombre de billets</a> aux contraintes formelles de l&#8217;écriture pour le Web, dues, notamment au fait que le support de lecture est un écran d&#8217;ordinateur. Un des derniers en date m&#8217;avait été inspiré par une bonne vieille référence de l&#8217;ergonomie Web : le réputé &#8220;Don&#8217;t make me think&#8221; de Steve Krug. Qu&#8217;avais-je épinglé ? Que, précisément, on ne lit pas les pages Web, mais qu&#8217;on les scanne, on les balaie. Pourquoi ? Parce que généralement:</p>
<ul>
<li>Nous sommes pressés.</li>
<li>Nous n&#8217;éprouvons pas le besoin de lire tout le contenu de la page.</li>
<li>Notre œil est un excellent &#8220;scanner.</li>
</ul>
<h2>En images&#8230;</h2>
<p>Je vous propose d&#8217;illustrer l&#8217;importance du visuel dans le contenu web par quelques captures d&#8217;écran. Ces exemples sont issus d&#8217;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.</p>
<h2>Soyez direct et concis</h2>
<p><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel1.png"></a><br />
Le texte original</p>
<p style="text-align:center;"><img class="size-medium wp-image-560 aligncenter" src="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel1.png?w=367&h=131" alt="Le texte original" width="367" height="131" /></p>
<p><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel2.png"></a><br />
Le texte final</p>
<p style="text-align:center;"><img class="size-medium wp-image-561 aligncenter" src="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel2.png?w=392&h=153" alt="" width="392" height="153" /></p>
<p style="text-align:center;"><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel3.png"></a><br />
La transformation<br />
<img class="size-medium wp-image-562 aligncenter" src="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel3.png?w=376&h=162" alt="" width="376" height="162" /></p>
<p><strong>Mon conseil : écrivez comme pense votre utilisateur :</strong> en termes d&#8217;informations (qui, quoi, pourquoi, comment, etc.). Qu&#8217;est-ce que cette assurance, pour qui a-t-elle été conçue, sous quelles conditions, etc.</p>
<p>Tenez compte du balayage dans la présentation de votre contenu: donnez de la saillance aux mots importants.</p>
<h2>Structurez votre contenu</h2>
<p>Le texte original
</p>
<p style="text-align:center;"><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel4.png"><img class="size-medium wp-image-563 aligncenter" src="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel4.png?w=300&h=139" alt="" width="300" height="139" /></a></p>
<p>Le texte final</p>
<p style="text-align:center;"><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel5.png"><img class="size-medium wp-image-564 aligncenter" src="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel5.png?w=300&h=165" alt="" width="300" height="165" /></a></p>
<p>La transformation</p>
<p style="text-align:center;"><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel6.png"><img class="size-medium wp-image-565 aligncenter" src="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel6.png?w=300&h=251" alt="" width="300" height="251" /></a></p>
<p><strong>Mon conseil : en organisant logiquement votre contenu</strong>, vous écrivez comme votre utilisateur pense. Utilisez des titres, des sous-titres et des listes pour donner cette structure. Vous facilitez le balayage.</p>
<h2>Le tableau, contenu visuel par excellence</h2>
<p>L&#8217;original</p>
<p style="text-align:center;"><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel7.png"><img class="size-medium wp-image-566 aligncenter" src="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel7.png?w=336&h=160" alt="" width="336" height="160" /></a></p>
<p>Le résultat final</p>
<p style="text-align:center;"><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel8.png"><img class="size-medium wp-image-567 aligncenter" src="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel8.png?w=390&h=159" alt="" width="390" height="159" /></a></p>
<p>La transformation</p>
<p style="text-align:center;"><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel9.png"><img class="size-medium wp-image-568 aligncenter" src="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel9.png?w=300&h=161" alt="" width="300" height="161" /></a></p>
<p>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:</p>
<ul>
<li>Ecrivez les chiffres en chiffres et non en lettres</li>
<li>Préférez les V et les X au oui et au non</li>
<li>Evitez les répétitions.</li>
</ul>
<p>Sources</p>
<ul>
<li><a title="Article en anglais" href="http://www.editorsweblog.org/newsrooms_and_journalism/2007/03/new_eyetrack_research_can_help.php" target="_blank">New eyetrack research can help online editors</a> (article EN)</li>
<li><a title="Extrait (EN) de " href="http://www.sensible.com/chapter.html" target="_blank">How do we use the Web</a> (article EN, Steve Krug, Don&#8217;t make me think)</li>
<li><a title="Lire l'article en anglais" href="http://www.slate.com/id/2193552/" target="_blank">How we read online</a> (l&#8217;article de Slate, qui a instigué ce billet)</li>
<li><a title="Accédez au site de Nielsen" href="http://www.useit.com/alertbox/9710a.html" target="_blank">Les conseils de Jakob Nielsen</a> (sur son terrible site Useit.com)</li>
<li><a title="Le premier épisode de cet article" href="http://ecrirepourleweb.wordpress.com/2008/06/23/le-vu-et-le-lu-1/" target="_blank">Le vu et le lu (1)</a></li>
<li><a title="Sur ce blog" href="http://ecrirepourleweb.wordpress.com/2008/04/08/dont-make-me-think/" target="_blank">Mon billet précédent</a> sur Steve Krug et &#8220;Comment <span style="text-decoration:line-through;">ne</span> lit-on <span style="text-decoration:line-through;">pas</span> sur le Web&#8221;</li>
<li><a href="http://www.flickr.com/photos/rached_miladi_tunisie/2359101608/" target="_blank">Retrouvez l&#8217;image sur Flickr</a></li>
</ul>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/ecrirepourleweb.wordpress.com/558/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/ecrirepourleweb.wordpress.com/558/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/ecrirepourleweb.wordpress.com/558/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/ecrirepourleweb.wordpress.com/558/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/ecrirepourleweb.wordpress.com/558/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/ecrirepourleweb.wordpress.com/558/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/ecrirepourleweb.wordpress.com/558/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/ecrirepourleweb.wordpress.com/558/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/ecrirepourleweb.wordpress.com/558/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/ecrirepourleweb.wordpress.com/558/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/ecrirepourleweb.wordpress.com/558/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/ecrirepourleweb.wordpress.com/558/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=ecrirepourleweb.wordpress.com&blog=617858&post=558&subd=ecrirepourleweb&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://ecrirepourleweb.wordpress.com/2008/06/27/le-vu-et-le-lu-2/feed/</wfw:commentRss>
	
		<media:content url="http://a.wordpress.com/avatar/murielv-128.jpg" medium="image">
			<media:title type="html">muriel v</media:title>
		</media:content>

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/leluetlevu2.png?w=300" medium="image" />

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel1.png?w=300" medium="image">
			<media:title type="html">Le texte original</media:title>
		</media:content>

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel2.png?w=300" medium="image" />

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel3.png?w=300" medium="image" />

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel4.png?w=300" medium="image" />

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel5.png?w=300" medium="image" />

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel6.png?w=300" medium="image" />

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel7.png?w=300" medium="image" />

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel8.png?w=300" medium="image" />

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/visuel9.png?w=300" medium="image" />
	</item>
		<item>
		<title>Le vu et le lu (1)</title>
		<link>http://ecrirepourleweb.wordpress.com/2008/06/23/le-vu-et-le-lu-1/</link>
		<comments>http://ecrirepourleweb.wordpress.com/2008/06/23/le-vu-et-le-lu-1/#comments</comments>
		<pubDate>Mon, 23 Jun 2008 15:48:10 +0000</pubDate>
		<dc:creator>muriel vandermeulen</dc:creator>
		
		<category><![CDATA[Contraintes formelles]]></category>

		<category><![CDATA[Lisibilité]]></category>

		<category><![CDATA[balayabilité]]></category>

		<category><![CDATA[mode de lecture]]></category>

		<category><![CDATA[reconnaissance optique]]></category>

		<category><![CDATA[saccade oculaire]]></category>

		<category><![CDATA[Scannability]]></category>

		<guid isPermaLink="false">http://ecrirepourleweb.wordpress.com/?p=552</guid>
		<description><![CDATA[Je rebondis sur le billet que Jean-Marc a consacré à un récent article de Slate, inspiré par Denis Balencourt. L&#8217;article titré &#8220;How we read online&#8221; revient (étonnamment ?) sur des principes élémentaires de l&#8217;écriture sur le Web - ou devrais-je dire de la lecture sur le Web - telles que Jakob Nielsen, que l&#8217;auteur cite [...]]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/wordsshape5.png"><img class="alignnone size-medium wp-image-557 alignright" style="float:right;" src="http://ecrirepourleweb.files.wordpress.com/2008/06/wordsshape5.png?w=195&h=208" alt="" width="195" height="208" /></a><em><strong>Je rebondis sur le billet que Jean-Marc a consacré à un récent article de Slate, inspiré par Denis Balencourt. L&#8217;article titré &#8220;How we read online&#8221; revient (étonnamment ?) sur des principes élémentaires de l&#8217;écriture sur le Web - ou devrais-je dire de la lecture sur le Web - telles que Jakob Nielsen, que l&#8217;auteur cite d&#8217;ailleurs, nous les enseigne depuis plus de 15 ans.</strong></em></p>
<p>Dans la suite donc de ces deux billets francophones sur l&#8217;article &#8220;How we read&#8221; paru dans le magazine Slate, je propose deux billets : un premier sur notre mode de lecture &#8220;tout court&#8221; et un second, qui sortira dans le courant de la semaine, sur le mode de lecture en ligne.</p>
<p>Dans ce deuxième billet, je reviendrai sur quelques grandes références sur la question (Jakob Nielsen,  Steve Krug, etc.) et je vous donnerai un exemple pratique.  Mais procédons par procédure <img src='http://s.wordpress.com/wp-includes/images/smilies/icon_wink.gif' alt=';-)' class='wp-smiley' /> </p>
<h2>De la reconnaissance formelle ou comparative à un modèle mixte&#8230;</h2>
<p>Il serait intéressant, disais-je, avant que de commenter notre mode de lecture à l&#8217;écran, de revenir sur notre mode de lecture&#8230; tout court.</p>
<p>On a longtemps cru que la lecture se faisait via une reconnaissance optique de la forme des mots. D&#8217;aucuns ont priviligié le repérage sériel des lettres. Enfin, il a été question d&#8217;une identification parallèle des lettres&#8230; Revenons brièvement sur ces 3 modes de reconnaissance optique.</p>
<h3>La reconnaissance formelle</h3>
<p>Dans la littérature spécialisée, le plus ancien modèle de reconnaissance optique des mots prévoit que <strong>les mots sont reconnus en tant qu&#8217;unités totales</strong> [...] Nous reconnaissons les mots comme des séquences unifiées plutôt que comme la somme de lettres distinctes [...] Nous voyons ces séquences <strong>comme des images</strong> (qui nous évoquent des séquences que nos yeux ont déjà maintes fois repérées et enregistrées).</p>
<p style="text-align:center;"><a><img class="alignnone size-medium wp-image-554 aligncenter" src="http://ecrirepourleweb.files.wordpress.com/2008/06/wordsshape.png?w=371&h=166" alt="forme_des_mots" width="371" height="166" /></a></p>
<h3>Le repérage sériel</h3>
<p>Le modèle qui a le moins vécu est celui qui veut que nous lisons les mots lettre après lettre, de gauche à droite. Ce modèle de reconnaissance sérielle a surtout été un échec face au test de <strong>l&#8217;effet de supériorité du mot</strong>.</p>
<p>Ce concept d&#8217;Effet de supériorité du mot signifie que le lecteur est bien plus capable d&#8217;identifier des lettres quand elles sont mises dans un contexte (les mots) que lorsqu&#8217;elles sont isolées.</p>
<h3>La reconnaissance par comparaison</h3>
<p>Un 3e modèle de reconnaissance des mots repose sur un schéma de reconnaissance par comparaison (en anglais:<strong> parallel letter recognition model</strong>). Selon cette théorie, nous reconnaîtrions toutes les lettres d&#8217;un mot simultanément, et les informations contenues dans chaque lettre nous serviraient à reconnaître les mots.</p>
<p style="text-align:center;"><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/wordsshape3.png"><img class="alignnone size-medium wp-image-556 aligncenter" src="http://ecrirepourleweb.files.wordpress.com/2008/06/wordsshape3.png?w=300&h=185" alt="" width="300" height="185" /></a></p>
<h3>Le modèle mixte</h3>
<p>La théorie qui prévaudrait aujourd&#8217;hui est un modèle mixte : outre la reconnaissance perceptuelle (forme du mot &amp; reconnaissance des lettres par comparaison), nous recourons aussi aux informations contextuelles pour reconnaître les mots dans le processus de lecture.</p>
<h3>Le mouvement des yeux: entre saccades et fixations</h3>
<p>Lorsque nous lisons, nous bougeons continuellement les yeux. Nous faisons des <strong>saccades oculaires</strong>. Entre les saccades, les yeux restent immobiles ; ce sont des <strong>fixations</strong>.</p>
<p>Pendant les saccades, l&#8217;œil est pratiquement aveugle. Cela signifie qu&#8217;au cours d&#8217;une saccade nous ne capturons pas d&#8217;informations nouvelle de la phrase lue  par contre, il est vraisemblable que nous continuions le traitement commencé avant la saccade. L&#8217;information visuelle est donc extraite du texte pendant les fixations.</p>
<p style="text-align:center;"><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/wordsshape2.png"><img class="alignnone size-medium wp-image-555 aligncenter" src="http://ecrirepourleweb.files.wordpress.com/2008/06/wordsshape2.png?w=300&h=122" alt="" width="300" height="122" /></a></p>
<h2>Sources</h2>
<ul>
<li><a title="Lire l'article daté 2004 en anglais" href="http://www.microsoft.com/typography/ctfonts/WordRecognition.aspx#evid" target="_blank">The science of word recognition (article EN)</a></li>
<li><a title="Ouvrage paru chez Deboeck (2001)" href="http://universite.deboeck.com/livre/?GCOI=28011100658440&amp;fa=author&amp;person_id=2247&amp;publishergcoicode=28011" target="_blank"><span class="bookTitle">Cognition et lecture</span>, Processus de base de la reconnaissance des mots écrits chez l&#8217;adulte</a></li>
<li><a title="Lire l'article sur le site de la BBC" href="http://news.bbc.co.uk/2/hi/science/nature/6983176.stm" target="_blank">Hidden method of reading revealed</a></li>
<li><a title="Allez sur le blog où j'ai trouvé l'image" href="http://rectitudes.unblog.fr/2007/10/01/voir-et-lire/" target="_blank">Retrouver l&#8217;illustration de ce billet</a></li>
<li><a href="http://blog.60questions.net/index.php/2008/06/18/265-how-we-read-online" target="_blank">Le billet sur 60questions.net</a></li>
<li><a href="http://www.balencourt.com/blog/2008/06/16/how-we-read-online" target="_blank">Le billet sur le blog Denis au fil du Web</a></li>
</ul>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/ecrirepourleweb.wordpress.com/552/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/ecrirepourleweb.wordpress.com/552/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/ecrirepourleweb.wordpress.com/552/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/ecrirepourleweb.wordpress.com/552/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/ecrirepourleweb.wordpress.com/552/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/ecrirepourleweb.wordpress.com/552/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/ecrirepourleweb.wordpress.com/552/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/ecrirepourleweb.wordpress.com/552/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/ecrirepourleweb.wordpress.com/552/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/ecrirepourleweb.wordpress.com/552/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/ecrirepourleweb.wordpress.com/552/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/ecrirepourleweb.wordpress.com/552/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=ecrirepourleweb.wordpress.com&blog=617858&post=552&subd=ecrirepourleweb&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://ecrirepourleweb.wordpress.com/2008/06/23/le-vu-et-le-lu-1/feed/</wfw:commentRss>
	
		<media:content url="http://a.wordpress.com/avatar/murielv-128.jpg" medium="image">
			<media:title type="html">muriel v</media:title>
		</media:content>

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/wordsshape5.png?w=281" medium="image" />

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/wordsshape.png?w=300" medium="image">
			<media:title type="html">forme_des_mots</media:title>
		</media:content>

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/wordsshape3.png?w=300" medium="image" />

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/wordsshape2.png?w=300" medium="image" />
	</item>
		<item>
		<title>Sale temps pour les nuages!</title>
		<link>http://ecrirepourleweb.wordpress.com/2008/06/20/sale-temps-pour-les-nuages/</link>
		<comments>http://ecrirepourleweb.wordpress.com/2008/06/20/sale-temps-pour-les-nuages/#comments</comments>
		<pubDate>Fri, 20 Jun 2008 18:28:29 +0000</pubDate>
		<dc:creator>muriel vandermeulen</dc:creator>
		
		<category><![CDATA[Architecture]]></category>

		<category><![CDATA[Contraintes de fond]]></category>

		<category><![CDATA[Expérience utilisateur]]></category>

		<category><![CDATA[Web 2.0]]></category>

		<category><![CDATA[carewords]]></category>

		<category><![CDATA[folksonomie]]></category>

		<category><![CDATA[keywords]]></category>

		<category><![CDATA[mots-clés]]></category>

		<category><![CDATA[nuages de tags]]></category>

		<category><![CDATA[tagclouds]]></category>

		<category><![CDATA[tags]]></category>

		<guid isPermaLink="false">http://ecrirepourleweb.wordpress.com/?p=496</guid>
		<description><![CDATA[
Dans sa présentation &#8220;Do Real People Really Use Tag Clouds?&#8221;, Garrick Schmitt fournit des données statistiques sur l&#8217;utilisation réelle des nuages de tags par les internautes. Face aux acquis du Web 2.0 , la remise en question penche du côté de l&#8217;ergonomie. Résultats sont plutôt mitigés. 
Tics en tags&#8230;

L’architecture par mots-clés est un des grands [...]]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p><a href="http://www.flickr.com/photos/mademoisellejeanne/1397070207/" target="_blank"><img src="http://farm2.static.flickr.com/1172/1397070207_bb90b75865_m.jpg" alt="" align="right" /></a></p>
<p><em><strong>Dans sa présentation &#8220;Do Real People Really Use Tag Clouds?&#8221;, Garrick Schmitt fournit des données statistiques sur l&#8217;utilisation réelle des nuages de tags par les internautes. Face aux acquis du Web 2.0 , la remise en question penche du côté de l&#8217;ergonomie. Résultats sont plutôt mitigés. </strong></em></p>
<h2><span style="color:#800000;">Tics en tags&#8230;<br />
</span></h2>
<p>L’<strong>architecture par mots-clés</strong> est un des grands acquis du Web 2.0. Selon les observateurs et les concepteurs, ce type de système a vu le jour pour répondre au besoin croissant des internautes d’effectuer des <strong>r</strong><strong>echerches rapides et ciblées</strong>. Si c’est ainsi que fonctionnent depuis toujours les moteurs de recherche, d&#8217;autres moyens sont apparus pour exploiter les formes de navigation à partir du contenu.</p>
<p>Un de ces moyens, que j&#8217;affectionnais pas mal, est le <strong>nuage de mots-clés</strong>. Dit <em>tagcloud</em> en anglais, le nuage de mots-clés est une représentation visuelle des mots-clés (<em>tags</em>) les plus utilisés sur un site web. Il suffit de cliquer sur un mot du nuage pour accéder aux pages associées à ce mot. Le nuage attribue aux mots les plus cliqués une taille (et une couleur) de police plus grande. Soit dit en passant, ces mots-clés sont classés par ordre alphabétique pour plus de facilité de balayage.</p>
<p>Le principal atout de ce système par rapport à des outils de recherche internes traditionnels est qu’il <strong>suggère les termes </strong>de recherche aux visiteurs. C’est une façon pour lui de voir en un seul coup d’œil les grands<strong> concepts accessibles</strong>, et de ne pas passer à côté de ceux-ci à cause d’une formulation différente, et/ou d’un critère trop restrictif.</p>
<p>C&#8217;est du moins ce qu&#8217;on pensait jusqu&#8217;ici&#8230; Voyons plutôt les conclusions de l&#8217;enquête de Garrick Schmitt.</p>
<h2><span style="color:#800000;">&#8230; du toc !<br />
</span></h2>
<p>À première vue, les <strong>résultats sont accablants</strong>.</p>
<blockquote>
<ul>
<li>88% des internautes n&#8217;utiliseraient jamais ou rarement les nuages de tags</li>
<li>65% ne les utiliseraient jamais</li>
<li>68% les trouveraient inutiles</li>
</ul>
</blockquote>
<p>Ces chiffres sont tirés de l&#8217;étude &#8220;Digital Consumer Behavior Study&#8221; menée par Avenue A | Razorfish en juillet 2007 auprès de 475 internautes américains.</p>
<p>Il y a donc un <strong>décallage entre l&#8217;engouement des concepteurs et l&#8217;usage qu&#8217;en fait le surfeur moyen.</strong></p>
<p style="text-align:center;"><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/mots-cles.png"><img class="alignnone size-medium wp-image-531" src="http://ecrirepourleweb.files.wordpress.com/2008/06/mots-cles.png?w=477&h=206" alt="" width="477" height="206" /></a></p>
<p>Certains observateurs avaient déjà tempéré <strong>l&#8217;accessibilité de ces tags</strong> en remettant en cause leur principe théorique : à savoir le principe de la <strong>folksonomie.</strong> Ce néologisme, constitué à partir des mots « folks » (« gens » en anglais) et  « taxonomie » ou « taxinomie », renvoie à la manière dont l’information est organisée au sein d’une communauté on line.</p>
<p>Adulée en ses débuts, comme de nombreuses tendances du Web, la folksonomie a bien dû se confronter aux réalités de son utilisation. Le fait qu&#8217;il s&#8217;agisse d&#8217;un système de classification collaborative et spontanée sous-entendait déjà ceci à l&#8217;origine : <strong>tout le monde n&#8217;emploie pas les mêmes descripteurs</strong>.</p>
<p>J&#8217;avais apprécié, en son temps, le concept utilisé par Gerry McGovern en lieu et place des mots-clés. Pas de &#8220;keywords&#8221; dans son discours, mais bien des &#8220;careword&#8221;. Souvenons-nous:</p>
<blockquote><p>“Your customers have a small set of words that summarize what they care about. Find those words, and you’re half way to success… When people go to a search engine, are they more likely to type “low fares” or “cheap flights?”</p></blockquote>
<p>En d&#8217;autres mots, McGovern part du principe que les descripteurs utilisés par les internautes ne sont pas ceux que leur attribuent les concepteurs des sites. Mais que pense-t-il des folksonomies ? Croit-il également qu&#8217;un utilisateur &#8220;a&#8221; ne partage pas ses &#8220;carewords&#8221; avec un utilisateur &#8220;b&#8221; ou &#8220;c&#8221;.</p>
<p>Car, apparemment, le discrédit qui pèse sur ce mode de recherche semble lourd. Non seulement ces systèmes seraient aléatoires, mais en plus ils n&#8217;auraient pas d&#8217;utilité et ne seraient là <strong>que pour la décoration</strong>. D&#8217;aucuns diront : c&#8217;est déjà ça!</p>
<h2><span style="color:#800000;">Liens utiles</span></h2>
<ul>
<li><a href="http://www.slideshare.net/gschmitt/do-real-people-really-use-tag-clouds" target="_blank">La présentation &#8220;Do Real People Really Use Tag Clouds?&#8221; de Garrick Schmitt</a></li>
<li><a href="http://s.billard.free.fr/referencement/?2008/04/16/476-des-statistiques-sur-lutilisation-des-tag-clouds" target="_blank">La publication sur Référencement, Design et Cie</a></li>
<li><a href="http://ecrirepourleweb.wordpress.com/2008/04/25/typographie-et-web/" target="_blank">Typographie et Web</a></li>
<li><a href="http://ecrirepourleweb.wordpress.com/2007/10/05/contenu-et-credibilite-5-customisez-lexperience-de-vos-utilisateurs/" target="_blank">Customisez l&#8217;expérience de vos utilisateurs</a></li>
<li><a title="Lire le billet" href="http://ecrirepourleweb.wordpress.com/2007/05/02/loeil-le-cerveau/" target="_blank">L&#8217;oeil, le cerveau (ancien billet sur les carewords)</a></li>
<li><a title="Consultez cet outil en ligne et familiarisez-vous avec le concept" href="http://www.mozbot.fr/" target="_blank">Exercez vous à créer des nuages de mots-clés à partir de vos pages Web</a></li>
<li><a title="Faites de beaux nuages de mots-clés" href="http://wordle.net/" target="_blank">Wordle, beautiful word clouds</a></li>
</ul>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/ecrirepourleweb.wordpress.com/496/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/ecrirepourleweb.wordpress.com/496/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/ecrirepourleweb.wordpress.com/496/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/ecrirepourleweb.wordpress.com/496/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/ecrirepourleweb.wordpress.com/496/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/ecrirepourleweb.wordpress.com/496/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/ecrirepourleweb.wordpress.com/496/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/ecrirepourleweb.wordpress.com/496/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/ecrirepourleweb.wordpress.com/496/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/ecrirepourleweb.wordpress.com/496/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/ecrirepourleweb.wordpress.com/496/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/ecrirepourleweb.wordpress.com/496/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=ecrirepourleweb.wordpress.com&blog=617858&post=496&subd=ecrirepourleweb&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://ecrirepourleweb.wordpress.com/2008/06/20/sale-temps-pour-les-nuages/feed/</wfw:commentRss>
	
		<media:content url="http://a.wordpress.com/avatar/murielv-128.jpg" medium="image">
			<media:title type="html">muriel v</media:title>
		</media:content>

		<media:content url="http://farm2.static.flickr.com/1172/1397070207_bb90b75865_m.jpg" medium="image" />

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/mots-cles.png?w=300" medium="image" />
	</item>
		<item>
		<title>Les 10 dogmes du Web</title>
		<link>http://ecrirepourleweb.wordpress.com/2008/06/18/les-10-dogmes-du-web/</link>
		<comments>http://ecrirepourleweb.wordpress.com/2008/06/18/les-10-dogmes-du-web/#comments</comments>
		<pubDate>Wed, 18 Jun 2008 15:24:39 +0000</pubDate>
		<dc:creator>muriel vandermeulen</dc:creator>
		
		<category><![CDATA[Architecture]]></category>

		<category><![CDATA[Expérience utilisateur]]></category>

		<category><![CDATA[Utilisabilité]]></category>

		<category><![CDATA[Web 2.0]]></category>

		<category><![CDATA[accessibilité]]></category>

		<category><![CDATA[design]]></category>

		<category><![CDATA[service]]></category>

		<guid isPermaLink="false">http://ecrirepourleweb.wordpress.com/?p=503</guid>
		<description><![CDATA[Une interview d&#8217;Eric Reiss, intitulée &#8220;Dogmas Are Meant to be Broken&#8221; et parue il y a quelques temps dans le journal en ligne Boxs and Arrows, propose 10 règles absolues ou dogmes du design Web.
Ces contraintes ne sont bien sûr pas, par définition, pour plaire à tout le monde : tout d&#8217;abord, car elles ont [...]]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p><a href="http://www.flickr.com/photos/cjb22222222/756589978/"><img src="http://farm2.static.flickr.com/1177/756589978_f9128335d1_m.jpg" alt="" align="right" /></a><em><strong>Une interview d&#8217;Eric Reiss, intitulée &#8220;Dogmas Are Meant to be Broken&#8221; et parue il y a quelques temps dans le journal en ligne Boxs and Arrows, propose 10 règles absolues ou dogmes du design Web.</strong></em></p>
<p>Ces contraintes ne sont bien sûr pas, par définition, pour plaire à tout le monde : tout d&#8217;abord, car elles ont à coeur de <strong>tempérer certains excès créatifs</strong> au profit de l&#8217;accessibilité.</p>
<p>C&#8217;est également dans ce sens que <em>Social Computing Magazine</em> envisage la recréation de la relation que les entreprises entretiennent ou souhaitent entretenir avec leurs clients sur le Web.</p>
<p>Les maîtres mots restent toujours : <strong>le service, la clarté et l&#8217;interactivité</strong> optimisés. Tout doit aller dans le sens d&#8217;une réflexion désengagée de tout autre enjeu.</p>
<p>Voici donc la liste de ces commandements:</p>
<ol>
<li>éliminer tout ce qui n&#8217;est là que pour complaire la <strong>politique interne du client</strong></li>
<li>éliminer tout ce qui n&#8217;est là que pour satisfaire l&#8217;<strong>ego des designer/développeurs</strong></li>
<li>éliminer tout ce qui est sans lien avec l&#8217;<strong>objet de la page</strong></li>
<li>éliminer ou adapter toute fonctionnalité qui réduit la <strong>liberté de navigation</strong> de l&#8217;internaute</li>
<li>éliminer ou adapter toute fonctionnalité représentant une <strong>difficulté d&#8217;utilisation</strong> pour l&#8217;internaute</li>
<li>éliminer tout ce qui nécessite l&#8217;installation d&#8217;un <strong>logiciel supplémentaire </strong></li>
<li>veiller à ce que tout le contenu puisse être <strong>lu, imprimé, sauvegardé</strong> en local</li>
<li>veiller à ne pas sacrifier l&#8217;<strong>utilisabilité</strong> au profit de la charte graphique</li>
<li>veiller à ne pas demander plus d&#8217;<strong>informations</strong> que nécessaires à un utilisateur pour pouvoir s&#8217;enregistrer sur le site</li>
<li>mieux vaut violer ces règles que d&#8217;essayer d&#8217;inventer des <strong>solutions barbares</strong></li>
</ol>
<h2>Liens utiles</h2>
<ul>
<li><a href="http://www.boxesandarrows.com/view/dogmas_are_mean">L&#8217;interview d&#8217;Eric Reiss</a></li>
<li><a href="http://www.clochix.net/post/2006/06/16/37-les-10-commandements-du-web-en-2006-et-autres-conseils-de-design" target="_blank">Le billet de Clochix à propos de l&#8217;interview</a></li>
<li><a href="http://web2.wsj2.com/five_techniques_for_using_web_20_to_reinvent_the_customer_re.htm" target="_blank">Les 5 conseils de Social Computing Magazine</a></li>
<li><a href="http://ecrirepourleweb.wordpress.com/2008/01/03/des-contraintes-aux-libertes-de-lecrit-web/" target="_blank">Des contraintes aux libertés de l’écrit web</a></li>
<li><a href="http://ecrirepourleweb.wordpress.com/?s=lisibilité" target="_blank">La règle des trois “R”</a></li>
</ul>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/ecrirepourleweb.wordpress.com/503/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/ecrirepourleweb.wordpress.com/503/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/ecrirepourleweb.wordpress.com/503/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/ecrirepourleweb.wordpress.com/503/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/ecrirepourleweb.wordpress.com/503/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/ecrirepourleweb.wordpress.com/503/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/ecrirepourleweb.wordpress.com/503/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/ecrirepourleweb.wordpress.com/503/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/ecrirepourleweb.wordpress.com/503/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/ecrirepourleweb.wordpress.com/503/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/ecrirepourleweb.wordpress.com/503/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/ecrirepourleweb.wordpress.com/503/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=ecrirepourleweb.wordpress.com&blog=617858&post=503&subd=ecrirepourleweb&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://ecrirepourleweb.wordpress.com/2008/06/18/les-10-dogmes-du-web/feed/</wfw:commentRss>
	
		<media:content url="http://a.wordpress.com/avatar/murielv-128.jpg" medium="image">
			<media:title type="html">muriel v</media:title>
		</media:content>

		<media:content url="http://farm2.static.flickr.com/1177/756589978_f9128335d1_m.jpg" medium="image" />
	</item>
		<item>
		<title>Tous égaux devant la home page</title>
		<link>http://ecrirepourleweb.wordpress.com/2008/06/11/tous-egaux-devant-la-home-page/</link>
		<comments>http://ecrirepourleweb.wordpress.com/2008/06/11/tous-egaux-devant-la-home-page/#comments</comments>
		<pubDate>Wed, 11 Jun 2008 07:17:03 +0000</pubDate>
		<dc:creator>muriel vandermeulen</dc:creator>
		
		<category><![CDATA[Contraintes de fond]]></category>

		<category><![CDATA[Home page]]></category>

		<category><![CDATA[Web 2.0]]></category>

		<category><![CDATA[A List Apart]]></category>

		<category><![CDATA[New York Times]]></category>

		<guid isPermaLink="false">http://ecrirepourleweb.wordpress.com/?p=510</guid>
		<description><![CDATA[J’avais promis de revenir sur la question du déclin (ou non) de la page d’accueil. Je prends donc enfin le temps de  conclure. Je ne pense pas que la home page soit morte. Non seulement, les pages façon Netvibes n’ont pas encore supplanté la page d’accueil, mais je pense même qu&#8217;elles ne le pourront [...]]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/totem.png"><img class="alignnone size-medium wp-image-527 alignright" style="float:right;" src="http://ecrirepourleweb.files.wordpress.com/2008/06/totem.png?w=148&h=217" alt="" width="148" height="217" /></a><em><strong>J’avais promis de revenir sur la question du déclin (ou non) de la page d’accueil. Je prends donc enfin le temps de  conclure. Je ne pense pas que la home page soit morte. Non seulement, les pages façon Netvibes n’ont pas encore supplanté la page d’accueil, mais je pense même qu&#8217;elles ne le pourront jamais. Car leur utilité n&#8217;est pas la même. </strong></em></p>
<p>Enfin, la page d’accueil continue de porter son nom à juste titre, si l’on admet qu’elle accueille surtout les prospects et les premiers visiteurs, et qu’elle reste la plus visitée. Ce n&#8217;est pas une page d&#8217;entrée, mais cela reste une page d&#8217;accueil, une page racine comme dirait Jean-Marc - un peu comme le totem indicateur dans les centres commerciaux.<br />
￼</p>
<h2>Petit préambule sur les pages personnalisables</h2>
<p>Netvibes et consorts sont des portails Web personnalisables. Ils permettent aux utilisateurs de construire un site web personnel agrégé, constitué par des pages onglets, elles-mêmes alimentées par des contenus extérieurs. En d&#8217;autres mots, ce sont donc des portails web individuels qui donnent accès à une multitude de services</p>
<p>Il existe une fâcheuse tendance à amalgamer ces outils, que j&#8217;appelle généralement les pages personnalisables,  et les pages d&#8217;accueil. Et pourtant, un élément les distingue nettement : le contenu.</p>
<h2>Le contenu : dénominateur séparateur</h2>
<p>Une page personnalisable rassemble, une fois qu&#8217;elle a été personnalisée, des contenus choisis exclusivemnt par le titulaire de la page :</p>
<ul>
<li>son blog,</li>
<li>une revue de presse</li>
<li>les prévisions météo</li>
<li>les dernières photos Flickr sur un thème,</li>
<li>des outils de recherche</li>
<li>un agrégateur de blogs,</li>
<li>etc.</li>
</ul>
<p>Rares sont les pages d&#8217;accueil (et le commanditaire n&#8217;y trouverait d&#8217;ailleurs pas d&#8217;intérêt) qui ne proposent que des contenus tiers, agrégés et disposés selon la seule volonté de l&#8217;utilisateur. Même la BBC, lorsqu&#8217;elle propose à l&#8217;internaute, de personnaliser la page d&#8217;accueil de son site Web, lui met à disposition des blocs qu&#8217;elle seule gère et actualise. Nous sommes donc tous égaux devant la page d&#8217;accueil puisqu&#8217;en tant qu&#8217;utilisateur, on fait exclusivement son choix parmi des contenus dont la BBC est propriétaire. En témoigne le slogan sur la page générique du bloc &#8220;Blogs&#8221; sur le site de la BBC :</p>
<h3 style="text-align:center;">&#8220;Find and talk to the BBC&#8217;s bloggers.&#8221;</h3>
<p>L&#8217;utilisateur ne peut que choisir d&#8217;afficher les dernières billets issus de blogs signés par des journalistes ou autres collaborateurs de la BBC.</p>
<p>Un bon exemple qui illustre que la page d&#8217;accueil n&#8217;est pas la page personnalisable d&#8217;un site Web est celui du New York Times. Vous constatez que les 2 premiers onglets sont : HOME - MY TIMES. Il y a donc bien 2 pages distinctes. L&#8217;une est la page d&#8217;accueil, l&#8217;autre le port d&#8217;attache ?</p>
<p style="text-align:center;"><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/mytimes.png"><img class="alignnone size-medium wp-image-526 aligncenter" src="http://ecrirepourleweb.files.wordpress.com/2008/06/mytimes.png?w=461&h=303" alt="" width="461" height="303" /></a></p>
<h2>Page d&#8217;accueil devenue port d&#8217;attache ?</h2>
<p>Tous les sites ne proposent pas une page personnalisable en plus de la page d&#8217;accueil. Néanmoins, on assiste bel et bien à une transformation de la page d&#8217;accueil. Car il va de soi qu&#8217;il ne faut pas limiter l&#8217;utilité de la homepage aux premiers visiteurs ou aux prospects.</p>
<p>Elle doit aussi servir aux visiteurs récurrents, voire fidèles. Et ne pas perdre son taux de fréquentation, encore élevé quoiqu&#8217;en disent certains (c&#8217;est ce que confirme d&#8217;ailleurs Jean-Marc dans un article en réaction à la discussion que j&#8217;ai lancé). Au fait, vous connaissez cette citation ?</p>
<blockquote><p>Before I get into those goals, here’s a grain of salt. Every site I’ve ever worked on has had strikingly similar traffic trends, and one stands out. Remember that smallest, deepest element I described earlier? This is the atomic element—for a news site, it’s the story page; for a search engine, it’s the search result; for a store, it’s a product page. This page accounts for 60 to 75 percent of all page views on the site. The rest belong to the home page.</p>
<p>This is not to say that the home page is unimportant—it’s hugely important as a first impression. But looking at the numbers, you’ll get far more bang out of tweaks to the atomic element pages than the home page.</p>
<p style="text-align:right;">Derek Powazek, sur <a title="Lire l'article entier" href="http://www.alistapart.com/articles/homepagegoals/" target="_blank">AListApart</a></p>
<h3 class="byline"><a href="http://www.alistapart.com/authors/p/derekpowazek"></a></h3>
</blockquote>
<p>A cet effet, on voit de plus en plus les pages d&#8217;accueil afficher des outils et modules actualisables, censés attirer l&#8217;utilisateur droitaubutiste : les nuages de mots-clés, les pages les plus visitées, les dernières infos actualisées en continu, un calendrier des événements, une fonction de recherche ergonomique, etc.</p>
<p>Certes, certains de ces outils proviennent tout droit du concept participatif du Web 2.0, et ce sont donc les internautes qui créent les incitants à la navigation pour les utilisateurs suivants. Mais le contenu reste généré par le propriétaire du site.</p>
<p>Liens rapides</p>
<ul>
<li><a title="Ayez votre page propre sur le New York Times" href="http://www.nytimes.com/gst/betamail.html?URI=http://my.nytimes.com/&amp;OQ=_rQ3D1&amp;OP=30d21ee2Q2FgFPJg0jnPt9zg-nstXX0UgzfnJPntX8DnP-nP9gzfnjzP0Q60Q51nzA" target="_blank">MyTimes</a></li>
<li><a title="Ceci est une page d'accueil" href="http://www.bbc.co.uk/home/" target="_blank">La home page de la BBC</a></li>
</ul>
<p>Les articles précédents sur le sujet</p>
<ul>
<li><a href="../2008/04/28/quel-nom-pour-la-page-daccueil/">Quel nom pour la page d’accueil ?</a></li>
<li> <a href="../2008/04/22/page-daccueil-la-mal-nommee/">Page d’accueil, la mal nommée ?</a></li>
<li> <a href="../2008/04/17/le-grand-declin-de-la-home-page/">Le grand déclin de la home page</a></li>
</ul>
<p>L&#8217;auteur de l&#8217;image <a title="Sur Flickr" href="http://www.flickr.com/photos/8140750@N06/" target="_blank">Totem</a></p>
<p>Chez les pairs:</p>
<ul>
<li><a href="http://blog.barbayellow.com/2008/05/24/les-3-pages-cles-sur-un-site-2-page-darticle-vs-page-daccueil/">Les 3 pages clés sur un site (2) : page d’article vs page d’accueil</a></li>
<li><a href="http://weboflife.free.fr/?p=91">Home page bientôt tu ne seras plus</a></li>
<li><a href="//blog.60questions.net/index.php/2008/04/18/243-la-homepage-en-declin" target="_blank">La homepage: en déclin?</a></li>
</ul>
<p>Clin d&#8217;oeil</p>
<p>Vu chez Jean-Marc - ça c&#8217;est de la home page personnalisée <img src='http://s.wordpress.com/wp-includes/images/smilies/icon_wink.gif' alt=';-)' class='wp-smiley' /> </p>
<ul>
<li><a class="h4" href="http://blog.60questions.net/index.php/2008/06/05/261-virez-la-pub-de-vos-sites-web">Virez la pub de vos sites web !</a></li>
</ul>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/ecrirepourleweb.wordpress.com/510/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/ecrirepourleweb.wordpress.com/510/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/ecrirepourleweb.wordpress.com/510/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/ecrirepourleweb.wordpress.com/510/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/ecrirepourleweb.wordpress.com/510/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/ecrirepourleweb.wordpress.com/510/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/ecrirepourleweb.wordpress.com/510/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/ecrirepourleweb.wordpress.com/510/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/ecrirepourleweb.wordpress.com/510/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/ecrirepourleweb.wordpress.com/510/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/ecrirepourleweb.wordpress.com/510/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/ecrirepourleweb.wordpress.com/510/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=ecrirepourleweb.wordpress.com&blog=617858&post=510&subd=ecrirepourleweb&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://ecrirepourleweb.wordpress.com/2008/06/11/tous-egaux-devant-la-home-page/feed/</wfw:commentRss>
	
		<media:content url="http://a.wordpress.com/avatar/murielv-128.jpg" medium="image">
			<media:title type="html">muriel v</media:title>
		</media:content>

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/totem.png?w=204" medium="image" />

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/mytimes.png?w=300" medium="image" />
	</item>
		<item>
		<title>3 outils Web 2 à la loupe</title>
		<link>http://ecrirepourleweb.wordpress.com/2008/06/10/3-outils-web2-a-la-loupe/</link>
		<comments>http://ecrirepourleweb.wordpress.com/2008/06/10/3-outils-web2-a-la-loupe/#comments</comments>
		<pubDate>Tue, 10 Jun 2008 18:58:49 +0000</pubDate>
		<dc:creator>muriel vandermeulen</dc:creator>
		
		<category><![CDATA[Architecture]]></category>

		<category><![CDATA[Outils &amp; Widgets]]></category>

		<category><![CDATA[Web 2.0]]></category>

		<category><![CDATA[bloguer]]></category>

		<category><![CDATA[fonte]]></category>

		<category><![CDATA[google]]></category>

		<category><![CDATA[plan de site]]></category>

		<category><![CDATA[police de caractère]]></category>

		<category><![CDATA[sitemap]]></category>

		<guid isPermaLink="false">http://ecrirepourleweb.wordpress.com/?p=507</guid>
		<description><![CDATA[Une fois n&#8217;est pas coutume : je vous livre aujourd&#8217;hui 3 petits outils que j&#8217;ai découverts dernièrement.
 
WriteMaps est un outil web gratuit qui vous permet, comme son nom le suggère, de créer, modifier et partager des plans de site en ligne. Vous pouvez sauver (même localement) votre travail, l&#8217;exporter ou en importer un précédent [...]]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><address><a href="http://ecrirepourleweb.files.wordpress.com/2008/06/writemaps1.png"><img class="alignnone size-medium wp-image-522 alignright" style="float:right;" src="http://ecrirepourleweb.files.wordpress.com/2008/06/writemaps1.png?w=190&h=152" alt="" width="190" height="152" /></a><strong>Une fois n&#8217;est pas coutume : je vous livre aujourd&#8217;hui 3 petits outils que j&#8217;ai découverts dernièrement.</strong></address>
<address> </address>
<p><strong>WriteMaps</strong> est un outil web gratuit qui vous permet, comme son nom le suggère, de créer, modifier et partager des plans de site en ligne. Vous pouvez sauver (même localement) votre travail, l&#8217;exporter ou en importer un précédent - en copiant collant le code source <img src='http://s.wordpress.com/wp-includes/images/smilies/icon_sad.gif' alt=':-(' class='wp-smiley' /> . Un petit outil bien pratique, donc. Naturellement, vous devez vous enregistrer pour l&#8217;utiliser. Rien n&#8217;est vraiment gratuit.</p>
<p><a title="Accédez au site de WriteMaps." href="http://writemaps.com/" target="_blank">Visitez le site</a> &gt;</p>
<p><strong>TouchGraph Google Browser </strong>est un outil web gratuit, qui outil qui permet l’analyse de sites similaires (aussi appelée analyse d’écosystème) au crible de Google. La recherche se fait via la commande &#8220;related&#8221;. Par contre, je n&#8217;ai pas trouvé comment Google estime qu&#8217;une page est similaire à une autre.</p>
<p>Différentes fonctionnalités sont fournies: déplacements, zoom, nombre de niveaux de recherche, &#8230; Une infobulle apparaît au survol de chaque noeud : titre, URL, description, etc. Sans oublier l&#8217;option qui permet de définir le nombre de niveaux de parentés.</p>
<p><a title="Essayez l'outil" href="http://www.touchgraph.com/TGGoogleBrowser.html" target="_blank">Découvrez l&#8217;outil</a> &gt;</p>
<p><strong>Fontburner</strong> vous permet de personnaliser la police que vous utilisez sur votre blog. L&#8217;outil a l&#8217;avantage d&#8217;être simple à utiliser. Inconvénient, par contre : il n&#8217;est pas installé en local. Mais&#8230; un plugin WordPress devrait bientôt voir les jours pour les WordPressiens aficionados de la typo&#8230; <span class="chapeau"> </span></p>
<p><a title="Un outil de personnalisation de fontes pour le Web" href="http://www.fontburner.com" target="_blank">Choisissez votre police préférée pour bloguer &gt;</a></p>
<p><!--/entry --> <!-- You can start editing here. --></p>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/ecrirepourleweb.wordpress.com/507/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/ecrirepourleweb.wordpress.com/507/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/ecrirepourleweb.wordpress.com/507/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/ecrirepourleweb.wordpress.com/507/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/ecrirepourleweb.wordpress.com/507/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/ecrirepourleweb.wordpress.com/507/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/ecrirepourleweb.wordpress.com/507/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/ecrirepourleweb.wordpress.com/507/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/ecrirepourleweb.wordpress.com/507/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/ecrirepourleweb.wordpress.com/507/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/ecrirepourleweb.wordpress.com/507/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/ecrirepourleweb.wordpress.com/507/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=ecrirepourleweb.wordpress.com&blog=617858&post=507&subd=ecrirepourleweb&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://ecrirepourleweb.wordpress.com/2008/06/10/3-outils-web2-a-la-loupe/feed/</wfw:commentRss>
	
		<media:content url="http://a.wordpress.com/avatar/murielv-128.jpg" medium="image">
			<media:title type="html">muriel v</media:title>
		</media:content>

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/06/writemaps1.png?w=300" medium="image" />
	</item>
		<item>
		<title>Hiérarchie (visuelle) de l&#8217;information (textuelle)</title>
		<link>http://ecrirepourleweb.wordpress.com/2008/06/08/lentonnoir-du-contenu-web/</link>
		<comments>http://ecrirepourleweb.wordpress.com/2008/06/08/lentonnoir-du-contenu-web/#comments</comments>
		<pubDate>Sun, 08 Jun 2008 18:05:34 +0000</pubDate>
		<dc:creator>muriel vandermeulen</dc:creator>
		
		<category><![CDATA[Contraintes de fond]]></category>

		<category><![CDATA[Contraintes formelles]]></category>

		<category><![CDATA[Utilisabilité]]></category>

		<category><![CDATA[hiérarchie de l'information]]></category>

		<category><![CDATA[macro contenu]]></category>

		<category><![CDATA[micro contenu]]></category>

		<category><![CDATA[pyramide inversée]]></category>

		<category><![CDATA[Steve Krug]]></category>

		<guid isPermaLink="false">http://ecrirepourleweb.wordpress.com/?p=479</guid>
		<description><![CDATA[J&#8217;ai déjà évoqué les micro et les macro contenus, la pyramide inversée, les gabarits de pages web, etc. Tout cela pour dire que vos pages de contenu doivent fonctionner comme un entonnoir. Entre micro- et macro contenu, c&#8217;est cette structure, cette hiérarchie qui va guider les lecteurs dans vos pages.
Sur toutes les pages de votre [...]]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><address><img class="alignright" style="float:right;" src="http://mgnt.khm.de:8080/images/webdev/scannotread.gif" alt="Steve Krug We dont read we scan" width="423" height="216" /><strong>J&#8217;ai déjà évoqué les micro et les macro contenus, la pyramide inversée, les gabarits de pages web, etc. Tout cela pour dire que vos pages de contenu doivent fonctionner comme un </strong><strong>entonnoir. Entre micro- et macro contenu, c&#8217;est cette structure, cette hiérarchie qui va guider les lecteurs dans vos pages.</strong></address>
<p>Sur toutes les pages de votre site, présentez vos contenus de la façon la plus cohérente possible. Pensez toujours à la hiérarchie des informations, aux messages essentiels à faire passer sur les pages, et à la structure de votre plan de contenu pour chacune des pages et sous-pages également.</p>
<h2>Vos guides de lecture</h2>
<p><strong>Les titres : </strong>Clairs, courts, explicatifs. Plus de la moitié de vos lecteurs quitteront votre page si elle ne comporte pas de titre, ou si celui-ci ne décrit pas clairement le contenu de la page.</p>
<p><strong>Les intertitres : </strong>Capter l&#8217;attention, c&#8217;est bien. La conserver, c&#8217;est mieux. L&#8217;inter-titre vous permet de rattraper un lecteur qui allait quitter la page. Vous pouvez placer un inter-titre tous les 4 à 6 paragraphes. Cette habitude va vous permettre de mieux construire vos pages et d&#8217;ordonner les paragraphes en groupes cohérents. D&#8217;autant que les intertitres peuvent servir d&#8217;index pour des contenus longs (+ de 3 écrans).</p>
<p><strong>Les accroches : </strong>Situées sous le titre (en caractère gras, de préférence), les accroches permettent aux lecteurs de vérifier, en quelques mots, que le contenu proposé correspond bien à ce qu&#8217;ils recherchent. L&#8217;accroche résume l&#8217;essentiel de votre page en 2 à 5 lignes. Elle répond aux fameuses questions &#8220;Who, what, when, why, where, how&#8221;.</p>
<p><strong>Les chandelles </strong>: Il arrive de plus en plus qu&#8217;une page Web propose 2 niveaux de contenus. Ce à des fins de simplification de la langue, d&#8217;optimisation du référencement ou d&#8217;universalisation de l&#8217;information. Ces contenus doivent être simples, distincts du contenu principal, courts et faciles à balayer</p>
<p><strong>Les paragraphes : </strong>Ne développez qu&#8217;une seule idée par paragraphe. Espacez vos paragraphes. Organisez vos idées logiquement, par mot-clé. En suivant le même ordre que dans votre accroche. N&#8217;hésitez pas à alléger vos contenus. Comme dirait Steve Krugs, &#8220;omit <span style="text-decoration:line-through;">useless</span> words&#8221;.</p>
<p><strong>Les liens (rapides</strong>) : de préférence rassemblés en bout de page (soit, parfois, après 2 ou 3 écrans) ou dans une colonne latérale de l&#8217;écran, les liens donnent des accès vers des informations (internes ou externes au site) apparentées au contenu traité dans la page. Ils doivent être clairs, distinctifs et correctement syntaxés.</p>
<p>Liens rapides</p>
<ul>
<li><a title="Accédez au contenu de l'article sur le site dédié" href="http://www.dismoitic.net/article.php3?id_article=13" target="_blank">La mise en page et ses règles</a>, un article sur le site pédagogique DismoiTIC.net</li>
<li><a title="Accédez au site Redaction.be" href="http://www.redaction.be/instructions/organiser.htm" target="_blank">Comment organiser son contenu</a>, un ancien article toujours pertinent de Jean-Marc</li>
<li><a title="Lire l'article en anglais" href="http://ecrirepourleweb.wordpress.com/2008/04/08/dont-make-me-think/" target="_blank">Un mien ancien article sur le légendaire &#8220;Don&#8217;t make me think&#8221; de Steve Krug (EN)</a>. Je n&#8217;ai toujours pas eu le temps de le traduire. C&#8217;est pour bientôt <img src='http://s.wordpress.com/wp-includes/images/smilies/icon_wink.gif' alt=';-)' class='wp-smiley' /> </li>
<li><a title="Voir la simulation avec Ecrire pour le Web" href="http://www.gwix.net/winstat/index.asp?u=ecrirepourleweb.wordpress.com" target="_blank">Un petit outil sympa</a> chez Laurent Goffin, qui vous montre les zones les plus visibles et donc cliquables de votre site.</li>
</ul>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/ecrirepourleweb.wordpress.com/479/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/ecrirepourleweb.wordpress.com/479/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/ecrirepourleweb.wordpress.com/479/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/ecrirepourleweb.wordpress.com/479/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/ecrirepourleweb.wordpress.com/479/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/ecrirepourleweb.wordpress.com/479/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/ecrirepourleweb.wordpress.com/479/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/ecrirepourleweb.wordpress.com/479/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/ecrirepourleweb.wordpress.com/479/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/ecrirepourleweb.wordpress.com/479/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/ecrirepourleweb.wordpress.com/479/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/ecrirepourleweb.wordpress.com/479/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=ecrirepourleweb.wordpress.com&blog=617858&post=479&subd=ecrirepourleweb&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://ecrirepourleweb.wordpress.com/2008/06/08/lentonnoir-du-contenu-web/feed/</wfw:commentRss>
	
		<media:content url="http://a.wordpress.com/avatar/murielv-128.jpg" medium="image">
			<media:title type="html">muriel v</media:title>
		</media:content>

		<media:content url="http://mgnt.khm.de:8080/images/webdev/scannotread.gif" medium="image">
			<media:title type="html">Steve Krug We dont read we scan</media:title>
		</media:content>
	</item>
		<item>
		<title>Ils faisaient du Web 2.0 sans le savoir&#8230;</title>
		<link>http://ecrirepourleweb.wordpress.com/2008/06/01/ils-faisaient-du-web-20-sans-le-savoir/</link>
		<comments>http://ecrirepourleweb.wordpress.com/2008/06/01/ils-faisaient-du-web-20-sans-le-savoir/#comments</comments>
		<pubDate>Sun, 01 Jun 2008 20:50:28 +0000</pubDate>
		<dc:creator>muriel vandermeulen</dc:creator>
		
		<category><![CDATA[Contraintes de fond]]></category>

		<category><![CDATA[Web 2.0]]></category>

		<category><![CDATA[Ajax]]></category>

		<category><![CDATA[Delicious]]></category>

		<category><![CDATA[Facebook]]></category>

		<category><![CDATA[Flickr]]></category>

		<category><![CDATA[iGoogle]]></category>

		<category><![CDATA[LinkedIn]]></category>

		<category><![CDATA[Mashups]]></category>

		<category><![CDATA[MySpace]]></category>

		<category><![CDATA[Netvibes]]></category>

		<category><![CDATA[RSS]]></category>

		<guid isPermaLink="false">http://ecrirepourleweb.wordpress.com/?p=500</guid>
		<description><![CDATA[ 
Je donnais récemment, via AGConsult, une formation Kluwer sur le thème &#8220;Votre projet Web 2.0&#8243;. Les participants étaient surtout soucieux d&#8217;avoir une définition du Web 2.0 - surtout du &#8220;point zéro&#8221; (sic) - et de savoir si, au fond, ils ne faisaient pas, comme Monsieur Jourdain de la prose, du Web 2.0 sans le [...]]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><address> </address>
<address><a href="http://ecrirepourleweb.files.wordpress.com/2008/05/monsieurjourdain20.png"><img class="alignnone size-medium wp-image-501 alignright" style="float:right;" src="http://ecrirepourleweb.files.wordpress.com/2008/05/monsieurjourdain20.png?w=187&h=300" alt="" width="187" height="300" /></a><strong>Je donnais récemment, via AGConsult, une formation Kluwer sur le thème &#8220;Votre projet Web 2.0&#8243;. Les participants étaient surtout soucieux d&#8217;avoir une définition du Web 2.0 - surtout du &#8220;point zéro&#8221; (sic) - et de savoir si, au fond, ils ne faisaient pas, comme Monsieur Jourdain de la prose, du Web 2.0 sans le savoir.</strong></address>
<address> </address>
<p>Qu&#8217;est-ce que le Web 2.0 ? Est-ce que &#8220;ça&#8221; existe vraiment ? Est-ce que c&#8217;est derrière nous ? Pourquoi alors parle-t-on déjà de Web 3.0 ? Ces questions sont peut-être éculées pour certains, mais elles sont encore parfaitement actuelles pour les clients que je rencontre au quotidien et qui essaient d&#8217;adapter leurs projets Web au présent toujours mouvant du média, mais aussi aux besoins  et exigences des utilisateurs finaux.</p>
<p>Rappelons que ce sont eux, d&#8217;ailleurs, les premiers acteurs et les grands gagnants de cette (r)évolution appelée Web 2.0, ces utilisateurs finaux. Et que ce que <a title="Lire l'interview de Cavazza sur deuxzero.com" href="http://www.deuxzero.com/2006/11/le_web_20_selon_fred_cavazza.html" target="_blank">prévoyait</a> Fred Cavazza il y a près de 2 ans vaut toujours :</p>
<blockquote><p>&#8220;Le potentiel qui se cache derrières ces nombreux concepts se découvre au fur et à mesure. Comprenez par là que nous n&#8217;en sommes qu&#8217;au début d&#8217;une ère nouvelle où les utilisateurs vont pouvoir décider des contenus et fonctionnalités qu&#8217;ils vont consommer, à défaut ils les créeront eux-mêmes. Tous les services et outils permettant de concrétiser ce paradigme sont encore loin d&#8217;être finalisés.&#8221;</p></blockquote>
<p>En quelques mots, je rappelle les grands axes de le séminaire d&#8217;initiation que je donne sur les outils Web 2.0:</p>
<address> </address>
<h2>Les caractéristiques du Web 2.0</h2>
<ul>
<li>Les plates-formes permettant une complète interactivité avec l&#8217;internaute (Ajax)</li>
<li>L&#8217;interopérabilité des applications (flux RSS)</li>
<li>Le développement des réseaux sociaux</li>
<li>La pratique nomade du Web (Delicious, Netvibes, iGoogle)</li>
</ul>
<h2>Les &#8220;espaces&#8221; du Web 2.0</h2>
<ul>
<li>Les espaces personnels (Netvibes, MySpace, Flickr, agenda en ligne, bureau virtuel, mashups, &#8230;)</li>
<li>Les espaces professionnels (projet collaboratif, chat d&#8217;entreprise, base de données en ligne)</li>
<li>Les espaces collaboratifs (knowledge base, gestion des favoris, gestion des tags, &#8230;)</li>
<li>Les espaces informatifs (agrégateur de flux, système d&#8217;informations, blogroll personnalisé)</li>
<li>Les espaces de diffusion (les blogs, les trackbacks, &#8230;)</li>
</ul>
<h2>Liens rapides sur le Web 2.0</h2>
<ul>
<li><a title="Consultez le blog spécialisé sur le Web 2.0" href="http://www.deuxzero.com/" target="_blank">Dessine-moi le Web 2.0</a></li>
<li><a title="Une inépuisable source d'information et de réflexion" href="http://www.fredcavazza.net/" target="_blank">Le blog de Fred Cavazza</a></li>
<li><a title="Lire l'article en particulier" href="http://www.fredcavazza.net/2005/08/24/web-20-une-premiere-definition/" target="_blank">L&#8217;article de Fred Cavazza sur son blog - Web 2.0: une première définition?</a></li>
<li><a title="Consultez ce blog intéressant pour les outils des entreprises" href="http://ademe.typepad.fr/web2/" target="_blank">Compil Web 2.0</a>, un blog sur les concepts et les usages du Web 2.0 et l&#8217;introduction de ces outils dans l&#8217;entreprise&#8230;</li>
<li><a title="Un blog sur l'innovation, Internet et le marketing" href="http://visionary.wordpress.com/" target="_blank"></a><a title="C'est clair, non ? Cliquez !" href="http://blog.eutech-ssii.com/" target="_blank">Web 2Rules</a>, le Web 2.0 c&#8217;était pas du buzz</li>
<li><a title="Eloquent également, me semble-t-il..." href="http://www.ru3.com/luc/" target="_blank">Tentatives d&#8217;intelligence collective</a></li>
<li>Adscriptor, excellent blog. <a title="Consultez le billet en question" href="http://adscriptum.blogspot.com/2008/05/10-technologies-de-rupture-pour-2008.html" target="_blank">10 technologies de rupture pour 2008</a> : un récent billet intéressant sur le thème, une traduction de Gartner.</li>
<li><a title="Allez au blog" href="http://www.media2.fr/index.php/" target="_blank">Medias 2.0</a>, un blog de réflexion sur les business models des médias interactifs</li>
<li><a title="Attention, ce site est en anglais" href="http://publishing2.com/" target="_blank">Publishing 2.0</a>, similaire initiative en anglais</li>
<li>La formation que j&#8217;anime pour <a title="Lire le programme de la formation." href="http://www.klu.be/fr/WEBDEFB" target="_blank">Kluwer</a></li>
</ul>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/ecrirepourleweb.wordpress.com/500/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/ecrirepourleweb.wordpress.com/500/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/ecrirepourleweb.wordpress.com/500/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/ecrirepourleweb.wordpress.com/500/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/ecrirepourleweb.wordpress.com/500/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/ecrirepourleweb.wordpress.com/500/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/ecrirepourleweb.wordpress.com/500/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/ecrirepourleweb.wordpress.com/500/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/ecrirepourleweb.wordpress.com/500/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/ecrirepourleweb.wordpress.com/500/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/ecrirepourleweb.wordpress.com/500/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/ecrirepourleweb.wordpress.com/500/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=ecrirepourleweb.wordpress.com&blog=617858&post=500&subd=ecrirepourleweb&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://ecrirepourleweb.wordpress.com/2008/06/01/ils-faisaient-du-web-20-sans-le-savoir/feed/</wfw:commentRss>
	
		<media:content url="http://a.wordpress.com/avatar/murielv-128.jpg" medium="image">
			<media:title type="html">muriel v</media:title>
		</media:content>

		<media:content url="http://ecrirepourleweb.files.wordpress.com/2008/05/monsieurjourdain20.png?w=187" medium="image" />
	</item>
	</channel>
</rss>