Hé ! Vous avez créé une page web vraiment cool -- Signez-là avec un pied de page ! Donnez la possibilité à vos visiteurs de vous envoyer un mail directement depuis votre site !
Après cette leçon, vous pourrez :
Note : Si vous n'avez pas les documents des leçons précédentes, téléchargez une copie maintenant.
Une fonctionnalité intéressante des pages web est le "pied de page", au bas d'une page, qui fournit des informations sur l'auteur et sur le document, comme par exemple la date de dernière modification ou la possibilité d'envoyer un message par mail à l'auteur.
C'est l'endroit du tag address qui stylise simplement un bloc de texte en italiques et l'indente sur une nouvelle ligne.
Vos pieds de page doivent être brefs, informatifs et cohérents entre vos différentes pages web. Les informations utiles à inclure sont :
Pour exemples, regardez les pieds de page au bas de chaque page de ce didacticiel. Pour créer votre propre style, jetez un coup d'oeil sur d'autres pages web pour des idées. L'imitation est toujours une très haute forme de reconnaissance !
Le code HTML du tag address est :
<address>
texte texte texte texte texte texte texte texte texte
texte texte texte texte texte texte texte texte texte
</address>
Notez que tout le HTML à l'intérieur du tag address est "légal" ; donc, nous pourrions le modifier avec des tags gras, des retours ý la ligne et un lien hypertexte :
| HTML | Résultat | ||
|---|---|---|---|
<address> <b>Titre de La Page</b><br> Dernière Modification : 31 Février 1999<br> Page Web par Alan Levine (alan.levine@domail.maricopa.edu) <br> <a href="http://www.mcli.dist.maricopa.edu/"> Maricopa Community Colleges</a><br> </address> |
|
Maintenant, supposons que quelqu'un lise votre page et veuille vous envoyer un commentaire sur la beauté de votre travail. Elle / Il devrait noter votre adresse email, démarrer un autre programme et vous envoyer le message. Ne serait-ce pas super si on pouvait envoyer un mail depuis votre navigateur web ? Il est vrai que maintenant, la majorité des navigateurs web le permettent !
Le moyen de le faire est de créer un lien hypertexte avec l'attribut mailto dans l'URL (voir la leçon 8b pour se rafraichir la mémoire). Créez un lien hypertexte email comme ceci :
<a href="mailto:bsbens@hotmail.com">envoyez un mail à Bernard</a>
Quand on clique sur le texte envoyez un mail à Bernard, le navigateur web affiche un écran dans lequel vous pouvez composer un message et me l'envoyer. De plus, vous pouvez même insérer un sujet par défaut pour le message (NOTE : cela peut ne pas marcher sur certains navigateurs) :
<a href="mailto:bsbens@hotmail.com?subject=Salut depuis la leçon 12">
envoyer un mail à Bernard</a>
Essayez ! Envoyez-moi un mot ! envoyer un mail à Bernard
Et vous pouvez ajouter encore plus de choses au lien mailto. Si vous vouliez envoyer le même message à plusieurs adresses, par exemple le Président et le Vice-Président des Etats-Unis, tapez simplement leurs adresses email séparées par des virgules (notez que votre code HTML devrait se présenter sur une seule ligne, nous l'avons présenté sur plusieurs lignes pour un meilleur confort de lecture) :
<a href="mailto:bsbens@hotmail.com,pres@whitehouse.gov,
vice-pres@whitehouse.gov?subject=Salut depuis la leçon 12">
envoyer un mail à Bernard, au Président et au Vice-Président des Etats-Unis</a>
Disons que le Vice-Président doive être uniquement en copie ("cc:") de ce message. Il vous suffit d'ajouter une autre ligne après le sujet en utilisant cc= et l'adresse email. Notez que les lignes Subject= et cc= sont séparées par un & :
<a href="mailto:bsbens@hotmail.com,pres@whitehouse.gov,
?subject=Salut depuis la leçon 12&cc=vice-pres@whitehouse.gov">
envoyer un mail à Bernard et au Président ; mettre le Vice-Président en copie</a>
Et enfin, vous pouvez essayer d'insérer un message par défaut en utilisant la syntaxe body= et le texte qui devrait apparaître dans le corps du message :
<a href="mailto:bsbens@hotmail.com,pres@whitehouse.gov,
?subject=Salut depuis la leçon 12&cc=vice-pres@whitehouse.gov
&body=Salut, je pense que Bernard mérite un diner chez vous.">
envoyer un mail à Bernard, au Président ; mettre le Vice-Président en copie, avec un message par défaut</a>
S'il vous plait, n'essayez pas d'envoyer ces messages ! Bernard aime les mails mais n'ennuyez pas les gars de la Maison Blanche !
Maintenant, retournons à notre exemple de Volcan. Notez que vous pouvez utiliser n'importe quel texte (ou image) comme lien hypertexte. Nous allons donc modifier le HTML de l'exemple précédent pour que l'adresse internet soit le lien email.
| HTML | Résultat | ||
|---|---|---|---|
<address> <b>Titre de La Page</b><br> Dernière Modification : 31 Février 1999<br> Page Web par Alan Levine <A HREF="mailto:alan.levine@domail.maricopa.edu"> (alan.levine@domail.maricopa.edu)</A> <br> <a href="http://www.mcli.dist.maricopa.edu/"> Maricopa Community Colleges</a><br> </address> |
| ||
| Et finalement, nous vous conseillons de rajouter l'URL de votre page dans le pied de page. Pourquoi ? Et si quelqu'un imprime votre page web mais ne l'ajoute pas dans ses signets ou ne note pas l'URL ? Inclure l'URL sur la page fournit une référence utile. Modifiez simplement l'exemple ci-dessus (notez que l'URL est sous le tag <address>...</address> : | |||
| HTML | Résultat | ||
<address> <b>Titre de La Page</b><br> Dernière Modification : 31 Février 1999<br> Page Web par Alan Levine <A HREF="mailto:alan.levine@domail.maricopa.edu"> (alan.levine@domail.maricopa.edu)</A> <br> <a href="http://www.mcli.dist.maricopa.edu/"> Maricopa Community Colleges</a><br> </address> <p> <tt> URL: http://www.mcli.dist.maricopa.edu/tut/ </tt> |
|
||
Maintenant, il est temps d'ajouter un pied de page à votre fichier HTML. Pour cet exemple, supposons que vous êtes "Lorrie Lava", une volcanologue de Big University (n'hésitez pas à changer les informations ci-dessous) :
<HR> <address><B>Web Volcan</B> <br> créé par Lorrie Lava, <A HREF="mailto:lava@pele.bigu.edu">lava@pele.bigu.edu</A><br> Etudes Volcaniques, <A HREF="http://www.bigu.edu/">Big University</A><p> <TT>Dernière Modification : 1er Avril 1995</TT> </address> <p> <tt>URL: http://www.bigu.edu/web/index.html</tt>
NOTE : Nous avons utilisé plusieurs tags HTML étudiés dans les leçons précédentes. Remarquez également le tag <p> supplémentaire en bas ; Ceci pour être sûr que la dernière ligne de texte est toujours visible.
Comparez votre document avec un exemple du document-type. Si votre page web est différente de l'exemple, vérifiez le texte que vous avez tapé dans l'éditeur de texte.
Revoyons les grandes lignes de cette leçon :
Ajoutez un pied de page adresse et des liens email dans vos propres documents HTML.
Encore un autre moyen de couper ces longues et ennuyeuses sections de texte ! Les Blocs de Texte ou BLOCKQUOTE...
Ecrire le HTML : Leçon 12 : Pieds de page Adresses et Liens Emails
©1994-2003
Maricopa Center for Learning and Instruction (MCLI)
Maricopa Community Colleges
La 'net connection (en anglais) à MCLI est
Alan Levine
Suggestions en Français à Bernard Bensoussan
URL: http://www.mcli.dist.maricopa.edu/tut/tut12.html