accueil navigation contenu

Delavy for the Web

Reflexions bilingues pour améliorer le Web

Version FrançaiseEnglish Version

Focus, pour une meilleure lecture sur le web

jeudi 1 janvier 2009 [18:41:56]

Bonjour ! Je vais vous présenter ici mon idée pour faciliter la lecture sur le web. Car si Firefox est bien adapté en ce qui concerne la recherche de l'information, il l'est moins quand à la lecture de l'information : durant le surf toutes les parties d'un site sont utiles, mais pour la lecture on devrait pouvoir isoler le texte des autres éléments qui surchargent une page Web et nuisent à la concentration.

This article is available in an English version.

visuel focus

C'est pourquoi j'ai pensé à Focus, qui part du principe que l'utilisateur doit pouvoir choisir çe qui l'intéresse et se concentrer sur ce qu'il veut.

  1. Je me rend sur le site web, et trouve l'article qui m'intéresse.
  2. Je lance Focus et délimite une zone de lecture sur la page. Seul cette partie sera visible, un masque sombre opacifiera le reste de la page.
  3. Je peux lire tranquillement !

Je précise que ce n'est qu'un concept que j'ai imaginé, mais le module pour firefox n'existe pas. J'ai mis en ligne mon projet pour le soumettre à la communautée des utilisateurs de firefox, et particulièrement des developpeurs. C'est un Concept-series pour Mozilla Labs.


Mozconcept : Focus par Delaby Pierre sur Vimeo.

Texte de la vidéo

Je me rend sur Google News, et veux lire par exemple le second article. Si je l'ouvre dans un nouvel onglet, j'ai donc le texte qui m'intéresse, mais autour plus de 50% de l'espace visuel de la page Web est occupée par des publicitées, ce qui rend difficile la concentration.

C'est là qu'intervient focus. Je le lance, par une combinaison de touches ou en cliquant sur l'icône, et trace un rectangle qui englobe toute la zone du texte. J'appuie ensuite sur entrée, ce qui me recentre le haut de la page. Je peux alors commencer la lecture dans un environnement visuel calme et propice à la réflexion.

Je pense à quelques outils supplémentaires : des boutons de fonction pour exporter le cadre en pdf ou sous forme d'image, retenir les coordonnées et dimensions du cadre pour l'appliquer à une eventuelle page suivante, fermer le cadre et changer l'opacité. Il serait aussi pratique d'avoir la barre de recherche habituelle de Firefox.

Réalisation

Cette vidéo à été réalisée sur After Effect CS3. J'ai choisit l'article au hasard, en prenant juste en compte l'encombrement de la page web. Vous pouvez le retrouver sur le site du Nouvel Obs. Focus s'inspire de l'outil de recadrage d'Illustrator : celui-ci fonctionne pareil pour délimiter une zone à exporter. Les exemples sont des captures d'écran prises sur Illustrator CS3.

Examples

exemple01mini exemple02mini exemple03mini

Textes, images et design : Copyright © 2008 - 2009 Delaby Pierre.
Copyleft : cette oeuvre est libre, vous pouvez la redistribuer et/ou la modifier selon les termes de la Licence Art Libre. Vous trouverez un exemplaire de cette Licence sur le site Copyleft Attitude www.artlibre.org ainsi que sur d'autres sites.
Icons par Mark James sous Creative Commons | Tous les Crédits et Attributions.

Généré avec Logz : http://www.logz.org | Hebergé par Provisoire.fr | Copyleft Licence Art Libre | Vrs ?, Vxl ? | site map