PROJET  

Année Universitaire : 2014/2015

HTML 5

HyperText Mark-Up Language

15

SommaireI. Introduction....................................................................................................................................2

1. Une Brève histoire du web.........................................................................................................2

2. Le consortium W3C et le groupe WhatWG.................................................................................3

3. Le principe du Web.....................................................................................................................4

II. Qu’est ce que HTML 5 ?..................................................................................................................5

1. Définition....................................................................................................................................5

2. Standard HTML...........................................................................................................................5

3. Versions du langage HTML.........................................................................................................5

III. Les grandes nouveautés de l’HTML 5.........................................................................................6

1. La déclaration de DOCTYPE .....................................................................................................6

2. Les navigateurs et le support de l’HTML 5..................................................................................6

3. Éléments supprimés en HTML5..................................................................................................8

4. Les nouveaux éléments HTML5..................................................................................................8

5. Etudes de quelques exemples..................................................................................................10

IV. Conclusion................................................................................................................................15

TableauxTableau 1: Éléments HTML4 supprimés en HTML5[6]............................................................................8Tableau 2 : Nouveaux éléments sémantiques[6]....................................................................................8Tableau 3: Nouveaux éléments de formulaire[6]...................................................................................9Tableau 4: Nouveaux Types d'entrées[6]...............................................................................................9Tableau 5: HTML5 - Nouvel Syntaxe d’attribut[6]................................................................................10Tableau 6: Nouveaux éléments graphiques[6].....................................................................................10Tableau 7: Nouveaux éléments multimédias [6]..................................................................................10Tableau 8: La première version de navigateur qui supporte <canvas>[6]............................................11Tableau 9: La première version de navigateur qui supporte <svg>[6]..................................................12Tableau 10: La première version de navigateur qui supporte <video>[6]............................................13Tableau 11: HTML Vidéo - Support du navigateur[6]...........................................................................13Tableau 12: La première version de navigateur qui supporte <audio>[6]............................................13Tableau 13:HTML Audio-Support du navigateur[6]..............................................................................14Tableau 14: La première version de navigateur qui supporte la Geolocation[6]..................................14

FiguresFigure 1: Le premier site web[1].............................................................................................................2Figure 2 : Forme d'une page HTML[6]....................................................................................................9Figure 3: Graphique réaliser par canvas...............................................................................................11Figure 4: Dessin réaliser par SVG[6].....................................................................................................12

15

I. Introduction

1. Une Brève histoire du web 

Tim Berners-Lee, un physicien britannique, a inventé le web au CERN" centre européen de recherche nucléaire " en 1989. À l’origine, le projet, baptisé « World Wide Web », a été conçu et développé pour que des scientifiques travaillant dans les universités et les instituts du monde entier puissent s'échanger des informations instantanément.

Le premier site web créé au CERN – et dans le monde – était destiné au projet World Wide Web lui-même. Il était hébergé sur l’ordinateur NeXT de Tim Berners-Lee. Le site décrivait les principales caractéristiques du web et expliquait comment accéder aux documents d’autres personnes et comment configurer son propre serveur. L’ordinateur NeXT – le serveur web d’origine – est encore au CERN. En 2013, le CERN a entrepris de remettre en service le premier site web "http://info.cern.ch/hypertext/WWW/TheProject.html", et a même rétabli le site web à son adresse d’origine.

Le 30 avril 1993, le CERN a mis le logiciel du World Wide Web dans le domaine public. Puis il a émis la version suivante de l’application sous licence libre afin d’accélérer sa diffusion. En donnant libre accès au logiciel nécessaire pour faire fonctionner un serveur web, ainsi qu’au navigateur et à la bibliothèque de codes associés, il a permis à la Toile de se tisser.[1]

Figure 1: Le premier site web[1]

15

2. Le consortium W3C et le groupe WhatWG

W3CLe W3C, World Wide Web Consortium, est un organisme international qui développe des standards pour le Web afin que les gens puissent communiquer efficacement à travers Internet.

