LA TYPOGRAPHIE du WEB 4- Le rôle du système informatique



Documents pareils
Manuel Utilisateur Version 1.6 Décembre 2001

Uniformiser la mise en forme du document. Accélère les mises à jour. Permets de générer des tables de matières automatiquement.

PHPWEBSITE -Tutoriel image

FAQ Mobiclic/ Toboclic

Initiation à linfographie

L ORDINATEUR FACILE D ACCÈS!

Formation > Développement > Internet > Réseaux > Matériel > Maintenance

Création de maquette web

Bernard Lecomte. Débuter avec HTML

Logiciel Enterprise Guide Version 1.3 Windows

L accès à distance du serveur

Installation et paramétrage. Accès aux modèles, autotextes et clip- art partagés

Guide pour la réalisation d'un document avec Open Office Writer 2.2

Créer votre propre modèle

Google Drive, le cloud de Google

Optimiser les s marketing Les points essentiels

Maîtrisez votre Navigateur

Personnalisation Fiche Annuaire

S.P.S.N. Lac du Der 2008

Livret 1 Poste de travail de l utilisateur :

PRISE EN MAIN D ILLUSTRATOR

TBI-DIRECT. Bridgit. Pour le partage de votre bureau. Écrit par : TBI Direct.

Utilisation de XnView

Guide d utilisation. Table des matières. Mutualisé : guide utilisation FileZilla

FAQ Trouvez des solutions aux problématiques techniques.

Utilisation de l éditeur.

Qu'est-ce que c'est Windows NT?

Affichage de la date d'exigibilité sur les documents FAQ INV 011

TRAVAILLER SUR LES ORDINATEURS DU LYCEE

Gestion des documents avec ALFRESCO

Chapitre 22 Optimisation pour diffusion à l'écran, pour le web

Mode Opératoire Windows XP

iil est désormais courant de trouver sur Internet un document

CMS Modules Dynamiques - Manuel Utilisateur

Ref : Résolution problème d'accès aux supports de cours

Qlik Sense Desktop. Qlik Sense Copyright QlikTech International AB. Tous droits réservés.

Climat Scolaire - Manuel utilisateur - Chapitre 2 : «Créer, Editer et suivi d un texte»

Créer un diaporama avec Open Office. Sommaire

Computer Link Software

Calibrage du moniteur avec Monitor Profiler de Little CMS

Fiche Mémo : Options d accessibilité sous Windows et Internet Explorer 5

MODE D'EMPLOI DU CONTRIBUTEUR WEB UAPV "CONTRIBUER DANS UNE RUBRIQUE DU SITE WEB"

Les conseils et les procédures pour utiliser divers programmes francophones avec de l'hébreu

Table des matières. 1 À propos de ce manuel Icônes utilisées dans ce manuel Public visé Commentaires...

LECON 2 : PROPRIETES DE L'AFFICHAGE Version aout 2011

l'ordinateur les bases

Services bancaires par Internet aux entreprises. Guide pratique pour : Rapports de solde Version

Dessiner dans Galaad FRANÇOIS PALLUT

FrontPage Support d apprentissage septembre 2000

espace de partage Explication rapide

CREER UN PETIT SITE WEB EN COMPOSANT DES PAGES HTML

Indiquer l'espace libre sur le disque dur

Parcours FOAD Formation EXCEL 2010

Paramétrage des navigateurs

Editeur html Guide de l'utilisateur

Didacticiel de mise à jour Web

DOCUMENTATION VISUALISATION UNIT

Bien travailler sur plusieurs écrans

WordPress :: Migrer son site du local vers le serveur en ligne

Le générateur d'activités

cbox VOS FICHIERS DEVIENNENT MOBILES! INTERFACE WEB MANUEL D UTILISATION

FORMATION PcVue. Mise en œuvre de WEBVUE. Journées de formation au logiciel de supervision PcVue 8.1. Lieu : Lycée Pablo Neruda Saint Martin d hères

TRUCS & ASTUCES SYSTEME. 1-Raccourcis Programme sur le Bureau (7)

Freeway 7. Nouvelles fonctionnalités

Ateliers Python+Qt : Premiers pas : Comment développez ses propres interfaces graphiques sur le RaspberryPi?

La navigation sur le Web avec Internet Explorer 6 Première approche

Inspiration 7.5. Brève description d Inspiration. Avantages d Inspiration. Inconvénients d Inspiration

Traitement de texte : Quelques rappels de quelques notions de base

