Créer sa page web
Tests, conformité, validité
- Utilisation avancée
- Conception du site
- Tester l'affichage de son site
- Vérifier la conformité de ses pages
- Firefox : Web Developer et FireDebug
- Vérifier la validité des liens hypertexte
Déplacé : Ajouter des fonctionnalités
- - Recherche sur le site
- - Météo sur le site
- - Afficher une vidéo dans une page web
- - Trier le contenu d'un tableau
- - création de diaporama et galeries d'images
- - création d'un menu de navigation
Déplacé : Restrictions, interdictions, redirections :
- Interdire l'accès au contenu des dossiers
- Faire une redirection de page
- Les fichiers .htaccess et robots.txt
- Anti aspirateur de site (05/03/09)
Déplacé page suivante :
- Gestion du site
- - Statistiques et classements
- - Référencement
- - Le fichier sitemaps.xml
- - Publicité
- . publicité avec Google AdSense
- Evolution du site
- - Nom de domaine
- - Hébergement
- Informations et aide à la création
- - sites d'aide et de conseils
- - sites de téléchargement
- - les forums de discussion
Utilisation
avancée :
Après avoir créé son site perso chez son FAI, on peut avoir envie de passer à la vitesse supérieure ;-)
D'abord au niveau de la conception du site :
- vérifier la conformité de ses pages
- vérifier la validité de ses liens hypertexte,
- incorporer une fonction de recherche,
- utiliser le php (déplacé)
Au niveau de la gestion du site :
- obtenir des statistiques sur la fréquentation de son site,
- référencer son site,
- faire de la publicité sur son site
Au niveau du développement du site :
- acheter un nom de domaine,
- faire héberger son site chez un hébergeur de site web,
Améliorer la conception du site :
Améliorer
la conception du site :
D'abord, vérifier la conformité de ses pages, puis,
- utiliser le php, (ex : pour créer un forum),
- incorporer une fonction de recherche,
- vérifier la validité des liens sur le site.
Tester
l'affichage de son site :
Il est utile, voir indispensable, de savoir si son site s'affiche correctement sous d'autres navigateurs Internet
que celui (ceux) que l'on utilise.
Si on en a la possibilité, il est même souhaitable de vérifier l'affichage sur Macintosh avec
le navigateur Safari.
Sur Windows XP :
Il y a trois navigateurs principaux :
- Internet Explorer (5, 6 et 7)
- Firefox,
- Opéra.
Internet Explorer 6 présente des différences notables avec les deux autres, particulièrement
si on utilise les feuilles de style (CSS).
- Internet Explorer 7, le nouveau navigateur Microsoft, résoud nombre de différences.d'affichage.
Sur Macintosh OS X :
Il y a deux navigateurs principaux :
- Safari, le plus communément utilisé, très "pointilleux" quant au code CSS utilisé,
- Firefox, semblable à la version Windows.
On peut citer Internet Explorer 5.2, semblable à la version 5.1.7 pour Macintosh Classic, mais cette version n'est plus supportée par Microsoft et peu utilisée.
Sur Windows 98, et Macintosh Classic :
Les deux navigateurs principaux sont :
- Internet Explorer 5 version Windows,
- Internet Explorer 5.1.7 version Macintosh.
La compatibilité est plus difficile à obtenir avec ces deux "vieux" navigateurs.
Et je ne parle pas de Netscape dans ces anciennes versions, et autres...
Mais tout dépend de l'accessibilité que l'on souhaite donner à son site.
De toute façon, l'affichage ne posera pas de problème avec un site conçu avec des tableaux.
Mais c'est l'utilisation des feuilles de style qui amènera des incompatibilités d'affichage.
Tester sur deux navigateurs :
On peut installer sur son ordinateur différents navigateurs (Firefox, Opéra), pour vérifier
si les pages s'affichent correctement.
Ceci car les navigateurs n'interprêtent pas le contenu des pages de la même façon.
Vérifier particulièrement les différences d'affichage entre Internet Explorer et un autre navigateur.
Sites de test :
Avec Browsershots.org (gratuit) :
http://browsershots.org/
Avec Browsercam.com (payant) :
http://browsercam.com/
Voir également :
Forum.alsacreations.com - Tester son site sous lynx avec windows XP
(il s'agit d'installer Linx (simple) pour tester l'accessibilité de son site en mode texte)
Versions standalone d'Internet Explorer :
http://browsers.evolt.org/?ie/32bit/standalone
Navigateurs :
Entre janvier et mai 2008, sur aidewindows.net :
- 40% des visiteurs utilisent Internet Explorer 7
- 30% des visiteurs utilisent Firefox
- 20% des visiteurs utilisent Internet Explorer 6 SP2 (Windows XP) - 6% utilisent Internet Explorer 6 autre version.
Résolution de l'écran :
On considérera également la largeur des pages :
Entre janvier et mai 2008, sur aidewindows.net :
- 6% des visiteurs utilisent une résolution d'écran de 800 x 600 pixels.
- 40% des visiteurs utilisent une résolution d'écran de 1024 x 768 pixels
Il est donc souhaitable de s'assurer que la consultation sera possible avec cette configuration.
Vérifier
la conformité de ses pages :
Pour être sûr que les pages web répondent aux normes internationales définies par l'organisme
gérant l'Internet, et donc, qu'elles pourront être lues par n'importe quel navigateur, on peut vérifier
leur conformité
sur le site officiel :
http://validator.w3.org
On peut également aller sur ce site :
http://www.abondance.com
Deux grandes "normes" sont utilisables :
La spécification HTML 4.01 :
http://www.la-grange.net/w3c/html4.01/
Le XHTML :
http://openweb.eu.org/xhtml/
Vérifier la validité des pages avec Web Developer Extension dans Firefox :
Avec le navigateur Firefox, on peut utiliser Web Developer Extension :
http://chrispederick.com/work/webdeveloper/

- l'onglet Tool permet de vérifier directement la validité de la page !
Programme semblable Microsoft pour Internet Explorer :
Internet Explorer Developer Toolbar
http://www.microsoft.com/downloads/details.aspx?
FamilyID=e59c3964-672d-4511-bb3e-2d5e1db91038&DisplayLang=en
Web Developer en français
http://joliclic.free.fr/mozilla/webdeveloper/
Google : Centre pour les webmasters :
Un ensemble d'outils qui aident à la gestion de son site et à la visibilité de ses pages sur le moteur Google.
Google : Centre pour les webmasters :
http://www.google.fr/webmasters/
Outils pour les webmasters (notamment Google Sitemaps) :
http://www.google.com/webmasters/sitemaps/?hl=fr
Création d'un fichier sitemap.xml :
Ce ficher énumèrent toutes les pages du site pour faciliter leur indexatation.
On peut y ajouter des indications sur la fréquence de modification.
Extensions
de Firefox : Web Developer et FireBug :
Si on utilise Firefox comme navigateur, on la possibilité d'ajouter deux extensions : Web Developer et FireBug
Web Developer :
Site officiel :
http://chrispederick.com/work/web-developer/
Téléchargement pour Firefox :
https://addons.mozilla.org/en-US/firefox/addon/60
Cette extension ajoute une barre d'outils dans Firefox, spécialement conçue pour les développeurs de site web :

L'onglet "Tools" permet notamment de vérifier la conformité de ses pages, directement, sur Internet.
FireBug :
Site officiel :
http://getfirebug.com/
Téléchargement pour Firefox :
https://addons.mozilla.org/fr/firefox/addon/1843
Voir aussi :
05/12/2006 : FireBug 1.0 Beta : plus qu'une extension, un prodige !
http://www.aozeo.com/blog/55-firebug-1-beta-plus-qu-une-extension-un-prodige
Vérifier
la validité des liens hypertexte :
Ce site, qui contient de nombreux liens, en est la preuve : il n'y a pas de liens éternels !
Au lieu de vérifier manuellement la validité des liens, on peut utiliser LinkAlarm.
LinkAlarm vérifie la validité des liens présents sur toutes les pages d'un
site (liens internes et liens externes). Un essai gratuit est offert (pour 100 pages).
Il suffit de donner l'adresse du site et son email. On consultera ensuite le rapport sur le site.
http://www.linkalarm.com/
Recherche
sur le site :
Météo
sur le site :
Afficher
une vidéo sur une page web :
Trier le contenu d'un tableau :
Création
de diaporama ou galeries d'images :
Création
d'un menu de navigation :
Interdire
l'accès au contenu de ses dossiers :
Pour éviter de rendre accessible le contenu de ses dossiers :

- placer un fichier index.php à l'intérieur de chaque dossier du site que l'on veut protéger.
Créer le fichier index.php :
- créer un fichier texte ordinaire avec le Bloc-notes,
- copier-coller le texte suivant :
<?
$VersRacine="..";
include ("$VersRacine/index.htm");
?>
Remplacer index.htm par index.php si c'est le nom du fichier index du site.
- menu Fichier, Enregistrer sous...,
- taper :
index.php
- placer une copie de ce fichier à l'intérieur de chaque dossier du site.
Télécharger un fichier index.php :
- si la page index du site est index.htm : cliquer ici
- si la page index du site est index.php : cliquer ici
PS : Sur Wanadoo, l'opération est inutile, car l'accès aux dossiers du site est protégé par défaut.
Autres solutions :
"Pour interdire tout accès à un répertoire (qui contient par exemple des includes php), un fichier .htaccess avec l'interdiction de faire du GET, PUT, POST sur le répertoire.
Ou sinon, s'il s'agit juste d'empêcher le listing du répertoire, un fichier .htaccess avec un "Options -Indexes".
En dernier recourt, un bête fichier index.html ou index.php vide placé dans le répertoire (mais à répéter pour toute une arborescence si nécessaire)."
Voir aussi :
Siteduzero.com - Protéger
un dossier avec un .htaccess
Il s'agit de créer une protection par Login / Mot de passe qui empêche l'accès à tous
les fichiers du dossier.
Cela se fait avec deux fichiers :
- .htaccess : ce fichier contiendra l'adresse du .htpasswd et quelques autres options que vous pourrez définir.
*
- .htpasswd : ce fichier contiendra une liste de logins / mots de passe, pour chaque personne autorisée à accéder
aux pages !
Redirection :
Si on modifie le nom d'une page, il faut également effectuer une redirection.
En effet, s'il existe des liens vers cette page, ou si des visiteurs l'ont ajoutée à leurs favoris, elle ne sera
plus accessible. A la place, s'affichera une erreur 404.
On conservera donc l'ancienne page, après en avoir supprimé le contenu et on placera une redirection automatique.
PS : En pratique, il vaut mieux, dans la mesure du possible, conserver une page plutôt que de la renommer. Car cela est préjudiciable au référencement de la page sur Internet et les moteurs de recherche. Tant pis donc si le nom est mal trouvé !
Il existe plusieurs moyens pour effectuer une redirection automatique :
En tous les cas, on supprime l'ancien contenu de la page.
1 - en HTML :
On utilise la balise : <meta http-equiv refresh>
- on supprime le contenu de l'ancienne page et on le remplace par :
<html>
<head>
<meta http-equiv="refresh" content="1 ; url=http://www.nouvelle.adresse.com">
</head>
<body>
L'adresse de la page est maintenant : http://www.nouvelle.adresse.com
</body>
</html>
2 - avec un fichier htaccess
Voir ci-dessous.
3 - en php
Si la page à rediriger est en php (voir sur ce site)
4 - en javascript :
Solution déconseillée. Car si le javascript a été désactivé sur le navigateur du visiteur, la redirection ne fonctionnera pas.
.htaccess
et robots.txt :
Ce sont deux fichiers que l'on peut être amené à utiliser.
Ils se placent à la racine du site.
.htaccess :
Le fichier htaccess a trois utilisations principales :
- limiter l'accès avec un mot de passe,
- faire une redirection de page,
- paramétrer une page d'erreur 404,
Voir :
http://www.webmaster-hub.com/publication/Le-fichier-htaccess.html
http://fr.selfhtml.org/divers/htaccess.htm
Voir aussi : Redirection web :
http://alexandre.alapetite.net/doc-alex/redirections/index.fr.html
Exemple de fichier .htaccess :
.htaccess est un nom de fichier particulier :
- il commence par un point
- il n'a pas d'extension.
Il est impossible de le créer avec Windows en utilisation normale.
En voici donc un modèle :
cliquer ici pour télécharger un modèle de fichier .htaccess
Exemple de redirection avec un fichier .htaccess :
Le fichier contient la ligne suivante :
Redirect permanent /index.htm http://www.aidewindows.net/
Cette ligne est constituée de 3 parties :
Redirect permanent = la commande de redirection
/index.htm = le fichier à rediriger, ici, le fichier index.htm du site
http://www.aidewindows.net/ = l'adresse de redirection
Evidemment, cette commande n'est donnée qu'à titre d'exemple !
Elle est à modifier suivant ses besoins.
robots.txt :
Le fichier robots.txt permet de gérer l'accès des robots d'indexation au site.
Il permet notamment d'interdire l'accès à certains dossiers ou certains fichiers.
Voir :
http://fr.selfhtml.org/divers/robots.htm
Exemple de fichier robots.txt :
Un fichier robots.txt se crée facilement avec le Bloc-notes.
On peut y mettre :
User-agent: *
Disallow: /images/
Cette commande interdira l'accès du dossier images aux robots d'indexation.
Attention :
Les robots peuvent ignorer les commandes du fichier robots.txt.
Le contenu du fichier robots.txt peut même être une indication sur les dossiers contenants des données
importantes.
En conséquence, ne pas utiliser le fichier robots.txt pour dissimuler des données.
Voir aussi :
About /robots.txt :
http://www.robotstxt.org/robotstxt.html
anti
aspirateur de site :
Je sais que certains (beaucoup ?) sites utilisent un anti aspirateur de site..
Ceci pour lutter contre les robots (bad bots) qui aspirent l'intégralité d'un site en consommant
toute la bande passante.
Script anti aspirateur :
http://www.webmaster-hub.com/index.php?showtopic=27059
Compter le nombre de visiteurs simultanés sans base de données :
http://www.webmaster-hub.com/publication/Compter-le-nombre-de-visiteurs.html
Ceci dit, le risque est de bloquer outre mesure le référencement du site par Google. Dans ce cas, le
mieux est l'ennemi du bien.
http://forum.webrankinfo.com/script-anti-aspirateur-google-les-autres-t9671.html
Certains considèrent qu'une liste de robots à exclure serait la solution la meilleure ?








