Informatique

Fil des billets

Sous-catégories

Facebook, you said security?

J’ai d’abord cru à un spam.

Bonjour Nicolas,
Votre confidentialité est de la plus haute importance pour tous les employés de Facebook et nous nous attachons sans cesse à protéger vos informations. Bien que la plupart d’entre nous passent tout le temps à empêcher ou résoudre les problèmes avant qu’ils n’affectent quiconque, nous avons récemment été pris de court par un bug technique qui a divulgué votre numéro de téléphone ou adresse électronique à un tiers.

Le bug avait une portée limitée et n’a vraisemblablement permis qu’à une personne que vous connaissez déjà en dehors de Facebook de voir votre adresse électronique ou numéro de téléphone. Ceci dit, nous prenons cette erreur très au sérieux.

Décrire la cause du bug peut être un peu trop technique, mais nous voulons expliquer ce qui s’est produit. Lorsque les utilisateurs téléchargent leurs listes de contacts ou carnets d’adresses sur Facebook, nous essayons de faire correspondre ces données avec les coordonnées d’autres utilisateurs de Facebook afin de générer des recommandations d’amis. À cause du bug, les adresses électroniques et les numéros de téléphone utilisés pour créer ces recommandations et réduire le nombre d’invitations que nous envoyons ont été accidentellement stockés dans leur compte Facebook, avec leurs contacts téléchargés. En conséquence, si une personne avait téléchargé une archive de son compte Facebook via notre outil de téléchargement des informations, qui inclut les contacts téléchargés, elle a pu se retrouver avec des adresses électroniques ou numéros de téléphone supplémentaires.

Voici vos coordonnées (accidentellement visibles d’1 utilisateur Facebook maximum) :
[…]@[…]

Nous pensons qu’1 utilisateur Facebook a vu ces coordonnées supplémentaires affichées à côté de votre nom dans la copie téléchargée de ses informations de compte. Aucune autre information vous concernant n’a été affichée et il est fort possible que la personne ayant vu ces informations ne vous soit pas étrangère, même si vous n’êtes pas amis sur Facebook.

Nous reconnaissons que le partage accidentel de coordonnées est inacceptable, même si vous connaissez les personnes ayant vu ces coordonnées, et nous avons pris toutes les mesures nécessaires pour empêcher que cela ne se reproduise. Pour plus d’informations sur le bug, veuillez lire notre publication de blog.

Tous les employés de Facebook prennent ce problème très au sérieux. Nous vous remercions pour votre usage continu de Facebook et mettons tout en œuvre pour fournir le niveau de service que vous attendez et méritez.

Merci,
L’équipe Facebook

“Message important de Facebook” reçu par email

Je serais curieux de savoir comment Facebook a déterminé que seul un utilisateur ait pu accéder à mon adresse email.

Forcer l’anti-aliasing avec Chrome sur Windows

Pour un projet de site web associatif, tout comme pour le blog ici, j’utilise des fontes provenant de la plateforme Google Web Fonts.
C’est un service très pratique qui permet d’utiliser la propriété @font-face de CSS pour utiliser une police d’écriture personnalisée.

Seulement, l’affichage n’était pas terrible du tout sur Windows, et uniquement avec le navigateur Chrome.
J’ai été très surpris qu’Internet Explorer affiche correctement les fontes, mais pas Chrome. Je me suis rendu compte que Chrome ne « forçait » pas le lissage de la police, ce qui donnait un aspect rugueux au rendu.

Comparatif fonte avec Chrome et IE 10

Mais j’ai trouvé une solution en suivant les conseils de Kévin décrits dans son article. Il suffit d’ajouter cette ligne (en adaptant la couleur naturellement) :

-webkit-text-stroke: 0.5px #333;

Chrome sans/avec -webkit-text-stroke

Le rendu est ce qu’il est, mais c’est déjà plus joli et agréable à l’œil.

Lire les PDF dans Firefox sous Mac OS avec PDF.js

Lorsque je suis passé sur Mac, j’ai voulu conservé mon navigateur habituel : Firefox. Mais au fil de mes pérégrinations sur le ouaib, je me suis aperçu que Firefox ne permettait pas de lire les fichiers PDF directement dans le navigateur. Il fallait toujours télécharger le document pour pouvoir le lire.

