Créer son site web : à toi de jouer !

Publié le - Mis à jour le 08-02-2016

Créer ton site : pour quoi faire ?

html avec cape

Tu peux donc à présent te mettre au travail pour créer ton site ! Mais, me demanderas-tu, quel est l’intérêt, alors qu’aujourd’hui des dizaines de solutions existent (blogs, réseaux sociaux, etc.) pour publier tout ce qu’on veut sur le web sans avoir à s’embêter à écrire la moindre ligne de code ?

L’intérêt est de pouvoir maîtriser tous les aspects de ce que tu mets en ligne pour avoir un site vraiment personnel et vraiment adapté au contenu que tu veux proposer aux internautes, sans être dépendant des possibilités d’édition que d’autres ont pensées pour toi, et cela la plupart du temps dans un but commercial. Et même si tu choisis une solution de publication déjà toute faite, t’être entraîné à faire par toi-même ton propre site web te permettra de pousser à fond ses possibilités d’édition. As-tu remarqué par exemple que sur les blogs, les éditeurs de texte qui te permettent de rédiger des billets ont généralement une option « source » pour te permettre de saisir du HTML ?

Surtout, l’intérêt, comme pour tout ce que l’on fait soi-même, est d’apprendre et de comprendre. Tu n’es plus un usager passif, tu deviens véritablement un acteur du web.

Je te l’avais dit, tu ne regarderas plus jamais par la fenêtre de ton navigateur de la même manière…
 

Au travail !

Pour créer ton site, il te suffit de créer tes pages et de les classer selon l’arborescence de ton choix sur ton ordinateur. La page d’accueil, à la racine de ton site, doit s’appeler index.html

Quand tu auras terminé de créer ton site sur ton ordinateur, tu vas avoir besoin d’un serveur.

La plupart des fournisseurs d’accès à Internet (FAI) fournissent gratuitement de l’espace sur leurs serveurs à leurs abonnés. Ce service est généralement appelé « Pages Perso ».

Pour envoyer les pages sur le serveur, tu vas avoir besoin des identifiants FTP que ton FAI t’envoie quand tu actives son service de « Pages Perso » ainsi que d’un logiciel client FTP comme Filezilla (http://filezilla.fr/). ce logiciel est très facile à utiliser. tout t’est expliqué ici : http://filezilla.fr/tutoriel-aide-support-apprendre-filezilla/

Je te conseille aussi d’installer un éditeur de texte adapté à l’écriture du HTML. On peut tout à fait réaliser un site web avec le bloc-notes de Windows ou TextEdit sur Mac, mais il existe des logiciels gratuits permettant de colorer le code pour s’y repérer plus facilement. Il y a par exemple Notepad++ sur Windows (http://notepad-plus-plus.org/fr/). Pour obtenir la coloration du code, sélectionne « H » puis « HTML » dans le menu « Langage ».
Mais il existe également des dizaines d’autres éditeurs HTML gratuits que tu peux trouver en faisant une recherche sur le web.

Je ne t’ai bien sûr pas tout expliqué, je t’ai simplement donné les bases à partir desquelles tu vas pouvoir mener tes propres recherches pour aller plus loin.
 

Plus loin

Voici déjà quelques liens que je te recommande pour commencer à compléter ce que je t’ai appris.

Tu auras sans doute très rapidement envie de donner un peu plus de style à tes pages HTML. Il y a déjà deux balises qu’il faut que tu connaisses dès maintenant, deux dernières, pour la route : la balise <em> et la balise <strong>. Les balises <em> et </em> on pour rôle de mettre en relief les portions de texte qu’elles encadrent. Les balises <strong> et </strong> servent, quant à elles, à indiquer une mise en exergue encore plus forte. Par convention, les navigateurs interprètent les balises <em> en mettant leur contenu en italique et les balises <strong> en mettant leur contenu en gras.

Ces balises sont donc souvent utilisées pour obtenir ces effets typographiques sans souci réel de mise en exergue, mais on les détourne ainsi de leur véritable usage. Pour agir sur le style des éléments HTML, l’outil véritablement approprié est constitué par les « feuilles de style en cascade » ou CSS (Cascading Style Sheets). Voici une très bonne introduction aux CSS sur le site du W3C :

L’ensemble des ressources ludiques offertes par la fondation Mozilla aux parents, aux éducateurs et aux adolescents dans le cadre du projet d’alphabétisation numérique Hackasaurus méritent aussi vraiment d’être découvertes pour mieux comprendre comment fonctionne le web et se l’approprier.

(Les Petits Débrouillards proposent une version du livret « hacktivity kit » d'Hackasaurus traduite en français.)

Auteur :

Recommandations