Bo�te � outils

Quelques petites astuces

Vous trouverez dans cette section des informations pratiques destin�es � vous aider dans la cr�ation de votre page ou de vos graphiques. Les r�ponses courtes et simples sont indiqu�es directement dans le tableau ci-dessous; celles qui doivent �tre plus d�taill�es sont expliqu�es sur des pages distinctes.

Pour...	Il faut...
Diviser facilement une page en plusieurs sections diff�rentes	Consulter les explications sur cette page.
R�cup�rer des images sur un site	Placer le curseur sur l'image de votre choix, puis cliquer avec le bouton droit de la souris, ce qui fera appara�tre un menu contextuel; dans ce menu, cliquer sur "Enregistrer l'image sous...", puis choisir le r�pertoire de votre disque dur dans lequel devra �tre enregistr�e l'image, et cliquer sur "Enregistrer".
Utiliser une image comme fonds d'�cran dans une page web	utiliser le code suivant : <body background="image.jpg"> o� image.jpg est � remplacer par le nom de l'image de votre choix.
Emp�cher le fond d'�cran de se r�p�ter et le maintenir fixe	Configurer le code de fond d'�cran comme suit : <body background="image.jpg" style="background-repeat: no-repeat; background-attachment: fixed"> o� background-repeat: no-repeat signifie que le fond ne se r�p�te pas et background-attachment: fixed signifie que le fond ne d�file pas en m�me temps que le texte.
Ajouter de la musique de fond	Ajouter le code suivant : <EMBED SRC="fichier_son.mid" WIDTH="50" HEIGHT="80" AUTOSTART="true" LOOP="-1"> o� WIDTH="50" et HEIGHT="80" correspondent aux dimension du panneau de contr�le. Si vous ne souhaitez pas afficher le panneau de contr�le, remplacez ces valeurs par ce code : HIDDEN="true" . AUTOSTART="true" indique que la musique doit d�marrer automatiquement � l'affichage de la page. LOOP="-1" (il est possible d'indiquer aussi "infinite" au lieu de "-1") indique que la musique doit jouer sans interruption (revient au d�but automatiquement et joue de nouveau). Si vous souhaitez sp�cificer le nombre de fois, indiquer la valeur (5, par exemple).
Ajouter des bordures de couleur aux cellules des tableaux	Configurer le code de cellule de la mani�re suivante : <td style="border-top: 2 solid #CE8E45"> o� border-top: signifie que la bordure s'applique � la partie sup�rieure de la cellule (voir l'exemple de la cellule de cette rubrique). Les autres possibilit�s sont border-right, border-bottom et border-left. 2 solid signifie que la bordure fait 2 pixels de large et qu'elle est pleine #CE8E45 correspond au code hexad�cimal de la couleur de la bordure.
Choisir la couleur du texte	<font color="#FF0000>Texte de couleur rouge</font> <font color="#0000FF>Texte de couleur bleue</font> <font color="#000000>Texte de couleur noire</font> Pour conna�tre les codes correspondant � chaque couleur, vous pouvez par exemple consulter cette petite pallette de ma composition.
Faire ouvrir les liens dans une nouvelle fen�tre	<a href="http://www.yahoo.fr" target="_blank"> Pour que les liens s'ouvrent toujours dans la m�me fen�tre, il suffit de donner un nom quelconque � la cible ("target") et de l'attribuer � tous les liens. Exemple : <a href="http://www.voila.fr" target="_cherche"> <a href="http://www.nomade.fr" target="_cherche"> <a href="http://www.toile.qc.ca" target="_cherche"> Le premier lien cliqu� va "cr�er", c'est-�-dire ouvrir, une nouvelle fen�tre qui s'appelera "cherche"; tous les autres liens s'ouvriront ensuite dans cette fen�tre.
Enlever le soulignement des liens et changer la couleur lorsque la souris passe dessus.	Recopier ce code � l'int�rieur des balises <HEAD></HEAD> : <style TYPE="text/css"> <!-- A:link {font: 12pt Verdana,sans-serif; text-decoration: none; color: #66CCFF;} A:visited {font: 12pt Verdana,sans-serif; text-decoration: none; color: #FFCC66;} A:active {font: 12pt Verdana,sans-serif; text-decoration: none; color: #007171;} A:hover {font: 12pt Verdana,sans-serif; text-decoration: none; color: #33FF66;} --> </style> Il s'agit de fonctions de feuilles de styles (CSS - Cascading Style Sheet). Le soulignement est d�sactiv� gr�ce au param�tre text-decoration: none, Pour personnaliser l'aspect des liens : Modifier la grosseur des caract�res et le type de police (font: xxpt Verdana,sans-serif;) Indiquer une couleur diff�rente pour chacun des �tats du lien (color: #XXXXXX;). � noter : dans Netscape, la fonction A:hover (changement de couleur au passage de la souris) ne fonctionne pas.
Ajouter du texte sur un bouton	Il existe un site qui permet d'effectuer cette op�ration en ligne gratuitement: ImageMagick Studio. Par contre, comme il est en anglais, voici quelques explications sommaires qui vous permettront de l'utiliser facilement. Dans l'espace intitul� Filename, cliquer sur le bouton Parcourir et aller s�lectionner sur votre disque dur le bouton sur lequel vous voulez ajouter du texte. Cliquer ensuite sur le bouton View. Votre bouton appara�tra au centre de l'�cran, juste en-dessous d'une s�rie d'onglets permettant d'effectuer des retouches graphiques. Cliquer sur l'onglet Annotate. Dans l'espace intitul� Text, taper le texte � ajouter sur le bouton. Juste en dessous, l'espace Location and Gravity permet de positionner le texte sur le bouton. Par exemple, pour un texte centr� au milieu (avec un bouton de Grenadine/Webd�co, par exemple) entrer les valeurs +0+10 et "Center" dans le menu d�roulant juste � droite (pour ajuster plus pr�ci�ment, modifier les valeur jusqu'� obtention du r�sultat souhait�). Attention : avant de cliquer sur annotate, descendre plus bas dans la page pour choisir les options du texte (font, couleur, etc.). Cliquer ensuite sur annotate. Une nouvelle page s'affichera avec le bouton contenant le texte. Lorsque vous �tes satisfait du r�sultat, cliquer sur le bouton output dans la s�rie d'onglets de la barre sup�rieure (deuxi�me en partant de gauche). Dans l'espace Format, choisir "gif". Si vous n'�tes pas familier avec le graphisme, conserver les options par d�faut des autres param�tres. Cliquer sur le bouton output. Une nouvelle page s'affichera avec le bouton cr�� aparaissant sur un fond gris. En cliquant dessus, il s'affichera sur une nouvelle page blanche. Pour le r�cup�rer, proc�der comme habituellement quand vous r�cup�rez une image sur le net. Voil�; il suffit de r�p�ter l'op�ration pour chaque nouveau bouton sur lequel vous souhaitez ajouter du texte. Si tout ceci vous semble trop compliqu�, vous pouvez �galement utiliser la m�thode expliqu�e dans le tutorial Ajouter du texte sur un bouton

Dallages
Unis
Figuratifs
Verticaux
Bases pour bannières
Boutons
Mini-gifs
Cliparts
Photos
Polices