Guide de l utilisateur Mikogo Version Windows

Livre Blanc WebSphere Transcoding Publisher

Manuel de l'utilisateur d'intego VirusBarrier Express et VirusBarrier Plus

Comment autoriser un programme à communiquer avec Internet sous Vista?

Le logiciel de création de site internet IZISPOT est un outil très puissant et qui est assez simple après quelques temps d utilisation.

Comment créer vos propres pages web?

Certificats Electroniques sur Clé USB

Table des matières : 16 ASTUCES OUTLOOK

Bientôt la rentrée!...personnaliser et configurer un ordinateur pour faciliter son utilisation en classe

Gérer ses impressions en ligne

Modules Multimédia PAO (Adobe)

Découvrez Windows NetMeeting

Le Service de Télétransmission par Internet des banques du Réseau OCÉOR GUIDE UTILISATEURS. Version V1.0

Télécharger et Installer OpenOffice.org sous Windows

Créer un modèle Impress

Tutoriel BLOGGER. Pour vous donner une idée, voici un exemple de blog :

Cyberclasse L'interface web pas à pas

MAILING KOMPOZER... 2 CREEZ UNE PAGE... 2 FORMAT DE LA PAGE... 2 AJOUTER DU TEXTE SUR UNE PAGE... 4

DÉCOUVERTE DE CAPTURE ONE

L'explorateur de fichier de Windows 8.1

Open Office - Présentation

Dans la série LES TUTORIELS LIBRES présentés par le site FRAMASOFT. Compression - Décompression avec 7-Zip. Georges Silva

Premiers pas avec Scribus

Centre de formation: Collège IBN BASSAM - TEMARA. Ce cours est proposé par le professeur d informatique:

Scopia Desktop. Sommaire

Guide d utilisation de fonctionnalités avancées de Beyond 20/20 (application à des données départementales issues de Sit@del2)

Guide utilisateur Archivage intermédiaire Messagerie. Enterprise Connect pour Outlook 2010 EC V 1.0

Support Web Administration et gestion des portails web des facultés - Université A.Mira Béjaia -

Saisissez le login et le mot de passe (attention aux minuscules et majuscules) qui vous ont

Transcription:

LES DOSSIERS DU CERIG LA TYPOGRAPHIE du WEB 4- Le rôle du système informatique Jean-Claude Sohm / EFPG (créé le : 20 juillet 2000 / révisé le : 20 décembre 2000) URL : http://cerig.efpg.inpg.fr/icg/dossiers/typo/chap4.htm Introduction : le système n'est pas indifférent En affichant la même page web sur l'écran d'un Mac et sur celui d'un PC, on constate en général que le texte apparaît plus flou, que les caractères sont plus petits, et que les couleurs sont plus claires, sur le premier que sur le second. La plate-forme joue donc un rôle notable dans la reproduction de la typographie d'unepage web. En affichant la même page web sur l'écran d'un portable et sur celui d'une machine de bureau (les deux ordinateurs utilisant le même système d'exploitation), on constate que les caractères sont un peu plus nets sur le premier, et les couleurs beaucoup plus vives sur le second. La technologie du moniteur joue donc également un rôle dans la reproduction de la typographie d'une page web. En affichant la même page web sur les moniteurs de deux ordinateurs de bureau utilisant le même système d'exploitation, on peut constater des différences importantes dans le rendu de la couleur. Le réglage du gamma par voie logicielle joue un rôle important dans la reproduction de la couleur, et donc de la typographie lorsque le texte et/ou le fond sont colorés. Enfin, le navigateur peut également jouer un rôle dans l'affichage du texte. Certains sites ont une bien meilleure typographie quand ils sont affichés grâce à une version récente du navigateur de Netscape. C'est le problème des polices dynamiques. Cela nous amène à examiner tour à tour : le lissage des caractères sur Mac, puis sur PC ; le passage du point au pixel ; la gestion de la couleur sur le web ; les polices dynamiques. (1 sur 6)

