Aller au contenu. | Aller à la navigation

Outils personnels

Navigation
Vous êtes ici : Accueil / Espace pédagogique / Informatique / Cours de B. Emery (ancien cours) / Cours 3INOC 2013-14 / Objectifs d'apprentissage 2013-14

Objectifs d'apprentissage 2013-14

Ce que vous devez savoir.

Objectifs généraux :

  • Comprendre l'organisation générale des fichiers destinés à l'internet.
  • Identifier la fonction des langages HTML, CSS et Javascript et leurs interactions.
  • Comprendre le fonctionnement d'algorithmes de programmation et en réaliser.
  • Réaliser des sites web et applications web.

 

Objectifs détaillés :

27 août 2013 - Introduction générale (Cours 1)

  • Définir la structure générale du langage et des fichiers HTML.
  • Définir la différence entre les balises ouvrantes, fermantes et orphelines.
  • Définir les notions de balises et d'attributs.

 

3 septembre 2013 - Les bases du HTML (Cours 2)

  • Définir les principales sections (head et body) d'un fichier HTML et leur principales balises.
  • Définir la structure minimale des fichiers HTML.
  • Identifier la différence entre les balises de catégorie flow (bloc) et phrasing (en ligne).
  • Dissocier le contenu d'un fichier de sa forme et associer à chaque élément une valeur sémantique à l'aide de la balise HTML adéquate.

 

10 septembre 2013 - Les bases de la CSS (Cours 3)

  • Définir les principales sections d'un fichier HTML où placer les déclaration CSS.
  • Définir la structure de base d'une déclaration CSS et les principales propriétés CSS.
  • Identifier les différences entre les unités absolues et relatives.
  • Dissocier le contenu d'un fichier de sa forme.

 

17 septembre 2013 - Les tableaux et les pseudo-classes CSS (Cours 4)

  • Définir l'organisation générale des tableaux HTML et leurs principales sous-sections.
  • Associer les balises HTML aux déclarations CSS afin de créer des tableaux "personnalisés".
  • Identifier les différents moyens (sélecteurs) d'affecter une balise HTML donnée par la CSS et le principe de cascade.
  • Identifier la propriété display et son importance dans la mise en page.
  • Identifier l'usage des tableaux comme étant réservé aux données tabulaires et non à la mise en page.

 

1 octobre 2013 - SVG (Cours 5)

  • Définir les principaux avantages du dessin vectoriel.
  • Définir les principales façon de placer les déclarations SVG.
  • Définir la structure des instructions SVG et réaliser des dessins simple.
  • Intégrer du code XML+SVG dans les fichiers HTML et les associer à de la CSS.

 

8 octobre 2012 - Evaluation

  • Utiliser l'ensemble des cours précédents pour mettre en place des pages HTML statiques.

En guise de travail supplémentaire de fin de semestre (à rendre au plus tard à la première leçon de janvier), vous pouvez réaliser seul (ou jusqu'à 4) un petit projet qui utilise tous les langages du cours (HTML, CSS, JS et SVG). Comme exemple, vous pouvez réaliser une animation de type "fond d'écran" ou une carte postale musicale (et animée). Tout élément provenant d'une autre source doit être explicitement indiqué, et la source citée. Le code ne doit pas faire intervenir de librairie JS (p.ex jQuery). Le code doit être commenté et indenté.
Ce travail peut rapporter de 0 à 3 dixièmes supplémentaires sur votre moyenne du semestre.

 

15 octobre 2013 - Les bases du Javascript (Cours 6)

  • Définir la structure du langage JS.
  • Différencier les variables locales des variables globales.
  • Définir les principales façon de placer les déclarations JS et les principales façons de lancer le code JS (notamment par les évenements du DOM).

 

29 oct. au 19 novembre 2013 - Programmation Javascript (Cours 7)

  • Identifier la structure du DOM et son intérêt.
  • Associer les balises HTML aux variables JS.
  • Utiliser les principales structures des langages de programmation (boucles, fonctions, etc.) pour modifier dynamiquement un fichier HTML/CSS.

 

26 novembre 2013 - Audio et Vidéo (Cours 8)

  • Identifier la structure de l'insertion d'élément audio et vidéo.
  • Contrôler les éléments audio et vidéo avec JS.

 

14 janvier 2014 - Mise en page avancée (Cours 9)

  • Utiliser les instructions de mise en page avancée (positionnement absolu, fixé, etc.).
  • Utiliser les instructions de mise en forme avancées (taille des blocs, overflow, etc.).
  • Refaire la CSS d'une page internet.

 

21 janvier 2014 - Externalisation des fichiers CSS et JS (Cours 10)

  • Externaliser les instructions CSS et Javascript.
  • Comprendre le principe de mise en cache des fichiers.

 

28 janvier - 11 février 2014 - Utilisation de jQuery (Cours 11*)

  • Intégrer et utiliser une librairie de fonctions javascript telle que jQuery.
  • Appliquer des fonctions JS pré-programmées (jQuery Tools) pour animer des pages internet.
  • Réaliser un jeu de Memory.

 

25 février 2014 - Les formulaires (Cours 12)

  • Identifier et utiliser la structure HTML et les balises spécifiques aux formulaires de données.
  • Différencier les balises HTML d'entrée de données et leurs usages spécifiques.
  • Récupérer/Modifier/Vérifier les données d'un formulaire à l'aide de JS.
  • Réaliser un formulaire de donnée.

 

mars-avril 2014 - Stockage local de données (Cours 13)

  • Comprendre le principe de stockage de données et des bases de données.
  • Utiliser les requêtes JS pour le stockage de donnée locale.
  • Réaliser un tableau de "Meilleures score" pour un jeu.

 

28 avril 2014 - Drag'n Drop HTML5 (Cours 14)

  • Comprendre le principe du Drag & Drop en HTML5, incluant les évènements DOM s'y rapportant et l'objet DataTransfer.
  • Différencier la réalisation d'une copie d'un objet de son déplacement.
  • Utiliser le JS pour écrire du code HTML et pas uniquement du contenu.
  • Réaliser des jeux incluant le drag'n drop.

 

Suite du Programme du 2ème semestre :

  • Réalisation de webapp/concept-art/jeu. Réécriture d'applications Flash en HTML5.
  • Pour vous aider : Animer SVG avec JavaScript Ex 1, Ex 2.