Une premiere page pour notre site web

Pendant que Free installe pas les modules demandés... je vais créer le site "à l'ancienne". En commençant par une seule page.

Comment créer et mettre en ligne une page web?

La façon aujourd'hui "normale" de créer un site et des pages web, c'est d'utiliser des outils tout faits.

• Ou bien un blog comme celui-ci, pour lequel on peut généralement se passer de faire "de la mécanique" et de plonger dans des coulisses techniques (là, j'ai quand même dû faire un peu de mécanique pour que les pages s'affichent correctement dans Internet Explorer avec la publicité).
• Ou bien en utilisant un "portail" de gestion de contenus (en anglais, pour faire savant: CMS - Content Management System).

Et donc, plus besoin de faire à tout bout de champ du "code HTML", celui des pages web.

La façon "ancienne" de créer des pages web, c'est de créer le code des pages sur sa machine, puis de le transférer sur le site web.
Initialement, quand Free a créé humourhistoires.free.fr le répertoire correspondant était vide et surtout non protégé: un peu comme celui que j'ai créé en http://humourhistoires.free.fr/vide/ et dans lequel j'ai rajouté un fichier de texte contenant ce présent paragraphe.
En effet, les répertoires (et leur contenu) sont affichés sauf si se trouve dans le répertoire un ou plusieurs fichiers avec des noms spéciaux: index.htm, index.html ou index.php sont les plus fréquents (attention, tout est en minuscules). C'est d'ailleurs parce qu'il y a un tel fichier que si vous allez voir http://humourhistoires.free.fr/ vous ne voyez pas le contenu du répertoire, mais une page web: vous pouvez d'ailleurs voir exactement (et pour cause!) la même chose en allant voir http://humourhistoires.free.fr/index.htm .

Créer une première page web
Pour créer notre page, nous devons d'abord en taper le texte en local sur notre machine, puis transférer le fichier correspondant sur le site web.

Ecrire une page web: les outils
Pour qu'une page web soit visible sur votre site, il faut deux choses

1. un éditeur pour créer le texte de la page, par exemple sur votre propre ordinateur
2. un moyen de transférer cette page vers le serveur de votre hébergeur.

Un éditeur de pages web: Word, Open Office

Notre objectif n'est pas ici de créer tout un site, mais juste de créer une page. Le reste du site sera créé par les modules installés par Free.

Aussi, au lieu d'utiliser un outil spécialisé pour créer notre page web, nous allons tout simplement utiliser... Word de Microsoft, ou son homologue gratuit (et concurrent) OpenOffice http://fr.openoffice.org/: ces deux programmes permettent en effet de sauver en "format web" un texte.

Comment faire? au lieu de l'enregistrer comme d'habitude, il suffit d'utiliser enregistrer sous et de choisir le format htm ou html. Un peu brutal certes, et si avec des outils spécialisés on regarde le code généré... il est assez horrible. Mais pourquoi s'en inquiéter s'il ne s'agit que d'une ou deux pages sur le serveur web?

On peut d'ailleurs réduire un peu l'ampleur des dégâts avec Word en sauvant non pas en "page web" mais en "page web filtrée".

Le résultat... c'est celui que vous trouvez sur http://humourhistoires.free.fr ... sachant que depuis la mise en ligne initiale, ce contenu a bien sûr évolué!
Nous pouvons visualiser notre page avant la mise en ligne: il suffit tout simplement d'ouvrir le fichier dans notre navigateur (Internet Explorer ou FireFox). On peut ainsi facilement modifier le fichier dans Word, l'enregistrer, et visualiser le nouveau résultat dans le navigateur lorsqu'on a actualisé la page qu'il affiche.

La mise en ligne

La page, ou plutôt son fichier, est actuellement sur notre machine... il faut la transférer sur le serveur pour qu'elle y soit visible depuis tout l'Internet. Cela se fait en utilisant un mécanisme appelé protocole ftp (file transfer program).

Pour le mettre en oeuvre, il faut normalement un programme spécial, appelé client ftp. Parmi de tels programmes, celui que nous utiliserons, si le besoin s'en présente, sera le programme open source et gratuit FileZilla... mais aujourd'hui pour notre page unique nous allons nous en passer et n'utiliser que le navigateur Windows (attention, ce n'est pas le navigateur web).

Pour cela, il faut disposer des informations ftp: nom du serveur (pour Free: ftpperso.free.fr), nom d'utilisateur (dans le cas présent: humourhistoires), mot de passe (disons xxxx, mais il est bien sûr différent)

On peut alors taper dans la ligne d'adresse du navigateur Windows ftp://utilisateur:passe@serveur ou plus exactement dans le cas présent: ftp://humourhistoires:xxx@ftpperso.free.fr ... et vous allez obtenir affiché directement ce répertoire, dans lequel il reste plus qu'à déposer par copier-coller notre fichier index.htm.

