Ressources du Congo

#TutorielHTML5-CSS3 #2 : Découverte & configuration de l'interface

7 Septembre 2017 , Rédigé par Zamba Synkin Publié dans #Dico exquis anti-mystification, #e-Learning, #Tech' Net & Code

S O M M A I RE

  • Découvrir l'interface de travail par défaut
  • Vérifier la version de Notepad++ installée
  • Configurer :
    • Encodage 
    • Langage par défaut (HTML)
    • Coloration syntaxique
    • Préférences (auto-complétion, moteur de recherche, langue, dossier de sauvegarde, zones d'édition, ...)
    • Compléments (récupérer les modules additionnels)
  • Structure d'un document en HTML5
#TutorielHTML5-CSS3 #2 : Découverte & configuration de l'interface, structure d'un document HTML
#TutorielHTML5-CSS3 #2 : Découverte & configuration de l'interface, structure d'un document HTML

Avant de nous atteler à créer des codes HTML, je vous propose de prendre la peine de bien configurer, d'entrée, le puissant éditeur Notepd++. Pourquoi donc vous demander vous? Eh bien, ce faisant, nous gagnerons beaucoup de temps quand nous allons rentrer dans le dur, comme vous le verrez sous peu.

Commençons par la barre de Menu composé notamment de: Menu, Édition, Recherche, Affichage, etc. Ca recouvre toute la partie encadrée en vert.

#TutorielHTML5-CSS3 #2 : Configuration de l'interface, structure d'un document HTML
#TutorielHTML5-CSS3 #2 : Configuration de l'interface, structure d'un document HTML

La Barre de Titre (1) n'est pas configurable, mais se mettra à jour automatiquement après qu'on aura fait la première sauvegarde de notre fichier. Pour l'heure, le titre par défaut est new1 !

La Barre d'outils (2) dont nous nous servirons, à maintes reprises, est le volet surligné en jaune. La suite de la Barre d'Outils (3) comporte tous les commandes masquées faute de place. Pour le visualiser, il suffira de faire un simple clic gauche sur le double chevron (>>).

Le terrain de jeu, là où nous devrons faire travailler nos neurones, est encadré par le (4). Nous y écrirons nos lignes de codes HTML, CSS, et JavaScript.

  • Encoder en UTF-8

Cette configuration est nécessaire si vous vous voulez que votre navigateur affiche correctement des caractères accentués. Pour ce faire, faites d'abord un clic gauche sur Encodage (1) pour faire se dérouler le menu contextuel. Après quoi, cochez Encoder en UTF-8 (2). C'est tout.

À noter qu'un Atelier est prévu pour illustrer le cas problématique d'affichage des caractères accentués. N'oubliez pas l'informatique nous vient des Anglo-saxons et en anglais, il n'y a pas de caractère doté d'accent !

  • Choix du langage par défaut : HTML

Pour ce faire, il suffit de cliquer sur Langage (1) puis sur HTML (2). Je vous conseille vivement de le faire pour pouvoir coder aisément plus avant. Du reste, cela vous évitera des crises de nerfs et de jurons !

  • Configuration de l'interface de travail: Préférences
    • Général

Pour ce volet, suivez cette configuration pour que nous ayons les mêmes rendus visuels lors de créations des codes HTML. À dire vrai, ça nous donnera une zone de travail confortable. Et donc, très agréable pour "coder".

  • Configuration de l'interface de travail: Préférences
    • Zone d'édition

Ce que j'ai dit précédemment vaut aussi pour la configuration de ce volet (Zone d'édition).

Lire la suite :

Partager cet article

Commenter cet article