LE WEB

LE WEB

Présentation du thème

Start

Index

Qu'est ce que le web ?

Repères historiques

Navigateurs ou moteurs de recherche ?

Approche technique

Sécurité & confidentialité sur le web

Zoom sur.......

Fonctionnement d'un moteur de recherche

Conclusion

Qu'est-ce que le web ?

La 1ère page du web en 1991

Approche historique

Je vérifie que j'ai bien retenu les dates

Navigateur ou moteur de recherche ?

Les principaux navigateurs

Un navigateur est un logiciel conçu pour consulter et afficher des sites Web. Les plus utilisés sont Firefox, Edge, Chrome et Safari. Parmi les différents menus des navigateurs, l'onglet Favoris permet d'accéder rapidement aux pages préférées.

Les principaux moteurs de recherche

Un moteur de recherche permet de trouver des informations dans des pages web dont on ne connaît pas l'adresse, voire dont on ignore l'existence.

Approche technique

Techniquement, le web repose sur cinq éléments : *le protocole HTTP (HyperText Transfert Protocol) ou sa version sécurisée HTTPS (échanges cryptés), *les URL (Uniform Resource Locator) * L'hypertexte * Un langage de description pour écrire des pages web : HTML ( Hyper Text Markup Language) * Un langage pour définir le style graphique des pages web : le CSS (Cascading Style Sheets) .

Modèle client/serveur Nous avons déjà vu que deux ordinateurs en réseau peuvent s'échanger des données. Dans la plupart des cas, ces échanges ne sont pas "symétriques" : en effet, un ordinateur A va souvent se contenter de demander des ressources (fichiers contenant du texte, photos, vidéos, sons...) à un ordinateur B. L'ordinateur B va, lui, se contenter de fournir des ressources à tous les ordinateurs qui lui en feront la demande. On dira alors que l'ordinateur A (celui qui demande des ressources) est un client alors que l'ordinateur B (celui qui fournit les ressources) sera qualifié de serveur.

Le Web s'appuie sur un dialogue entre clients et serveurs. Les clients sont les applications qui se connectent au Web, comme les navigateurs, qui envoient des requêtes HTTP (HyperText Transfert Protocol) aux serveurs où sont stockées les données. HTTP est le protocole qui permet aux ordinateurs de communiquer entre eux.

Exemple : Google, Amazon ou encore Facebook possèdent un très grand nombre de serveurs afin de pouvoir satisfaire les demandes des utilisateurs en permanence. Ces entreprises possèdent d'immenses salles contenant chacune des centaines ou des milliers de serveurs (ces serveurs sont rangés dans des armoires appelées "baies de serveur").

Exemple de requête HTTP (côté client)

Exemple d'une réponse HTTP (côté serveur)

Le protocole HTTPS

Les sites web ont une structure en arborescence : une ressource (page, photo....) peut se trouver dans un dossier, lui-même situé dans un autre dossier et ainsi de suite.

Le langage HTML

