Éditeurs de texte : Bloc-notes, Notepad++, Netbeans, etc.
WYSIWYG : sans apprendre le code
Vous utilisez souvent un navigateur pour visiter des sites comme YouTube ou Cazou. Mais quelle langue parlent-ils ? Avec un simple CTRL + U, vous pouvez voir le code source d'une page web.
Synthèse Web
Qui a inventé le WEB, et quand ?
Quels langages sont utilisés pour créer un site web ?
Quelles versions sont utilisées aujourd'hui ?
Le navigateur est-il un programme ? Qui fait quoi ?
Tous les navigateurs affichent-ils le même rendu ? Citez-en.
Quel programme utiliser pour coder un site web ?
Ma première page en HTML
Écrivez deux lignes :
Bonjour
Comment va ?
Enregistrez le fichier avec l'extension .html et ouvrez-le avec un navigateur.
Résultat attendu : une seule ligne affichée si vous ne faites pas de retour à la ligne explicite.
Balises et attributs : introduction
Balises (tags) HTML : instructions encadrées par des chevrons
Types de balises : ouvrante, fermante, orpheline (auto-fermante)
Contenu : titre, image, paragraphe, lien
Attributs : placés dans la balise ouvrante (ex : title, alt, src, href, class, id, etc.)
Balises de base d'une page HTML
Une page web peut être nommée index.php, index.htm, etc. Elle doit indiquer au navigateur qu’il s’agit d’un document HTML5 via <!DOCTYPE html>.
Métadonnées : pour le navigateur, non visibles par l'utilisateur
Contenu : visible
Indentation : améliore la lisibilité du code
Exercice 1
Nom du fichier : 01-ma_page
Onglet du navigateur : Ma page
Titre (H1) : Le secret d’un — couronné de succès
Paragraphe : Un conseil, ne le lis pas au boulot, ... il devait être 8h20 ce matin, la rue était calme, ... quand tout à coup, surgit de la rue qui mène à Sapiens, un ...