User Tools

Site Tools


2013_2014:s1:docweb:start

This is an old revision of the document!


Conception de documents et d’interfaces numériques

Objectifs

• Savoir structurer et présenter des contenus numériques

Contenus (extrait du PPN 2013)

  • Séparation contenu-structure-présentation
  • Technologies du Web (World Wide Web) pour la description de documents et d’interfaces: HTML (HyperText Markup Language), CSS (Cascading Style Sheets), chartes graphiques
  • Sensibilisation à l’ergonomie
  • Outils bureautiques de production de documents numériques
  • Conformité des sites Web aux standards d'accessibilité W3C / WAI (World Wide Web Consortium / Web Accessibility Initiative)

Modalités de mise en œuvre : • Équipe mixte d’enseignants en communication et en informatique • Respect des normes et standards • Possibilité de s'appuyer sur un gestionnaire de contenus • Utilisation d'outils de mesure de conformité pour l'accessibilité du We

Intervenants

Nom Affiliation Adresse
Mireille Blay-Fornarino IUT /UNS/ I3S Bureau XXX Ou Bâtiment Templiers :Bureau 449 (www)
Gaetan Rey IUT/UNS/I3S Bureau XXX
Eyrol IUT/UNS/ Bureau XXX
Jean-Michel Pebre
Pascal Perry

Notations

PAS DE DS?

Les TD se font en quadrinôme??.

Planification

  1. Savoir faire une présentation (présenter un sujet en moins de 3mn, les ingrédients d'une bonne présentation,…)
    • Outils :ex : powerpoint, Prezi?, …
    • Pédagogie : montrer de mauvaises présentations
    • étude de cas possibles : ….
    • évaluation en fin de module par une présentation de l'ensemble
    • Relation au projet Tut
  2. idem Savoir faire une présentation
  3. Savoir construire un document bien structuré (format, style, contenu, …)
    • Outils :ex : word, un outil de gestion de contenu en ligne? (lié à Epub ou autre, wiki, …)
    • Pédagogie : Pourquoi ce document est difficile à lire? N'attire pas?
    • étude de cas possibles :… P
    • évaluation en fin de module par un rendu présentant le travail réalisé?
    • Relation au projet Tut
  4. idem Savoir construire un document bien structuré
  5. idem Savoir construire un document bien structuré
  6. Savoir manipuler des données dans un tableur
    • Outils : ex : excel
    • Pédagogie : Analyse de tableaux? de graphiques? …
    • étude de cas possible : obtenir des chiffres sur les provenances des étudiants et les visualiser, obtenir des chiffres sur les filières informatiques, sur les offres d'emplois, sur les offres de stage, … En quoi cette visualisation est plus parlante qu'un long texte? Quels problèmes dans la provenance de ces chiffres?
    • évaluation en fin de module par un rendu présentant le travail réalisé?
  7. Idem Savoir manipuler des données dans un tableur

ATTENTION IE10 et parfois Mozilla Firefox 17.0.5 (x86 fr) (Firefox ESR)

Partie WEB (Séparation Contenu/Presentation, Validation syntaxique, Accessibilité, Optimisation) Rendu à chaque séance mais on en note un au hasard Page personnelle - Demander à Gilles - en interne - essayer de voir pourquoi certaines pages sont meilleures? - Puis MS ExpressionWeb; MS expert,

  1. Comment marche le Web : Serveur, requête http(message texte envoyé avec l'adresse du serveur + la page, metadonnées), navigateur, visualisation de la requête, N clients qui parlent à un seul serveur, le protocole HTTP, …
  2. Construire une page Web : HTML, CSS, XHTML (CSS Zen Garden)
    • une page une idée, …
    • Outils : ?? (quel environnement? pas NotePad++; dans DreamSpark : MS ExpressionWeb; )
    • Pédagogie : Regarder le code source d'une page web, Redimmensionner … constater les changements de visualisation, Utilisation de la synthèse vocale, Quelle difference entre la visualisation et le contenu, modifier des éléments et voir les changemnets
    • Evaluation : Questions qui montrent que vous avez compris ce que vous êtes sensés avoir appris (On les traite en début de séance d'après) avec une évaluation individuelle.
  3. Elements d'HTML (Xhtml, Html5?) (grandes balises : entete, body, doctype, langage et pas besoin d'encodage, importances, inclusion de fichiers; next/previous; div, span, …; Puis les tailles em, … ; Puis les positionnements ; Quelques animations ; ..)
    • Outils : ?? (quel environnement? pas NotePad)
    • Pédagogie : demander la construction d'une page web en donnant un cours en ligne? avec des éléments clefs : couleurs, liens, tableau, …, structure, forcer la présence d'éléments similaires pour ensuite faire sortir les feuilles de style
  4. XHTML et Validations :
    • Outils : outils de validation de page (W3C, ValidDom?)
    • Pédagogie : faire valider et corriger la page de la semaine précédente
  5. CSS : (CSS Zen Garden)
    • Outils : outils de validation de page
    • Pédagogie : Modifier la page précédente pour y mettre du style…
  6. Optimisations : MetaDonnées, pages Rank, NetLinking, Google points essentiels de l'optimisation, GoogleAnalytics, classes d'adresses de rang A, Une séance en amphi sur l'optimisation ? Mettre une seule balise H1…
  7. Tour d'horizon d'autres outils qui permettent de publier des pages sans écrire de code : Autres systèmes, WIKI, WIKIPEDIA, WordPress, CMS, Moteur de Blog, …
  8. Bilan récapitulatif : A placer dans la dernière séance.
  9. Semaine du 6 janvier : Soutenances de projets Tuts mais avec des documents produits pour ce module et évaluation.. Pour la partie web, on évalue la syntaxe….

Outils

Examens années précédentes

Ce module est nouveau. Il n'existe donc pas d'archives.

Références

2013_2014/s1/docweb/start.1373880600.txt.gz · Last modified: 2013/07/15 11:30 by blay