A la fin de ce chapitre, vous connaîtrez les outils pour développer un site Internet. Vous serez en mesure de créer avec notepad un fichier html ou htm et de le visualiser à l'aide d'un navigateur.
Pour créer vos pages Web vous aurez besoin d'un navigateur et d'un éditeur de texte. Un navigateur ou encore browser est un logiciel qui permet de lire les pages web, c'est à dire les fichiers portant une extension tel .htm, .html, .php, .asp comme les pages consultées sur internet. Par défaut, Windows utilisait Internet Explorer, depuis Windows 10 c'est EDGE, il en existe d'autres tel que Firefox, Chrome, Opera ou encore Safari pour les plus connus..
Un éditeur de texte est un logiciel qui permet d'écrire des textes et qui les enregistre dans un format générique, le .txt. C'est une sorte de traitement de texte mais dont les fonctionnalités de mise en page sont très réduites. Windows est équipé par défaut du bloc note appelé aussi notepad. C'est un éditeur extrèmement simple qui permet néanmoins de faire des pages internet comme un profesionnel.
Ils existent de nombreux éditeurs de texte développé pour convenir au mieux au besoins de programmeurs selon le langage qu'il utilise. Pour le développement web, on utilisera des éditeurs HTML non WYSYWIG tels que notepad++ ou Sublime Text. Vous pourrez sans doute en trouver un qui réponde à vos attentes depuis le portail de logiciels libres Framasoft. ou sur telecharger.com.
Les traitements de texte comme Word pourraient causer des problèmes d'encodage il ne faut donc pas les utiliser.
Pour développer un site Internet, il existe des outils très performant comme Dreamweaver. Cependant, apprendre avec un éditeur de texte est un passage nécessaire pour bien maîtriser la syntaxe et l'utilisation de ces logiciels.
Les deux sections qui suivent ont pour objectif de vous familiariser avec le fonctionnement de votre éditeur de texte et de votre navigateur dans le contexte de création d'une page Web.
Lancez le Bloc-notes et écrivez Bonjour.
Pour lancer Bloc-notes, allez dans la barre des tâches de Windows et parcourez Démarrer > Tous les programmes > Accessoires > Bloc-notes.
Nommez votre fichier test.html. Par défaut, l'encodage de Bloc-notes est en ANSI. Choisissez plutôt UTF-8 et prenez cette bonne habitude.
Pour enregistrer un fichier, parcourez Fichier > Enregistrer sous…, écrivez le nom voulu dans le champ « Nom du fichier : » et appuyez sur Enregistrer.
Vous venez de créer votre première page internet. Elle n'a pas de contenu, cependant, on peut la visualiser dans un navigateur internet. L'important c'est l'extension, une page internet est une page ayant pour extension soit htm ou alors html.
Pour visualiser dans votre navigateur le contenu du fichier que vous venez de créer, ouvrez d'abord une nouvelle fenêtre (de façon à pouvoir revenir à celle-ci ensuite) et ouvrez-y le fichier test.html.
Pour ouvrir une nouvelle fenêtre, parcourez Fichier > Nouveau > Fenêtre. Pour ouvrir un fichier, faites Fichier > Ouvrir… depuis la barre des menus du navigateur, sélectionnez le fichier souhaité et appuyez sur Ouvrir.
Vous pouvez visualiser votre page ! certes elle est vide mais nous allons apprendre à la remplir. Cette procédure qui consiste à utiliser un fichier texte pour éditer le contenu d'une page internet et sa visualisation dans le navigateur est un processus que vous allez réïtérer de nombreuses fois lors de la construction de votre page web.
Nous avons utilisé l'extension html lors de la création de notre fichier. L'extension htm aurait pu aussi être utilisée.
Maintenant vous êtes en mesure de créer et visualiser un fichier HTML. HTML - Hyper Text Markup Language - est un langage de marquage, de balisage. Son apprentissage consiste à connaître les différentes balises qui permettent de gérer la mise en page d'un document : mettre en gras, en italique, écrire un titre, faire un lien.
Conservez le fichier test.html nous allons l'utiliser pour la suite de notre apprentissage.