FTP

Parmi la longue liste des sigles mystérieux, vous avez surement déjà entendu parlé de FTP. Pour comprendre ce que cela recouvre, il faut déjà mettre la lumière sur deux concepts liés : site en local ou à distance. Lorsqu’on crée un site internet, on crée un ou plusieurs documents sur son ordinateur. Dans les précédents articles, vous avez d’ailleurs créé un document qui s’appelle index.html. Bien souvent, on s’imagine que l’extension .html rend ce document disponible sur le web. Ce n’est pas le cas ! Ce document est pour l’instant conservé sur votre ordinateur. De la même manière que personne ne peut se connecter à votre ordinateur et visionner vos documents, personne ne peut accéder à ce document, index.html. C’est ce qu’on appelle un site en local. Vous l’avez compris, il est limité à votre seul usage. Alors comment le rendre disponible sur le web ?

Gimme shelter

Votre fournisseur d’accès internet (Free, SFR…) vous protège contre les connexions extérieures justement pour éviter à votre ordinateur virus et autres intrusions malveillantes. Si vous voulez rendre votre site visible, il faut donc utiliser un autre ordinateur qui sera lui mis à disposition justement pour recevoir des connexions extérieures : c’est ce qu’on appelle un serveur. Un serveur n’est rien d’autre qu’un ordinateur ouvert, sur lequel n’importe qui peut consulter son contenu. Comment obtenir un serveur ? Ce sont les sociétés d’hébergement qui proposent ce service. Votre but est donc de placer votre site index.html sur un serveur, c’est ce qu’on appelle à distance. Pour cela, des sociétés spécialisées type OVH vous proposent de louer un peu d’espace sur leurs serveurs : c’est l’hébergement. Pour rendre votre site internet disponible sur le web, vous aurez besoin de louer un hébergement plus ou moins grand (selon le nombre de fichiers que vous devez héberger, le poids des images, des vidéos…) ainsi qu’une adresse, aussi appelée nom de domaine. Celui-ci est indispensable pour vous retrouver. C’est l’URL que vos visiteurs renseigneront pour atteindre votre site. Une fois que vous vous êtes acquitté de votre hébergement et de votre nom de domaine, reste à déterminer comment placer votre page index.html sur ce serveur. C’est là que le fameux FTP fait son entrée. FTP signifie File Transfer Protocol : autrement dit une façon (protocole) de transférer des fichiers. Concrètement, cela revient à télécharger sur son ordinateur un logiciel qui va servir de passerelle entre deux ordinateurs : le vôtre et celui de votre hébergeur. Comment ? Le serveur côté hébergeur est accessible avec un identifiant et un mot de passe, que votre hébergeur vous fournit. C’est la clef de votre hébergement. Grâce à ces identifiants que vous renseignez dans la plateforme FTP, vous pouvez placer et enlever vos fichiers autant que vous voulez.

 

Cela vous a-t-il servi ? N’hésitez pas à me faire un retour !

 

Continuons à ajouter du contenu dans la page index.html

Dans le dernier épisode, vous avez affiché votre premier HelloWorld.

Le navigateur affiche bien votre ligne de code. Il a l’air de nous avoir tout à fait compris. Vraiment? Faisons un test et ajoutons une nouvelle ligne au fichier index.html. Le but cette fois-ci est d’afficher un lien, comme ceci.

Retournons du côté du navigateur et rafraichissons la page.

Le texte s’affiche bien. Mais ce lien ne semble pas actif. Si vous passez la souris au-dessus et cliquez, rien ne se passe. Pourquoi ? Le navigateur qui interprète le code n’a pas compris ce que vous attendiez de lui. Il a besoin que vous lui parliez un langage qu’il comprenne pour cela : l’HTML. Et pour écrire de l’HTML, on utilise ce qu’on appelle des balises. Ces balises vont encadrer tous les éléments de votre page pour que le navigateur comprenne exactement de quoi il s’agit. Ici, nous voulons que le navigateur comprenne que http://www.google.fr est un lien. Nous allons donc utiliser la balise Lien comme ceci.

Surtout n’oubliez pas d’enregistrer votre document et rafraichissez votre page web.

Bingo, le navigateur a compris que ce texte était un lien. Vous pouvez à présent cliquer dessus : ça marche !

Décortiquons ensemble cette première balise.La première partie correspond à l’ouverture de la balise : on y renseigne l’adresse de destination.

Puis, on renseigne le texte qui sera visible sur votre site. Dans notre exemple, c’est une adresse http://www.google.fr, mais on peut le remplacer par Cliquez ici.

Dernière étape, on referme la balise. Notez bien la barre /.

Voici le résultat dans le navigateur

Il est essentiel de bien refermer les balises. Sans quoi, le navigateur n’a aucune indication sur l’élément concerné par la balise. Dans notre exemple, si vous ne refermez pas la balise et ajoutez du texte à côté comme ici,

le navigateur va considérer que tout le texte est un lien.

Les balises sont donc essentielles à l’affichage de votre page. Elles vont définir chacun de ses éléments (ceci est un lien, ceci est un texte, ceci est une image) pour que le navigateur les affiche correctement.

Votre première balise est en place ! Bravo.

Dans le prochain épisode, nous continuerons notre exploration des balises.

En attendant, bon code !

 

Catégories : blog

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *