Julien Falgas

Formé aux arts plastiques et aux contenus web, je suis un observateur et un acteur assidu de l'évolution de la bande dessinée numérique. Webmestre pour l'Université de Lorraine, j'assure des enseignements devant des étudiants en Sciences de l'information et de la communication. Depuis 2011, je prépare une thèse consacrée aux usages des dispositifs de publication numérique par les auteurs et les publics de bande dessinée.

Aller au contenu | Aller au menu | Aller à la recherche

2004 oct. 12

Ce qui compte c'est la taille

La mise en page d'un bande dessinée en ligne doit prendre en compte le confort de lecture. Cet impératif est d'autant plus grand que beaucoup de bédéphiles considèrent encore qu'il est très inconfortable de lire de la bande dessinée sur écran.

De bonnes résolutions

Il est tout d'abord préférable d'éviter les ascenseurs horizontaux dans la mesure où les souris à deux molettes sont encore très peu répandues. Pour ce faire il faut prendre en compte les différentes résolutions dans lesquelles la page est susceptible d'être affichée. La résolution minimale des ordinateurs (640*480) permet d'afficher des images de 540 pixels de largeur mais est devenue extrêmement minoritaire chez les utilisateurs, la plus courante (1024*768) en autorise 950.

Mais les internautes ne l'utilisent pas toujours dans sa totalité (la barre de favoris l'occulte souvent partiellement) et la résolution 800*600 reste trop répandue pour être négligée. Mieux vaut donc considérer que l'on dispose de 760 pixels de largeur. Sachant que les PDA proposent un affichage vertical de 240 pixels de marge, bienvenue dans l'univers impotoyable de l'accessibilité.

A l'horizontale ou à la verticale ?

Si l'on souhaite que l'internaute puisse tout voir d'un seul coup d'oeil comme c'est le cas avec une planche traditionnelle, alors on dispose au maximum de 420 pixels de hauteur pour les affichages 800*600 et 600 pour les affichages en 1024*768. Le format idéal dans cette optique serait donc la bande horizontale, autrement dit le strip, ou éventuellement le carré.

Un positionnement vertical peut toutefois fort bien convenir si sa largeur est idéale. Scott Mac Cloud en est un fervent défenseur avec des planches sans fin en hauteur ou en largeur (et à la limite dans les deux directions dans certains cas très précis où la lecture se fait interactive).

Attention toutefois, car de plus en plus d'internautes disposent d'affichages très grands (1600*1200 et parfois plus). Or, si le scroll long s'avère riche de possibilités narratives, ces lecteurs risquent de devoir utiliser un ascenceur pour quelques pixels de trop dans l'une ou l'autre dimension, ce qui est très frustrant. Il est bien sûr possible de forcer l'affichage dans une fenêtre de taille fixe, mais les navigateurs de nouvelle génération se répandent, qui exploitent la navigation par onglets et formattent toute tentative de forcer un fenêtrage.

Tu me trouves trop grosse ?

La taille spaciale n'est pas la seule préocupation à avoir, celle occupée par les fichiers sur la bande passante des internautes est également importante. Si le haut débit se généralise, les zones rurales en sont encore généralement privées. De plus même en haut débit, il n'est pas rare de trouver des pages au chargement long de manière injustifiée.

Pour l'image fixe, le format .jpg permet de compresser correctement la plupart des images, et le .png 8 bit, qui est appelé à succéder au .gif, est très efficace lorsqu'il s'agit de dessins. Ce dernier format offre d'ailleurs des possibilités nouvelles de transparences, malheureusement très mal supportées par Internet Explorer 6 et ses prédécesseurs.

Pour l'image animée, le format flash s'impose, mais oblige l'auteur à se conformer aux impératifs du graphisme vectoriel, tant l'usage d'images bitmap alourdi les animations.

Commentaires

1
Bonjour, Bien sûr une longue suite d'images verticales ou horizontales est une bonne solution, mais celle qui m'a paru "évidente" dès le départ est une simple fenêtre, avec des flèches pour tourner la page. C'est aussi très utilisé. Le tout est de faire un bon compromis qualité/bande passante. Des gifs 16 couleurs sont tout à fait suffisants pou passer un dessin au trait. Question dimentions, il est important d'utiliser l'écran au maximum, et pour cela j'ouvre mes fenêtres avec un lien html spécial "onclick" qui permet de supprimer les barres de favoris, ascenseurs, etc. Le tout est de conserver une ligne avec le n° de page, le titre, les flèches, etc. Ainsi j'arrive à une image utile de 790x518 pixels, prévue pour un écran 800x600. La taille des lettres et des détails doit aussi être prévue en conséquence, pour être suffisament lisible: suffisamment grandes en dimention, et avec assez de pixels. Cette taille d'images a aussi un avantage: si un jour je suis publié sur papier, deux écrans de ce type font une page. Tout cela me fait des images de 70 à 100ko, qui arrivent instantannément en ADSL et en quelques secondes avec un modem. J'ai essayé la couleur, (qui nécessite des gifs 256 couleurs) elle ne fait que doubler la taille des fichiers.

