Affichage des articles dont le libellé est html5. Afficher tous les articles
Affichage des articles dont le libellé est html5. Afficher tous les articles
mardi 12 novembre 2019
Dans HTML5 , on divise les éléments en catégories générales en fonction de leur objectif, on
commence de la division d'un document en sections et articles logiques à la mise en évidence de
mots individuels.
Le contenu de la page web comprend tout ce que les visiteurs peuvent le voir et lire et utiliser , le
contenu est l'information que nous essayons de communiquer au public.
Le web est un moyen de transférer cette information d'un côté à l'autre .
On peut décomposer une masse de mots en partie lisibles en ajoutant quelques balises structurelles.
 | |
| Contenu et structure dans html5 |
référence à la signification inhérente d'un élément ou attribut HTML5.
Si un bloc de texte est une citation sera marquer comme citation avec la balise de l'élément qui le
Conviens , si une chaine de mots est un titre , on met l'élément correspondant .
Former une structure solide à notre contenu le rend plus fort et plus flexible et facile à suivre par les
utilisateurs et les lecteurs .
Lors de l'organisation logique de notre contenu avec les éléments approprié , nous intégrons
également le cadre robuste dont nous avons besoin pour styliser nos pages web avec css.
Lors de l'organisation logique de notre contenu avec les éléments approprié , nous intégrons
également le cadre robuste dont nous avons besoin pour styliser nos pages web avec css.
Sections logiques:
Les éléments HTML5 décrivent la nature et le but de leur contenu , avec des éléments spécifiques
pour l'en-tête, les paragraphes, les citations, les listes, les liens, les images, etc ...
Notre contenu peut être un article comprenant plusieurs paragraphes, ainsi qu'un titre et quelques
sous-titres , avec quelques notes de bas de page et un auteur signé pour une bonne mesure.
Nous pouvons regrouper tout ce contenu en une seule unité sémantique avec l'élément article, en
déclarant que nos différents fragments de texte ont des objectifs différents, mais qu'ils forment
également un tout cohérent.
lundi 11 novembre 2019
Il y a différents liens dans l'en-tête du document HTML5 (head).
Les Liens extérieurs:
L'élément de lien <link> associe le document HTML actuel à une ressource externe , il y a plusieursressources extérieures, donnant exemples comme document de feuilles de style css ou une
bibliothèque ou image ico etc.
La tâche la plus courante de l'élément lien <link> est de connecter une page web à une feuille de
style externe et associe à la page à une icône que le navigateur l'affiche dans les signes et dans le
champ d'adresse .
L'élément <link> contient les attributs suivants : rel="", href=""
L'attribut rel =" " : indique la relation entre le document HTML actuel et la ressource liée ,
examples: rel= "stylesheet" , rel="icon", rel="editURL", rel="search" ,rel="prev" , rel="license".
L'attrubut href="" : href requis porte l'URL (un localisateur de ressources uniforme) de la
ressource liée ,
examples: href="/css/styles.css" ,
href="https://feeds.feedburner.com/example"href="/favicon.ico", etc ..
Il y a aussi l'attribut type="" , ce dernier n'est pas nécessaire à présent, rarement utilisé .
On n'a pas toujours besoin de déclarer le type de contenu pour chaque ressource.
Les informations de l'attribut type sont envoyées automatiquement par le serveur web ou intégrées
au fichier lui-même.
examples :
type="text/html",type="stylesheet",type="image/ico" ,etc ..  | |||
| les liens dans l'entete |
Le nombre d'éléments de lien <link> que vous pouvez inclure dans l'en-tête d'un document HTML
est illimité, par exemple , nous pouvons créer des liens vers différentes feuilles de style pour
différents supports ou plusieurs icônes .
Les deux éléments suivants de liaison reliant le document HTML à deux ressources externes
Les deux éléments suivants de liaison reliant le document HTML à deux ressources externes
différentes :
<head>
<link rel="stylesheet" type="text/css" href="/css/styles.css">
<link rel="icon" type["image/ico" href="/favicon.ico">
</head>
Type de support (Media type) :
L'attribut de type facultatif de l'élément lien (link) indique le type de média internet de la ressource
liée . ce type de contenu est également appelé type de contenu ou type MIME
( Multipurpose Internet Mail Extensions, ces types de médias ont été définis à l'origine pour être
utilisé dans le courrier électronique , mais ensuite été adoptés pour d'autres applications internet , y
compris le web ).
Différents types de fichiers sont servis et gérés de différentes manières .
les fichiers texte sont très différents des fichiers images et les deux sont différents des fichiers vidéos
ou des fichiers applications .
Le type de média internet est un identifiant en deux parties composées d'un type et d'un sous-type ,
séparés par une barre oblique , indiquant le type de fichier traité par le navigateur afin que celui-ci
puisse traiter les données en conséquence.Le type de média pour les fichiers CSS est un text/css , ce
qui indique que la feuille de style est un fichier texte écrit en langage CSS.
Il s'agit de la valeur de type que vous etes le plus suscibtible de rencontrer dans un élément de lien.
Les autres fichiers multimédia ont leurs propres types de contenu.
Tels que image/jpeg pour les graphiques jpeg et audio/mpeg pour les fichiers audio mp3 .
L'attribut type peut apparaitre sur d'autres éléments que le lien par exemple comme <input>.
Type de support différent:
Lorsque l'élément de lien (link) est lié à une feuille de style css , l'attribut média facultatif peut
indiquer le support auquel cette feuille de style est destinée.
Donc on peut facilement personnaliser mise à jour et la conception de notre site pour différents
médias .
On peut écrire de feuilles de style cs distinctes , la première pour l'afficher sur un écran d'ordinateur et la deuxième pour l'utiliser lorsque la page est imprimée.
<link rel="stylesheet" href="/css/screen-styles.css" media="screen">
<link rel="stylesheet" href="/css/screen-styles.css" media="print">
On peut aussi inclure ou ajouter plusieurs type de support dans un seul attribut de support , qui sont
séparés par des virgules.
<link rel="stylesheet" href="/css/screen-styles.css" media="screen,projection,tv">
dimanche 27 octobre 2019
La balise <meta> en HTML fournit des informations sur document HTML ou , en termes simples,
des informations importantes sur un document.
Ces balises sont essentiellement utilisées pour ajouter dea paires nom/valeur afin de décrire les
propriétés d'un document HTML , telles que la date d'expiration, le nom de ;auteur , la liste des mots-
clés , etc.
Cette balise <meta> est un élément vide, car elle ne comporte qu'une balise d'ouverture et aucune
balise de fermeture , mais elle contient des informations dans ses attributs .
Un document web peut inclure plusieurs balises meta en fonction des informations, mais, en général,
cela n'affecte pas l'aspect phusique du document .(1)
(3) https://www.w3schools.com/tags/tag_meta.asp
des informations importantes sur un document.
Ces balises sont essentiellement utilisées pour ajouter dea paires nom/valeur afin de décrire les
propriétés d'un document HTML , telles que la date d'expiration, le nom de ;auteur , la liste des mots-
clés , etc.
Cette balise <meta> est un élément vide, car elle ne comporte qu'une balise d'ouverture et aucune
balise de fermeture , mais elle contient des informations dans ses attributs .
Un document web peut inclure plusieurs balises meta en fonction des informations, mais, en général,
cela n'affecte pas l'aspect phusique du document .(1)
 | |
| meta tag |
Les balises meta vous permettent de fournir des métadonnées sur vos pages HTML. Cela peut être
utile pour les moteurs de recherche, les navigateurs et les autres applications qui souhaitent en savoir
plus sur votre page .
Les métadonnées sont des informations sures, on décrit , d'autres données ou informations.
Vous pouvez ajouter des métadonnées à vos pages web en plaçant des balises <meta> entre les
balises <head>...</head> .(2)
Les métadonnées sont des données (informations ) sur les données .
La balise <meta> fournit des métadonnées sur le document HTML , les métadonnées ne seront pas
affichées sur la page web , mais seront analysables par la machine .
Les méta-éléments sont généralement utlisés pour spécifier la description de la page, les mots-clés ,
l'auteur du document la dernière modification et d'autres métadonnées .
Les métadonnées peuvent être utilisées par les navigateurs pour mieux afficher du contenu et bien
correctement , ou recharger une page. Les métadonnées utilisées pour que les moteurs de recherche
les classent parmi les premiers websites , et cela grâce aux mots-clés.(3)
correctement , ou recharger une page. Les métadonnées utilisées pour que les moteurs de recherche
les classent parmi les premiers websites , et cela grâce aux mots-clés.(3)
Les métadonnées prennent de nombreuses formes :
Voici différents éléments de meta tag :
1- <meta charset="utf-8">
Le jeu de caractères est généralement défini sur UTF-8 et indique essentiellement au navigateur le
codage de caractères à utiliser.
Vos pages doivent absolument inclure une indication du jeu de caractères à utiliser. C’est l’une des
choses que vous devez insérer dans votre modèle.
L'élément <meta charset = "utf-8"> est devenue plus facile avec HTML5.
Découvrez la version de cet extrait requise pour HTML 4.01:
<meta http-equiv = "content-type" content = "text / html; charset = UTF-8">
Autres métatags typiques incluent la description et l'auteur.
Voici un exemple de chacun d’eux:
2- La description : <meta name = "description" content = "Une description de votre page">
3- L'auteur : <meta name = "author" content = "Le nom de l'auteur">
4- Keywords : <meta name="keywords" content="choose essential words and important words in
the page web" >.
5-work on mobile device: <meta name="viewport" content="width=device-width,initial-scale=1"> .
6-Refresh : <meta name="refresh" content="5; url= url name ">
7-Revised : <meta name="revised" content="website name, date of revised">.
8-Copyright : <meta name="copyright" content="copyright owner"> .
4- Keywords : <meta name="keywords" content="choose essential words and important words in
the page web" >.
5-work on mobile device: <meta name="viewport" content="width=device-width,initial-scale=1"> .
6-Refresh : <meta name="refresh" content="5; url= url name ">
7-Revised : <meta name="revised" content="website name, date of revised">.
8-Copyright : <meta name="copyright" content="copyright owner"> .
Ref:
jeudi 24 octobre 2019
Pour commencer par un document HTML5 nous devons écrire avant tous la déclaration suivante:
<! DOCTYPE.html>
<! DOCTYPE.html>
C'est quoi doctype :
Une déclaration de type de document est une instruction destinée au navigateur web sur la version
du langage de balisage dans laquelle une page web est écrite.
La déclaratiopn doctype apparait en haut du document HTML avant l'ouverture du balise <html>
La déclaration de doctype n'est pas une balise html.
Le doctype sert à valider ses pages suivant les normes W3C choisis , mais son principal but est
d'indiquer aux navigateurs comment interpréter le document aux pages web , il sert à definir le type
du document afin qu'il soit correctement interprété pour le navigateur , c'est une instructionpour le
navigateur à propos de la version de HTML du document .
Pour les versions précédente du html par example (1)
Pour HTML 4.01 Strict la déclaration est :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
Pour HTML 4.01 Transitional la déclaration est :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Pour HTML 4.01 Frameset la déclaration est :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
Pour XHTML 1.0 Strict la déclaration est :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Pour XHTML 1.0 Transitional la déclaration est :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Pour XHTML 1.0 Frameset la déclaration est :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Pour XHTML 1.1 la déclaration est :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> (2)
Pour la version actuelle du HTML5 est la déclaration type suivante :
<!DOCTYPE html>
On peut ajouter la langue du document par example pour le français on écrit la balise html comme
ceci : <html lan="fr">
Dans la balise <head>....</head> il y a d'autes balises sont les suivantes :
La balise <meta> pour les données
La balise <title> pour écrire le titre de la page en haut à gauche.
La balise <link> la liaison entre la page et d'autres sites web.
Plus d'explication prochainement
Ref:
(1) https://www.html-5-tutorial.com/doctype.htm
(2) https://html.com/tags/doctype/
Le doctype sert à valider ses pages suivant les normes W3C choisis , mais son principal but est
d'indiquer aux navigateurs comment interpréter le document aux pages web , il sert à definir le type
du document afin qu'il soit correctement interprété pour le navigateur , c'est une instructionpour le
navigateur à propos de la version de HTML du document .
Pour les versions précédente du html par example (1)
Pour HTML 4.01 Strict la déclaration est :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
Pour HTML 4.01 Transitional la déclaration est :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Pour HTML 4.01 Frameset la déclaration est :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
Pour XHTML 1.0 Strict la déclaration est :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Pour XHTML 1.0 Transitional la déclaration est :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Pour XHTML 1.0 Frameset la déclaration est :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Pour XHTML 1.1 la déclaration est :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> (2)
Pour la version actuelle du HTML5 est la déclaration type suivante :
<!DOCTYPE html>
 | |
| document html5 |
L'ouverture de document HTML5 :
L'ouverture d'un document HTML commence par la racine html, une balise pour l'ouverture <html>
et une autre balise pour la fermeture à la fin du document html </html>.
et une autre balise pour la fermeture à la fin du document html </html>.
On peut ajouter la langue du document par example pour le français on écrit la balise html comme
ceci : <html lan="fr">
La dexième balise c'est l'entête c'est la balise head, une pour l'ouverture <head> et une autre pour la
fermeture </head>
Dans la balise <head>....</head> il y a d'autes balises sont les suivantes :
La balise <meta> pour les données
La balise <title> pour écrire le titre de la page en haut à gauche.
La balise <link> la liaison entre la page et d'autres sites web.
Plus d'explication prochainement
Ref:
(1) https://www.html-5-tutorial.com/doctype.htm
(2) https://html.com/tags/doctype/