Regarde cette vidéo et gagne facilement jusqu'à 15 Lumniz en te connectant !
Il n’y a pas de Lumniz à gagner car tu as déjà vu ce contenu. Ne t’inquiète pas, il y a plein d’autres vidéos, jeux, quiz ou articles intéressants à explorer et toujours plus de Lumniz à remporter.
Notions de web et d'interface homme-machine
Les cours Lumni - LycéeDans ce cours de spécialité Numérique et sciences informatiques, Charles explique ce qui se cache derrière les notions de web et d'interface homme-machine
Téléchargez en PDF :
- le support de cours,
- une fiche d'exercices,
- les fichiers d'exercices,
- le corrigé des exercices.
Le plan du cours
- Historique
- Web et Internet
- Modèle client-serveur
- Les langages client : HTML, CSS, JavaScript
Web et Internet
Internet est un gigantesque réseau d’ordinateurs où s'échangent :
- courriers electroniques
- streaming
- échange de fichiers par FTP
Le Web est un ensemble d’informations constitué par des milliards de documents reliés les uns aux autres par des hyperliens ou liens hypertexte.
Modèle client-serveur
Le navigateur commence par demander, à un serveur de noms de domaines (DNS), l’adresse IP de chihuahuas.fr. Le serveur fournit 185.75.143.28.
Puis le navigateur envoie une requête HTTP au serveur web.
GET /commandes.html HTTP/1.1
Host : www.chihuahuas.fr
User-Agent : Mozilla/5.0
Accept : text/html
Le serveur web renvoie l’entête suivant
HTTP/1.1 200 OK
Date: Thu, 19 Jun 2020 16:20:34 GMT
Server: Apache/2.2.3
Content-Length: 7234
Content-Type: text/html; charset=UTF-8
…suivi des données c’est-à-dire de la page web au format HTML.
L'HyperText Transfer Protocol Secure (HTTPS, littéralement « protocole de transfert hypertextuel sécurisé ») est la combinaison du HTTP avec une couche de chiffrement comme SSL ou TLS
Récapitulons :
- Internet est un réseau informatique.
- Le Web est un réseau d’informations.
- Le Web et Internet représentent deux choses différentes.
- Cette URL https://mabanque.fr témoigne avec https:// que l’échange entre le navigateur et le serveur est chiffré.
Les langages client : HTML, CSS, JavaScript
HTML5 (HyperTextMarkupLanguage 5)
HTML5 est un langage de balises utilisé pour la structure du site.
Exemples :
La balise <a> permet d’insérer dans une page web un lien hypertexte
Pour insérer une image dans un script HTML, on utilise la balise <img>
CSS 3 (Cascading Style Sheets).
CSS 3 Langage de feuilles de style en cascade utilisé pour le graphisme du site. L’ordre de la cascade est le suivant : Sélecteur > Propriété > Valeur
Exemples :
On saisit le code suivant dans un fichier CSS : p{color:red;text-decoration:underline;} Qu’observe-t-on sur la page web ? Les textes des paragraphes sont soulignés et en rouge
Comment modifier le style de la balise h1 dans un fichier CSS ? h1{font-style:italic; color:red
JavaScript
JavaScript est un langage de programmation de scripts utilisé pour l’interaction utilisateur – interface.
Exemples :
<button onclick='Rouge()'>Cliquez</button> cette ligne de code est un JavaScript
Le sélecteur document.getElementById('truc') recherche dans le document web l’unique élément d’identifiant 'truc'
Réalisateur : Didier Fraisse
Producteur : France tv studio
Année de copyright : 2020
Année de production : 2020
Année de diffusion : 2020
Publié le 04/08/20
Modifié le 20/09/23
Ce contenu est proposé par