meetup html
TRANSCRIPT
![Page 1: Meetup html](https://reader031.vdocuments.net/reader031/viewer/2022031919/55c58fcbbb61ebc06e8b48a4/html5/thumbnails/1.jpg)
Créer son premier site avecHTML
Formation par Ludovic Verrecchia, intervenant à 3wAcademy
![Page 2: Meetup html](https://reader031.vdocuments.net/reader031/viewer/2022031919/55c58fcbbb61ebc06e8b48a4/html5/thumbnails/2.jpg)
Notre école
Plus de 400 étudiants
11 salles dans le monde
Plus de 2 ans d'existence
![Page 3: Meetup html](https://reader031.vdocuments.net/reader031/viewer/2022031919/55c58fcbbb61ebc06e8b48a4/html5/thumbnails/3.jpg)
Nos cours
![Page 4: Meetup html](https://reader031.vdocuments.net/reader031/viewer/2022031919/55c58fcbbb61ebc06e8b48a4/html5/thumbnails/4.jpg)
Notre méthode
![Page 5: Meetup html](https://reader031.vdocuments.net/reader031/viewer/2022031919/55c58fcbbb61ebc06e8b48a4/html5/thumbnails/5.jpg)
Suivez-nous
www.3wa.fr
www.facebook.com/3WAcademy
#3WAcademy
3w Academy
![Page 6: Meetup html](https://reader031.vdocuments.net/reader031/viewer/2022031919/55c58fcbbb61ebc06e8b48a4/html5/thumbnails/6.jpg)
![Page 7: Meetup html](https://reader031.vdocuments.net/reader031/viewer/2022031919/55c58fcbbb61ebc06e8b48a4/html5/thumbnails/7.jpg)
![Page 8: Meetup html](https://reader031.vdocuments.net/reader031/viewer/2022031919/55c58fcbbb61ebc06e8b48a4/html5/thumbnails/8.jpg)
HTML
HyperText Markup Language
![Page 9: Meetup html](https://reader031.vdocuments.net/reader031/viewer/2022031919/55c58fcbbb61ebc06e8b48a4/html5/thumbnails/9.jpg)
Les balises - syntaxe
- HTML est un langage de balises- Chaque balise a un nom et est entourée de < et >- Il faut une balise ouvrante et fermante
<balise> Mon contenu</balise>
<p> Mon premier paragraphe</p>
![Page 10: Meetup html](https://reader031.vdocuments.net/reader031/viewer/2022031919/55c58fcbbb61ebc06e8b48a4/html5/thumbnails/10.jpg)
Les balises - attributs
- Un attribut est un complément d’information
- On ajoute le nom de l’attribut et sa valeur entourée de double quote. Ex : <html lang="fr">
- Toutes les balises peuvent avoir des attributs. Mais une seule fois le même attribut.
![Page 11: Meetup html](https://reader031.vdocuments.net/reader031/viewer/2022031919/55c58fcbbb61ebc06e8b48a4/html5/thumbnails/11.jpg)
Sémantique
Chaque balise a un sens/rôle unique.
Les titre : <h1>, <h2>, <h3>....<h6>Le texte : <p>Mettre en avant : <strong>Les liens : <a>
Du son : <audio>Des vidéos : <video>Une image : <img>autres : <div>, <span>
Il est possible d'imbriquer des balises<p> Mon texte ayant un <a href="http://monsite.ca"> lien </a> vers mon site super cool</p>
![Page 12: Meetup html](https://reader031.vdocuments.net/reader031/viewer/2022031919/55c58fcbbb61ebc06e8b48a4/html5/thumbnails/12.jpg)
Cas pratique
- Créer un nouveau fichier “page.html”
- A l’aide d’un éditeur, ouvrir le contenu du fichier
- Écrire votre premier paragraphe HTML
- Vérifier l’affichage dans votre navigateur
![Page 13: Meetup html](https://reader031.vdocuments.net/reader031/viewer/2022031919/55c58fcbbb61ebc06e8b48a4/html5/thumbnails/13.jpg)
Structure de base
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>Titre</title> </head> <body> <!-- votre contenu HTML --> </body></html>
![Page 14: Meetup html](https://reader031.vdocuments.net/reader031/viewer/2022031919/55c58fcbbb61ebc06e8b48a4/html5/thumbnails/14.jpg)
Lien de page en page
- La balise <a> permet de faire un lien vers une autre page. Pour cela, il faut remplir l’attribut href, en lui donnant le nom de la page à atteindre.
<a href="page2.html"> page2 </a>
![Page 15: Meetup html](https://reader031.vdocuments.net/reader031/viewer/2022031919/55c58fcbbb61ebc06e8b48a4/html5/thumbnails/15.jpg)