95 lines
4.4 KiB
TeX
95 lines
4.4 KiB
TeX
\documentclass[11pt,a4paper]{../../template/template_cours}
|
||
\usepackage{listings}
|
||
|
||
\title{Séquence Web — Cours}
|
||
\author{\href{https://git.jean-cloud.net/adrian-amaglio}{Adrian Amaglio}}
|
||
\def\thesequence{Web}
|
||
|
||
\begin{document}
|
||
\maketitle
|
||
|
||
\section{Qu’est-ce que le web ?}
|
||
\begin{definition}
|
||
Le web est un réseau d’échange de documents (pages web, multimédia, etc) utilisant internet.
|
||
\end{definition}
|
||
|
||
\begin{definition}
|
||
Un navigateur web est un logiciel capable de récupérer des documents sur le web et d’afficher des pages web.
|
||
\end{definition}
|
||
|
||
\section{URLs}
|
||
On identifie les fichiers grâce à une URL pour « Uniform Ressource Locator » ou en français : « localisateur uniforme de ressource ».
|
||
\begin{definition}
|
||
Une URL est de la forme suivante :\\
|
||
\textcolor{red}{https://}\textcolor{blue}{www.julesguesde.fr}\textcolor{green}{/LIENS}\textcolor{black}{?lang=fr}
|
||
\begin{description}
|
||
\item[\textcolor{red}{https://}] Le protocole utilisé pour récupérer la ressource. HTTP pour le web, HTTPS avec un chiffrement.
|
||
\item[\textcolor{blue}{www.julesguesde.fr}] Est le nom du serveur qui stock la ressource.
|
||
\item[\textcolor{green}{/LIENS}] Est le chemin du document que l’on souhaite récupérer sur le serveur.
|
||
\item[\textcolor{black}{?lang=fr}] Sont des paramètres permettant de personnaliser la page.
|
||
\end{description}
|
||
\end{definition}
|
||
|
||
|
||
\section{Documents et pages web}
|
||
Tous les fichiers peuvent être mis sur le web. Un type de fichier est cependant traité différement : les pages web.
|
||
Une page web est un fichier texte dont le contenu est structuré par le format HTML pour « HyperText Markup Language » ou « langage de balisage hypertexte ».
|
||
\begin{definition}
|
||
Le HTML permet de structurer un document et de donner un sens sémantique au texte.
|
||
C’est à dire que l’on peut préciser où sont les titres, paragraphes, menus, en-têtes, etc.
|
||
\end{definition}
|
||
Le HTML est un format de structure d’un fichier.
|
||
On peut donc mettre des titres, des paragraphes et d’autres éléments de structure dans une page.
|
||
\begin{example}
|
||
Voici à quoi ressemble une page HTML en texte et interprétée par le navigateur
|
||
\begin{centering}
|
||
\lstinputlisting[language=HTML,linerange={1-4,6-12}]{example.html}
|
||
\includegraphics[width=.4\textwidth]{example.png}
|
||
\end{centering}
|
||
\end{example}
|
||
|
||
\subsection{Les feuilles de style}
|
||
Un autre type de fichier est important pour le web.
|
||
Il s’agit du CSS comme « Cascade Style Sheet » ou « feuilles de style en cascade ».
|
||
\begin{definition}
|
||
Les fichiers CSS permettent de styliser une page web en changeant les éléments de style (la mise en forme, les polices, les couleurs…).
|
||
\end{definition}
|
||
|
||
\begin{example}
|
||
Voici la même page que tout à l’heure mais pour laquelle on a appliqué le style CSS suivant :
|
||
\begin{centering}
|
||
\lstinputlisting[language=HTML]{example.css}
|
||
\includegraphics[width=.6\textwidth]{examplecss.png}
|
||
\end{centering}
|
||
\end{example}
|
||
|
||
\section{HyperTexte}
|
||
La force du web, c’est de pouvoir faire référence à d’autres documents depuis un texte.
|
||
C’est le rôle des liens !
|
||
\begin{example}
|
||
Par exemple, sur le site du lycée, on trouve des liens vers le site web de pronote et vers l’ENT.
|
||
\end{example}
|
||
Les documents sur internet peuvent donc être vus comme connectés entre eux par ces liens.
|
||
C’est pour ça qu’on le représente souvent sous forme de toile d’araignée (web en anglais).
|
||
|
||
\begin{definition}
|
||
L’hypertexte est la possibilité dans un document de faire un lien direct avec un autre document.
|
||
\end{definition}
|
||
|
||
\section{Moteurs de recherche}
|
||
Pour accéder à un site internet, il faut connaître son adresse IP ou son adresse symbolique, ce qui est très peu pratique au quotidien.
|
||
Les moteurs de recherches sont des sites web qui répertorient d’autres sites web et les classent par mots-clés et thèmes.
|
||
Ils peuvent ensuite nous présenter les pages web qui semblent contenir ce que l’on cherche.
|
||
\begin{definition}
|
||
Un moteur de recherche répertorie un maximum de pages web puis affiche celles qui correspondent le mieux à notre recherche.
|
||
\end{definition}
|
||
|
||
\section{Cookies}
|
||
\begin{definition}
|
||
Un cookie est un texte stocké par le navigateur à la demande d’un serveur.\\
|
||
Il est renvoyé au serveur à chaque requête.\\
|
||
Il permet donc de stocker des préférences ou d’identifier les utilisateurs et utilisatrices.
|
||
\end{definition}
|
||
|
||
\end{document}
|