likchenpa Le samedi 16 octobre 2004 à 18:18

2
Je voudrais juste rectifier un détail concernant Flash : Pour l’image animée, le format flash s’impose, mais oblige l’auteur à se conformer aux impératifs du graphisme vectoriel, tant l’usage d’images bitmap alourdi les animations. Il est tout à fait possible de compresser les images BMP dans un format JPG dans Flash. La sortie d'image ou animation compressée par flash propose un poids plus léger qu'une compression via Photoshop ...et cela pour une qualité identique. Bien entendu Flash est conçu pour créer de l'animation vectorielle, mais ce n'est pas tout ! Il assure aussi très bien la compression photo ou vidéo ... Flash peut résoudre un grand nombre des problèmes concernant la taille des écrans : Les multiples possibilités d'affichage plein écran peuvent être très bénéfique à l'affichage de planche de grande tailles. Pour ceux qui voudrait travailler dans cette optique, voyez un peu la fonction "stage" qui permet de ne pas déformer le JPG pour une occupation de la page qui s'adaptera à la taille d'écran sur 100 %. ) Un exemple à ne pas suivre serait la première version de mon site ( http://www.art-logic.info ) : Si vous redimensionnez votre navigateur toute l'animation se déforme ... L'image s'altère avec la transformation les textes deviennent géant ou trop petit. Un site catastrophique abandonné depuis. L'idée plus interessante serait dans le goût de la prochaine version ( http://www.art-logic.info/index2.htm ) que je prépare : Avec la fonction "stage" l'image ne s'étire plus, les textes non plus et pourtant j'use toujours de 100 % de la taille du navigateur. Bien entendu lors du redimensionnement l'image de fond est tronquée pour les besoin de mon site. Mais on peut très bien imaginer que l'internaute puisse déplacer cette image avec une navigation plus adéquate que les ascenseurs du navigateur. Tout est possible avec flash pour améliorer le confort de lecture mais aussi les délais d'attentes lié au chargement. Un autre exemple pour afficher des planches qui sont plus grande que la taille de l'écran est peut être les logiciels de cartographie en ligne ( mappy maporama et les autres ) . Quand votre carte est à l'écran une main vous permet de glisser la carte sur plusieurs km. Il ya tant à dire sur les possibilités que peut offrir ce soft ... je vais peut être stopper mon message là, il va bientôt ressembler à un article ! ;- ) Je promets d'écrire encore quelques broutilles à ce sujet.

Stephan webmaster de art-logic.info Le samedi 23 octobre 2004 à 23:54

3
Re-bonjour, petit complément d'information, pour ceux qui souhaitent plutôt la longue page verticale. Demander à un visiteur de télécharger plusieurs mégaoctets d'image peut sembler une hérésie, car avec un modem cela peut prendre plusieurs minutes. Mais apparemment si l'image est une image gif (sans entrelacement) et non pas du jpg, cela marche très bien, car le haut se charge en premier, et le bas se charge quand on est encore en train de lire le haut.

likchenpa Le dimanche 24 octobre 2004 à 22:10

4
Bonjour, il ne faut pas oublier que le système flash a été conçu dès le départ pour tenir compte des limitations du web, notament le temps de chargement. Ainsi diverses astuces sont prévues: -compression des fichiers -barre indiquant où en est le chargement -surtout, quand il s'agit d'un "film" en flash, il commence à jouer avant que le téléchargement soit terminé. Ainsi, comme le démontrent de nombreux exemples sur abdel-inn, le flash s'intègre bien dans un site, avec peu d'attente. Je compte l'utiliser en insertion dans de la bédé plus classique, pour certaines images justifiant du son, du mouvement ou une meilleure qualité. Question qualité, on voit aussi sur les exemples que l'utilisation systématique d'images bitmap très lourdes et détaillées ne nuit guère au temps de chargement.

likchenpa Le dimanche 24 octobre 2004 à 22:19

5
... Petite correction quant aux liens sur les deux versions de mon site sitée ici. Les liens sont morts. Vous pouvez néanmoins jeter un œil à l'utilisation de l'objet stage en passant d'un mode panoramique à une taille normale sur cette interface de {{galeries ( http://www.art-logic.info/annecy/rubrique.php3?id_rubrique=2 )}}.

Le dimanche 24 avril 2005 à 00:42

Ajouter un commentaire

Le code HTML est affiché comme du texte et les adresses web sont automatiquement transformées.

Fil des commentaires de ce billet