Le consortium existe depuis 1994 et est dirigé par l'inventeur du Web, Tim Berners-Lee.Il est composé d'une équipe fixe (environ 70 personnes) et des membres (plus de 450 organisations).Les membres délèguent des ingénieurs au sein de W3C et participent ainsi à l'élaboration des spécifications techniques pour les technologies du Web.

Les spécifications déjà élaborées, il y en a une cinquantaine (HTML, XML, CSS, SVG...), sont accessibles au public sur le site de W3C. Il en est de même pour les compte-rendus des développements en cours.[2]

Le WHATWG

Le WHATWG, pour « Web Hypertext Application Technology Working Group » est un groupe communautaire en ligne, créé en 2004 par des membres d'Apple, Mozilla et Opera après un workshop du W3C, lors duquel ils ont relevé leur inquiétude face au désintérêt du W3C pour HTML par rapport à XHTML. Le but du WHATWG est de définir et faire évoluer les spécifications HTML, et certaines APIs intrinsèques (Web Storage, Web Workers, Web Sockets, ...). Administrativement, le WHATWG n'a pas d'existence, c'est simplement une communauté sur le web. Le WHATWG est dirigé par un petit comité, le nombre de membres est illimité et la participation est gratuite.[3]

le W3C et le WHATWG se séparent à cause de divergences insolubles

Le WHATWG est une entité séparée du W3C. Elle a été créée en réaction aux lenteurs du Consortium dont le processus de standardisation est parfois jugé comme manquant de nervosité. Le W3C réunit un grand nombre d’acteurs et doit accorder l’ensemble des participants.

Le HTML5, tel qu’il est travaillé par le W3C, est à la base un regroupement de propositions du WHATWG. Cependant, la gestion du W3C a progressivement provoqué des tensions, le Consortium ayant choisi de séparer le « pack » HTML5 en sous-spécifications, notamment pour l’API canvas 2D, les évènements côté serveurs et ainsi de suite. De son côté, le WHATWG est revenu à une spécification unique qu’elle nomme « HTML Living Standard » : un ensemble insécable de technologies liées.

Le WHATWG a du coup décidé de faire cavalier seul. Dans un mail explicatif, Ian Hickson, membre du WHATWG, explique que les objectifs des deux entités s’écartaient trop l’un de l’autre. Le fonctionnement du W3C repose sur un modèle de versions préliminaires. De son côté, le WHATWG travaille sur la définition même du HTML et des technologies attenantes, et corrige les bugs au fur et à mesure qu’ils sont détectés.

15

Il existe en fait surtout une conception très différente de comment une standardisation doit être menée. Le WHATWG se concentre essentiellement sur la technique tandis que le W3C considère d’autres aspects. En octobre 2010, Daniel Glazman, travaillant sur le CSS au W3C, expliquait à ZDnet : « Le W3C suit un processus assez (trop ?) rigoureux, mais l'expérience des 16 ans d'existence du W3C a montré pourquoi c'est nécessaire ; de son côté, le WHATWG fonce en ne se préoccupant quasiment de rien si ce n'est de la technique ».[4]

La bonne marche du HTML5 pourrait être perturbée

Devant un tel « fork », doit-on craindre que le HTML5 évolue réellement dans des directions différentes ? Rien n’est sûr.

Le WHATWG, dont fait également partie Google, va clairement avancer plus vite que le W3C. Les éditeurs de navigateur vont se référer au travail fait par le groupe, mais il ne s’agit pas pour autant de se détourner du W3C. Les deux travaux auront un certain degré de complémentarité. Il est simplement dommage que le manque d’accord sur les questions d’organisation mène à la création de deux versions différentes d’un même standard.

La séparation est d’autant plus regrettable que le HTML5 avait déjà ses propres difficultés. En effet, il ne faut pas oublier que la norme n’en est pas encore officiellement une : il s’agit d’un brouillon. Bien que l’on en soit à plusieurs versions, tous les aspects n’ont pas encore été finalisés. Le support réalisé par les navigateurs est donc forcément temporaire, les points finalisés étant mis à jour progressivement.

