Fiche de cours

Éditer une page HTML avec différents outils

Lycée   >   Seconde   >   SNT   >   Éditer une page HTML avec différents outils

  • Fiche de cours
  • Quiz et exercices
  • Vidéos et podcasts
Objectifs
  • Savoir éditer du code à l’aide d’un éditeur de code plus évolué que le bloc-notes de Windows.
  • Savoir éditer du code à l’aide d’un éditeur de code en ligne.
Points clés
  • Lorsque l’on veut apprendre à coder, que ce soit en HTML ou dans les autres langages, il est nécessaire d’avoir un outil spécifique appelé éditeur de code.
  • Le plus connu est sans aucun doute le bloc-notes de Windows mais il reste très limité en fonctionnalités.
  • Il existe des éditeurs hors ligne et en ligne :
    • un outil de développement en ligne permet d’obtenir très rapidement une page web (ex : JS Fiddle) ;
    • un outil de développement hors-ligne permet de travailler sans avoir de connexion internet (ex : Bracket).
Pour bien comprendre
  • Connaitre la structure de base d’un document HTML
  • Savoir taper une adresse symbolique dans une barre d’adresse de navigateur
  • Connaitre les principales balises du langage HTML
  • Connaitre les principaux navigateurs.

Pour créer une page HTML, il est nécessaire d’utiliser un éditeur de contenu. Cet outil de développement peut être en ligne ou hors-ligne.

1. Outil de développement en ligne
a. Présentation
Un outil de développement en ligne est un logiciel en ligne qui facilite la création et la publication des pages web.
Exemple d’outil en ligne : JS Fiddle

JS Fiddle est un outil de développement en ligne qui permet d’obtenir très rapidement une page web.

On peut le télécharger à l’adresse suivante : https://jsfiddle.net/.

Cet outil permet d’écrire des lignes de code en HTML et de tester tout de suite le résultat qui sera obtenu. Il intègre la même fonction qu’un navigateur (comme Chrome) qui permet de décoder des lignes HTML.

b. Exemple d'utilisation de l'outil en ligne JS Fiddle
  1. On tape le code HTML.
  2. On obtient l’affichage suivant grâce au navigateur. 

2. Outil de développement hors ligne
a. Présentation
Il est possible de coder du HTML sans connexion internet : il faut pour cela utiliser un éditeur de code. Il s’agit d’un logiciel destiné à la création et à l’édition de fichier texte.
Remarque
Tout système d’exploitation possède un éditeur de texte, il n'est donc pas utile d’en télécharger un (comme Brackets) pour pouvoir coder en HTML. On peut utiliser le bloc-notes de Windows comme premier outil de codage.
Le passage à un éditeur tel que Brackets est toutefois nécessaire pour la qualité de l’interface et la simplicité des commandes.
Exemple d’outil hors-ligne : Brackets

Brackets est un éditeur de texte open source, c’est-à-dire que ce logiciel peut être utilisé et modifié par n’importe qui. Cet outil moderne comprend et facilite la conception de sites web.

On peut le télécharger à l’adresse suivante : http://brackets.io/

Remarque
Pour installer cet outil, il faut au préalable cliquer sur le bouton « Télécharger ».
b. Exemple d'utilisation de l'outil hors-ligne Brackets
  1. On tape dans la zone d’édition le code HTML suivant :
  2. On enregistre le fichier en lui donnant un nom simple suivi de l’extension « .htm » ou « .html » : par exemple « index.htm » ou « index.html ».
  3. On affiche le fichier dans l’explorateur en cliquant sur « Aperçu en direct ».
  4. On double clique sur « index.htm » dans l’explorateur, qui fera alors appel au navigateur par défaut pour obtenir l’affichage souhaité. 

Évalue ce cours !

 

Des quiz et exercices pour mieux assimiler sa leçon

La plateforme de soutien scolaire en ligne myMaxicours propose des quiz et exercices en accompagnement de chaque fiche de cours. Les exercices permettent de vérifier si la leçon est bien comprise ou s’il reste encore des notions à revoir.

S’abonner

 

Des exercices variés pour ne pas s’ennuyer

Les exercices se déclinent sous toutes leurs formes sur myMaxicours ! Selon la matière et la classe étudiées, retrouvez des dictées, des mots à relier ou encore des phrases à compléter, mais aussi des textes à trous et bien d’autres formats !

Dans les classes de primaire, l’accent est mis sur des exercices illustrés très ludiques pour motiver les plus jeunes.

S’abonner

 

Des quiz pour une évaluation en direct

Les quiz et exercices permettent d’avoir un retour immédiat sur la bonne compréhension du cours. Une fois toutes les réponses communiquées, le résultat s’affiche à l’écran et permet à l’élève de se situer immédiatement.

myMaxicours offre des solutions efficaces de révision grâce aux fiches de cours et aux exercices associés. L’élève se rassure pour le prochain examen en testant ses connaissances au préalable.

S’abonner

Des vidéos et des podcasts pour apprendre différemment

Certains élèves ont une mémoire visuelle quand d’autres ont plutôt une mémoire auditive. myMaxicours s’adapte à tous les enfants et adolescents pour leur proposer un apprentissage serein et efficace.

Découvrez de nombreuses vidéos et podcasts en complément des fiches de cours et des exercices pour une année scolaire au top !

S’abonner

 

Des podcasts pour les révisions

La plateforme de soutien scolaire en ligne myMaxicours propose des podcasts de révision pour toutes les classes à examen : troisième, première et terminale.

Les ados peuvent écouter les différents cours afin de mieux les mémoriser en préparation de leurs examens. Des fiches de cours de différentes matières sont disponibles en podcasts ainsi qu’une préparation au grand oral avec de nombreux conseils pratiques.

S’abonner

 

Des vidéos de cours pour comprendre en image

Des vidéos de cours illustrent les notions principales à retenir et complètent les fiches de cours. De quoi réviser sa prochaine évaluation ou son prochain examen en toute confiance !

S’abonner

Découvrez le soutien scolaire en ligne avec myMaxicours

Plongez dans l'univers de myMaxicours et découvrez une approche innovante du soutien scolaire en ligne, conçue pour captiver et éduquer les élèves de CP à la terminale. Notre plateforme se distingue par une riche sélection de contenus interactifs et ludiques, élaborés pour stimuler la concentration et la motivation à travers des parcours d'apprentissage adaptés à chaque tranche d'âge. Chez myMaxicours, nous croyons en une éducation où chaque élève trouve sa place, progresse à son rythme et développe sa confiance en soi dans un environnement bienveillant.

Profitez d'un accès direct à nos Profs en ligne pour une assistance personnalisée, ou explorez nos exercices et corrigés pour renforcer vos connaissances. Notre assistance scolaire en ligne est conçue pour vous accompagner à chaque étape de votre parcours éducatif, tandis que nos vidéos et fiches de cours offrent des explications claires et concises sur une multitude de sujets. Avec myMaxicours, avancez sereinement sur le chemin de la réussite scolaire, armé des meilleurs outils et du soutien de professionnels dédiés à votre épanouissement académique.

Fiches de cours les plus recherchées

SNT

Le langage CSS et les sélecteurs

SNT

Changer la couleur avec des sélecteurs CSS

SNT

L'URL

SNT

La requête HTTP

SNT

Le modèle client/serveur

SNT

Télécharger une page web sur un serveur

SNT

L'usage des réseaux sociaux

SNT

Violence et protection sur les réseaux sociaux

SNT

Principe et économie des réseaux sociaux

SNT

La modélisation des réseaux sociaux