Technologies du web 1

Cette page regroupe des vidéos présentant le contenu du cours Technologies du Web 1 du semestre 1 de la licence SESI de l'Université de Lille 1. Dans le cursus informatique de Lille 1, ce cours est prolongé par un autre qui approfondit javascript (ajax en particulier) et présente les aspects orienté serveur du web, avec le langage php et une introduction aux bases de données notamment.

Ces ressources sont mises à disposition librement. Simplement, commme il se doit, en cas d'utilisation il convient de citer la source et l'Université Lille 1. Toutes les remarques permettant d'améliorer le contenu présenté sont les bienvenues. Celui-ci est en partie encore en cours d'élaboration et/ou d'amélioration.

Objectifs et pré-requis

Le contenu de ce cours porte sur les technologies côté client du web, à savoir les langages HTML, CSS et javascript. Son objectif n'est pas d'en faire une présentation exhaustive. Les principes essentiels sont présentés ainsi que les éléments les plus utilisés. Il n'est pas question, et cela n'aurait pas de sens, de chercher à faire un catalogue de tous les éléments de ces langages. Ces technologies comportent de nombreux détails et parfois subtilités. A l'issue de ce cours l'étudiant doit être en mesure de poursuivre en autonomie l'apprentissage des différents éléments complémentaires.

Les notions présentées ne sont pas complexes et sont certainement à la portée d'un très large public. Seule la partie sur le langage javascript fait l'hypothèse de connaissances de bases en programmation impérative car ce n'est pas l'objectif de ce cours que d'introduire la programmation. Par contre les parties sur HTML et CSS peuvent être abordées sans aucun pré-requis, à mon avis par un public très large. Elles permettent déjà de toucher du doigt de nombreux concepts importants en informatique : les langages, la syntaxe, la validation, la rigueur d'écriture de code, etc.

Comment utiliser ces supports

Le cours est structuré en chapitres. Chaque chapitre est découpé en parties présentées sous la forme de vidéos relativement courtes. Ces vidéos consistent en la présentation de diapositives de cours commentées et annotées ainsi que d'exemples. Dans chaque partie vous avez accès au support pdf des diapositives de cours. Vous disposez du diaporama tel qu'il est utilisé dans les vidéos mais aussi d'une version pour impression où les animations sont supprimées (au prix de quelques pertes) pour diminuer le nombre de pages. Une bonne manière de procéder est certainement de disposer d'un exemplaire papier de ces dispositives que vous pourrez annoter au fur et à mesure des vidéos, comme vous le feriez lors d'un cours. Vous pouvez de plus, et devriez, régulièrement faire des pauses dans les vidéos pour réfléchir aux points abordés, essayer de répondre aux questions posées avant de consulter la réponse. Vous avez évidemment la possibilité de revenir sur un point et de le répéter plusieurs fois quand c'est nécessaire.

Dans chacune des pages présentant une séquence, les vidéos sont disponibles en ligne depuis les serveurs de Lille 1, sous différentes qualités. Les plus basses sont néanmoins difficilement exploitables... Vous disposez aussi de la vidéo au format mp4 que vous pouvez télécharger pour une consultation hors-ligne (et parfois en ligne selon les formats pris en charge par votre navigateur). Afin de permettre une meilleure lisibilité des exemples et notamment des codes sources, il est conseillé d'afficher les vidéos en plein écran.

Lorsque des exemples sont présentés dans une séquence, les fichiers sources de cet exemple peuvent être téléchargés. Il est alors possible d'étudier plus en détail l'exemple, ce qui est fortement conseillé.

Enfin des exercices sont proposés pour accompagner l'ensemble du contenu (voir lien ci-dessous). Ils sont parfois corrigés mais l'étude de cette correction n'est utile que si l'on a fait l'effort de chercher à traiter l'exercice auparavant. On peut alors confronter sa solution à celle proposée. Et n'oubliez pas qu'il n'y a pas forcément une solution unique. Le cours n'a de sens que s'il est appliqué et que vous essayez donc de réaliser ces exercices. C'est à travers ce travail que vous pourrez évaluer et valider votre compréhension des notions présentées. De plus les exercices sont à de nombreuses reprises l'occasion de compléter le cours et d'introduire des éléments des langages étudiés par l'exemple et la pratique.

Bref, soyez acteur de votre apprentissage.