J’ai cherché s’il existait des solutions, mais rien de très excitant. Adobe[1] ne propose plus son plugin PDF pour navigateurs sur Mac OS. Alors j’ai d’abord essayé PDF Browser Plugin mais ce n’était pas assez convivial et ergonomique à mon goût.

J’ai ensuite testé un plugin intéressant, PDF.js, un lecteur de PDF utilisant les standards web. Et je n’ai pas non plus été convaincu. Le projet était encore en développement, et sortait à peine des cartons.
J’ai alors délaissé Firefox au profit de Safari, pour qui le problème ne se posait pas. Seulement voilà, ce n’est pas Firefox.

Mais c’était sans compter mon envie de savoir si le problème n’avait pas été résolu entre temps… Je suis retombé sur la plupart des même articles qu’il y a une dizaine de mois, notamment sur l’article du support de Mozilla qui propose deux solutions : PDF.js et PDF Browser Plugin.
Mais voilà, la capture d’écran de PDF.js avait bien changé. Je l’ai donc réinstallé, sans grand espoir. Et bien je ne suis pas du tout déçu !

Outre l’interface beaucoup plus agréable et ergonomique, le visionnage est fluide et je n’ai pas encore eu de problème pour lire les PDF, même les formulaires de maths avec de jolies formules…

Bref, je suis conquis, et si comme moi vous voulez de nouveau pouvoir lire les PDF sur Firefox sous Mac OS, je ne peux que vous conseiller très fortement d’utiliser l’excellent plugin PDF.js (appelé aussi PDF Viewer) des Labs de Mozilla !

Notes

[1] Voir l’article du support Mozilla.

Un petit favicon pour son site

Pour ne pas devoir aller chercher quand j’en ai besoin la bonne syntaxe qu’Internet Explorer réussira à comprendre pour afficher un beau favicon, j’ai décidé de prendre les choses en main et de me faire un petit mémo ici.

Pour Internet Explorer (jusqu’à je ne sais pas quelle version), il faut un favicon au format ICO 16×16 — sinon il fera la tête et n’affichera rien — à appeler avec :

<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" /> 

Pour les navigateurs récents, un favicon au format PNG 32×32 fera très bien l’affaire. Il faudra l’appeler avec :

<link rel="icon" type="image/png" href="favicon.png" />

Il est possible d’utiliser d’autres formats (GIF, JPG, …) pour ces navigateurs. Il faut alors penser à modifier le type="image/xxx" correspondant.

Et pour les appareils iOS, j’ai vu que l’on pouvait augmenter encore la taille du favicon, mais bon là je verrais quand j’en aurais vraiment besoin.


Mise à jour de nov. 2014

L’eau a coulé sous les ponts depuis, et voici deux outils qui me sont utiles voire indispensables :

  • convertico.com qui permet de convertir une image au format ICO ;
  • realfavicongenerator.net qui est l’outil ultime pour, à partir d’une image assez grande, générer tous les différents formats et différentes tailles de favicon nécessaires (standard, Microsoft, iOS, …).

Changer le programme par défaut sous Mac

Dernièrement, quand je voulais ouvrir un fichier .css sous Mac, il me l’ouvrait automatiquement avec DashCode. Très gentil, mais je préfère l’ouvrir avec Komodo.

Je faisais donc un clic droit, “Ouvrir avec”, et je cochais la case “Toujours ouvrir avec”. Le problème c’est que cela ne s’appliquait qu’au fichier sélectionné.

Ouvrir avec sous Mac (mauvaise solution)

Mais j’ai (enfin) trouvé la solution :).

Il suffit de faire sur n’importe quel fichier avec l’extension dont vous voulez modifier le programme par défaut

  • cmd + i pour afficher les propriétés,
  • dans la rubrique “Ouvrir avec”, sélectionner le programme avec lequel vous voulez ouvrir ces fichiers par défaut,
  • enfin, cliquer sur “Tout modifier…” pour l’appliquer à l’extension.

Changer de programme par défaut sous Mac (bonne solution)

Voilà, le problème est résolu !