En outre, le HTML5 a fort à faire dans le domaine mobile. Le moteur de rendu Webkit y règne pratiquement en maître. Présent dans iOS et Android (Safari, Chrome, etc.), il concentre l’attention des développeurs qui deviennent parfois plus sensibles à ses évolutions qu’à celles des organismes de standardisation. La mission du HTML5 est donc bien loin d’être terminée et la séparation du W3C et du WHATWG pourrait, au moins pendant un temps, créer des perturbations supplémentaires.[4]

3. Le principe du Web

Le web est composé de pages web stockées sur des serveurs web, c'est-à-dire des machines connectées à Internet en permanence et chargées de fournir les pages web demandées. Chacune des pages web, et plus généralement toute ressource en ligne (image, vidéo, musique, animation, etc.), est repérée par une adresse unique appelée URL. L'élément clé pour la navigation au sein des pages web est le navigateur (en anglais browser, parfois également appelé fureteur, fouineur, feuilleteur ou butineur au Québec), c'est-à-dire le logiciel client capable d'interroger les serveurs web, d'exploiter leurs résultats et de mettre en page les informations grâce aux instructions contenues dans la page HTML. Parmi les principaux navigateurs utilisés sur Internet, citons notamment les suivants :Mozilla Firefox, Microsoft Internet Explorer, Chrome, Safari.[5]

15

II. Qu’est ce que HTML 5 ? 

1. Définition

Le HTML (« HyperText Mark-Up Language ») est un langage dit de « marquage » (de « structuration » ou de « balisage ») dont le rôle est de formaliser l'écriture d'un document avec des balises de formatage. Les balises permettent d'indiquer la façon dont doit être présenté le document et les liens qu'il établit avec d'autres documents. Le langage HTML permet notamment la lecture de documents sur Internet à partir de machines différentes, grâce au protocole HTTP, permettant d'accéder via le réseau à des documents repérés par une adresse unique, appelée URL. On appelle World Wide Web (noté WWW) ou tout simplement Web (mot anglais signifiant toile) la "toile virtuelle" formée par les différents documents (appelés « pages web ») liés entre-eux par des hyperliens. Les pages web sont généralement organisées autour d'une page d'accueil, jouant un point central dans la navigation à l'aide des liens hypertextes. Cet ensemble cohérent de pages web liées par des liens hypertextes et articulées autour d'une page d'accueil commune est appelée site web. Le Web est ainsi une énorme archive vivante composée d'une myriade de sites web proposant des pages web pouvant contenir du texte mis en forme, des images, des sons, des vidéo, etc.[5]

2. Standard HTML

Il est important de comprendre que le langage HTML est un standard, c'est-à-dire qu'il s'agit de recommandations publiées par un consortium international : le World Wide Web Consortium (W3C). Les spécifications officielles du HTML décrivent donc les "instructions" HTML mais en aucun cas leur implémentation, c'est-à-dire leur traduction en programmes d'ordinateur, afin de permettre la consultation de pages web indépendamment du système d'exploitation ou de l'architecture de l'ordinateur. Toutefois, aussi étoffées les spécifications soient-elles, il existe toujours une marge d'interprétation de la part des navigateurs, ce qui explique qu'une même page web puisse s'afficher différemment d'un navigateur Internet à l'autre. De plus, il arrive parfois que certains éditeurs de logiciels ajoutent des instructions HTML propriétaires, c'est-à-dire ne faisant pas partie des spécifications du W3C. Ainsi des pages web contenant ce type d'instruction pourront être parfaitement affichées sur un navigateur et seront totalement ou en partie illisibles sur les autres, d'où la nécessité de créer des pages web respectant les recommandations du W3C afin de permettre leur consultation par le plus grand nombre.[5]

3. Versions du langage HTML