Le langage HTML (Hyper Text Markup Language) est un langage informatique de description (ce n'est pas un langage de programmation comme Python). Il permet de décrire la structure d'un document numérique destiné à être transmis par le web et affiché dans un programme appelé navigateur internet (Exemple : Mozilla Firefox, Google Chrome, Internet Explorer, Safari...).

Le langage HTML utilise des balises pour délimiter le début et la fin de chaque instruction lue par le navigateur.Chaque instruction HTML est délimitée par une balise ouvrante <élément > et une balise fermante </élément>. Ces balises sont invisibles à l'écran mais elles sont importantes car elles permettent au navigateur d'interpréter ce qu'il doit afficher.

Exemple de page en langage html

Composition d'une page web

Les principales balises HTML

<p>=pour créer un paragraphe <h1>=pour créer un gros titre <h1 align=center>----------</h1>=pour mettre au centre mon gros titre <h2>=pour créer un titre de niveau 2 (écriture plus petite que h1) <strong>------</strong> =pour mettre en gras une zone de texte <em>--------------</em> =pour mettre en italique une zone de texte <u>----------</u>=pour souligner une zone de texte

D'autres balises HTML

<img> = pour insérer une image <table>= pour insérer un tableau <tr>---------</tr>= pour insérer une ligne de tableau <td>--------</td>= pour insérer une cellule du tableau

Le lien hypertexte est sans doute la balise la plus emblématique : elle permet un renvoi à un autre endroit d'une page Web, à une autre page du site ou à un autre site. Elle est identifiée par la balise < a href ="url de la page/"> et se termine par </a>. Un lien est composé principalement d'une URL cible et d'un libellé (le texte cliquable souvent de couleur, ou une image).

Une page web est donc un simple fichier texte contenant des balises et enregistré avec l'extension ".html".On peut construire une page web à l'aide d'un éditeur de texte gratuit tel que NotePad++(Bloc Notes sur vos oridinateurs). On peut aussi utiliser un éditeur HTML en ligne sur le site : http://goonlinetools.com/

Illustration : j'utilise l'éditeur en ligne Goonlinetools.com

Je m'entraîne

LE LANGAGE CSS : "feuilles de style en cascade"

Le langage CSS (Cascading Style Sheets) permet de définir le style graphique d'une page Web (arrière-plan, type et taille des polices de caractères, etc.). La modification du style d'un élément dans une feuille de style se répercute automatiquement à toutes les pages HTML qui y font appel.

EXEMPLE D'UNE FEUILLE DE STYLE CSS

Autres instructions utiles dans le CSS : - font-style = pour incliner le texte (il faut préciser l'attribut : normal pour une écriture droite ou l'attribut italic pour une écriture en italique.-text-align -= pour déterminer l'alignement du texte (Left / Center/Right / Justify). - Pour souligner du texte :text-decoration : underline.

Tout d'abord, un sélecteur va servir à déterminer à quel (s) élément (s) HTML on souhaite appliquer un style particulier.Par exemple : si l'on souhaite appliquer un style particulier à tous nos paragraphes, on utilisera le sélecteur "p" (="paragraphe"). Si l'on veut modifier le style de tous les titres de niveau 1, on utilisera le sélecteur "h1".

Syntaxe particulière du langage CSS : - on entoure les propriétés et les valeurs par des accolades. - on place un point virgule après avoir spécifié une valeur pour chacune des propriétés. - chaque propriété est séparée de sa valeur par deux points. Exemple :propriété : font-sizevaleur: 18 pxOn l'écrit de cette façon :font-size : 18 px;

Où écrire le CSS ? - A l'intérieur de la page HTML en l'écrivant dans l'élément "head" de notre page HTML : insérer un élément style (<style>.........</style>) directement dans la partie "head" de notre page HTML

Mise en application : je sais intégrer du langage CSS directement dans une page en langage HTML

Synthèse

Sécurité & confidentialité sur le web

Les cookies

Cookie : petit fichier stocké par le navigateur sur l'ordinateur de l'utilisateur après consultation d'un site ou d'un réseau social.

Avantage : Il peut être utilisé pour garder une authentification, une session ouverte, mémoriser nos mots de passe. Inconvénient : collecte de données personnelles à notre insu (nos préférences sur un site, contenu de notre panier d'achat électronique...). Il sert donc indirectement à faire de la publicité ciblée.

PUBLICITE CIBLEE

La publicité ciblée (ou personnalisée) est une technique publicitaire qui vise à identifier les personnes individuellement afin de leur diffuser des messages publicitaires spécifiques en fonction de caractéristiques individuelles. Elle nécessite donc de connaître la personne consultant la publicité et de disposer d’informations sur elle afin de choisir un contenu publicitaire plus susceptible de la faire interagir, par exemple concernant l’un de ses centres d’intérêt supposés ou une intention d’achat. Pour cela, les acteurs de la publicité constituent des « profils » qui sont associés aux utilisateurs.

Les cookies peuvent être considérés comme intrusifs : c'est à cause d'eux que nous sommes immergés de publicités!Face à ce genre de cookies, il est nécessaire de bloquer ces fichiers au niveau de notre navigateur (et non du site).

Comment paramétrer son navigateur

Pour surfer sur le Web en toute sécurité et toute confidentialité, il faut éliminer ses traces en paramétrant son navigateur. Il est possible d'effacer son historique à partir des options du navigateur .

Cliquer ici

Navigation privée

Il s’agit d’une fenêtre de navigateur qui n’enregistre pas votre activité en ligne, y compris vos recherches Google, les sites que vous avez visités, vos mots de passe et les éventuels cookies. Lorsque vous fermez une fenêtre de navigation privée, votre session de navigation est effacée sans laisser de trace sur votre appareil. Cela signifie que toute personne partageant votre ordinateur ne sera pas en mesure de savoir ce que vous avez consulté sur votre navigateur.

Le VPN :réseau privé virtuel (par abonnement)

Un VPN est un outil de cybersécurité qui chiffre votre connexion Internet afin de masquer votre localisation et d’empêcher les autres d’intercepter votre trafic web. Un VPN garantit votre confidentialité et votre anonymat sur Internet lorsque vous naviguez, faites des achats et effectuez des opérations bancaires en ligne.

Utiliser un VPN

Même sur un réseau public, un VPN peut :- Rendre votre navigation confidentielle - Masquer votre adresse IP (Internet Protocol) - Empêcher votre fournisseur d’accès à internet de vous suivre

Petite précision : Utiliser un VPN permet d'avoir une navigation sans laisser de traces. Mais Malgré cet anonymat, les fournisseurs d'accès à Internet doivent conserver vos fichiers de navigation (appelés les «logs») pendant un an. Ces fichiers peuvent être consultés par la police sur décision judiciaire : affaires graves, cyber-harcèlement, etc...

Zoom sur.....

Fonctionnement des moteurs de recherche

Quelques fonctionnalités de Google

Les droits du web

= ensemble des règles de droit qui s’appliquent sur Internet = La Convention européenne des droits de l’homme définit les droits et les libertés garantis à tous les internautes.

Les types de droits qui s’appliquent sur Internet

Droit au respect de la vie privée et à la protection des données = les informations fournies par un internaute ne peuvent être divulguées sans son consentement. = Une entreprise doit obtenir l’accord de la CNIL pour utiliser des données à caractère personnel. Droit à la suppression ou à la rectification de nos données personnelles = on peut demander à supprimer tout contenu qui porterait préjudice à votre dignité, votre sécurité, votre vie privée ou à votre réputation. Droit d’opposition = lorsque des données à caractère personnel sont traitées à des fins de prospection, la personne concernée a le droit de s’opposer, à tout moment, au traitement de ces données.

Droit à l’oubli = possibilité de demander de ne plus avoir de contenu associé à son nom et prénom lors d’une recherche sur un moteur de recherche. Demande de « déférencement » à faire directement auprès des moteurs de recherche.Droit à la propriété intellectuelle= voler ou s’approprier une œuvre protégée (photographies, musiques, vidéos…) sans le consentement de son auteur sur la toile est illégal. Droit à la liberté d’expression : sauf incitation à la discrimination, à la haine ou à la violence. Vous pouvez choisir de ne pas révéler votre identité sur internet mais les pouvoirs publics peuvent prendre des mesures permettant de la révéler.

Droit d’accès à l’information et aux opinions : il ne doit pas y avoir de discrimination. Droit à la protection contre la cybercriminalité (arnaques, cyber harcèlement, piratage informatique, incitation au terrorisme, pédopornographie…) Droit à la protection des consommateurs lors d’achats en ligne. Droit à l’image : = droit de disposer de son image = droit de s’opposer à la commercialisation, diffusion ou publication de son image sans le consentement de la personne concernée. = désigne aussi le droit de ne pas diffuser une image sans l’accord de la personne qui prise la photographie (droit propriété intellectuelle).

Les différentes parties du web

Internet = réseau mondial de communication connectant des millions d'ordinateurs et d'appareils à travers le monde =infrastructure physique composée de câbles, routeurs, serveurs et périphériques permettant l'échange de données diverses (fichiers, images, vidéos, e-mails....). Le web = réseau d'informations à l'intérieur d'Internet.