(1 ère partie) enfin
! ![]()
Principes de base
- Un surfeur consulte un moteur de recherche, ou au hasard d'un clic vient visualiser votre site. Le plus important consiste alors à capter son attention dès la HomePage (page d'accueil) pour l'inciter à rester visiter.
- Théoriquement toute page doit présenter un contenu clair et cohérent avec possibilité de choisir et naturellement de pouvoir naviguer à son aise sans jamais se perdre. Un surfeur qui ne sait plus où il se trouve sur un site, est un surfeur perdu qui vous quitte aussitôt.
- Prévoyez d'agrémenter avec des images, point particulier qui sera développé dans un futur chapitre. La couleur de fond qui participe à l'aspect esthétique de vos pages reste aussi un élément important, et vous devrez effectuer des essais comparatifs surtout pour conserver une bonne lisibilité du texte. L'orthographe trop souvent négligée n'est que le reflet de votre personnalité.
- La typographie choisie, doit permettre de visualiser vos pages sans entraîner de lassitude ou de fatigue visuelle et vous devez utiliser un corps (taille des caractères) et une police classiques. Apprenez à réduire la monotonie d'une page en utilisant des titres et sous-titres en couleur, que vous devez définir au départ. Une longueur de page raisonnable (disons 3 fois maxi la hauteur de l'écran ou 1000 mots au plus) sur une largeur de 450 pixels ou 80 caractères environ.
- L'arborescence de votre site sera conçue pour faciliter la visite de différentes pages à l'aide des liens hypertextes indispensables (réf chapitre 3-2), sans oublier ceux que vous allez peut-être ajouter à l'intérieur de votre texte.
Oui, un travail planifié et appliqué, un zeste de bon goût (et pourquoi pas d'humour) et une dose de logique vont, sans recours à des technologies de pointe, vous donner l'occasion de réaliser des pages digne d'un vrai webmaster.
bonjour,
moi aussi je veux devenir un Webmaster célèbre......
Pour des raisons évidentes , vous n'allez pas vous lancer en premier dans une HomePage définitive qui nécessite quelques connaissances de base pour la réaliser correctement et fait toujours l'objet d'ajustements au fur et à mesure de vos acquisitions du code HTML. Tout simplement puisqu'il faut bien débuter par un bout vous allez monter une page appartenant au site qui a été retenu : "Les chiens de race Setter".
Vous allez par exemple taper sur une page vierge de votre traitement de texte habituel le contenu (le brouillon disons) de la page ayant trait au Setter Irlandais:
- Un titre, centré, SETTER IRLANDAIS.
- Puis un peu plus bas, deux sous-titres : 1-
Origines. et 2- Aptitudes.
- Le sous-titre 1 - Origines sera subdivisé en 3 paragraphes : 1a-
Nationalité, 1b- Origines, et 3c- Standard.
- Le sous-titre 2 - Aptitudes sera divisé en paragraphes : 2a-Aptitudes,
2b- Personnalité, et 2c- Remarques.
Pour le contenu du texte, comme il s'agit d'un exercice vous pouvez réduire la longueur des paragraphes à quelques lignes seulement. OK ? et supposant ce premier point réalisé, vous allez maintenant le coder en HTML pour le rendre lisible à l'identique (ou presque) sur votre écran.
Tags HTML, Head, Title
vous allez d'abord placer les tags (on parle aussi de "balises") comme expliqué "au chapitre 6 ": Programmation de base".
<HTML>
<HEAD>
<TITLE>Origine du Setter Gordon</TITLE>
</HEAD>
<BODY>
texte
</BODY>
</HTML>
Ce titre apparaît uniquement dans la barre de TITRE du navigateur c-à-d la partie supérieure de sa fenêtre, et comme déjà dit son caractère d'information aide le visiteur qui vous ajoute dans son Bookmark (signets ou favoris) à y accéder plus tard directement et, important aussi les moteurs de recherche pour le référencement l'utilisent toujours.
Tag Body
<BODY>
....... </BODY>
C'est entre ces tags que vous placez le "contenu" de votre page, texte, images, divers, et en premier vous disposez le titre du sujet traité de la façon suivante, en supposant que vous ayez choisi de le centrer (attention il n'est plus question du titre vu ci-dessus pour le navigateur, mais celui de votre page en clair) :
<H2><CENTER><FONT FACE="Arial" COLOR="#AF0000"> SETTER IRLANDAIS </FONT></CENTER></H2>
ce qui vous donne sur l'écran :
SETTER IRLANDAIS
Explications : Le formatage du texte ne peut se faire qu'à l'aide des tags et attributs, et pour centrer votre titre vous pouvez appuyer 10 ou 20 fois la barre d'espacement ou le bouton retour à la ligne de votre clavier, vous n'obtiendrez aucun résultat équivalent sur votre navigateur et votre titre restera obstinément sur la marge gauche.
Tag Hn (n = un chiffre) ou dimension d'un titre
(on parle alors de niveau 1 à 6 )
Voici les tags et leur taille réelle correspondante (vous entendrez parler aussi de "corps")
<H1> Pour un titre de niveau 1</H1>
<H2> Pour un titre de niveau 2 </H2>
<H3> Pour un titre de niveau 3 </H3>
<H4> Pour un titre de niveau 4 </H4>
<H5> Pour un titre de niveau 5 </H5>
<H6> Pour un titre de niveau 6 </H6>
REMARQUE : Lorsque vous utilisez ces tags pour des titres ou du texte, les caractères inclus sont toujours en caractères gras et un retour à la ligne inclut automatiquement un saut de ligne sans avoir à placer <BR> ou <P>
Tag Center ou Centrage d'un titre
Pour centrer votre titre (ou un texte) au milieu de la page vous allez ajouter ce nouveaux tag :
Il s'agit encore de choix, mais vous pouvez toujours faire à votre convenance des essais pour comparer. et voici le tag avec son attribut FACE à utiliser :
comparez avec les polices de base, Helvetica, Times, Arial, Chicago, Monaco et gardez en mémoire que théoriquement tous les ordinateurs possèdent les polices suivantes installées d'origine : Arial, Times New Roman, Courier New et Symbol.
Tag Font Color ou Couleur du texte
"#FF0000" pour le rouge, "#000000" pour le noir et "#0000FF" pour le bleu.
Tag Font Size ou Taille des caractères du texte
On parle aussi du Corps d'un caractère, et vous avez le choix entre ces deux écritures :
modèle b) <FONT SIZE="4"> ou <FONT SIZE=4>
Avec l'attribut SIZE il n'est plus question du titre et de niveau, mais du corps fixé aux caractères pour rédiger le texte. Vous pouvez choisir une valeur entre "1" la plus petite taille et "7" la plus grande, avec par défaut la valeur "3" définie dans votre navigateur. ( pour info : Cette valeur correspond au corps 12 d'un logiciel de traitement de texte.)
Modèle a) : si vous conservez la valeur 3 par défaut,
et si vous choisissez une taille plus petite que "3", vous codez par exemple
<FONT SIZE="-2"> ce qui correspond à la plus petite taille admise
vu que 3 par défaut moins 2 = 1------> voici le
résultat égal à la taille 1 .
De même si vous voulez par exemple une taille plus grande il faut placer le tag <FONT SIZE="+2"> et, 3 par défaut plus 2 = 5--------> voici le résultat taille 5.
Modèle b) : dans ce deuxième modèle le résultat
sera identique mais sur une base différente de raisonnement, à
savoir que si vous voulez obtenir le corps de la valeur par défaut
vous placez <FONT SIZE=3>. Si vous choisissez une taille plus petite
que "3", vous placez le tag <FONT SIZE=1> ce qui correspond à
la plus petite admise ------> voici le résultat
taille 1.
De même si vous voulez par exemple une taille plus grande vous
placez alors le tag <FONT SIZE=5>-------> voici le
résultat taille 5.
Notez : Il est possible d'utiliser au choix les valeurs avec ou sans les guillemets et vous obtiendrez le même résultat avec="+2" ou =+2 si vous utilisez un navigateur version 3 ou 4, alors que les guillemets étaient indispensables pour une interprétation correcte par certains navigateurs de versions antérieures
Sommaire Page perso ......@........ Caractères accentués, lignes de séparation
Tous droits réservés © 1997- 2006. www. aidenet.com
- Arborescence : (Tree structure) Vous avez créé un dossier répertoire qui est la représentation en général dans l'ordre alphabétique de l'organisation des fichiers ou dossiers à l'intérieur de l'ordinateur. On parle aussi d'arborescence pour expliquer la possibilité structurée lorsque vous pouvez visualiser un site, suivant votre choix et à l'aide de liens hypertextes. (retour texte)
- Webmaster : (Maître du Web) (webmestre) c'est le technicien du Provider chargé de la maintenance d'un Site composé d'un ensemble d'ordinateurs (serveurs du Web) utilisant des logiciels spécialisés indispensables à leur fonctionnement spécifique. (retour texte)
- Formatage : (Formatting) La structure caractérisant la présentation des informations au sein d'un ordinateur ne peut être conservée dans une page WWW qu'en utilisant des tags et attributs afin de respecter la mise en page d'origine. Cette mise en forme , texte gras, plus gros..., couleurs, titres, listes etc..., correspond au formatage du document. (retour texte)