Le langage HTML a été mis au point par Tim Berners-Lee, alors chercheur au CERN, à partir de 1989. Celui-ci annonça officiellement la création du web sur Usenet en août 1991. Ce n'est cependant qu'à partir de 1993 que l'on considère l'état du HTML suffisamment avancé

15

pour parler de langage (HTML est alors baptisée symboliquement HTML 1.0). Le navigateur internet utilisé à l'époque était nommé NCSA Mosaïc. Le RFC 1866, daté de novembre 1995 représente la première version officielle de HTML, c'est-à-dire le HTML 2.0. HTML 3Après la brêve apparition d'un HTML 3.0, qui ne vit jamais officiellement le jour, le HTML 3.2 devint le standard officiel le 14 janvier 1997. Les apports les plus marquants du HTML 3.2 étaient la standardisation des tableaux ainsi que d'un grand nombre d'éléments de présentation. HTML 4Le 18 décembre 1997, le HTML 4.0 a été publié. La version 4.0 du langage HTML standardise notamment les feuilles de style et les cadres (frames). La version HTML 4.01, apparue le 24 décembre 1999 apporte quelques modifications mineures au HTML 4.0. HTML 5Le HTML 5.0 est en cours de spécification en 2012. La version 5.0 du langage HTML définit deux syntaxes de DOM : HTML5 et XHTML5. Cette version apporte de nouvelles possibilités en terme de création d' « applications Web riches » bénéficiant de l'intégration d'éléments multimédias et d'interactivité, à l'image de ce que permettent Adobe Flash ou Microsoft Silverlight.[5]

III. Les grandes nouveautés de l’HTML 5

1. La déclaration de DOCTYPE

La déclaration DOCTYPE pour HTML5 est très simple:o <!DOCTYPE html> au lieu de <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01

Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> en HTML 4.o La déclaration de codage de caractères (charset) est également très simple:

<meta charset="UTF-8"> au lieu de <meta http-equiv="Content Type" content="text /html;charset=ISO-8859-1"> en HTML 4, le codage de caractères par défaut en HTML5 est UTF-8.

Exemple HTML5<!DOCTYPE html><html><head><meta charset="UTF-8"><title> Titre du document </title></head><body>contenu du document...... </body></html>

2. Les navigateurs et le support de l’HTML 5 

HTML5 est prise en charge dans tous les navigateurs modernes. En outre, tous les navigateurs, anciens et nouveaux, gèrent automatiquement les éléments non reconnus

15

comme les éléments en ligne. Pour cette raison, on peut «enseigner» les vieux navigateurs pour gérer les éléments HTML "inconnus".HTML5 définit 8 nouveaux éléments HTML sémantiques. Tous ces éléments sont de niveau bloc. Pour assurer un comportement correct dans les anciens navigateurs, on peut définir la propriété CSS display pour block:Exemple

header, section, footer, aside, nav, main, article, figure { display: block; }

On peut aussi ajouter un nouvel élément au format HTML avec un tour du navigateur. Cet exemple ajoute un nouvel élément appelé <myHero> en HTML, et définit un style d'affichage pour elle:<!DOCTYPE html><html><head> <title>Creating an HTML Element</title> <script>document.createElement("myHero")</script> <style> myHero { display: block; background-color: #ddd; padding: 50px; font-size: 30px; } </style> </head><body><h1>My First Heading</h1><p>My first paragraph.</p><myHero>My First Hero</myHero></body></html>

La déclaration JavaScript document.createElement ("myHero") est ajouté, que pour satisfaire IE. On peut utiliser la solution décrite ci-dessus, pour tous les nouveaux éléments HTML5, mais Internet Explorer 8 et plus tôt, ne permettent pas de styliser d'éléments inconnus. Heureusement, Sjoerd Visscher a créé le "JavaScript HTML5 habilitation", "le Shiv":<!--[if lt IE 9]> <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.2/html5shiv.js"></script><![endif]-->Le code ci-dessus est un commentaire, mais les versions précédentes d'IE9 va le lire (et comprendre). Le lien vers le code shiv  doit être placé dans l'élément <head>, car Internet Explorer a besoin de connaître tous les nouveaux éléments avant de les lire. Cependant, un