Le lissage des caractères sur le Mac : ATM Le système d'exploitation du Mac comporte l'utilitaire ATM (Adobe Type Manager). On y accède via le menu pomme, à la rubrique "Tableaux de bord". Dans son réglage par défaut, ATM lisse les polices PostScript à l'écran, quelle que soit leur taille. Pour supprimer ce lissage ou le rétablir, il suffit d'agir sur la case à cocher intitulée "Disable Smoothing at Screen Font Point Sizes" (figure 1). L'opération ne nécessite pas le redémarrage de la machine, ce qui est fort commode. Figure 1 : l'utilitaire ATM du Mac Sur le Mac, les navigateurs utilisent par défaut la police Times comme police proportionnelle. Comme il s'agit d'une police PostScript, cela donne un aspect un peu flou au texte affiché par les navigateurs sur le Mac -- lorsqu'on ne modifie pas les réglages d'origine d'atm et/ou des navigateurs. Si l'on aime, tant mieux. Si l'on n'aime pas, en quelques clics de souris, on supprime l'effet. Dans la liste des polices communes Mac/PC (chapitre 3), seul Symbol est une police PostScript sur le Mac ; la police Times New Roman ne l'est pas. Par défaut, les navigateurs affichent en Times, qui est une police PostScript. (2 sur 6)

Le lissage des caractères sur PC Le système d'exploitation du PC ne comporte pas ATM. Le lissage éventuel des caractères affichés à l'écran est réglé par le système d'exploitation Windows. Un clic droit sur le bureau ouvre un menu contextuel dans lequel on choisit "Propriétés". La boite de dialogue "Propriétés de Affichage" apparait : on choisit l'onglet "Effets", et on coche la case "Lisser les polices d'écran". En regardant le nouvel aspect du bureau, on peut avoir un coup au coeur : tout dépend du moniteur que l'on possède! Lors de son affichage à l'écran, le texte n'est lissé que si la taille des caractères est assez grande. Le tableau V précise ce point dans le cas des polices communes Mac/PC, et pour les tailles permises par le HTML. Par défaut, les navigateurs utilisent Times New Roman comme police proportionnelle sur PC. Tableau V : lissage des polices sur l'écran d'un PC Police Lissée par Windows si : Arial taille > 3 Arial Black taille > 3 Comic Sans MS taille > 2 Courier New taille > 6 Georgia taille > 3 Impact taille > 4 Symbol taille > 3 Times New Roman taille > 3 Trebuchet MS taille > 3 Verdana taille > 3 Webdings taille > 5 Du point au pixel Le Mac et le PC n'affichent pas les caractères de même taille (exprimée en points) avec les mêmes dimensions. Ainsi : sur le Mac, la règle est "un point = un pixel" ; sur le PC, le réglage par défaut est "un point = 4/3 pixel". C'est la raison pour laquelle certains auteurs écrivent que le Mac a une dpi de 72 et le PC une dpi de 96. Tout dépend de la définition du "dot" de dpi (pixel ou point). (3 sur 6)

