Création d`une page Web

Création d'une page Web
De quelques règles de base à respecter
Prof.Ahmed ALMAKARI
Université Ibn Zohr Agadir
Conseil de base
• L'élaboration d'une page Web se compare facilement à la construction d'une
maison. Il est essentiel d'avoir une bonne idée de la charpente avant de
s'aventurer dans le travail comme tel. La structure hiérarchique et l'aspect
visuel se planifient. Avant de débuter la codification d'une page Web, le
webmestre doit avoir une idée précise du résultat escompté. Il doit aussi
respecter des règles afin que les internautes aient le goût de lire le contenu et
désirent y revenir...
Le poids des pages
• Le poids d'une page ne doit pas dépasser 100 Ko au maximum.
• Aucune image ne doit dépasser 75 Ko et l'arrière-plan (background) doit être
plus petit que 20 Ko (car cette image se répète indéfiniment).
• Le texte est facilement lisible sur le fond d'écran.
• Tout a une fonction et rien n'est exclusivement décoratif.
• Les hyperliens sont utiles et appropriés.
Texte et icônes
•
•
•
•
Le fond, les icônes et les lignes doivent respecter une certaine uniformité.
Les icônes doivent être utilisées pour représenter la même idée tout au long du site Web (exemple: si vous
utilisez une image de maison pour représenter le retour à la page d'accueil, cette image doit être la même
pour toutes les pages du site).
Ne jamais souligner le texte, car l'usager pourrait confondre ce texte souligné avec un hyperlien.
La taille la plus répandue des moniteurs est de 15 pouces pour une résolution de 72 dpi et de 256
couleurs. Il est donc raisonnable de créer des pages HTML destinées à ces écrans de 640 x 480 pixels,
même si les écrans de 800 X 600 pixels sont de plus en plus populaires. En format utile, cela correspond à
une taille maximum de 580 x 280 pixels quand on enlève les ascenseurs. Limiter la taille d'image à 350
pixels maximum dans sa plus grande dimension, de préférence autour de 200 pixels.
Fonds d’écran
• Fond d'écran: deux possibilités:
– Couleur unie: éviter les teintes de rouge et de jaune de même que leurs
dérivés (ex. : le vert, l'orange...).
– Image de fond (background): (ex.: comme celle à l'écran) elle doit avoir au
moins 20 X 20 pixels afin d'éviter le ralentissement de l'affichage (le
background est une image qui se répète dans toute la page). De plus, si ces
images ne sont pas très pâles, elles rendent la lecture difficile. Les images
de fond doivent être de motifs légers ou unis.
Les polices
•
Police de caractère (font)
•
•
•
Utiliser les polices les plus courantes, car l'usager voit seulement les polices installées sur son
ordinateur.
Polices courantes: Arial, Times New Roman, Verdana, Courrier, Comic Sans Ms.
Les autres polices, et plusieurs sont très décoratives, peuvent être utilisées en créant d'abord
une image. Ex.: Vous faites une image pour le titre de votre recherche et vous vous servez de
la police de votre choix.
Ce titre est une image conçue avec la police Curlz MT.
Les couleurs
Couleurs à éviter
•
Le choix des couleurs et certaines modalités d'une page écran sont fondés sur des critères de confort et d'efficacité
connus en ergonomie. En effet, une part de la fatigue visuelle ou des symptômes d'inconfort peut être attribuable à
certaines caractéristiques d'une page écran.
•
•
Caractères: bleu, rouge, violet (peu importe la couleur du fond).
Duos à ne jamais utiliser ensemble (soit caractères/fond ou caractères/caractères):
–
Rouge avec bleu;
–
Jaune avec violet;
–
Jaune avec vert. Ces couples sont reconnus comme causant une sollicitation excessive de la rétine, provoquant ainsi un inconfort
qui peut s'aggraver avec le vieillissement.
Compatibilités
Re-images!
Images
•
•
•
•
Respecter les droits d'auteur: utiliser seulement les images libres de droits, comme les
«cliparts» et les banques d'images disponibles sur le Web. .
Attention aux images animées: elles peuvent étourdir l'internaute plutôt que de le séduire!
Pour diminuer la grandeur d'une image, il est recommandé de le faire à l'aide d'un logiciel de
dessin plutôt que de la redimensionner dans l'éditeur HTML (l'image originale gardera son
format de base et si elle est trop lourde, elle ralentira le chargement de la page; exemple: une
très grande image peut facilement être redimensionnée à l'aide de la souris dans un éditeur
HTML , mais elle gardera son «poids» original (nb de Ko) au chargement.
N’utiliser une image que quand c’est vraiment nécessaire
Dernières vérifications
• Avant de remettre ses pages Web afin qu'elles soient publiées
dans Internet, on doit s'assurer qu'elles sont parfaites en tous
points! Voici une liste de points à vérifier qui permettra d'effectuer
les derniers ajustements et corrections à l'intérieur des pages Web.