15

site tel que http://caniuse.com ou encore http://fmbip.com mise à jour régulièrement permet d’avoir des informations assez précises sur la prise en charge du HTML 5 de votre site ou de votre navigateur.3. Éléments supprimés en HTML5

Les éléments suivants HTML4 ont été retirés de HTML5:Element Use instead<acronym> <abbr><applet> <object><basefont> CSS<big> CSS<center> CSS<dir> <ul><font> CSS<frame><frameset><noframes><strike> CSS<tt> CSS

Tableau 1: Éléments HTML4 supprimés en HTML5[6]

4. Les nouveaux éléments HTML5Les nouveaux éléments les plus intéressants sont:Nouveaux éléments sémantiques / structurelHTML5 offre de nouveaux éléments pour une meilleure structure du document:

Tag Description<article> Defines an article in the document<aside> Defines content aside the page content<bdi> Defines a part of text that might be formatted in a different direction from other text<details> Defines additional details that the user can view or hide<dialog> Defines a dialog box or window<figcaption> Defines a caption for a <figure> element<footer> Defines a footer for the document or a section<header> Defines a header for the document or a section<main> Defines the main content of the document<mark> Defines marked or highlighted text<meter> Defines a scalar measurement within a known range (a gauge) <nav> Defines navigation links in the document<progress> Defines the progress of a task<rt> Defines an explanation/pronunciation of characters (for East Asian Typography)<ruby> Defines a ruby annotation (for East Asian typography)<section> Defines a section in the document<summary> Defines a visible heading for a <details> element<time> Defines a date/time<wdr> Defines a possible line-break

Tableau 2 : Nouveaux éléments sémantiques[6]

15

Figure 2 : Forme d'une page HTML[6]

Nouveaux éléments de formulaire

Tag Description<datalist> Defines pre-defined options for input controls<keygen> Defines a key-pair generator field (for forms)<output> Defines the result of a calculation

Tableau 3: Nouveaux éléments de formulaire[6]

Nouveaux Types d'entrées

New Input Types New Input Attributes color date datetime datetime-local email month number range search tel time url week

autocomplete autofocus form formaction formenctype formmethod formnovalidate formtarget height and width list min and max multiple pattern (regexp) place holder required step

Tableau 4: Nouveaux Types d'entrées[6]

HTML5 - Nouvel Syntaxe d’attribut

HTML5 permet quatre syntaxes différentes pour les attributs. Cet exemple démontre les différentes syntaxes utilisées dans une balise <input>:

Type Example

15

Empty <input type="text" value="John" disabled>Unquoted <input type="text" value=John>Double-quoted <input type="text" value="John Doe">Single-quoted <input type="text" value='John Doe'>

Tableau 5: HTML5 - Nouvel Syntaxe d’attribut[6]

Nouveaux éléments graphiques

Tag Description<canvas> Defines graphic drawing using JavaScript<svg> Defines graphic drawing using SVG

Tableau 6: Nouveaux éléments graphiques[6]

Nouveaux éléments multimédias

Tag Description<audio> Defines sound or music content<embed> Defines containers for external applications (like plug-ins)<source> Defines sources for <video> and <audio><track> Defines tracks for <video> and <audio><video> Defines video or movie content

Tableau 7: Nouveaux éléments multimédias [6]

La Nouvelle API HTML5 (Application Programming Interface) 

Les plus intéressantes nouvelles API sont:

HTML GeolocationHTML Drag and DropHTML Local StorageHTML Application CacheHTML Web WorkersHTML SSE

5. Etudes de quelques exemples

HTML5 Canvas

Le code HTML de l’élément <canvas> est utilisé pour dessiner des graphiques sur une page web.Le graphique au dessous est créé avec <canvas>. Elle montre quatre éléments: un rectangle rouge, un rectangle de gradient, un rectangle multicolore, et un texte multicolore. [6]