Le même texte apparaît donc plus petit sur Mac que sur PC, comme le montrent les tableaux II, III et IV du chapitre 3. En fait, la situation réelle est encore un peu plus complexe, et dépend du type de moniteur utilisé. À l'aide d'une loupe de grossissement moyen, on peut faire les observations suivantes : pour les ordinateurs portables, qui sont équipés d'écrans à cristaux liquides, l'affichage est effectivement constitué de petits carrés adjacents (un carré = un pixel, à moins que l'on ne règle la résolution à une valeur inférieure). Chaque carré est divisé en trois bandes verticales, qui constituent les trois luminophores (un rouge, un vert et un bleu) ; pour les autres ordinateurs, qui sont équipés d'écrans à rayon cathodique (CRT : Cathode Ray Tube), l'unité d'affichage est la triade, groupe de trois luminophores dont la forme (ronde, carrée, rectangulaire, etc.) varie d'un constructeur à l'autre. Contrairement au cas précédent, les triades ne sont pas adjacentes, et les pixels ne sont pas matérialisés. La distance moyenne entre les triades est de l'ordre du quart de millimètre. Sur un écran CRT, afficher les pixels à partir des luminophores implique un sérieux lissage de la part du système. Il faut en effet simuler des pixels, c'est à dire des carrés d'un tiers de millimètre de côté, distribués dans deux directions rectangulaires, à l'aide de luminophores distants d'un quart de millimètre, distribués suivant un dessin en nid d'abeille. L'opération est effectuée par le processeur de la carte graphique (le ramdac). Il en résulte que les caractères n'apparaissent jamais parfaitement nets, quelle que soit la plate-forme et sa configuration. Bien entendu, le passage des luminophores aux pixels n'arrange pas l'aspect des caractères, on s'en doute! Comme les luminophores n'ont pas la même forme sur tous les écrans, et que le motif de leur répétition varie d'un fabricant à l'autre, un oeil exercé décèlera que les mêmes caractères s'affichent de manière légèrement différente sur des moniteurs de marques distinctes. Les plus mauvais résultats sont obtenus avec les moniteurs CRT dont les luminophores ont la forme de bandes verticales, moniteurs pour lesquels il est préférable de désactiver le lissage des caractères. Le problème de la couleur Les couleurs affichées par le moniteur d'un Mac sont généralement plus claires que celles affichées par le moniteur d'un PC, et cela s'applique aussi bien au texte qu'aux images. La différence provient principalement d'un réglage différent de la correction du gamma sur les deux plates-formes (le coefficient gamma caractérise la non-linéarité des moniteurs). D'autres facteurs jouent un rôle dans l'affichage de la couleur : le réglage de la luminosité et du contraste, l'espace chromatique du moniteur, et les conditions de son emploi. Pour plus de détails, on pourra consulter la note technique du CERIG sur ce sujet. (4 sur 6)

Les couleurs affichées par le moniteur d'un portable sont plus fades que celles affichées par le moniteur d'un ordinateur de bureau, le même système d'exploitation étant utilisé dans les deux cas. En d'autres termes, l'espace chromatique du premier moniteur est plus petit que celui du second. Cela tient au fait que les deux moniteurs n'utilisent pas la même technologie : cristaux liquides pour le premier, tube à rayonnement cathodique (CRT) pour le second. Les polices dynamiques Un fichier de police complet pèse typiquement 150 à 300 Ko. Voici quelques exemples, provenant d'un PC : Arial (266 Ko), Courier New (290 Ko), Garamond (181 Ko), Times New Roman (315 Ko). D'où viennent de pareilles tailles, alors que les caractères sont définis comme des images vectorielles? Du fait que les grandes polices classiques contiennent les 635 caractères de la WGL4 (Windows Glyph List 4). Cette liste, qui a été établie par Microsoft, comporte tous les caractères utilisés en Europe occidentale (caractères accentués inclus), plus les caractères grecs, turcs et cyrilliques. Chaque lettre existe sous forme majuscule et sous forme minuscule, chaque caractère est représenté dans les quatre styles (normal, italique, gras et gras italique). Enfin, des formules permettent d'affiner localement certaines lettres pour l'affichage dans les grandes tailles. Une police complète, c'est un monde! Il est évidemment impensable d'accompagner le téléchargement d'une page web -- dont on tente de limiter la taille à 50 Ko -- de celui d'un ou de plusieurs fichiers de polices pesant chacun plusieurs centaines de Ko. De fait, il est rarissime de voir l'auteur d'une page web proposer aux internautes le téléchargement d'une police spécifique. De plus cette opération, qui n'est pas prévue dans le HTML, ne s'effectue pas de manière automatique. Bien entendu, on n'utilise jamais qu'un petit sous-ensemble de tout ce que contient une police complète. Plusieurs éditeurs de logiciel ont donc imaginé de ne transmettre avec la page web que les caractères effectivement utilisés. Le procédé s'appelle "font embedding" ou "dynamic font" en anglais, et "police dynamique" en français. Bitstream (utilisez de préférence Navigator pour visiter ce site) est le plus connu des éditeurs de logiciel permettant cette opération. Ceux qui utilisent une version récente du navigateur de Netscape (postérieure à 4.2) sont automatiquement dotés de cet afficheur de polices (pour vérifier, utiliser la rubrique "Aide/A propos des afficheurs de polices"). Pour ceux qui utilisent le navigateur de Microsoft, un contrôle ActiveX devrait se télécharger automatiquement. En pratique, soit il ne se charge pas, soit il plante le navigateur -- ce qui est assez fréquent avec les ActiveX (expérience de l'auteur). Pour voir des polices originales, visitez le site de démonstration (utilisez Navigator). L'éditeur Microsoft a développé une technique appelée WEFT, qui permet de transmettre une police de caractère avec une page web. Cette technique ne s'est pas développée, parce qu'elle est spécifique du navigateur Internet Explorer. Une version 2 a néanmoins été annoncée. (5 sur 6)

Remarque : il existe de nombreux sites web où l'on peut télécharger des polices, gratuites ou payantes selon le cas, mais cette offre n'est pas liée à l'affichage d'une page web particulière. Il s'agit en fait d'une opération FTP. Copyright CERIG/EFPG 1996-2001 (6 sur 6)