HTML5 le futur de l'internet
Avant de commencer,il faudra télécharger le navigateur Opéra pour voir le rendu des-
( + )Présentation
- ( + )Balise pour structurer un documents
- ( + ) section
Cette balise découpe le contenu en section
identifie un bloc de contenu pour structurer la page par sections thématiques. Elle peut contenir des titres (hn), des paragraphes (p), un entête (header) et/ou un pied de page (footer).
- ( + ) article
Cette balise encadre un morceau de texte
indique un contenu indépendant de la page, par exemple un post sur un forum ou un blog. Il est possible d'imbriquer plusieurs balises
, dans le cas de commentaires. Son utilisation reste encore complexe et devrait être précisée dans les prochaines versions du document HTML 5. - ( + ) aside
Cette balise étend le contenu
Elle précise que le contenu de la section est thématiquement lié au reste de la page, mais qu’il est néanmoins possible de le séparer de la structure de la page. Cet élément est généralement représenté comme un encadré sur la page. La balise
- ( + ) header
Cette balise définit l'en-tête d'une section à savoir le haut de page
- ( + ) footer
Cette balise définit un pied de page (il est possible de pied de page en haut et vice versa)
ces trois balises(aside, article et section) servent à mettre un encart sur le côté et découper un document en plusieurs morceaux
- ( + ) section
- ( + )Balise pour contenu embarqué
- ( + ) figure
-
-
legend : comme son nom l'indique cette balise sert à indiquer une légende
-
cite : cette balise sert à insérer une citation
Cette Balise délimite un contenu média avec sa légende et son titre par exemple.
-
- ( + ) canvas
exemple canvas (2)
exemple canvas (3)
Cette Balise sert à dessiner et afficher des formes géométriques
- ( + ) video
Cette Balise est spécifié pour tous les contenu vidéo
HTML 5 proposera une alternative grâce à ses balises <>video<> et <>audio<>. Par exemple, pour la vidéo on pourra définir :
* la source
* les dimensions
* l'image de preload
* le type de fichier
* des contrôles
* ... - ( + ) audio
Cette Balise est spécifié pour tous les contenu audio
- ( + ) figure
- ( + )Balise pour formulaire
- ( + ) output
Elle sert à définir le résultat d'un processus, par exemple celui d'un script
Un champ de sortie pour les formulaires (par exemple "" <>output name="result" onforminput="value = a.value + b.value">0 "" affichera la somme des champs a et b).
- ( + ) form
Cette Balise sert à génerer des formulaires plus évolué que la version précédente
- ( + )exemple de formulaire
- ( + ) output
- ( + )Balise pour la mise en page
- ( + ) pre
Cette Balise sert à afficher le texte tel qu il est écrit sur un document text
- ( + ) var
Cette Balise permet de mettre en valeur une variable
- ( + ) dialog / dt / dd
-
- dialog : mettre en avant une conversation
- dt : précise le nom du locuteur
- dd : précise les paroles du locuteur
On se sert de cette balise pour les conversations(une sorte de DL)
-
- ( + ) dfn
Balise pour les définitions
- ( + ) time
Balise utilisée pour le temps et l'heure
- ( + ) meter
Cette Balise contient une valeur fractionnaire ou scalaire dont on connaît l'intervalle de valeurs possibles
- ( + ) progress
Cette Balise indique le niveau d'avancement d'une tâche.
Les attributs de cette balise sont encore un peu flous
- ( + ) pre
- ( + )Balises mises aux oubliettes par html5
-
-
basefont
-
big
-
center
-
font
-
s
-
strike
-
tt
-
u
-
frame
-
frameset
-
noframes
-
HTML 5 se base sur les nouvelles technologies (navigateurs Web, standards utilisés...). Il intègre le référencement universel qui permet aux moteurs de recherche de proposer à l'internaute un panel de documents multimédia, et plus seulement des pages Web. Pour cela, les balises HTML 5 précisent le contenu des éléments.
HTML5 reprend la majorité des éléments de HTML4. Cependant HTML5 définit aussi nombre de nouveaux éléments qui sont de nouvelles balises sémantiques.
L'intérêt des balises sémantiques est d'une part d'obtenir une meilleure lisibilité du code, mais également de spécifier certains éléments au lieu d'utiliser un élément générique tel que div.
Cette aspect est très utile aux crawlers des moteurs de recherche, tels que Yahoo ou Google.
- ( + )Balise pour structurer un documents