Créer son internet: février 2011

Une page HTML est composée de commandes HTML appelées instructions.

- Toutes les commandes HTML sont introduites par des tags:
Ce sont des tags d'ouverture ou de fermeture; <title>...</title>
Le tag de fermeture se différencie par sa barre oblique (slash).
- Les commandes html sont en anglais, elles sont l'abréviation d'un
terme anglais.
- Elles ne font pas la différence entre les majuscules et miniscules.
- Les caractères spéciaux et accents sont codés;
Exemple: Caractère Code Entity
é &eacute
è &egrave
Pour apporter des précisions aux commandes HTML, on utilise des attributs;
Exemple: <h1 align="center"> Votre titre principal centré</h1>
h1: abréviation de heading, c-a-d "titre", cette commande introduit
un titre important.
align="center" : L'attribut est align et sa valeur introduite par des guillemets est center.

Toutes pages HTML commence par l'instruction <html>
et se terminent toujours par l'instruction</html>.
La structure de base est donc;
<html>
...
</html>

L'intèrieur de votre page HTML se compose de deux parties:
L'en-tête (header) et le corps (body).
L' en-tête:
Celui-ci permet de donner des informations importantes sur votre
page et n'est pas affiché dans le navigateur.
Il se situe entre <head> et </head>
L'unique commande affichée est votre titre qui sera visible
dans la barre de titre du navigateur.

Le body:
Entre <body> et </body> se trouvent le texte, les liens,
les éléments graphiques etc...

Au début du body, on commence par définir la couleur de
fond de votre page, la couleur de votre texte, la couleur des
liens, la couleur des liens déjà activés, la couleur des liens
au moment du clic.
Ce qui vous donnera:
<body bgcolor="#FFFFFF" text="#000000" link="#CCCCCC"
vlink="#CCCCCC" alink="#E9E6E6">
L'attribut bgcolor définit la couleur de fond
" " text " " du texte
" " link " " des liens
" " vlink " " des liens déjà activés
" " alink " " des liens au moment du clic
Pour définir la couleur, vous avez deux possibilités;
Indiquer son code hexadécimal;
Ex: <body bgcolor="#FFFFFF">
Indiquer son nom;
Ex: <body bgcolor="red">

Pour insérer une image, vous devez utiliser le tag <img>
et faire référence au fichier graphique lui correspondant.
Votre fichier graphique se nomme par exemple "animaux.gif".
Votre image devra se trouver au préalable dans le dossier de votre
page.
Ce qui donnera; <img src="animaux.gif">
Dans le cas où le fichier graphique que vous souhaîtez intégrer
se trouve sous une autre URL que la votre, il vous faudra indiquer le
chemin lui correspondant.

Les liens:
La commande d'insertion d'un lien se nomme <a> et possède deux attributs;
. href: définit une destination
. name: définit un signet

L'attribut href est le plus important. Comme nous l'avons vu précedemment pour la structure d'un site, vos fichiers sont
enregistrés dans un dossier (correspondant à votre page d'accueil)
et sous- dossiers. Vos liens vont suivre la structure de votre site;
Ce sont les deux points suivi d'une barre oblique qui représentent
l'itinéraire de votre arborescence et les niveaux de votre site:
<a href="../fichier.htm"> texte</a>.
Exemple:
Vous souhaîtez faire un lien vers un fichier se trouvant
dans le même dossier que votre page d'accueil;
L'instruction sera donc: <a href="fichier.htm">texte </a>
Les deux points ne sont pas présent. Votre fichier se trouvant
au même niveau que votre page .
Vous souhaîtez maintenant établir un lien vers un sous-dossier
(nommé par ex "s1")
se trouvant à deux niveaux supérieurs dans votre arborescence.
L'instruction sera donc: <a href="../../s1.htm">texte</a>

L'attribut name permet de définir un signet ou ancre.
Cet attribut est pratique pour se déplacer à l'intérieur d'une même
page ou d'une autre page pour arriver à un endroit précis.
Vous commencez par sélectionner le mot vers lequel vous souhaîtez
faire pointer votre ancre.
Ce qui vous donne: <a name="nom"> définition de l'ancre</a>
C'est le caractère # qui indique que la destination est un signet.
L'instruction sera: <a href="#nom">texte du lien</a>
Pour faire pointer une ancre vers une autre page de votre
arborescence, vous devez indiquer le chemin lui correspondant.

Ajoutez title à vos balises de liens ou image, votre référencement n'en sera que meilleur,
par exemple :
<img src="http://www.uvnet.fr/logo_flux_rss.png" width="30" height="30" border="0" title="flux rss actualité webmaster"/></a>

10 étapes pour réussir son référencement

1/ La création de votre site
Vous devez avoir un contenu de qualité, c'est avant tout la base essentielle.
Vos pages devront contenir suffisemment de texte.
N'utilisez pas de javascript,de frames.

2/ L'importance de votre nom de domaine
Vous aurez plus de chance d'apparaitre dans les premiers résultats
si vous avez le mot clef dans votre nom de domaine.

3/L'architecture de vos pages est importante, créer des maillages internes
en reliant vos pages entre elles.

4/ Soignez vos balises Title, Alt et meta-description.
Choisissez un titre différent pour chacune de vos pages (en rapport avec
votre page bien entendu).

5/ Votre site doit être construit selon les standards du web.
Créer un fichier CSS afin d'avoir un code source propre et homogène.

6/ Inscrivez-vous dans des annuaires à fortes fréquentations.
Effectuez des partenariats avec des sites en rapport avec votre thématique
Pour être visible, créer des bannières publicitaires.

7/ Effectuez votre référencement manuellement, pas de soumission automatique
Faîtes une description unique pour chaque soumission

8/ Utilisez les réseaux sociaux en vous créant une page sur facebook et Twitter
principalement. Créez-vous un blog.

9/ Faites des communiqués de presse.
Utilisez les Digg like en rédigeant quotidennement des articles.

10/ Créez un Flux rss, votre sitemap et inscrivez-vous sur google analytics pour suivre
l'évolution de votre site

Mettez à jour quotidiennement votre site, ajoutez de nouvelles pages et
continuez à vous référencer manuellement.

Créer son internet

mercredi 9 février 2011

mardi 8 février 2011

HTML: instructions et éléments de base

10 étapes pour un bon référencement