Pour une prochaine refonte graphique

Paint par ArtCriminal sur Flickr.com

Quand j’aurais envie de refaire ou modifier le design, il faut que je pense à remplacer :

  • “billets précédents” par “retourner dans le passé” ;
  • “billets suivants” par “revenir dans le présent” ;
  • “aucun commentaire” par “ajouter son grain de sel”.

Photo : Art Criminal sur Flickr.

De l’art de changer son design

Pots de peinture

Il y a quelques temps, j’ajoutais un nouveau design pour le blog. Il se voulait plus agréable à lire, plus convival, et plus léger. Je me suis inspiré de nombreux sites pour lesquels j’appréciais particulièrement leur design, ou certains éléments de leur design. Entre autres : 5thirtyone dont j’affectionne tout particulièrement la colonne de gauche contenant les informations sur chaque article.

Mais voilà, je me suis rendu compte que le design ressemblait plus à des idées collées les unes aux autres, sans vraiment trop d’harmonie. Et que niveau accessibilité, ce n’était pas terrible non plus. Mettre la sidebar en bas comme le font certains blogs, nécessite plutôt d’afficher au plus un ou deux articles au-dessus.
Et qu’au départ, je voulais un design léger, très simple (j’adore la nudité du blog de Cyril Krylatov). Ce qui n’était plus le cas !

Et puis j’ai découvert la très intéressante initiative de Kozlika et de Franck (c’est Kozlika qui parle) :

Je voudrais réaliser un nouveau thème pour Dotclear. Je voudrais que celui-ci soit suffisamment robuste et présentable pour que nous puissions le joindre à la prochaine version.

[…]

À ces prémisses s’ajouterait l’une de mes marottes : le chantier public en direct, ouvert aux commentaires. Tu connais mon goût pour l’exégèse et je frétille d’avance des discussions à n’en plus finir sur le choix d’une valeur de marge gauche d’une liste à 1.5 ou 1.66em.

Je me suis donc inspiré des premières versions de ce nouveau design (en partiuclier les stickers), et j’ai essayé de ne pas ajouter des fioritures partout, tout comme des illustrations à tout bout de champ.

A la différence des autres thèmes que j’ai pu faire, dans lesquels je reprennais chaque template et je les modifiais à ma sauce, j’ai vraiment limité les modifications sur les fichiers. J’ai fait tout ce que j’ai pu en CSS, et j’ai gardé un certain nombre de comportement par défaut.
J’entends par là les formulations comme : Par Nicolas le lundi 4 mai 2011, 15:09 - Général. Je n’y ai pas touché (même si j’aurais préféré quelque chose comme Le lundi 4 mai 2011 – Général (notez la différence entre les traits « d’union »[1])).

Je n’ai néanmois pas pu résister à modifier ces templates suivants :

  • user_head.html : pour ajouter un favicon et des commentaires conditionnels (c’est toujours un plaisir de prendre en compte les navigateurs obsolètes…),
  • _top.html : pour avoir un haut de page avec description et les stickers,
  • post.html et page.html : j’ai uniquement modifié les commentaires pour afficher les images Gravatar des commentateurs,
  • _footer.html : là je me suis laissé un peu aller, entre les dernières photos de Flickr et mon dernier Tweet,
  • 404.html : pour personnaliser la page d’erreur 404, qui n’est vraiment pas agréable par défault.

J’espère que ce design ne me lassera pas trop vite, et qu’il est autant agréable pour vous que pour moi !

Photo : Frédéric Bisson.

Notes

[1] En réalité le second trait n’est pas un trait d’union, mais un demi-cadratin : – (utilisé notamment pour les énumérations). Seul le - est un trait d’union, qui permet d’accoler deux mots (par exemple : c’est-à-dire). Plus de précisons sur la page Wikipédia.

Un site Internet pour la Bibliothèque de Bezannes

La Bibliothèque de Bezannes vient d’ouvrir son site Internet (en réalité, l’ouverture date du premier septembre).
Il est disponible à cette adresse : bibliothequebezannes.free.fr.

Bibliothèque de Bezannes

Bonne visite !
D’après mes sources, d’autres rubriques sont à venir…