Initial commit.
This commit is contained in:
commit
2ffa7c51a2
29 changed files with 1074 additions and 0 deletions
BIN
ProductSans-Regular.woff
Executable file
BIN
ProductSans-Regular.woff
Executable file
Binary file not shown.
73
icann.html
Executable file
73
icann.html
Executable file
|
|
@ -0,0 +1,73 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<title>ICANN - Qui dirige le net ?</title>
|
||||||
|
<link rel="stylesheet" type="text/css" href="style.css">
|
||||||
|
<link rel="icon" type="image/png" href="img/logpetitx500.png"/>
|
||||||
|
<link rel="stylesheet" href="//cdn.materialdesignicons.com/4.7.95/css/materialdesignicons.min.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="backgroundbg">
|
||||||
|
<img class="icon" src="img/logoaltern.png" alt="logo">
|
||||||
|
<div class="divtitle">
|
||||||
|
<title class="quidir">Qui Dirige Internet ?</title>
|
||||||
|
</div>
|
||||||
|
<nav>
|
||||||
|
<ul class="nav_links">
|
||||||
|
<li><a href="ietf.html">IETF</a></li>
|
||||||
|
<li><a href="icann.html">ICANN</a></li>
|
||||||
|
<li><a href="isoc.html">ISOC</a></li>
|
||||||
|
<li><a href="w3c.html">W3C</a></li>
|
||||||
|
<li><a href="uit.html">UIT</a></li>
|
||||||
|
<li><button class="basicbutton" onclick="window.location.href = 'index.html';"><span class="mdi mdi-home"></span> Accueil</button></li>
|
||||||
|
<li><button class="basicbutton" onclick="window.location.href = 'resume.html';"><span class="mdi mdi-check"></span> Résumé</button></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<div class="parallax-wrapper parallax-background3">
|
||||||
|
<div>
|
||||||
|
<h3 class="intro">ICANN</h3>
|
||||||
|
<h3 class="subintro">Internet Corporation for Assigned Names and Numbers</h3>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="divpers">
|
||||||
|
<div class="divcontent">
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<a href="https://www.instagram.com/alzyohan/"><img class="img0" src="img/profilpic_yohan.png" alt="profilpic"></a>
|
||||||
|
</div>
|
||||||
|
<p class="textpers">Écrit par Yohan Boujon, 16 Décembre 2019 ∙</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="div5">
|
||||||
|
<div class="text1">
|
||||||
|
<p class="textfont1"><a href="https://www.icann.org/fr" class="colorlink">“Internet Corporation for Assigned Names and Numbers”</a> est une société non lucrative d’utilité publique fondée le 18 septembre 1998 à Los Angeles mais elle est d’influence international. Son but est d’attribuer les noms de domaines de chaque site internet. En effet, comme nous l’avons vu dans l’IETF, chaque ordinateur ou serveur possède une adresse IP, sur un navigateur internet nous accédons à ces adresses IP via des liens internet, commençant par http ou https, c’est la sécurité du site web, si les informations sont cryptées ou non, ensuite www pour « world wide web », enfin le nom de domaine finissant par un point et une suite de lettre.</p>
|
||||||
|
</div>
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<a><img class="img1" src="img/image5.jpg" alt="picture1" align="right"></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="div5">
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<a><img class="img1" src="img/image6.jpg" alt="picture1" align="right"></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="text2">
|
||||||
|
<p class="textfont2">C’est elle qui met en vente ces noms, elle les vend à des sociétés, qui ensuivent les revendent soit à des utilisateurs, soit à des sociétés avec serveurs. C’est grâce à une technologie appelées « serveur DNS » que ces adresses IP sont transformées en noms de domaines, il y a les domaines de premier niveau, qui sont les .com, .fr, .org, et ensuite les sous domaines, quand il y a x.nomdedomaine.fr ou nomdedomaine.x.fr. Les serveurs DNS s’adressent donc à un serveur racine, avec une adresse IP propre pour savoir à quel nom de domaine il appartient, il s’en suit deux cas, au démarrage il demande la liste à jour des serveurs racines, ou, quand il doit déterminer le nom de domaine pour un serveur.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="divfinal">
|
||||||
|
<div class="divbuttonleft">
|
||||||
|
<button class="basicbutton" onclick="window.location.href = 'ietf.html';"><span class="mdi mdi-chevron-left"></span> IETF</button>
|
||||||
|
</div>
|
||||||
|
<div class="divbuttonright" style="float:right">
|
||||||
|
<button class="basicbutton" onclick="window.location.href = 'isoc.html';">ISOC <span class="mdi mdi-chevron-right"></span></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
78
ietf.html
Executable file
78
ietf.html
Executable file
|
|
@ -0,0 +1,78 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<title>IETF - Qui dirige le net ?</title>
|
||||||
|
<link rel="stylesheet" type="text/css" href="style.css">
|
||||||
|
<link rel="icon" type="image/png" href="img/logpetitx500.png"/>
|
||||||
|
<link rel="stylesheet" href="//cdn.materialdesignicons.com/4.7.95/css/materialdesignicons.min.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="backgroundbg">
|
||||||
|
<img class="icon" src="img/logoaltern.png" alt="logo">
|
||||||
|
<div class="divtitle">
|
||||||
|
<title class="quidir">Qui Dirige Internet ?</title>
|
||||||
|
</div>
|
||||||
|
<nav>
|
||||||
|
<ul class="nav_links">
|
||||||
|
<li><a href="ietf.html">IETF</a></li>
|
||||||
|
<li><a href="icann.html">ICANN</a></li>
|
||||||
|
<li><a href="isoc.html">ISOC</a></li>
|
||||||
|
<li><a href="w3c.html">W3C</a></li>
|
||||||
|
<li><a href="uit.html">UIT</a></li>
|
||||||
|
<li><button class="basicbutton" onclick="window.location.href = 'index.html';"><span class="mdi mdi-home"></span> Accueil</button></li>
|
||||||
|
<li><button class="basicbutton" onclick="window.location.href = 'resume.html';"><span class="mdi mdi-check"></span> Résumé</button></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<div class="parallax-wrapper parallax-background2">
|
||||||
|
<div>
|
||||||
|
<h3 class="intro">IETF</h3>
|
||||||
|
<h3 class="subintro">Internet Engineering Task Force</h3>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="divpers">
|
||||||
|
<div class="divcontent">
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<a href="https://www.instagram.com/alzyohan/"><img class="img0" src="img/profilpic_yohan.png" alt="profilpic"></a>
|
||||||
|
</div>
|
||||||
|
<p class="textpers">Écrit par Yohan Boujon, 16 Décembre 2019 ∙</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="div3">
|
||||||
|
<div class="text1">
|
||||||
|
<p class="textfont1"><a href="https://ietf.org/" class="colorlink">“Internet Enggineering Task Force”</a> est une société fille de l’ISOC, elle a été fondée le 17 janvier 1986, bien qu’elle soit Américaine, elle porte une influence mondiale. C’est elle qui élabore les premiers standards d’Internet, que ce soit les protocoles internet (TCP/IP) ou les composants demandés pour pouvoir accéder à internet. C’est une société assez spéciale, non lucrative qui invite des membres du monde entier pour pouvoir décider des nouveautés.<br>
|
||||||
|
<br>Elle fonctionne avec des « Request for Comments » ou RFC, c’est une série numérotée de documents qui permettent de savoir les différentes caractéristiques matérielles d’Internet, elles ne sont pas des obligations, mais bien des standards, des bases données pour accéder et utiliser internet. Chaque RFC se passent à une date précise, la première étant du 7 avril 1969 et la dernière datant de 2009.<br>
|
||||||
|
<br>Les propositions aux RFC peuvent être données sous n’importe quelle candidature de n’importe quelle personne (oui vous aussi vous pouvez), c’est ce qu’on appelle un groupe informel, elle n’a ni statut, ni membre. L’idée votée à la RFC est ensuite proposée, puis cette idée se transforme en brouillon ou « draft », et enfin transformé en standards Internet.</p>
|
||||||
|
</div>
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<a><img class="img3" src="img/image4.png" alt="picture1" align="right"></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="div4">
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<a><img class="img4" src="img/image3.jpg" alt="picture1" align="right"></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="text2">
|
||||||
|
<p class="textfont2">Mais du coup, c’est quoi le protocole (TCP/IP) ? C’est le protocole mis en place par l’IEFT, qui se passe chaque fois que votre ordinateur veut accéder à un serveur, donc, à un site web, à un email, à un jeu en ligne, une application en ligne, tout ce qui passe par internet, et donc un serveur, utilise ce protocole. L’IP est simplement une étiquette, plaque d’immatriculation donné sur tous les ordinateurs possédant une carte wifi. Le TCP ou « Transmission Control Protocol » fonctionne en 3 étapes appelés « Three-way handshake », littéralement le check en 3 étapes.<br>
|
||||||
|
<br>Premièrement l’ordinateur envoie un signal « SYN », ou synchronisant avec une certaine valeur.<br>
|
||||||
|
<br>En second temps le serveur recevant ce signale, envoie à son tour un « SYN », pour répondre qu’il veut bien une synchronisation, ensuite un « ACK », acknowledgement en anglais, qui veut dire reconnaissant, pour demander à l’ordinateur s’il veut se connecter<br>
|
||||||
|
<br>Nous finissons par un nouveau signal « ACK » venant de l’ordinateur jusqu’au serveur, c’est bon, l’ordinateur s’est connecté avec succès !</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="divfinal">
|
||||||
|
<div class="divbuttonleft">
|
||||||
|
<button class="basicbutton" onclick="window.location.href = 'index.html';"><span class="mdi mdi-chevron-left"></span> Introduction</button>
|
||||||
|
</div>
|
||||||
|
<div class="divbuttonright" style="float:right">
|
||||||
|
<button class="basicbutton" onclick="window.location.href = 'icann.html';">ICANN <span class="mdi mdi-chevron-right"></span></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
BIN
img/image1.jpg
Executable file
BIN
img/image1.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 73 KiB |
BIN
img/image2.jpg
Executable file
BIN
img/image2.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 97 KiB |
BIN
img/image3.jpg
Executable file
BIN
img/image3.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 55 KiB |
BIN
img/image4.png
Executable file
BIN
img/image4.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 66 KiB |
BIN
img/image5.jpg
Executable file
BIN
img/image5.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 456 KiB |
BIN
img/image6.jpg
Executable file
BIN
img/image6.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 876 KiB |
BIN
img/image7.jpg
Executable file
BIN
img/image7.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 46 KiB |
BIN
img/image8.jpg
Executable file
BIN
img/image8.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 107 KiB |
BIN
img/image9.png
Executable file
BIN
img/image9.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 800 KiB |
BIN
img/intro.png
Executable file
BIN
img/intro.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 MiB |
BIN
img/intro1.png
Executable file
BIN
img/intro1.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
BIN
img/intro2.png
Executable file
BIN
img/intro2.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 MiB |
BIN
img/intro3.png
Executable file
BIN
img/intro3.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 MiB |
BIN
img/intro4.png
Executable file
BIN
img/intro4.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 781 KiB |
BIN
img/intro5.png
Executable file
BIN
img/intro5.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 2.4 MiB |
BIN
img/logo.png
Executable file
BIN
img/logo.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 166 KiB |
BIN
img/logoaltern.png
Executable file
BIN
img/logoaltern.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 172 KiB |
BIN
img/logpetitx250.png
Executable file
BIN
img/logpetitx250.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
img/logpetitx500.png
Executable file
BIN
img/logpetitx500.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 40 KiB |
BIN
img/profilpic_yohan.png
Executable file
BIN
img/profilpic_yohan.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
76
index.html
Executable file
76
index.html
Executable file
|
|
@ -0,0 +1,76 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<title>Qui dirige le net ?</title>
|
||||||
|
<link rel="stylesheet" type="text/css" href="style.css">
|
||||||
|
<link rel="icon" type="image/png" href="img/logpetitx500.png"/>
|
||||||
|
<link rel="stylesheet" href="//cdn.materialdesignicons.com/4.7.95/css/materialdesignicons.min.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="backgroundbg">
|
||||||
|
<img class="icon" src="img/logoaltern.png" alt="logo">
|
||||||
|
<div class="divtitle">
|
||||||
|
<title class="quidir">Qui Dirige Internet ?</title>
|
||||||
|
</div>
|
||||||
|
<nav>
|
||||||
|
<ul class="nav_links">
|
||||||
|
<li><a href="ietf.html">IETF</a></li>
|
||||||
|
<li><a href="icann.html">ICANN</a></li>
|
||||||
|
<li><a href="isoc.html">ISOC</a></li>
|
||||||
|
<li><a href="w3c.html">W3C</a></li>
|
||||||
|
<li><a href="uit.html">UIT</a></li>
|
||||||
|
<li><button class="basicbutton" onclick="window.location.href = 'index.html';"><span class="mdi mdi-home"></span> Accueil</button></li>
|
||||||
|
<li><button class="basicbutton" onclick="window.location.href = 'resume.html';"><span class="mdi mdi-check"></span> Résumé</button></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<div class="parallax-wrapper parallax-background1">
|
||||||
|
<div>
|
||||||
|
<h3 class="intro">Introduction</h3>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="divpers">
|
||||||
|
<div class="divcontent">
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<a href="https://www.instagram.com/alzyohan/"><img class="img0" src="img/profilpic_yohan.png" alt="profilpic"></a>
|
||||||
|
</div>
|
||||||
|
<p class="textpers">Écrit par Yohan Boujon, 16 Décembre 2019 ∙</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="div1">
|
||||||
|
<div class="text1">
|
||||||
|
<p class="textfont1">On pourrait penser qu’Internet est un lieu sauvage ou n’importe qui peut faire ce que bon lui semble, mais, bien qu’Internet soit très libre, il est contrôler par certaines sociétés qui contrôlent, que ce soit comment les URL doivent être écrites, les différents protocoles, le langage utilisé, le développement et la croissance d’internet, ou encore la répartition d’internet dans le monde.<br>
|
||||||
|
<br>En effet, bien que chaque pays ait ses propres lois sur le contenu de chaque site internet, pour accéder à ces sites il faut des protocoles précis qui sont donnés par l’IETF et l’ICANN. L’un décrit les composants que chacun doit avoir pour pouvoir accéder à Internet, et les bases pour chaque navigateur Internet. L’autre attribut les noms de domaines, donc, la communication entre les serveurs, internet, et le client. Ces règles que chaque serveur, ou site web respecte, cela permet un langage universel et pose les bases pour accéder.</p>
|
||||||
|
</div>
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<a><img class="img1" src="img/image1.jpg" alt="picture1" align="right"></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="div2">
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<div class="contenu">
|
||||||
|
<img class="img2" src="img/image2.jpg" alt="picture1" align="left">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="text2">
|
||||||
|
<p class="textfont2">Après tout cela il faut connecter tout ce monde, une part financière et publicitaire, d’une part l’ITU, qui existe depuis près de 150 ans, qui a câblé le réseau qui partage le monde entier, que ce soit par le réseau téléphonique, ADSL, ou maintenant la fibre, ou encore la 4G, bientôt la 5G. La part financière et publicitaire qui est l’ISOC est très important pour la répartition d’internet, si en 30 ans Internet s’est autant démocratisé, c’est en effet grâce à cette société Américaine, maintenant créant des branches tout autour du monde pour démocratiser Internet dans le plus de pays possible. Qui sont ces dirigeants ? Comment fonctionnent-ils ?<br>
|
||||||
|
<br>Nous verrons chacune de ces sociétés mères d'internet, certaines travaillent sur le fonctionnement du réseau, d’autres démocratisent un langage universel, et enfin l’un finance le projet.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="divfinal">
|
||||||
|
<div class="divbuttonleft">
|
||||||
|
<button class="offbutton"><span class="mdi mdi-chevron-left"></span></button>
|
||||||
|
</div>
|
||||||
|
<div class="divbuttonright" style="float:right">
|
||||||
|
<button class="basicbutton" onclick="window.location.href = 'ietf.html';">IETF <span class="mdi mdi-chevron-right"></span></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
63
isoc.html
Executable file
63
isoc.html
Executable file
|
|
@ -0,0 +1,63 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<title>ISOC - Qui dirige le net ?</title>
|
||||||
|
<link rel="stylesheet" type="text/css" href="style.css">
|
||||||
|
<link rel="icon" type="image/png" href="img/logpetitx500.png"/>
|
||||||
|
<link rel="stylesheet" href="//cdn.materialdesignicons.com/4.7.95/css/materialdesignicons.min.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="backgroundbg">
|
||||||
|
<img class="icon" src="img/logoaltern.png" alt="logo">
|
||||||
|
<div class="divtitle">
|
||||||
|
<title class="quidir">Qui Dirige Internet ?</title>
|
||||||
|
</div>
|
||||||
|
<nav>
|
||||||
|
<ul class="nav_links">
|
||||||
|
<li><a href="ietf.html">IETF</a></li>
|
||||||
|
<li><a href="icann.html">ICANN</a></li>
|
||||||
|
<li><a href="isoc.html">ISOC</a></li>
|
||||||
|
<li><a href="w3c.html">W3C</a></li>
|
||||||
|
<li><a href="uit.html">UIT</a></li>
|
||||||
|
<li><button class="basicbutton" onclick="window.location.href = 'index.html';"><span class="mdi mdi-home"></span> Accueil</button></li>
|
||||||
|
<li><button class="basicbutton" onclick="window.location.href = 'resume.html';"><span class="mdi mdi-check"></span> Résumé</button></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<div class="parallax-wrapper parallax-background4">
|
||||||
|
<div>
|
||||||
|
<h3 class="intro">ISOC</h3>
|
||||||
|
<h3 class="subintro">Internet Society</h3>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="divpers">
|
||||||
|
<div class="divcontent">
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<a href="https://www.instagram.com/alzyohan/"><img class="img0" src="img/profilpic_yohan.png" alt="profilpic"></a>
|
||||||
|
</div>
|
||||||
|
<p class="textpers">Écrit par Yohan Boujon, 16 Décembre 2019 ∙</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="div4">
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<iframe width="560" height="315" src="https://www.youtube.com/embed/GTP4vDelF_g?controls=0" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="text2">
|
||||||
|
<p class="textfont2"><a href="https://www.internetsociety.org/fr/" class="colorlink">L’Internet Society</a> est d’origine Américaine, elle a été créée en janvier 1992 par les pionniers de l’internet et elle a pour but de promouvoir ce système de réseau dans le monde. D’influence Américaine, cette société a permis le grand essor d’internet, à partir de sa création le nombre d’utilisateur doublait chaque année, nourri par l’influence Américaine, l’envie de se mondialiser était le plus important. C’est elle qui finance la plupart des sociétés mères de l’internet, dont l’IETF, avec plus de 39 millions de dollars de chiffre d’affaire et 37 millions de dollars de dépenses, l’Internet Society. Elle est divisée en plusieurs sections nationales, dont récemment Internet Society France, elle marche comme Google, ou encore Sony. Une grande partie de son financement provient des organisations membres, que ce soit l’IETF ou la W3C. En 2017 l’ISOC a publié un rapport d’Internet, dont ses évolutions depuis sa création, les cyber attaques, l’IA, les objets connectés.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="divfinal">
|
||||||
|
<div class="divbuttonleft">
|
||||||
|
<button class="basicbutton" onclick="window.location.href = 'icann.html';"><span class="mdi mdi-chevron-left"></span> ICANN</button>
|
||||||
|
</div>
|
||||||
|
<div class="divbuttonright" style="float:right">
|
||||||
|
<button class="basicbutton" onclick="window.location.href = 'w3c.html';">W3C <span class="mdi mdi-chevron-right"></span></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
57
resume.html
Executable file
57
resume.html
Executable file
|
|
@ -0,0 +1,57 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<title>Résumé - Qui dirige le net ?</title>
|
||||||
|
<link rel="stylesheet" type="text/css" href="style.css">
|
||||||
|
<link rel="icon" type="image/png" href="img/logpetitx500.png"/>
|
||||||
|
<link rel="stylesheet" href="//cdn.materialdesignicons.com/4.7.95/css/materialdesignicons.min.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="backgroundbg">
|
||||||
|
<img class="icon" src="img/logoaltern.png" alt="logo">
|
||||||
|
<div class="divtitle">
|
||||||
|
<title class="quidir">Qui Dirige Internet ?</title>
|
||||||
|
</div>
|
||||||
|
<nav>
|
||||||
|
<ul class="nav_links">
|
||||||
|
<li><a href="ietf.html">IETF</a></li>
|
||||||
|
<li><a href="icann.html">ICANN</a></li>
|
||||||
|
<li><a href="isoc.html">ISOC</a></li>
|
||||||
|
<li><a href="w3c.html">W3C</a></li>
|
||||||
|
<li><a href="uit.html">UIT</a></li>
|
||||||
|
<li><button class="basicbutton" onclick="window.location.href = 'index.html';"><span class="mdi mdi-home"></span> Accueil</button></li>
|
||||||
|
<li><button class="basicbutton" onclick="window.location.href = 'resume.html';"><span class="mdi mdi-check"></span> Résumé</button></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<div class="parallax-wrapper parallax-background1">
|
||||||
|
<div>
|
||||||
|
<h3 class="intro">Résumé</h3>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="divpers">
|
||||||
|
<div class="divcontent">
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<a href="https://www.instagram.com/alzyohan/"><img class="img0" src="img/profilpic_yohan.png" alt="profilpic"></a>
|
||||||
|
</div>
|
||||||
|
<p class="textpers">Écrit par Yohan Boujon, 16 Décembre 2019 ∙</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="div6">
|
||||||
|
<div class="text1">
|
||||||
|
<p class="textfont3">En Résumé nous avons vu qu’internet depuis sa création a été contrôlé par divers société, et demande beaucoup d’idée à ses utilisateurs, que ce soit par l’instar de « Request for Comments », ou simplement car les sociétés sont non lucrative, et c’est cela qui a permis une telle liberté, car en effet, si aujourd’hui l’accès à Internet est simple c’est notamment grâce aux financements de l’ISOC et de cela découle l’intérêt de crée son site web, qui coutera une certaine somme pour le nom de domaine, ainsi que les serveurs, non seulement cela permet une grande communication dans le monde, mais en plus de cela, des métiers tout nouveau sont formés et l’économie tourne. L’une des plus vieilles société au monde a permis le câblage d’internet, les utilisateurs avec l’IETF ont standardisé internet, ainsi que de grands codeurs dont le fondateur de W3C ont permis la simplicité d’accès à internet.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="divfinal">
|
||||||
|
<div class="divbuttonleft">
|
||||||
|
<button class="basicbutton" onclick="window.location.href = 'uit.html';"><span class="mdi mdi-chevron-left"></span> UIT</button>
|
||||||
|
</div>
|
||||||
|
<div class="divbuttonright" style="float:right">
|
||||||
|
<button class="offbutton"><span class="mdi mdi-chevron-right"></span></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
546
style.css
Executable file
546
style.css
Executable file
|
|
@ -0,0 +1,546 @@
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Product Sans';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: normal;
|
||||||
|
src: local('Product Sans'), url('ProductSans-Regular.woff') format('woff');
|
||||||
|
}
|
||||||
|
@import url('https://fonts.googleapis.com/css?family=Roboto&display=swap');
|
||||||
|
|
||||||
|
html {
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
height: 100vh;
|
||||||
|
perspective: 1px;
|
||||||
|
transform-style: preserve-3d;
|
||||||
|
overflow-x: hidden;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 30px 10%;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
title {
|
||||||
|
font-family: 'Product Sans', sans-serif;
|
||||||
|
font-size: 32px;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
padding: 10px 25px;
|
||||||
|
border: none;
|
||||||
|
border-radius: 50px;
|
||||||
|
cursor: pointer;
|
||||||
|
z-index: 2;
|
||||||
|
position: relative;
|
||||||
|
font-family: 'Product Sans', sans-serif;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 110%;
|
||||||
|
color: #ffffff;
|
||||||
|
text-decoration: none;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
button:hover {
|
||||||
|
transition: all 0.3s ease-out;
|
||||||
|
bottom: 0.2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
border: none;
|
||||||
|
box-shadow: 10px 12px 26px rgba(0, 0, 0, 0.30);
|
||||||
|
width: 81vh;
|
||||||
|
height: 40vh;
|
||||||
|
margin-left:50%;
|
||||||
|
margin-right:50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
table#material tr:nth-child(even) {
|
||||||
|
background-color: #eeeeee;
|
||||||
|
}
|
||||||
|
|
||||||
|
table#material tr:nth-child(odd) {
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
table#material th {
|
||||||
|
color: #ffffff;
|
||||||
|
background: linear-gradient(65deg, #1a237e, #01579b);
|
||||||
|
}
|
||||||
|
|
||||||
|
td {
|
||||||
|
text-align: left;
|
||||||
|
font-family: 'Roboto';
|
||||||
|
font-weight: 300;
|
||||||
|
color: #1c1c1c;
|
||||||
|
}
|
||||||
|
|
||||||
|
tr {
|
||||||
|
text-align: center;
|
||||||
|
font-family: 'Product Sans';
|
||||||
|
color: #1c1c1c;
|
||||||
|
text-shadow: 0 6px 8px rgba(0, 0, 0, 0.30);
|
||||||
|
}
|
||||||
|
|
||||||
|
.basicbutton {
|
||||||
|
background: linear-gradient(65deg, #1a237e, #01579b);
|
||||||
|
}
|
||||||
|
|
||||||
|
.basicbutton:hover {
|
||||||
|
background: linear-gradient(65deg, #2330ad, #0363af);
|
||||||
|
box-shadow: 0 3px 12px 0 rgba(1, 87, 155, 0.7);
|
||||||
|
}
|
||||||
|
|
||||||
|
.offbutton {
|
||||||
|
background: linear-gradient(65deg, #3b3f6e, #527795);
|
||||||
|
}
|
||||||
|
|
||||||
|
.offbutton:hover {
|
||||||
|
background: linear-gradient(65deg, #282b4d, #3b566c);
|
||||||
|
box-shadow: 0 3px 12px 0 rgba(77, 90, 145, 0.7);
|
||||||
|
}
|
||||||
|
|
||||||
|
.backgroundbg {
|
||||||
|
box-sizing: border-box;
|
||||||
|
width: relative;
|
||||||
|
height: 100px;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
background-color: #0d184e;
|
||||||
|
z-index: 2;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
li, a {
|
||||||
|
font-family: 'Product Sans', sans-serif;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 110%;
|
||||||
|
color: #cbc4f5;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
cursor: pointer;
|
||||||
|
height: 100px;
|
||||||
|
width: 100px;
|
||||||
|
margin: 20px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav_links {
|
||||||
|
list-style: none;
|
||||||
|
z-index: 2;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav_links li {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0px 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav_links li a {
|
||||||
|
transition: all 0.3s ease 0s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav_links li a:hover {
|
||||||
|
color: #0363af;
|
||||||
|
}
|
||||||
|
|
||||||
|
.parallax-wrapper {
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
padding-top: 20vh;
|
||||||
|
box-sizing: border-box;
|
||||||
|
transform-style: preserve-3d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.parallax-wrapper::before {
|
||||||
|
content:"";
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
background-repeat: round;
|
||||||
|
position: absolute;
|
||||||
|
z-index: -1;
|
||||||
|
transform: translateZ(-1px) scale(2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.parallax-background1::before{
|
||||||
|
background-image: url('img/intro.png');
|
||||||
|
}
|
||||||
|
|
||||||
|
.parallax-background2::before{
|
||||||
|
background-image: url('img/intro5.png');
|
||||||
|
}
|
||||||
|
|
||||||
|
.parallax-background3::before{
|
||||||
|
background-image: url('img/intro1.png');
|
||||||
|
}
|
||||||
|
|
||||||
|
.parallax-background4::before{
|
||||||
|
background-image: url('img/intro4.png');
|
||||||
|
}
|
||||||
|
|
||||||
|
.parallax-background5::before{
|
||||||
|
background-image: url('img/intro3.png');
|
||||||
|
}
|
||||||
|
|
||||||
|
.parallax-background6::before{
|
||||||
|
background-image: url('img/intro2.png');
|
||||||
|
}
|
||||||
|
|
||||||
|
.colorlink {
|
||||||
|
color: #0363af;
|
||||||
|
}
|
||||||
|
|
||||||
|
.quidir {
|
||||||
|
position: relative;
|
||||||
|
color: #cbc4f5;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
text-shadow: 10px 12px 26px rgba(0, 0, 0, 0.30);
|
||||||
|
font-family: 'Product Sans';
|
||||||
|
}
|
||||||
|
|
||||||
|
.intro {
|
||||||
|
font-family: 'Product Sans', sans-serif;
|
||||||
|
font-size: 140px;
|
||||||
|
font-weight: 700;
|
||||||
|
text-shadow: 10px 12px 26px rgba(0, 0, 0, 0.30);
|
||||||
|
position: relative;
|
||||||
|
color: #edf0f1;
|
||||||
|
text-align: center;
|
||||||
|
top: 15vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.subintro {
|
||||||
|
font-family: 'Product Sans', sans-serif;
|
||||||
|
font-size: 50px;
|
||||||
|
font-weight: 500;
|
||||||
|
text-shadow: 10px 12px 26px rgba(0, 0, 0, 0.30);
|
||||||
|
position: relative;
|
||||||
|
color: #edf0f1;
|
||||||
|
opacity: 0.7;
|
||||||
|
text-align: center;
|
||||||
|
top: 15vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.divtitle {
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: flex;
|
||||||
|
height: 13vh;
|
||||||
|
position: absolute;
|
||||||
|
left: 125px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.div1 {
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-right: 20vh;
|
||||||
|
padding-left: 20vh;
|
||||||
|
background-color: #edf0f1;
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
height: 550px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.div2 {
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-right: 20vh;
|
||||||
|
padding-left: 20vh;
|
||||||
|
background-color: #edf0f1;
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
height: 500px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.div3 {
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-right: 20vh;
|
||||||
|
padding-left: 20vh;
|
||||||
|
background-color: #edf0f1;
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
height: 550px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.div4 {
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-right: 20vh;
|
||||||
|
padding-left: 20vh;
|
||||||
|
background-color: #edf0f1;
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
height: 650px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.div5 {
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-right: 20vh;
|
||||||
|
padding-left: 20vh;
|
||||||
|
background-color: #edf0f1;
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
height: 400px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.div6 {
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-right: 20vh;
|
||||||
|
padding-left: 20vh;
|
||||||
|
background-color: #edf0f1;
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
height: 500px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.centered {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.divfinal {
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-right: 20vh;
|
||||||
|
padding-left: 20vh;
|
||||||
|
background-color: #edf0f1;
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
height: 100px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.divpers {
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-right: 20vh;
|
||||||
|
padding-left: 20vh;
|
||||||
|
background-color: #edf0f1;
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
height: 12vh;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.divcontent {
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-left: 5vh;
|
||||||
|
background-color: #edf0f1;
|
||||||
|
width: 100%;
|
||||||
|
height: 10vh;
|
||||||
|
box-shadow: 0 4px 10px 0 rgba(0,0,0,0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.divbuttonright {
|
||||||
|
display:flex;
|
||||||
|
overflow: auto;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
box-sizing: border-box;
|
||||||
|
height: 13vh;
|
||||||
|
position: absolute;
|
||||||
|
right: 125px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.divbuttonleft {
|
||||||
|
display:flex;
|
||||||
|
overflow: auto;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
box-sizing: border-box;
|
||||||
|
height: 13vh;
|
||||||
|
position: absolute;
|
||||||
|
left: 125px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contenu{
|
||||||
|
position: relative;
|
||||||
|
width: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.outcentered {
|
||||||
|
height: 100%;
|
||||||
|
display: table;
|
||||||
|
}
|
||||||
|
|
||||||
|
.incentered {
|
||||||
|
display: table-cell;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img1 {
|
||||||
|
width: 440px;
|
||||||
|
height: 275px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img2 {
|
||||||
|
width: 448px;
|
||||||
|
height: 297.5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img0 {
|
||||||
|
cursor: pointer;
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
box-shadow: 0 4px 10px 0 rgba(0,0,0,0.3);
|
||||||
|
border-radius: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img3 {
|
||||||
|
width: 400px;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img4 {
|
||||||
|
width: 402.6px;
|
||||||
|
height: 183.7px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img6 {
|
||||||
|
width: 500px;
|
||||||
|
height: 275px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img0:hover {
|
||||||
|
transition: 0.3s ease-in;
|
||||||
|
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.8);
|
||||||
|
}
|
||||||
|
|
||||||
|
.img1:hover {
|
||||||
|
transition: 0.22s ease-in;
|
||||||
|
box-shadow: 0 8px 21px 0 rgba(0,0,0,0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.img2:hover {
|
||||||
|
transition: 0.22s ease-in;
|
||||||
|
box-shadow: 0 8px 21px 0 rgba(0,0,0,0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.img3:hover {
|
||||||
|
transition: 0.22s ease-in;
|
||||||
|
box-shadow: 0 8px 21px 0 rgba(0,0,0,0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.img4:hover {
|
||||||
|
transition: 0.22s ease-in;
|
||||||
|
box-shadow: 0 8px 21px 0 rgba(0,0,0,0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.img6:hover {
|
||||||
|
transition: 0.22s ease-in;
|
||||||
|
box-shadow: 0 8px 21px 0 rgba(0,0,0,0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.overlay1 {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
width: 448px;
|
||||||
|
height: 297.5px;
|
||||||
|
opacity: 0;
|
||||||
|
transition: 0.22s ease-in;
|
||||||
|
background: linear-gradient(65deg, #1a237e, #01579b);
|
||||||
|
box-shadow: 0 8px 21px 0 rgba(0,0,0,0.7);
|
||||||
|
font-family: 'Product Sans', sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contenu:hover .overlay1{
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.textcontenu1 {
|
||||||
|
color: white;
|
||||||
|
font-size: 20px;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
text-shadow: 0px 4px 8px rgba(0,0,0,0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.textpers {
|
||||||
|
font-family: 'Product Sans', sans-serif;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 130%;
|
||||||
|
text-align: left;
|
||||||
|
margin: 3vh;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text1 {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.textfont1 {
|
||||||
|
font-family: 'Roboto', sans-serif;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 130%;
|
||||||
|
text-align: left;
|
||||||
|
margin: 5vh;
|
||||||
|
color: #1c1c1c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text2 {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.textfont2 {
|
||||||
|
font-family: 'Roboto', sans-serif;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 130%;
|
||||||
|
text-align: right;
|
||||||
|
margin: 5vh;
|
||||||
|
color: #1c1c1c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.textfont3 {
|
||||||
|
font-family: 'Roboto', sans-serif;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 130%;
|
||||||
|
text-align: center;
|
||||||
|
margin: 5vh;
|
||||||
|
color: #1c1c1c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text3 {
|
||||||
|
font-family: 'Roboto', sans-serif;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 130%;
|
||||||
|
text-align: left;
|
||||||
|
margin: 5vh;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
color: #1c1c1c;
|
||||||
|
}
|
||||||
64
uit.html
Executable file
64
uit.html
Executable file
|
|
@ -0,0 +1,64 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<title>UIT - Qui dirige le net ?</title>
|
||||||
|
<link rel="stylesheet" type="text/css" href="style.css">
|
||||||
|
<link rel="icon" type="image/png" href="img/logpetitx500.png"/>
|
||||||
|
<link rel="stylesheet" href="//cdn.materialdesignicons.com/4.7.95/css/materialdesignicons.min.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="backgroundbg">
|
||||||
|
<img class="icon" src="img/logoaltern.png" alt="logo">
|
||||||
|
<div class="divtitle">
|
||||||
|
<title class="quidir">Qui Dirige Internet ?</title>
|
||||||
|
</div>
|
||||||
|
<nav>
|
||||||
|
<ul class="nav_links">
|
||||||
|
<li><a href="ietf.html">IETF</a></li>
|
||||||
|
<li><a href="icann.html">ICANN</a></li>
|
||||||
|
<li><a href="isoc.html">ISOC</a></li>
|
||||||
|
<li><a href="w3c.html">W3C</a></li>
|
||||||
|
<li><a href="uit.html">UIT</a></li>
|
||||||
|
<li><button class="basicbutton" onclick="window.location.href = 'index.html';"><span class="mdi mdi-home"></span> Accueil</button></li>
|
||||||
|
<li><button class="basicbutton" onclick="window.location.href = 'resume.html';"><span class="mdi mdi-check"></span> Résumé</button></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<div class="parallax-wrapper parallax-background6">
|
||||||
|
<div>
|
||||||
|
<h3 class="intro">UIT</h3>
|
||||||
|
<h3 class="subintro">Union internationale des télécommunications</h3>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="divpers">
|
||||||
|
<div class="divcontent">
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<a href="https://www.instagram.com/alzyohan/"><img class="img0" src="img/profilpic_yohan.png" alt="profilpic"></a>
|
||||||
|
</div>
|
||||||
|
<p class="textpers">Écrit par Yohan Boujon, 16 Décembre 2019 ∙</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="div5">
|
||||||
|
<div class="text1">
|
||||||
|
<p class="textfont1"><a href="https://www.itu.int/fr/Pages/default.aspx" class="colorlink">L’Union internationale des télécommunications</a> est la plus vieille société pionnière de l’internet, fondée le 17 Mai 1865, en 150 ans d’existence cette société avait pour but de déterminer les normes internationales pour tout ce qui est communication, c’est dans les années 1970 que cette société a commencé à déterminer les normes pour internet, et plus précisément son réseau filaire.<br>
|
||||||
|
<br>Car, en effet, à la base l’UIT voulait faire comme l’IETF et l’W3C, mais se rendant compte que son système de normes propriétaires étaient compliqués (car la société est vieille, beaucoup de technologies voulaient être la norme), l’UIT se concentre plus sur les réseaux de câble, comme les câbles téléphoniques, utilisés par internet pour l’ADSL, que ce soit la 4G, la 3G ou encore la 5G, et la fibre.</p>
|
||||||
|
</div>
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<a><img class="img1" src="img/image9.png" alt="picture1" align="right"></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="divfinal">
|
||||||
|
<div class="divbuttonleft">
|
||||||
|
<button class="basicbutton" onclick="window.location.href = 'w3c.html';"><span class="mdi mdi-chevron-left"></span> W3C</button>
|
||||||
|
</div>
|
||||||
|
<div class="divbuttonright" style="float:right">
|
||||||
|
<button class="basicbutton" onclick="window.location.href = 'resume.html';">Résumé <span class="mdi mdi-chevron-right"></span></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
117
w3c.html
Executable file
117
w3c.html
Executable file
|
|
@ -0,0 +1,117 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<title>W3C - Qui dirige le net ?</title>
|
||||||
|
<link rel="stylesheet" type="text/css" href="style.css">
|
||||||
|
<link rel="icon" type="image/png" href="img/logpetitx500.png"/>
|
||||||
|
<link rel="stylesheet" href="//cdn.materialdesignicons.com/4.7.95/css/materialdesignicons.min.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="backgroundbg">
|
||||||
|
<img class="icon" src="img/logoaltern.png" alt="logo">
|
||||||
|
<div class="divtitle">
|
||||||
|
<title class="quidir">Qui Dirige Internet ?</title>
|
||||||
|
</div>
|
||||||
|
<nav>
|
||||||
|
<ul class="nav_links">
|
||||||
|
<li><a href="ietf.html">IETF</a></li>
|
||||||
|
<li><a href="icann.html">ICANN</a></li>
|
||||||
|
<li><a href="isoc.html">ISOC</a></li>
|
||||||
|
<li><a href="w3c.html">W3C</a></li>
|
||||||
|
<li><a href="uit.html">UIT</a></li>
|
||||||
|
<li><button class="basicbutton" onclick="window.location.href = 'index.html';"><span class="mdi mdi-home"></span> Accueil</button></li>
|
||||||
|
<li><button class="basicbutton" onclick="window.location.href = 'resume.html';"><span class="mdi mdi-check"></span> Résumé</button></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<div class="parallax-wrapper parallax-background5">
|
||||||
|
<div>
|
||||||
|
<h3 class="intro">W3C</h3>
|
||||||
|
<h3 class="subintro">World Wide Web Consortium</h3>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="divpers">
|
||||||
|
<div class="divcontent">
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<a href="https://www.instagram.com/alzyohan/"><img class="img0" src="img/profilpic_yohan.png" alt="profilpic"></a>
|
||||||
|
</div>
|
||||||
|
<p class="textpers">Écrit par Yohan Boujon, 16 Décembre 2019 ∙</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="div5">
|
||||||
|
<div class="text1">
|
||||||
|
<p class="textfont1"><a href="https://www.w3.org/" class="colorlink">Le Word Wide Web Consortium</a>, comme son nom l’indique est un consortium, créée le 1er Octobre 1994 elle vise à normaliser le langage utilisé pour les fichiers provenant d’internet, le html, le css, le png ou svg par exemple. « Un Seul web partout et pour tous », quittant le CERN la même année de sa fondation, elle est soutenue par de nombreuses autres sociétés, en octobre 2007 elle compte plus de 16 bureaux dans 16 pays différents. En 2009, Tim Bernes-Lee crée une branche indépendante nommée W3F ou « World Wide Web Fondation » dans le but d’apporter internet aux pays en voie de développement.</p>
|
||||||
|
</div>
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<a><img class="img6" src="img/image7.jpg" alt="picture1" align="right"></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="div6">
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<a><img class="img1" src="img/image8.jpg" alt="picture1" align="right"></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="text2">
|
||||||
|
<p class="textfont2">La création du Hypertext Markup Language ou HTML en 1992 avec un code simple de compréhension et peu lourd a permis un développement rapide des sites internet, et cela grâce au fondateur de W3C, Tim Berners-Lee, inventeur du World Wide Web comme on le connait. A ces débuts un problème persistait avec le html : le manque d’animations, ou de possibilités de rendre un site web plus esthétique. C’est en 1996 que le CSS arriva avec le JavaScript qui permis de crée des programmes dans les sites web, avec l’avancée de nombreuses autres fonctionnalités du web, comme le rdf, le sparql ou encore le soap.<br>
|
||||||
|
<br>A noter que le CSS3 est encore en développement et que le nom HTML est maintenant un standard, sans numéro de version, comme Windows 10 aujourd’hui, HTML 5 restera la dernière version de HTML 5. Le CSS 4, lui, est en brouillon et n’est pas encore prévu de sortir.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="div5">
|
||||||
|
<div class="outcentered">
|
||||||
|
<div class="incentered">
|
||||||
|
<table id="material" cellspacing="0" cellpadding="0">
|
||||||
|
<tr>
|
||||||
|
<th></th>
|
||||||
|
<th>1992</th>
|
||||||
|
<th>1994</th>
|
||||||
|
<th>1996</th>
|
||||||
|
<th>1998</th>
|
||||||
|
<th>2000</th>
|
||||||
|
<th>2009</th>
|
||||||
|
<th>2012</th>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Evolurion de l'HTML</td>
|
||||||
|
<td>HTML <strong>1</strong></td>
|
||||||
|
<td>HTML <strong>2</strong></td>
|
||||||
|
<td>HTML <strong>4</strong></td>
|
||||||
|
<td></td>
|
||||||
|
<td>XHTML <strong>1</strong></td>
|
||||||
|
<td>HTML <strong>5</strong></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Evolution du CSS</td>
|
||||||
|
<td></td>
|
||||||
|
<td></td>
|
||||||
|
<td>CSS <strong>1</strong></td>
|
||||||
|
<td>CSS <strong>2</strong></td>
|
||||||
|
<td></td>
|
||||||
|
<td></td>
|
||||||
|
<td>Début du CSS <strong>3</strong></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>Création du Javascript<td>
|
||||||
|
<td></td>
|
||||||
|
<td></td>
|
||||||
|
<td>JavaScript</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="divfinal">
|
||||||
|
<div class="divbuttonleft">
|
||||||
|
<button class="basicbutton" onclick="window.location.href = 'isoc.html';"><span class="mdi mdi-chevron-left"></span> ISOC</button>
|
||||||
|
</div>
|
||||||
|
<div class="divbuttonright" style="float:right">
|
||||||
|
<button class="basicbutton" onclick="window.location.href = 'uit.html';">UIT <span class="mdi mdi-chevron-right"></span></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
Loading…
Add table
Reference in a new issue