Archives du mot-clé title

Liste de meta tags

Grandement inspiré de Meta Tags Explained.

Balises Dublin Core
C’est une tentative de formalisation des meta par des documentalistes. Il y a 27 (15 + 12) balises, certaines faisant doublon avec des existantes. Ce n’est pas un problème, car les 15 valeurs sont préfixées code>DC. et l’objectif est de ne pas avoir à se reposer sur les balises « anciennes ». Rentrer dans le détail de ces balises dépasse le cadre de cet article. Sachez juste que c’est une bonne idée de renseigner les valeurs Dublin Core.
abstract
Surtout utilisé dans les cercles universitaires, c’est une courte description (10 mots). C’est entre description (pour une vraie phrase) et keywords (pour la concision). Indexé uniquement par les moteurs de recherche universitaires.
author
Prénom et nom de l’auteur (pas du webmaster qui a mis en ligne). Pas indexé.
http-equiv="bla
Il remplace l’entête HTTP idoine, il est donc à éviter si vous pouvez vous-même changer les entêtes HTTP. Le seul cas où il est toujours utile est content-language (voir plus bas).
content-language
Il remplace l’entête HTTP idoine, il est donc à éviter si vous pouvez vous-même changer les entêtes HTTP. Pas indexé.
content-script-type
Il remplace l’entête HTTP idoine, il est donc à éviter si vous pouvez vous-même changer les entêtes HTTP. Pas indexé, même les navigateurs l’ignorent.
content-type
Il remplace l’entête HTTP idoine, il est donc à éviter si vous pouvez vous-même changer les entêtes HTTP. Cependant, et contrairement à tous les autres http-equiv, il reste pertinent (et même indispensable) dans un cas de figure : la validation HTML d’une page Web hors-ligne (quand vous écrivez votre HTML sur votre machine, sans pseudo-serveur) écrit en autre chose que de l’US-ASCII (dit autrement, pour que vos é et Ç ne produisent pas une erreur). En effet, comme il n’y a pas de flux réseau, il n’y a pas d’entête HTTP et ce meta est donc la seule manière de connaître l’encodage de votre fichier. Pas indexé.
copyright
Pas indexé.
description
Description de la page (pas du site). Pour des raisons de catalogage, ne devrait pas comporter plus de 250 caractères (les moteurs de recherche, eux, recommendent même moins de 200 caractères). Elle est destinée à des humains, donc faites-là accrocheuse (ce qui peut avoir des sens variés, selon votre lectorat). Tâchez de réutiliser les mots-clés de keywords.
designer
Sert aux designers comme moyen de rappeler que c’est eux qui ont conçu la page. Ne marche bien sûr que pour du pompage de très bas niveau (qui reste cependant très populaire, OpenWeb peut en attester). Pas indexé (et limite pas pertinent).
distribution
Accepte trois valeurs : global, local et IU. Pas indexé (et limite pas pertinent). Si vous voulez réserver l’usage des pages, il y a beaucoup mieux (robots.txt, .htaccess et carrément du mot de passe ou un intranet).
expires
Quand est-ce que la page sera mise à jour. Plus indexé.
generator
Comme designer (ou, dans les courriels, X-Mailer) elles servent de pub pour le concepteur – ici, le logiciel utilisé – et, à mon avis, décridibilisent le site. Pas indexé.
googlebot
Comme robots, mais uniquement pour Google. Indexé par Google. Ne pas utiliser, car ce serait revenir au temps du optimisé pour….
icbm
Pour donner une adresse physique. C’est assez vague : est-ce l’adresse physique du serveur (faible intérêt) et dans ce cas, il faut la changer quand le serveur change de place, l’adresse de la résidence principale de l’éditeur principal, le lieu d’où est écrit une page pour un blog itinérant, le lieu dont parle la page… Ça ressemble plus à une mode qu’à autre chose. Quoiqu’il en soit, vous pouvez connaître la valeur à entrer en allant sur geourl.org/add.html.
keywords
Le plus connu et aussi le plus abusé, il n’est du coup partiquement plus utilisé.
language
Fait la même chose que content-language, mais avec le vrai nom, en anglais, de la langue (English au lieu de en). Ne pas utiliser, car html xml:lang (ou html lang si vous êtes encore en HTML) fait la même chose, en mieux — d’une manière générale, une balise meta est toujours la moins bonne des manières formalisées de faire quelque chose). Indexation inconnue, mais, comme j’ai dit, mieux vaut ne pas l’utilser.
mssmarttagspreventparsing
Un temps, Microsoft envisageait un système de smart tags qui, selon la communauté des développeurs Web, ferait plus de mal que de bien (sauf à Microsoft, bien sûr). Microsoft avait prévu de se retirer de leur « programme » d’opt-in avec cette valeur meta mise à true. Du fait du très mauvais retour dans la presse, Microsoft a annulé la chose, mais plus d’un site méfiant conserve cette valeur, au cas où. Cependant : d’une part, rien n’empêche Microsoft de n’en avoir cure (même problème que pour les robots, d’ailleurs) et d’autre part, si on commence comme ça, ça peut aller loin (les meta spécifiques aux moteurs de recherche). Indexation inconnue.
msn
A une seule valeur, noodp où la description de dmoz/ODP sera remplacée par celle de MSN Search. Indexé par MSN.
publisher
Comme generator. Pas indexé, ne pas utiliser.
rating
Noter le site, un truc pour les États-Uniens pudibonds et les Chiennes de garde. Pas indexé, ne pas utiliser — un RDF de l’ICRA a plus de sens et, encore une fois, une balise meta et la moins banne manière formalisée de faire quelque chose.
refresh
Il remplace l’entête HTTP idoine, il est donc à éviter si vous pouvez vous-même changer les entêtes HTTP (une redirection 301, ou parfois une 302). Indexation inconnue.
reply-to
Présent dans le brouillon de HTML 3, qui n’est jamais sorti et qui était bien). Malhereusement, un paradis à spam, utilisez donc plutôt link contact. Indexation inconnue, ne pas utiliser.
resource-type
Double-emploi avec la DTD.
revisit-after
Même objectif que expires. Pas indexé.
robots
Gère le comportement des robots. Valeurs : index (indexer la page), follow (suivre les liens de la page), noindex, nofollow, all (valeur par d

flattr this!

Les exclusivités d’Opera

Initialement publié le 17 avril 2006 à 19:03:41

Exclusivités

  • Titres numérotés Gecko en fait désormais autant
  • Espaces fines insécables Gecko en fait désormais autant
  • Sélection de texte autogénéré
  • Retours chariot CSS (\a, de mémoire)
  • Le seul à pouvoir correctement utiliser run-in avec du display:after (les dernières compilations nocturnes de Webkit ont réglé le problème ; mais pas la dernière nocturne de Gecko 1.9)
  • La meilleure gestion de l’attribut cite à ce jour grâce aux liens en cascade (CLink)

Exemples

Sur ce blog

Démonstration de la puissance d’Opera
Démonstration de la puissance d’Opera

Le texte cité est une liste de définitions (en gras, les dt). Les deux_points et espaces les précédants sont autogénérés (quand on y pense, c’est de la présentation, tout ça).

Si vous cliquiez sur le texte violet en bas, ça vous emmènerait sur la page de source. Et vous pourriez aussi le sélectionner, quand bien même il est autogénéré depuis l’attribut title.

Bien entendu, il n’a pas le problème de Safari avec les guillemets, qu’il localise comme demandé (Firefox le fait aussi correctement).

Soyons honnêtes : Opera a du mal avec les enrichissements typographiques et surexploite les déliés (vous le voyez en bas). D’une manière générale, Opera a du mal avec Mac. Il n’empêche, c’est bien, tout ça.

Autre

Un autre exemple que je compte bien (re)mettre en action dans la nouvelle version du site Web, les compteurs (counter, conter-increment) :

h3:before	{ 	content:counter(thetitre3) "."; 	counter-increment:thetitre3; 	}
Un exemple simple
Un exemple simple
Un exemple plus évolué
Un exemple plus évolué

Le fichier HTML

Notez que dans le dernier exemple, les astérisques peuvent tout à fait être rendus par une autre navigateur ; en effet, il n’y a aucune numérotation derrière.

Notez également que les postulats des titres (h*), qui ne sont pas des blocs, mais des lignes, ont été totalement revus en XHTML 2.0 (à l’avenir cependant incertain). Les compteurs ne devraient donc plus être nécessaires (pour cette utilisation) dans cette nouvelle mouture du langage par excellence du Web.

Voir aussi

  1. Télécharger Opera
    • en version stable. Préférez la version anglaise, la version française étant très en retard
    • en version beta. La version 9 est en bêta, j’en ai fait une revue (pour la bêta 1) et c’est celle que j’utilise, preuve de sa stabilité
  2. D’autres articles sur Opera, sur ce blog
  3. Le blog de Laurent Denis, chantre francophone d’Opera et spécialisé dans l’accessibilité
  4. Wikipédia — Opera et Wikipédia — Liste des fonctionnalités du navigateur Opera
  5. Les primeurs d’Omniweb, où je glorifie un autre navigateur
  6. Des caption pour les listes, où je traite d’un autre problème lié aux énumérations

flattr this!

Un (beau) titre et rien d’autre…

J’avais déjà signalé il y a quelques années combien je n’aime pas voir les h1 être utilisés comme titre (le titre d’un chapitre, n’est pas le titre du livre, à la fin !) : Un title dans la page.

Rien de nouveau, sauf une superbe mise en forme de la chose.

Title très bien mis en forme
  • un titre
  • du texte bidon
  • une mise en forme sur le titre (police Didot, bordure inférieure, letter-spacing, opacity, text-shadow)
  • un Mac pour afficher ça (il paraît que Linux s’améliore, et passe même devant Windows)

Si vous regardez attentivement, vous verrez que derrière le titre, ce n’est pas uniforme ; eh oui, c’est le texte en transparence (un demi-pourcent de transparence ; ça n’a l’air de rien, mais en mouvement, ça se voit assez sans gêner la lecture).

J’avoue sans vergogne être assez fier de moi, pour le coup.

HTML
<title>Un titre, et rien d’autre</title>
CSS
head, head title {display:block} head title { 	background:white; 	border-bottom:10px solid #ddd; 	font:200% Didot,serif; 900 small-caps; 	left:0; 	letter-spacing:.2em; 	opacity:.95; 	margin-bottom:2em; 	padding:.6em 0; 	position:fixed; 	right:0; 	text-align:center; 	text-shadow:.1em .1em .1em #000 } body	{ 	font-family:Hoefler Text,Times New Roman,serif; 	line-height:1.6em; 	margin:0 2em; 	margin-top:8em }

On doit pouvoir virer certaines choses, mais je n’ai pas envie de chercher.

J’espère que ça vous plaît. Et que l’on ne me dise plus qu’un title, c’est moche !

flattr this!