Chapitre Initiation HTML 5 [PDF]
Faculté des Sciences Juridiques Université Jendouba Économiques et de Gestion Développement Web: Initiation HTML 5 Man
32 0 5MB
Papiere empfehlen
![Chapitre Initiation HTML 5 [PDF]](https://vdoc.tips/img/200x200/chapitre-initiation-html-5.jpg)
- Author / Uploaded
- ManelBenSassi
Datei wird geladen, bitte warten...
Zitiervorschau
Faculté des Sciences Juridiques Université Jendouba Je suis content < /p>< /em> Je suis content < /p>< /em> Il faut respecter la syntaxe Mlle < /p>
Économiques et de Gestion
Développement Web: Initiation HTML 5 Manel Ben Sassi Université de Jendouba, FSJSEG [email protected]
1 / 86
Sommaire
1
Les langages du web
2
Initiation HTML 5 Introduction HTML 5, Quoi de neufs ? Les volets principaux Traitement du texte Les objets multimédia Des formulaires améliorés Les graphiques sous HTML5
3
Bibliographie
2 / 86
Les langages du web
Les langages du web
3 / 86
Les langages du web
Les Langages du web
Pour créer un site web, on utilise au moins deux langages : le HTML et le CSS. Il en existe d’autres mais ces deux suffisent. Il est important de bien les distinguer et de comprendre leur utilité respective. I
HTML
I
CSS
I
Autres Langages
I
Outils du web
4 / 86
Les langages du web
Le HTML
HTML signifie HyperText Markup Language. C’est un langage sémantique. Il sert à définir chaque élément de la page, indiquer leur sens, leur importance et leur hiérarchie : titre, paragraphe, menu, lien, image, etc. La sémantique est importante pour permettre aux navigateurs et aux moteurs de recherche de "comprendre" la page.
5 / 86
Les langages du web
Le CSS
CSS signifie Cascade Style Sheet C’est un langage de présentation. Il sert à appliquer un style graphique aux éléments définis par le HTML : police, couleur, taille de caractère, espacement, marges, etc. La présentation permet de rendre le code HTML lisible par un être humain. On pourrait en théorie se passer du CSS.
6 / 86
Les langages du web
Le CSS une page HTML issue de Wikipédia, sans CSS.
7 / 86
Les langages du web
Le CSS la même page HTML, cette fois-ci mise en forme grâce au CSS
8 / 86
Les langages du web
Le CSS la même page HTML, cette fois-ci avec un code CSS adapté aux petits écrans !
9 / 86
Les langages du web
D’autres Langages
I
Javascript permet de créer des animations ou gérer l’interaction entre l’utilisateur et la page.
I
PHP, ASP, .. sont des langages de programmation permettent de générer dynamiquement des pages HTML.
I
MySQL ou PostgreSQL sont des langages qui permettent de dialoguer avec une base de données.
10 / 86
Les langages du web
Les outils du web
Il existe de nombreux outils, certains très onéreux, pour créer un site web. En réalité, de simples éditeurs de texte comme le Bloc-notes de Windows ou TextEdit sur Mac suffisent. Pour s’en convaincre : I
Ouvrir un éditeur de texte.
I
Inscrire un texte quelconque, par exemple "Bonjour".
I
Enregistrer le fichier avec une extension ".html", par exemple "test.html".
I
Ouvrir le fichier dans un navigateur web.
I
Nous avons créé notre première page web !
11 / 86
Initiation HTML 5
Initiation HTML5
12 / 86
Initiation HTML 5
Introduction
HTML5 n’est pas ... Tout d’abord, je suis convaincu que parmi vous certains se disent :
Ou encore ...
Voire ...
13 / 86
Initiation HTML 5
Introduction
HTML 5 est ... HTML 5 n’est pas un nouveau langage ! !
HTML 5 est ... Une évolution de l’HTML 4.01 (et de l’XHTML 1.0), ⇒ Tout ce que vous savez faire en HTML reste valide. L’ajout d’une multitude de nouvelles fonctionnalités au langage HTML ainsi qu’au Javascript. est le fruit des travaux de l’organisation mondiale W3C (World Wide Web Consortium) et du WHATWG (Web Hypertext Application Technology Working Group), le groupe constitué de développeurs des navigateurs tels que Mozilla, Opera ou Apple. 14 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Quoi de neufs ?
Les objectifs principaux : I
Les nouveaux traits se baseront sur html, css , XML et Javascript.
I
Réduire les besoins des éléments externes (flash).
I
Améliorer le traitement des erreurs.
I
Plus de balises pour remplacer les scripts
I
HTML 5 est indépendant du type d’appareil.
I
Le processus de développement doit être observable par le public.
15 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Les nouveautés dans le code HTML 5 Un allégement du code : Certaines balises ont été simplifiées afin d’alléger le code Figure – Auparavant, on pourrait avoir ...
Figure – Maintenant, HTML 5...
16 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Les nouvelles balises sémantiques
1
Stockage local
2
Traitement de texte
3
composants du formulaire
4
Audio vidéo
5
Canevas
17 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
Les Balises.. un petit rappel
le contenu défini Les balises entourent le contenu qu’elles définissent. Elles sont composées d’un mot entouré des symboles < et >. Elles fonctionnent la plupart du temps par deux : balise ouvrante et balise fermante (précédée de /).
18 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
Traitement du texte en HTML 5
19 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Traitement du texte Headings HTML offre 6 niveaux d’en-têtes (headings) : (Le plus grand), , (par défaut), et (le plus petit) Paragraphes et retours à la lignes
20 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Polices à espacement fixe Le contenu d’un élément es écrit avec une police à espacement fixe et préserve de plus à la fois les espaces et les retours à la ligne.
21 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Eléments un peu spéciaux indique que vous introduisez un terme spécial ou nouveau, typiquement rendu en italique. indique une adresse postale, habituellement à la fin d’un document, ou encore une adresse de contact (créateur d’une page web) indique une abréviation ; si possible, à accompagner d’un attribut title contient une citation ou une référence à une autre source ; souvent utilisé pour inclure des titres de livres, films ou chansons. insère une courte citation (à l’intérieur d’une phrase) d’une autre source. preuve
22 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
Exercice
1
Pour avoir une police à espacement fixe, on utilise : a) b) c) d) CSS
23 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
Exercice
1
Pour avoir une police à espacement fixe, on utilise : a) b) c) d) CSS
2
Pour mettre du texte en gras, on utilise : a) b) c) d) CSS
24 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
Exercice
1
Pour avoir une police à espacement fixe, on utilise : a) b) c) d) CSS
2
Pour mettre du texte en gras, on utilise : a) b) c) d) CSS
3
Est-ce que ce qui suit est bien formé ?
25 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
Exercice
1
Pour avoir une police à espacement fixe, on utilise : a) b) c) d) CSS
2
Pour mettre du texte en gras, on utilise : a) b) c) d) CSS
3
Est-ce que ce qui suit est bien formé ?
4
Est-ce que ce qui suit est bien formé ? Programmation Web HTML
26 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
Un autre Exercice
Est-ce que ce qui suit est bien formé ? 1
Toto, rue des géants de la frite, Trouville
27 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
Un autre Exercice
Est-ce que ce qui suit est bien formé ? 1
Toto, rue des géants de la frite, Trouville
2
28 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Traitement de texte Un exemple de rendu ... Partie Edition
29 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Traitement de texte Un exemple de rendu ... Partie Affichage sur un client web
30 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : La balise article Qui représente une portion de la page qui garde un sens même séparée de l’ensemble de la page(comme un article de blog par exemple)
31 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : La balise header Qui indique que l’élément est une en-tête
32 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : La balise mark Est un surligneur de texte. Il marque un passage spécifique, que l’on souhaite mettre en valeur d’une façon particulière, pour attirer l’attention.
33 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : La balise figure C’est une unité de contenu ⇒ sert de conteneur dans lequel s’insèrent divers éléments comme des images, des schémas, des vidéos, des tableaux ou encore des blocs de code.
34 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : La balise figcaption : Un titre pour le conteneur, son enplacement peut-être avant ou après la balise figure
L’objectif est de lier ce contenu à une légende (facultatif) 35 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : La balise footer indique que l’élément est un pied-de-page
36 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
Exercice
1
Quelle est la signification de la balise ?
2
Quelle balise pour mettre du texte dans un conteneur ?
3
Existe-t-il une ou des balise(s) pour désigner pied et entête de l’article ?
37 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
Les objets multimédia en HTML 5
38 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
Exemple Balise : Object
la balise Intégrer un élément ou un fichier externe (vidéo, audio, flash, pdf ...). Le support des éléments dépend du navigateur.
39 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
Balise Object : pdf la balise : un fichier pdf
40 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
Balise Object : Audio la balise : un fichier audio
41 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
Exemple Balise : Flash Un objet flash dans la page HTML
42 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : progresse
43 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : MultiMedia - video Cette balise intègre directement un lecteur vidéo dans la page, avec des boutons Lecture, Pause, une barre de progression, du volume ...
44 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Les balises MultiMedia - audio Cette balise est l’équivalent de la balise video mais pour l’audio. Avec l’attribut facultatif autoplay, le son sera joué automatiquement dès le chargement de la page.
45 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Les URL et les hyperliens Les hyperliens Les hyperliens permettent au visiteur de naviguer entre des sites web distants en cliquant sur des mots, phrases et images. Pour créer un lien vers un autre document, utiliser l’élément . La syntaxe minimale pour son utilisation est :
Il est de bon usage de : Rendre le contenu de vos liens concis et précis Utiliser l’attribut title comme information contextuelle lorsque l’utilisateur passe sur le lien
46 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Les URL et les hyperliens
Les URL URL Uniform Resources Locator La syntaxe générale : protocol ://user :pass@host :port/path ?query]anchor
47 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Les URL et les hyperliens Les anchres⇒ Jeter l’ancre pour faire des liens dans la même page web. Les étapes à suivre : 1 Il faut tout d’abord jeter l’anchre
2
Il faut ensuite créer des liens vers les anchres :
Figure – 3 manières pour définir l’anchre 3
Si on a plusieurs ancres dans une page ... 1
2
On place des ancres invisibles dans le code, aux endroits adhoc : On crée les liens vers ces ancres en ajoutant ] devant leur nom : Cliquez ici 48 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
Les formulaires en HTML5
49 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires L’élément clef pour définir un formulaire
50 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires L’élément clef pour définir un formulaire
51 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Le formulaire est principalement constitué de I Action spécifie où envoyer les données du formulaire ; la valeur est une URL correspondant à une page/programme sur une serveur web. I onsubmit et onreset peuvent être utilisées pour lancer une procédure de contrôle (e.g. avec Javascript) quand l’utilisateur clique sur un bouton de type submit ou reset I method spécifie la méthode à employer pour envoyer les données ; cela peut être "get" ou "post". ⇒ POST ou GET ? ⇒ Est ce qu’on peut avoir des formulaires imbriqués ?
52 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Le formulaire est principalement constitué de I Action spécifie où envoyer les données du formulaire ; la valeur est une URL correspondant à une page/programme sur une serveur web. I onsubmit et onreset peuvent être utilisées pour lancer une procédure de contrôle (e.g. avec Javascript) quand l’utilisateur clique sur un bouton de type submit ou reset I method spécifie la méthode à employer pour envoyer les données ; cela peut être "get" ou "post". ⇒ POST ou GET ? ⇒ Est ce qu’on peut avoir des formulaires imbriqués ? GET Les paramètres sont passés en claire par l’URL. Leurs longueurs sont limités POST Les informations passent en cachette (personal and sensitive 53 / 86 information). La longueur est illimité.
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Les éléments du formulaire : Nous avons une variété de type pour la balise input...
54 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires La balise input de type url et adresse mail ...
55 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires La balise input de type tel ... pour le développement mobile
Figure – Affichage sur un IOS
Figure – Affichage sur un Système Android 56 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Questions ... Combien de types champs de saisie existent en HTML ?
57 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Questions ... Combien de types champs de saisie existent en HTML ? 3 types — ⇒ Lesquels ?
58 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Questions ... Combien de types champs de saisie existent en HTML ? 3 types — ⇒ Lesquels ? 1
Champ de saisie (simple- ligne) avec la balise input et le type text
2
Champ mot-de-passe en utilisant l’élémentinput avec l’attribut type fixé à la valeur password
3
Zone de saisie (multi-ligne) en utilisant l’élément
Combien y a t-il de façon pour insérer un bouton ?
59 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Questions ... Combien de types champs de saisie existent en HTML ? 3 types — ⇒ Lesquels ? 1
Champ de saisie (simple- ligne) avec la balise input et le type text
2
Champ mot-de-passe en utilisant l’élémentinput avec l’attribut type fixé à la valeur password
3
Zone de saisie (multi-ligne) en utilisant l’élément
Combien y a t-il de façon pour insérer un bouton ? Il existe 3 manières ... il faut les chercher ...
60 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Questions ... Combien de types champs de saisie existent en HTML ? 3 types — ⇒ Lesquels ? 1
Champ de saisie (simple- ligne) avec la balise input et le type text
2
Champ mot-de-passe en utilisant l’élémentinput avec l’attribut type fixé à la valeur password
3
Zone de saisie (multi-ligne) en utilisant l’élément
Combien y a t-il de façon pour insérer un bouton ? Il existe 3 manières ... il faut les chercher ...
button, type=submit, type=button 61 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Le champ mot-passe Un tel composant est crée avec l’élément dont l’attribut type vaut "password ". Le champ masque les caractères tapés en les remplaçant par un point ou une astérisque
Question Comment la valeur est transmise au serveur ? Sécurisé ?
62 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires
Les attributs d’évènements permettent d’associer un scripte (programme) à un évènement (e.g., un clic de souris ou l’appui d’une touche). L’élément accepte les évèments suivants : onload, onunload Les évènements associés aux formulaires sont : onfocus, onblur, onsubmit, onreset, onselect, onchange
63 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Exemple ... à détailler
64 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Les composants cachés Pour passer de l’information entre différentes pages sans que l’utilisateur ne le voie, vous pouvez utiliser un composant caché. Un tel composant est créé avec dont l’attribut type est fixé à "hidden"
Les fieldset et Legend Pour de grands formulaires, les éléments et peuvent aider à grouper les composants : crée une bordure ajoute une légende 65 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Pouvez-vous interpréter ce formulaire ? ... Dessinez-le
66 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires
Les attributs important de la balise input : Certains composants de formulaire peuvent porter les attributs disabled, readonly, required Placeholder : attribut permet de placer une indication au niveau de certains éléments , disparaissant dès que l’utilisateur entre une information.
67 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires D’autres attributs intéressants pour la balise form : autocorrect pour la correction automatique (on/off). autocapitalize pour la mise en majuscule automatique (on/off). spellcheck (true/false) autofocus permet de placer le focus sur un controle sur un seul donné. autocomplete permet d’éviter l’auto-completion lorsque cela est sensible (login, etc.) ; valeurs on/off.
68 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Questions : Comment peut-on limiter le nombre de caractère saisie à 40 dans un input de type "text"
69 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Questions : Comment peut-on limiter le nombre de caractère saisie à 40 dans un input de type "text" .
70 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Questions : Comment peut-on limiter le nombre de caractère saisie à 40 dans un input de type "text" . Comment asssigner une valeur par défaut au input text précedent ?
71 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Questions : Comment peut-on limiter le nombre de caractère saisie à 40 dans un input de type "text" . Comment asssigner une valeur par défaut au input text précedent ? .
72 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Questions : Comment peut-on limiter le nombre de caractère saisie à 40 dans un input de type "text" . Comment asssigner une valeur par défaut au input text précedent ? . Comment assigner une indication à une réponse dans une input de type texte ?
73 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Questions : Comment peut-on limiter le nombre de caractère saisie à 40 dans un input de type "text" . Comment asssigner une valeur par défaut au input text précedent ? . Comment assigner une indication à une réponse dans une input de type texte ? A l’aide de l’attribut placeholder
74 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Questions : Comment peut-on limiter le nombre de caractère saisie à 40 dans un input de type "text" . Comment asssigner une valeur par défaut au input text précedent ? . Comment assigner une indication à une réponse dans une input de type texte ? A l’aide de l’attribut placeholder "Comment mettre un compteur de pas égal à 3 ?"
75 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Questions : Comment peut-on limiter le nombre de caractère saisie à 40 dans un input de type "text" . Comment asssigner une valeur par défaut au input text précedent ? . Comment assigner une indication à une réponse dans une input de type texte ? A l’aide de l’attribut placeholder "Comment mettre un compteur de pas égal à 3 ?"
76 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Questions : Comment peut-on limiter le nombre de caractère saisie à 40 dans un input de type "text" . Comment asssigner une valeur par défaut au input text précedent ? . Comment assigner une indication à une réponse dans une input de type texte ? A l’aide de l’attribut placeholder "Comment mettre un compteur de pas égal à 3 ?"
Comment peut-on définir un interval de valeur ?
77 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Questions : Comment peut-on limiter le nombre de caractère saisie à 40 dans un input de type "text" . Comment asssigner une valeur par défaut au input text précedent ? . Comment assigner une indication à une réponse dans une input de type texte ? A l’aide de l’attribut placeholder "Comment mettre un compteur de pas égal à 3 ?"
Comment peut-on définir un interval de valeur ? Possible avec les deux types number et date et les attributs minet max ... A vous de jouer ! un exemple ? 78 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires D’autres attributs intéressants pour la balise input : pattern Permet de spécifier une expression régulière à la valeur assignée au type input. Avant l’envoie du formulaire la chaine saisie est contrôlée (checked) Cet attribut est valable sur les input de type de text, search, url, tel, email et password Par convention d’usage, il est recommandé d’utilisé "tittle" pour décrire cette expression régulière !
79 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Éléments de formulaires Validation du formulaire .. Un test de validation est effectué à chaque soumission (bouton submit) pour tout controle ayant l’attribut required Pour une validation instantanée (c’est à dire, dès que l’utilisateur quitte un champ), il faut utiliser Javascript. Remarque Pour désactiver (temporairement) la validation au niveau d’un formulaire, il faut utiliser novalidate au niveau de l’élément ou au niveau du bouton submit.
80 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
Les graphiques en HTML 5
81 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Canvas Cette balise est probablement la plus prometteuse de toutes, puisqu’il s’agit d’une surface sur laquelle il est possible de tracer des formes et de les animer. En résumé . . . C’est dans cette zone que sont réalisées des animations ou des jeux.
82 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Canvas
Ce qu’on pourrait faire .... avec
83 / 86
Initiation HTML 5
HTML 5, Quoi de neufs ?
HTML5 : Google Maps C’est une API JavaScript qui permet d’attirer l’attention de visiteur en : Lui suggérant des annonces ou des publicités Adaptant la langue du site Visualisant l’itinéraires depuis là où se trouve le visiteur Les étapes pour intégrer une carte I
Il faut définir la zone (largeur et hauteur) dans une division (⇒ Pensez à)
I
Créer une fonction "JavaScript" pour définir les Propriétés de la carte (La position à afficher par défaut, le zoom, les types d’affichage de la carte : terrain, satellite, ...)
I
Pour afficher, la fonctionnalité de la carte est fournie par une bibliothèque JavaScript qu’il faut importer. 84 / 86
Bibliographie
Références Bibliographiques
85 / 86
Bibliographie
Références Bibliographiques
1
2
3
HTML5 et CSS3 Cours et exercices corrigés,Jean Engels, Edition Eyrolles, 2012 CSS avancées : Vers HTML5 et CSS3, Raphaël Goetter, 2me Edition, Eyrolles, 2012 CSS3 : Pratique du design web, H. Giraudel et R. Goetter, Edition Eyrolles, 26 février 2015
86 / 86