IntroductionLes pages précédentes montraient comment utiliser Microsoft Word 97 ou Netscape Composer pour créer une page Web. Mais, éventuellement, il faudra que vous entrez dans le code HTML pour pouvoir changer ou ajouter une option. Comme mentionné à la page de conception de pages Web avec Word, tous les codes en format HTML se retrouvent entre des "<" et des ">". La plupart de ces codes fonctionnent aussi en paires: le premier pour activer la commande et le second pour la terminer. La seule différence entre les deux est que le dernier a le caractère "/" en plus dans le code. Par exemple, les codes <P> et </P> indiquent le début et la fin d'un paragraphe. Il y a aussi certains codes qui sont nécessaires. Les commandes de baseCertains codes sont essentiels pour que le fureteur reconnaisse que le fichier soit une page Web. <HTML> Ce que vous avez au-dessus sont les codes de base pour une page Web. Une page Web commence toujours par le code <HTML>. C'est de cette manière que le format est reconnu par les éditeurs de pages Web. Ensuite suit la section <HEAD> qui inclus le nom de la page (<TITLE>) qui va apparaître sur la barre titre de la fenêtre lors de l'affichage de la page dans un fureteur. C'est à l'intérieur des codes <BODY> que se retrouve le texte de la page. Souvent, le premier code BODY inclus des options telles que la couleur de fond (<BACKGROUND>) ou le nom de l'image qui sert de motif de fond de la page. Voici quelques options possibles pour la commande BODY.
Ex.: <BODY BACKGROUND="bk21.gif" TEXT="blue" LINK="red" VLINK="yellow" ALINK="green"> La présentationEntre les commandes <BODY> et </BODY>, il y a le texte qui compose la page Web. Il est cependant toujours possible de changer la présentation du texte. Les commandes qui suivent vous donne une idée de ce qui est possible d'accomplir en format HTML pour la présentation du texte.
Les imagesL'un des élément qui a rendu le World Wide Web si populaire est sa possibilité d'afficher des images. Voici un exemple du code pour l'image plus.gif <IMG SRC="plus.gif" ALT="+" HEIGHT="10" WIDTH="10" BORDER="0"> Voici le résultat Le code précédent indentifie une image. L'option SRC indique le nom et si nécessaire le chemin (en adresse absolue si nécessaire) pour trouver l'image en question. L'option ALT affiche du texte si, pour une raison ou une autre, l'image n'apparaîtrait pas. Ceci laisse toujours une référence aux lecteurs de la page. Cette option est encore plus importantes pour les lecteurs de pages Web ayant un hadicap visuel. Les options HEIGHT et WIDTH réservent l'espace nécessaire pour afficher l'image. De cette manière, le fureteur réserve l'espace et continue d'afficher le reste du texte de la page. Par après, il revient et affiche les images dans les espaces réservés. Si cette option n'est pas utilisée, la présentation du texte de la page est ralentie puisque le fureteur doit premièrement lire l'image avant de réserver l'espace. L'option BORDER sert à déterminer l'épaisseur du contour de l'image. Si l'option n'est pas là, il n'y aura pas de bordure autour de l'image (BORDER="0"). Les liens et les signetsL'élément le plus important d'une page Web, après son contenu, est le lien à une autre page Web. Il est impensable de concevoir une page Web sans envisager de créer un ou plusieurs liens à d'autres pages Web. D'ailleurs le nom du service, le Web, provient du fait que toutes les pages disponibles sur l'Internet sont entre-reliées. Il y a aussi les codes pour les liens et les signets. <A HREF="acct.htm">Les tables</A> Ce code représente un lien à une autre page Web (acct.htm) avec une adresse relative. Il y a aussi le texte qui apparaît à l'écran sur lequel vous appuyez pour vous rendre à cette page. <A HREF="#intro">Introduction</A> Le code ci-dessus est un lien à un signet qui se retrouve quelque part sur la même page Web actuelle. <A NAME="test"></A> Ceci est un signet de la page. Le nom de celui-ci est "test". Lien à une adresse de courrier électronique <A HREF="mailto:adresse_de_courrier_électronique@de_votre_choix"> Ex.: <A HREF="mailto:lecompagnon@lecompagnon.info"> Lien à un fichier ou document qui n'est pas une page Web ou une image. <HREF="nom_du_document_incluant extention_si_nécessaire"> Ex.: <HREF="courrier.ppt"> Autres services: FTP, Gopher, newsgroups Target (pour les "frames" ou les cadres) Liens sur un Imagemap avec des formes: Les tableauxIls sont utile pour une grille mais aussi pour écrire du texte sur plusieurs colonnes. Le format HTML n'a pas de commandes pour afficher plusieurs colonnes. Il est cependant possible de contourner cette limitation en écrivant le texte dans des cellules d'un tableau. Voici quelques-uns des codes que vous allez retrouver dans un tableau.
COLSPAN, ROWSPAN Les formulairesLes formulaires permet au concepteur de pages Web d'avoir un contact avec les lecteurs sans avoir à passer par le courrier électronique. De plus le concepteur peut demander de l'information précise puisqu'il conçoie le formulaire.
Les frames ou les cadresFRAMESET Découpe l'écran en plusieurs partis horizontalement ou verticalement en autant de parties que vous avez besoin. Le découpage peut se faire selon le nombre de "pixels" ou selon un certain pourcentage de l'écran. <NOFRAME> Texte de la page </NOFRAME> Incrire du texte pour les usagers qui n'utilisent un fureteur qui supporte l'option des cardre. Ceci est de plus en plus rare. Les autres commandesCaractères spéciaux Parmi les codes, il y a ceux pour les caractères spéciaux.
Le format HTML a été premièrement conçu pour
du texte en anglais. C'est ensuite que des codes ont été
ajoutés pour les caractères des différentes langues
de la planète. Voici quelques-uns des codes pour la langue française.
<! vos commentaires> Remarques qui ne seront pas pris en considération par le fureteur. Comme mentionné ci-dessus, la commande <META> peut être utilisé pour mieux décrire votre page Web. Cette commande se place entre les commandes <HEAD> et </HEAD> au début de la page. Placez-le immédiatement après les commandes <TITLE> et </TITLE>. Le <META> offre plusieurs options comme vous allez le voir. Elle se découpe en deux parties: le nom et le contenu. Voici pour commencer les deux plus populaires. <META NAME="KEYWORDS" CONTENT="Liste des mots clés,séparés,par,une,virgule"> Cette commande caché offre au site de recherche les termes qu'il pourra mettre dans différentes catégories. Certains sites de recherche n'aiment pas avoir des espaces à côté de la virgule. N'en mettez pas! <META NAME="DESCRIPTION" CONTENT="Une courte description de votre site ou de votre page. Environ de 25 mots ou 200 caractères."> C'est la description qui va apparaître à l'écran lorsqu'une personne aura choisi l'un des mots clés que vous avez écrit. Une autre qui apparaît souvent: <META NAME="GENERATOR" CONTENT="Nom de l'éditeur avec lequel vous avez conçu cette page">. C'est l'éditeur lui-même qui l'ajoute. Un peu de promotion quoi! En voici d'autres. <META NAME="AUTHOR" CONTENT="Nom de l'auteur de la page (votre nom)"> Certain sites de recherche vous permet de chercher selon l'auteur de la page. Il faut cependant que le bon <META> soit présent! <META NAME="COPYRIGHT" CONTENT="Les droits d'auteur vont à (votre nom), année de composition (ex.: 1998)"> Les droits d'auteur. <META NAME="EXPIRES" CONTENT="Date en anglais ex.: 1 january 2001"> Date ou la référence à cette page sera retiré de la base de données du site. Pour vérifier si une page est encore valide, certains sites de recherche utilisent des "araignées" (spiders), des petits automates qui valident l'existence d'une page. Avec un peu de recherche, j'ai trouvé ces autres "META TAGS" qui pourraient vous aider à identifier votre page. Ceci est plus pour de l'information générale sur la page que pour identifier la page avec des mots clés. <META http-equiv="Publication_Date" CONTENT="Date de publication"> Le dernier META TAG est intéressant pour "rafraichir" la page ou lorsque vous "déménager" votre site sur un autre serveur. La commande permet de charger une autre page Web automatiquement après un certain tempa. <META http-equiv="Refresh" CONTENT="(nombre de secondes d'affichage);url=(adresse de la page Web à afficher)"> Elle est intéressant si vous déménager votre site, si possible, vous pouvez laissez une page Web sur l'ancien serveur avec la commande "refresh" qui redirige les lecteurs au nouveau site. De cette manière, vous pouvez conserver les utilisateurs réguliers à votre site en les informant de la nouvelle adresse. Pour vous démontrer le fonctionnement de cette commande, vous pouvez cliquer ici. Ce lien va vous transférer à une page Web ayant une commande "refresh". Vous serez de retour au paragraphe suivant dans 30 secondes. On peut aussi s'en servir pour afficher rapidement plusieurs petites pages pour en faire un genre de promotion. Une personne m'a même mentionné la possibilité d'un "carousel" ou plusieurs pages Web font une boucle infini. N'oubliez pas dans ce cas d'ajouter un lien ou un bouton de navigation pour "sortir" de la boucle!
|
Abonnez-vous à l'infolettre Abonnez-vous à l'infolettre du site pour recevoir le manuel " 150 fonctions Excel expliquées ". Vous recevrez aussi les prochaines infolettres sur les nouveautés du site et des formations détaillées que vous ne trouverez nulle part ailleurs. |