15

Figure 3: Graphique réaliser par canvas

Qu'est-ce que HTML Canvas?Le code HTML de l’élément <canvas> est utilisé pour dessiner des graphiques, à la volée, par l'intermédiaire de scripts (habituellement JavaScript). L'élément <canvas> est seulement un conteneur pour les graphiques. On doit utiliser un script pour tirer effectivement les graphiques. Toile dispose de plusieurs méthodes pour dessiner des chemins, des boîtes, des cercles, du texte, et l'ajout d'images.Support du navigateurLes chiffres du tableau indiquent la première version de navigateur qui soutient pleinement l'élément <canvas>.

Tableau 8: La première version de navigateur qui supporte <canvas>[6]

Exemple<!DOCTYPE html><html><body><canvas id="myCanvas" width="200" height="100" style="border:1px solid #d3d3d3;">Your browser does not support the HTML5 canvas tag.</canvas><script>var c = document.getElementById("myCanvas");var ctx = c.getContext("2d");// Create gradientvar grd = ctx.createRadialGradient(75,50,5,90,60,100);grd.addColorStop(0,"red");grd.addColorStop(1,"white");// Fill with gradientctx.fillStyle = grd;ctx.fillRect(10,10,150,80);</script></body></html>

15

HTML5 SVG

SVG signifie Scalable Vector Graphics, est une recommandation du W3C utilisé pour définir le graphique pour le Web SVG. L'élément HTML <svg> (introduit en HTML5) est un conteneur pour les graphiques SVG. SVG dispose de plusieurs méthodes pour les chemins de dessin, des boîtes, des cercles, du texte et des images graphiques.Support du navigateurLes chiffres du tableau indiquent la première version de navigateur qui soutient pleinement l'élément <svg>.

Tableau 9: La première version de navigateur qui supporte <svg>[6]

Exemple<!DOCTYPE html><html><body><svg width="300" height="200"> <polygon points="100,10 40,198 190,78 10,78 160,198" style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;" />Sorry, your browser does not support inline SVG.</svg></body></html>

Figure 4: Dessin réaliser par SVG[6]

Différences entre SVG et CanvasSVG est un langage de description de graphiques 2D en XML. Canvas dessine des graphiques 2D, à la volée (avec JavaScript). SVG est basé sur XML, ce qui signifie que chaque élément est disponible dans le DOM de SVG. Vous pouvez joindre des gestionnaires d'événements JavaScript pour un élément.En SVG, chaque forme dessinée est connu comme un objet. Si les attributs d'un objet de SVG sont modifiés, le navigateur peut automatiquement interpréter de nouveau la forme.

15

Canvas est rendue pixel par pixel. Avec canvas, une fois que le graphique est tiré, il est oublié par le navigateur. Si sa position doit être changée, toute la scène doit être redessinée, y compris les objets qui auraient pu être couverts par le graphique.

HTML5 Video

Avant l'HTML5, il n'y avait pas de norme pour montrer des vidéos sur une page Web, les vidéos ne peuvent être lus avec un plug-in (comme le flash). Le HTML5 <video> spécifie un moyen standard pour intégrer une vidéo dans une page Web.Support du navigateurLes chiffres du tableau indiquent la première version de navigateur qui soutient pleinement l'élément <video>.

Tableau 10: La première version de navigateur qui supporte <video>[6]

HTML Vidéo - Support du navigateurIl ya actuellement 3 formats vidéo pris en charge pour l’ élément <video>: MP4, WebM et Ogg:

Browser MP4 WebM OggInternet Explorer YES NO NOChrome YES YES YESFirefox YES YES YESSafari YES NO NOOpera YES(from Opera 25) YES YES

Tableau 11: HTML Vidéo - Support du navigateur[6]

HTML5 audio