Une fois ce transfert réalisé... il ne reste qu'à vérifier que lorsqu'on tape l'adresse du site on obtient bien la page.

Notre site comporte maintenant une page: c'est peu, mais cela permet de lancer le référencement du site.

Résumé: adresses et outils cités pour cette étape

• OpenOffice et Word pour créer facilement des pages de texte que l'on peut ensuite facilement enregistrer.
• FileZilla nous servira plus loin lorsque devrons transférer de nombreux fichiers vers ou depuis le serveur web.

Creons le site

Ça y est, Free a activé les pages web et la base mysql.
Plutôt que de me fatiguer à écrire des pages web et à me battre avec du code HTML plus que nécessaire... j'ai décidé d'utiliser les outils "prêts à l'emploi" que propose Free à la page
ACTIVER LES MODULES POUR VOS PAGES PERSO. (Attention, il faut s'être connecté sous Free pour avoir accès à cette page).

Lorsqu'on clique sur la ligne montrée ici à gauche, on obtient une page qui comporte notamment:

le module SPIP qui permet la gestion de contenus dans d'excellentes conditions (l'outil est un peu complexe si on veut le maîtriser entièrement... mais nous n'irons pas si loin!

D'autres outils, tels que des logiciels de forum, de blog, de wiki, ainsi que de gestion d'albums photos (nous l'avons déjà mentionné).

Nous allons, nous, activer SPIP et lui apporter le minimum de modifications pour que d'une part il puisse gérer notre contenu d'histoires, d'autre part nous puissions lui rajouter des publicités Oxado et Adsense, puisque c'est l'un de nos objectifs.

Pour cela, sélectionnons le module SPIP et sélectionnons la mise à jour automatique de versions de SPIP: si une nouvelle version devient disponible, Free la mettra automatiquement à jour.

Initialement, rien ne semble se passer, puis l'on obtient finalement l'écran ci-contre.

---

Il faut en fait laisser quelques jours pour que cette installation soit complète... Je les mettrai à profit pour créer une première version, très rudimentaire, du site: suffisant pour commencer à lancer le référencement auprès des moteurs de recherche.

---

Creation de l'adresse du site web

Degré de difficulté technique: faible

J'ai décidé de créer un site qui contiendra en base de données toute une série d'histoires drôles (enfin, en principe!).
Première étape: choisir un "nom de domaine" et un hébergeur pour le site.

Pour le nom de domaine, plutôt que d'en déposer un nouveau, j'ai décidé provisoirement d'utiliser plutôt un "sous-domaine" de free.fr
J'espérais pouvoir créer humour-histoires.free.fr, ce qui faciliterait le référencement. Raté! Free ne me propose finalement que humourhistoires.free.fr, ce qui est nettement moins intéressant. Mais c'est gratuit....

Suite des opérations:
Une fois le compte créé par Free (quelques heures), il faut s'y connecter et activer les pages web et la base mysql. Ces dernières créations prennent en temps normal 24 à 48 heures.
En attendant, bien que je sache que pour quelques jours cela ne marchera pas, je crée ici un lien vers le futur site http://humourhistoires.free.fr

Autres options:
Si vous avez une vingtaine d'euros, vous pouvez créer votre domaine (si son nom est disponible!) avec un registrar, un organisme habilité à enregistrer des noms de domaine. Personnellement j'en utilise deux à ma plus grande satisfaction:

• Gandi à http://www.gandi.net n'est que registrar, il n'offre que la gestion des noms de domaine et l'administration des domaines et des redirections (c'est très important).
• OVH à http://www.ovh.net propose des offres couplées domaine+hébergement (avec administration du domaine, bien sûr), ce qui parfois coûte plus cher de quelques euros.
  Leurs offres changent assez souvent, notamment à la baisse... aussi je vous laisse aller voir par vous-même.

J'ai pris une solution intermédiaire pour le site de Marine, notre fille artiste peintre:
Dépôt du nom de domaine marka-online.org chez Gandi, et création du site chez Free, qui a permis markaonline.free.fr.
Chez Gandi, j'ai mis en place une redirection, qui fait que lorsqu'on tape http://www.marka-online.org on va en fait directement au même endroit que par http://markaonline.free.fr
On combine ainsi tous les avantages.

J'ai créé d'autres sites chez Free, par exemple comme site de démonstration pour des clients, ou pour héberger facilement un site comme celui que j'utilise pour les élèves de mon cours en http://webmsi.free.fr

Bien pratique. Il y a quelques particularités quand même, parce que les mécanismes de protection ont une technique un peu différente des mécanismes classiques (pour les techniciens: le htaccess est un peu modifié).

Résumé: adresses et outils cités pour cette étape

• Gandi: enregistrement de noms de domaine, administration des domaines (DNS) et des redirections.
• OVH: enregistrement de noms de domaines, hébergement de sites webs et de blogs, administration des domaines (DNS) et des redirections.
• Free: hébergement gratuit de sites web.