Archives pour la catégorie Redux:Web coding

Interlignage, exposants et Unicode

Sur commentcamarche.net, un utilisateur demandait comment avoir des exposants qui ne cassent pas l’interlignage. C’est un vieux problème jamais vraiment résolu dans les navigateurs autrement qu’en utilisant des règles CSS (CSS auteur par opposition à CSS navigateur).

Un contributeur proposait de passer par les chiffres en indice disponible dans les polices.

on peut aussi écrire directement à la suite texte :

exemple¹ et exemple² soit (je décompose) & sup 1 ; et & sup 2 ;

ça évite d’avoir à écrire une balise, et le texte et placé dans le même interligne que le texte.

limité à 1, 2 et 3.

Comme je me suis fendu d’une longue réponse qui me parait utile à d’autres, je vous la retranscrit ici

Non, non et non.

  1. Non, parce que tous les tous les chiffres sont disponibles. Cependant, les chiffres de 4 à 0 ne sont pas placés au même endroit dans Unicode (vous utilisez Unicode n’est-ce pas ? Vous n’êtes pas resté au XXe siècle ?)La liste est ici, avec exposants et indices

    ⁰¹²³⁴⁵⁶⁷⁸⁹₀₁₂₃₄₅₆₇₈₉

  2. Non parce que caractères Unicode ne sont pas conçus pour être utilisés, mais pour être compatibles avec l’existant. Il existe par exemple des caractères Unicode pour les chiffres romains, mais il ne sont pas conçus pour être utilisés dans de nouveaux documents, mais juste pour permettre à d’anciens documents d’être lus (pour un chiffre romain, on recommande ainsi d’utiliser le ou les caractères latins correspondants (I, II, III, IV…), quand bien même le chiffre romain existe dans Unicode (Ⅰ,Ⅱ,Ⅲ,Ⅳ)…
  3. Non parce que faire ainsi amène à deux poids deux mesures : pour les chiffres, vous utilisez les caractères Unicode et pour les lettres, mmh ? Et voilà, vous vous retrouvez à devoir mélanger de caractères d’exposant et des CSS, au lieu d’utiliser des CSS partout (vu qu’il est impossible d’utiliser des caractères d’exposant partout).

En espérant avoir êté utile.

flattr this!

Graisses de police, le support complet se fait attendre

On parle beaucoup du test Acid3, et vas-y que je te supporte tout, puisque j’ai un score de 100 % au test.

Ben voyons.

98 % des navigateurs ne gère toujours pas CSS 1.

Et je le prouve : ce n’est que maintenant qu’un navigateur, un seul, et uniquement sur une seule plateforme, sait enfin grer les gradations de polices (font-weight:700).

CSS 1 ! C’tait en 1996. Nous sommes en 2009. Treize ans. Treize ans ! Les plus jeunes de mes lecteurs n’taient même pas ns à l’poque.

Dans le même ordre d’ide : les polices tlchargeables ont onze ans (CSS 2) et, ç commence à peine se rveiller (pour le meilleur et pour le pire). Vous pouvez vrifier par vous-même.

flattr this!

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!

Why you shall not use Word

  1. have the very same version of Microsoft Word 2003 on two similar computers
  2. have the same font set on both, and globally the same settings
  3. create a new Word document on the first one; spend a while on the layout of the page because it’s an important document
  4. save it on the network
  5. download it on the second computer and open it with Word 2003
  6. scream discovering the layout of the page is different and you have no idea why!
  7. cast a spell on Microsoft and light a candle because PDFMaker is available…
  8. throw away Word forever for this kind of important document

See also La duplicité de MS Word.

flattr this!

Commentateurs de qualité — Google, je leur fais confiance

Après lecture de Vrais vampires : détecter un simulateur et Guide d’achat : choisir un appareil-photo numérique (APN), je me suis décidé à faire une toute petite modification sur le blog. Petite par ce qu’elle est, est que seul Google remarquera, mais qui est d’une grande importance dans ce qu’elle représente.

Pour aider la pertinence des publicités, Google propose un morceau de code qui lui dit sur quoi il doit se baser pour mettre des pubs (google_ad_section). Jusqu’à aujourd’hui, je limitais la zone « importante » au billet lui-même, les commentaires n’étant pas pris en compte.

J’ai aujourd’hui décidé que les commentateurs aussi avaient des choses intéressantes à dire — en tout cas, c’est le cas sur ces billets-là. Désormais, les commentaires aussi seront pris en compte. Ça veux dire que j’ai désormais suffisamment confiance en la qualité des commentateurs. En vous.

flattr this!

Firefox codenames: Gran Paradiso vs. Minefield

So you wanna get the absolute latest version of Firefox, hey? Well, so you would go for nightly, look at the bottom and download the one with the date of yesterday.

Yes but no.

That would work for Webkit (and now that WebKit works on Windows, not even), but not for the immense Firefox.

First off, Firefox is evolving very fast. I mean it. We don’t speak nightly there, we speak hourly. Yes, that fast. So, not only you must look for the day, but you must also look for the hour.

But that is just the tip of the iceberg (or the iceweasel—private joke). Even for the latest day and the same platform, you’ll get several versions. Even for the same language (yes, you can get a localised pre-alpha: check latest-trunk-l10n).

So, same day, same platform, same language, same pre-version… What’s next?

Branch or trunk. Cutting edge or bleeding edge.

Take Gran Paradiso and Minefield, for instance. Both are pre-alpha 6 versions of Firefox loaded with Gecko 1.9 (I’ll spare you the difference between Gecko and Firefox—if you read so far, I guess you know it). Gran Paradiso is branch, Minefield is trunk. Firefox is a tree and its constant gardeners sometimes cut off some branches (effectively forking Firefox) to focus on bug-fixing. If we double the tree metaphor with a comparison with science, branches (a sort of code-freeze) are aimed at “applied coding”, i.e. releasing Firefox’s next version, while trunk is aimed at “pure coding” a.k.a. “Mad Scientist”.

So, Firefox 3 will develop out of Gran Paradiso, a branch devoted to integration, bugfixes and all these non-sexy, lamerz things ;-). Meanwhile, pure coding will continue on the trunk, codenamed Minefield, a nickname it deserves well. So, the one who wish to live dangerously can go wild with Minefield, the l33t’s toy. Cut or bleed, branch or trunk, Gran Paradiso or Minefield.

You wanted the short version? This is: latest is Minefield. Not that it would help you much, since you still have to look for a lot of different versions. Start here (I don’t know what tinderbox builds are).

Follow the links from Firefox 3 (Gran Paradiso) is on the loose!

flattr this!