Valeur de cette activité : 5 points
Compétence :
13- Utilisation du logiciel KOMPOZER, BLUEFISH : disponible sous SLITAZ, GWRITE ou BLUEGRIFFON

A-Module 01 : HTML : 5 points - difficulté : 2

Présentation

Utilisation du logiciel KOMPOZER, BLUEFISH (disponible sous Slitaz) ou BLUEGRIFFON

Vous maîtrisez maintenant les bases du langage Html.

Vous avez jusqu'à maintenant utilisé l'éditeur html intégré au site La Différence.

Il existe des centaines d'éditeurs html gratuits disponibles sur le web.

Ils se divisent en deux catégories :
- les "wysiwyg"
- les non "wysiwyg"

Le terme "wysiwyg" est un acronyme qui signifie : What You See Is What You Get, c'est à dire que ces éditeurs affichent directement le résultat du code html.
Ce code n'est donc pas visible.
Ce genre d'éditeur est utilisé par les personnes qui ne désirent que produire des pages web sans aller plus loin dans l'apprentissage de la programmation web.

Notre cas est bien différent, nous désirons maîtriser le code Html car nous y ajouterons du code provenant d'autres langages de programmation web (voir les autres modules du cours).


Nous utiliserons dans cet exercice l'éditeur KOMPOZER, BLUEFISH (disponible sous Slitaz), GWRITE ou BLUEGRIFFON.

Personnellement, j'utilise l'éditeur non wysiwyg GEANY (voir activité no 88492 en raison des "snippets" (fragments de code) disponibles.

Les logiciels KOMPOZER et BLUEGRIFFON sont disponibles gratuitement pour les systèmes d'exploitation WINDOWS et LINUX.

Ils sont gratuits et possèdent une grande variété de fonctions.



Vous pouvez répéter cette activité plus d'une fois en utilisant un logiciel différent et un contenu différent pour chacun des travaux présentés.

Description

Dans cet exercice, vous devrez créer une page web en utilisant le logiciel éditeur html de votre choix.

Vous placerez ensuite cette page dans votre espace de téléchargement.

  1. Sélectionnez et installez le logiciel de votre choix

    Sous Linux, je vous suggère l'utilisation d'un des logiciels suivants:
    1. BLUEFISH (éditeur non wysiwyg mais très complet (Html, css, php, sql,...), utilisez le menu Édition + Préférences+commandes externes pour identifier votre navigateur web par défaut): installez en tapant dans le terminal sudo apt-get install bluefish
    2. gwrite (non recommandé, trop simple, peu de fonctions) : installez en tapant dans le terminal sudo apt-get install gwrite
    3. Bluegriffon (suggéré pour les débutants) :
      Au labo, installez en tapant dans le terminal :
      wget http://chene-bleu.info/i/ladifference/bluegriffon.zip && unzip ./bluegriffon.zip && rm ./bluegriffon.zip && echo "alias bluegriffon='~/BlueGriffon/bluegriffon'" >> ~/.bashrc

      Sous windows, installez à partir du site officiel
      BLUEGRIFFON supporte le HTML5 et le CSS3 en plus d'intégrer un éditeur SVG.
    4. Kompozer (bon logiciel pour débutants) : installez à partir du site officiel
      ou
      Windows et linux
      Kompozer portable (Windows ou Linux + Wine)
    5. Il existe plusieurs autres solutions possibles :
      exemple : CoffeCup qui offre une version gratuite sous windows
    6. Il existe également des éditeurs Wysiwyg et non Wysiwyg pour programmeurs avançés tels que APTANA STUDIO
    7. 5 éditeurs pour programmeurs avançés
  2. Le sujet de votre travail sera "Les planètes de notre système solaire" (ou tout autre sujet de votre choix - faites accepter votre sujet par l'enseignant). (lien utile : http://www.neufplanetes.org/systeme_solaire/)
  3. ATTENTION : Les pages que vous allez créer seront enregistrées sur votre ordinateur. Vous devrez donc à la fin de la période, télécharger ces pages dans votre espace de téléchargement.
  4. Lancer votre logiciel
  5. Prenez quelques minutes afin de vous familiariser avec l'interface. Explorez les différents menus et boutons.
  6. Votre page devra inclure les éléments suivants :
    1. Un titre de niveau 1 centré
    2. Plusieurs images:
    3. - Une image doit être utilisée comme hyperlien (lien sur un clic sur l'image)
    4. Une liste numérotée (balises OL et LI).
    5. Des textes de couleurs différentes
    6. Un tableau contenant des cellules fusionnées (colspan ou rowspan)
  7. Enregistrez cette page "kompozer.html"
  8. Téléchargez vos documents (page et images) dans votre espace de téléchargement.
  9. IMPORTANT : Ajoutez une page à votre portfolio qui contiendra :
    - dans le champ titre : KOMPOZER-BLUEFISH-BLUEGRIFFON
    - dans le champ No de la directive : 4385
    - dans le champ matière : Informatique
    - dans le champ section : Module HTML
    - dans le champ contenu : un lien vers votre page kompozer.html
    - dans le champ contenu : le nom du logiciel utilisé

  10. Cochez la case à cocher de correction du travail
  11. Enregistrez cette page

    Cette page servira à la correction de votre travail et à transmettre mes commentaires concernant ton travail.