STIC:STIC I - exercice 1 (Nestor-Pixel)

De EduTech Wiki
Aller à la navigation Aller à la recherche

Cette page fait partie des cours STIC I et STIC II

Exercice 1

Cet exercice du course STIC I vous permet:

  • d'apprendre un peu de XHTML (si vous ne connaissez pas déjà)
  • d'apprendre un peu de CSS et de "web design"
  • de réfléchir comment organiser un petit site

Tâche

  • Faites votre "home page" à TECFA plus un rapport

La "home page" sera accessible par l’URL 

http://tecfa.unige.ch/perso/maltt/votre login/

Par exemple: 

http://tecfa.unige.ch/perso/maltt/ott/

Exemple de nom correct du fichier d'entrée: welcome.html welcome.htm index.html welcome.php ...

Pour savoir oũ mettre votre home page, consultez notre serveur LDAP (votre home page y est indiquée): 

* Addresses Nestor

Par FTP: 

tecfa.unige.ch
/web/perso/maltt/votre login/

Le rapport est à placer ici (vue FTP): 

tecfa.unige.ch
/web/etu-maltt/nestor/login/stic/ex1/

Exemple: 

/etu-maltt/nestor/dupond/stic/ex1/

Exemple de nom correct du fichier d'entrée: welcome.html welcome.htm index.html welcome.php ...

Contraintes

  • Vous devez vous fixer des objectifs en ce qui concerne sa fonction, son design etc. et les réaliser (en parler dans le rapport).
  • La page doit être faite en XHTML (Pas HTML !)
  • Liens vers le les valideurs HTML/CSS du W3C:
http://validator.w3.org/check/referer
http://jigsaw.w3.org/css-validator/check/referer

Structure du rapport

Voici les éléments les plus importants qui doivent figurer dans la page d'accueil / rapport

  • Titre, auteur et date
  • Le résulat: Lien vers la homepage, lien vers le fichier CSS utilisé
  • Objectifs: A quoi/qui sert le dispositif, quel est le "message" ?
  • La production: bref résumé de la démarche
  • Difficultés, auto-évaluation, remarques
  • Ressources utilisées, bibliographie.

Evaluation

  • Qualité du rapport
  • selon vos objectifs explicités dans le rapport (!!)
  • absence d’erreurs XHTML et CSS (validité de XHTML/CSS)
  • utilisation créative de CSS
  • ergonomie générale
  • navigation entre pages
  • emplacement correct des fichiers
  • comme pour chaque exercice: participation dans les 2 wikis (améliorations, modifications et ajouts de pages en dehors des "pages cours". Indiquez très brièvement ce que vous avez fait dans votre home page wiki et dans le rapport, sinon on risque de ne pas le voir ...)

Ressources

Transparents et liens

  1. Design d'un petit dispositif: http://tecfa.unige.ch/guides/tie/html/www-design-intro/www-design-intro.html
  2. HTML de base: http://tecfa.unige.ch/guides/tie/html/xhtml-intro/xhtml-intro.html
  3. CSS de base: http://tecfa.unige.ch/guides/tie/html/css-intro/css-intro.html

Liens:

  1. HTML: http://tecfa.unige.ch/guides/html/pointers.html
  2. CSS: http://tecfa.unige.ch/guides/css/pointers.html
  3. Design: http://tecfa.unige.ch/guides/design/pointers.html

Configuration de Firefox

Configuration de Firefox. Il faut absolument installer ces extensions.

Exemples, outils et autres infos

Exemples:

Editeurs - A votre choix:

  • On vous conseille d'utiliser XML Exchanger Lite pour éditer XHTML car vous allez le réutiliser pour les exercices XML.
  • Pour CSS, prenez un simple éditeur (même Exchanger peut faire l'affaire).

Articles edutechwiki anglais sur Internet et HTML:

Récupérée de « https://edutechwiki.unige.ch/fmediawiki/index.php?title=STIC:STIC_I_-_exercice_1_(Nestor-Pixel)&oldid=8788 »