Avant l'HTML5, il n'y avait pas de norme pour la lecture de fichiers audio sur une page web, les fichiers audio ne peuvent être lus qu’avec un plug-in (comme le flash). Le HTML5 <audio> spécifie un moyen standard pour intégrer du son dans une page Web.Support du navigateurLes chiffres du tableau indiquent la première version de navigateur qui soutient pleinement l'élément <audio>.

Tableau 12: La première version de navigateur qui supporte <audio>[6]

15

HTML Audio-Support du navigateurActuellement, il existe 3 formats de fichiers pris en charge pour l'élément <audio>: MP3, WAV, et Ogg:

Browser MP4 Wav OggInternet Explorer YES NO NOChrome YES YES YESFirefox YES YES YESSafari YES YES NOOpera YES YES YES

Tableau 13:HTML Audio-Support du navigateur[6]HTML5 Géolocalisation

La Géolocalisation en HTML est utilisé pour localiser la position d'un utilisateur. Et pour repérer la position de l'utilisateur l'API HTML Géolocalisation est utilisée pour obtenir la position géographique d'un utilisateur. Puisque cela peut compromettre la vie privée de l'utilisateur, la position n’est pas disponible, sauf si l'utilisateur l'approuve.Support du navigateurLes chiffres du tableau indiquent la première version de navigateur qui soutient pleinement Géolocalisation.

Tableau 14: La première version de navigateur qui supporte la Geolocation[6]

Utilisation de la Géo localisation en HTMLUtilisez la méthode getCurrentPosition () pour obtenir la position de l'utilisateur. L'exemple ci-dessous est un exemple simple de Géo localisation retourner la latitude et la longitude de la position de l'utilisateur:<!DOCTYPE html><html><body><p>Click the button to get your coordinates.</p><button onclick="getLocation()">Try It</button><p id="demo"></p><script>var x = document.getElementById("demo");function getLocation() { if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition); } else { x.innerHTML = "Geolocation is not supported by this browser."; }}

15

function showPosition(position) { x.innerHTML = "Latitude: " + position.coords.latitude + "<br>Longitude: " + position.coords.longitude; }</script></body></html>Explication de l'exemple:

Vérifiez si Géolocalisation est soutenu, si elle est supportée, exécuter la méthode getCurrentPosition (), si non, afficher un message à l'utilisateur. Si la méthode getCurrentPosition () est réussie, elle retourne un objet coordonnées à la fonction spécifiée dans le paramètre (showPosition). La fonction showPosition () obtient les écrans de le Latitude et Longitude.

IV. Conclusion

Les nouvelles sections et éléments introduits en HTML5 apportent la capacité de décrire la structure et le plan d'un document web d'une manière standard. Ils apportent un grand avantage pour les utilisateurs de navigateurs HTML5 et qui ont besoin de la structure pour les aider à comprendre la page. Ces nouveaux éléments sont simples à utiliser et, avec très peu d'efforts, ils peuvent également être mis en œuvre dans les navigateurs ne prenant pas en charge HTML5.Et pour réaliser un site web il est essentiel de savoir utiliser le HTML et CSS pour le style et JavaScript, et pour un site dynamique il faut utiliser le PHP et MySQL.

V. Référence

[1]: http://home.web.cern.ch/fr/topics/la-naissance-du-web "Le CERN, l’Organisation européenne pour la recherche nucléaire"

[2]: http://communication-expert-comptable.over-blog.com/pages/Quest_ce_que_le_ W3C_A_quoi_sert_il_pour_la_creation_de_site_internet-1950567.html " Christophe Jablonski"

[3]: http://www.hteumeuleu.fr/le-w3c-le-whatwg-et-html5/

[4]: http://www.nextinpact.com/archive/72625-html5-w3c-et-whatwg-se-separent-a-cause-divergences-insolubles.htm "Ian Hickson"

[5]: http://www.commentcamarche.net/contents/498-html-langage "Réalisé sous la direction de Jean-François Pillou, fondateur de commentcamarche.net"

[6]: http://www.w3schools.com/htmL/

[7]: http://fr.slideshare.net/Kenium/prsentation-html5-11912586