Crer son site web Chapitre II Balise Mta

Créer son site web Chapitre II

Balise Méta Les balises <META> sont des balises situées entre <head> et </head>, elles permettent d'indiquer aux moteurs de recherche un certain nombre d'informations sur le contenu d'une page. Les robots des moteurs viennent "aspirer" ce code pour le copier sur leurs disques et en faire un index de recherche par la suite. Syntaxe: <META NAME=". . . " CONTENT=". . . "> Exemple: <meta name="keywords" content=" suite de mots séparés par « , » "> <META NAME="Language" CONTENT="fr">

Exemple de la balise <Meta> Balise ouvrante Contenu textuel <html><head> <title> Centre de recherche et de developpement pédagogique</title> <meta name="keywords" Content=" beyrouth, beirut, education, liban, lebanon, curriculum "> <meta name="Reply-to" CONTENT="president@crdp. org"> </head> <body bgcolor=“blue”> </body> </html> Couple (attribut, valeur) Balise fermante

Exemple de la balise <Meta> <html><head> <title> Centre de recherche et de developpement pédagogique</title> <meta name="keywords" Content=" beyrouth, beirut, education, liban, lebanon, curriculum "> </head> <body bgcolor="blue"> </body> </html>

Exemple de la balise <Meta> La balise <META> joue un rôle très important pour les “moteurs de recherche” dans leur recherche aux pages web. Meta tag n’apparaît pas dans la page <head> <meta name="description" content= " education, mehe, crdp, lebanon… " > <meta http-equiv="content-type" content= "text/html; charset=UTF-8 " > </head>

<Meta> Description de la page. Chaque page DOIT avoir une description indépendante ! Entre 100 et 1000 caractères. Cette description est fréquemment reprise par les annuaires qui indexent votre site. Elle est également utilisée pour présenter un résumé de votre page dans les résultats des moteurs de recherche. Exemple : <META NAME="Description" CONTENT="Rôle et description des balises Meta">

<Meta> Distribution Définie la destination (publique) des documents présentés dans la page. Zone non obligatoire et de peu d'intérêt. Elle est sans doute utilisée par quelques très rares annuaires. Valeurs possibles : global, local, iu (intranet) Exemple <META NAME="Distribution" CONTENT="global">

<Meta> Generator Logiciel(s) utilisé(s) pour créer la page. Zone inutile. Exemple <META NAME="Generator" CONTENT="Golive">

<Meta> Identifier-URL Adresse (url) du site. Zone non obligatoire et de peu d'intérêt Si vous utilisez cette zone, mettez la même URL sur toutes les pages de votre site ! Exemple <META NAME="Identifier-URL" CONTENT="www. crdp. org">

<Meta> Keywords Liste de mots clés. Zone utile : certains annuaires s'en serviront pour indexer votre site. Le moteur de recherche Voila semble également en tenir compte dans ses classements. Seuls les mots clés qui figurent dans le reste de la page seront réellement pris en compte par les robots. Exemple <META NAME="Keywords" CONTENT= « éducation, liban, lebanon, crdp, cerd, Webmaster …">

<Meta> Reply-to Elle permet de positionner le sefeur vers un nouveau emplacement: • Adresse email du webmaster. • Zone qui peut être utile. • Nouveau adresse du site web. Exemple <META NAME="Reply-to" CONTENT="webmaster@crdp. org">

<META> HTTP-EQUIV <META HTTP-EQUIV=". . . " CONTENT=". . . "> Type: Définit la table de caractères à utiliser. Par défaut c'est la table de caractères occidentale (text/html; charset=iso-8859 -1) qui sera utilisée. Exemple <META http-equiv="Content-Type" content="text/html; charset=iso-8859 -1">

<META> HTTP-EQUIV <META HTTP-EQUIV=". . . " CONTENT=". . . "> Language: Langue du site. Valeurs possibles : fr : Français en : Anglais ou Américain de : Allemand Si votre page est en plusieurs langues, séparez ces codes par des virgules. Exemple <META http-equiv="Content-Language" content="fr, ar, en">

Codes couleur dans HTML Pour définir une couleur dans une page web on utilise deux types de codages basés sur le système RGB (Red, Green, Blue) qui sont les suivants: 1. Coder les couleurs par leurs noms: green, blue, red, black…etc 2. Utilisation des codes héxadécimales d’une couleur

<META> HTTP-EQUIV <META HTTP-EQUIV=". . . " CONTENT=". . . "> Refresh: Réactualiser automatiquement la page toutes les n secondes. <META http-equiv="Refresh" content="10"> (pour 10 secondes) OU Rediriger automatiquement le navigateur vers une autre page au bout de n secondes Exemple <META http-equiv="Refresh" content="10; URL=http: //www. google. com">

Formulaire (Form)

Form name: spécifie le nom de la forme. action: spécifie la URL de script qui recevra les données téléchargées. method: précise la méthode à utiliser pour télécharger des données. Il peut prendre différentes valeurs, mais le plus souvent utilisés sont GET et POST. target: spécifie la page cible où le résultat du script s'affiche. Il prend des valeurs comme _blank, _self, _parent etc.

Form simple <FORM ACTION= " brevet. asp" METHOD="get " > <p align="center " >Entrer votre numéro: <INPUT type="text" NAME="numbrevet" SIZE="37"> </p> <P align="center" > <INPUT type="submit" VALUE = " Recherche" Name="submit" > </P> </form>

Text Area <form name="myform" action=“memo. asp" method="POST" > <div align="center " > This is outside the area <textarea cols="40" rows="5" name="myname " > Ecrivez ton avis ici: </textarea> Vous ètes maintenant hors Textarea. </div> </form>

Check box <html> <body> <form id="checklist"> <label><input type="checkbox" name="buy" />Buy some tee</label> <br /> <label><input type="checkbox" name="brew" />Prepare the tee</label> <br /> <label><input type="checkbox" name="drink" />Drink tee</label><br /> <P> Choose one t send by email</p> <button onclick="send. Mail(abdonada@hotmail. com); return false">Send Mail</button> </form> </body> </html>

Option Button <html><body> <form method="POST" action= " option. asp " ><p> <select name="mycar" > <option value= " model 1" >Fiat</option> <option value= " model 2 " >Mercedes</option> <option value= " model 3 " >Renault</option> </select> <input type="submit" value="Submit" name="B 1" > <input type="reset" value="Reset" name="B 2" > </p></form></body></html> </body>

Drop Down Box <form method="POST" action=" option. asp " > <p> <select> <option> Milk </option> <option> Coffee </option> <option> Tea </option> </select> <input type="submit" value=“submit" name="B 1" action= " option. asp " > <input type="reset" value="Reset" name="B 2"> </p> </form>

Password <html><body> <form name = "mypassword" action = mailto: ayammine@mehe. gov. lb method= "post"> First: <input title="Please Enter Your First Name" id="first" name="first" type="text" size="12" maxlength="12" /> Last: <input title="Please Enter Your Last Name" id="last" name="last" type="text" size="18" maxlength="24" /><br /> Password: <input type="password" title="Please Enter Your Password" size="8" maxlength="8" /><br /> <input type="submit" value="SUBMIT" /> </form> </body></html>