Waker, c’est un site de bêtises trop fréquentes et trop futiles pour être postées ici.
Au départ, c’était un WordPress avec un thème pas trop travaillé, mais j’aimais bien la palette de couleurs. Et puis je me suis rendu compte que poster avec WordPress était trop contraignant, car trop long. Même avec le bookmarklet Press This, poster un simple lien ou une photo prenait trop de temps.
Résultat : je prends un tumblr tout simplement. Le bookmarklet est très efficace : il récupère facilement les photos ou la vidéo de la page où l’on est, et l’upload est direct. Au début, j’ai pris mon thème bbxtumblr, mais il manquait d’identité pour Waker.
Donc, j’en ai fait un autre.
Navigation au clavier
La grande particularité est d’avoir intégré grâce à une lib JavaScript, la navigation au clavier comme pour Google Reader ou FFFFOUND, c’est à dire la touche “J” pour suivant et “K” pour précédent, sachant qu’elle gère aussi la pagination dès que vous arrivez en haut ou en bas de la page.
Et si vous voulez savoir pourquoi ça s’appelle “Waker”, et bien voilà pourquoi.
Même si le HTML 5 est encore un joli bordel, des développeurs s’en donnent à coeur joie pour trouver des fonctionnalités très intéressantes, comme ce Drag & Drop en HTML 5 et JS.
Si vous en avez marre d’attendre que le grand public mette à jour ses navigateurs pour pouvoir utiliser du HTML 5 et du CSS 3, vous pouvez utiliser Modernizr :
Modernizr is a small and simple JavaScript library that helps you take advantage of emerging web technologies (CSS3, HTML 5) while still maintaining a fine level of control over older browsers that may not yet support these new technologies.
Je testerai sans doute à la prochaine refonte du site, c’est à dire prochainement (?).
J’aimais pas trop les lightbox au début, un peu trop “fancy” à mon goût. Certains la critiquaient même exagérément. Bref, que l’on aime ou pas, ça utilise techniquement toujours du JavaScript.
Mais un ninja a réussi à le réaliser sans JavaScript, juste en CSS. Ca utilise la pseudo-classe :target. Et il appelle ça Futurebox.
Ok, ça marche pas sous IE (6,7,8) mais qu’est-ce qu’on s’en fout. Tiens d’ailleurs, gros f*ck à Microsoft pour son discours de merde (IE8 = le meilleur navigateur du monde entier de l’univers) et ses décisions de merde (Outlook 2010 utilisera le moteur de Word pour afficher le HTML).
Je ne connaissais pas cette astuce et j’en avais besoin pour mon tout récent blog 29minparjour.com où je poste beaucoup de code dans des balises <pre>.
Syntaxhighlighter ? Pas une solution pour moi.
Au début, je voulais utiliser le syntaxhighlighter (très connu et très utilisé) mais je n’aimais pas avoir à spécifier à chaque fois dans le html que tel bloc devait être stylé, et dans quel language. De plus, le code à insérer (name=”code”) n’est pas valide…
J’avoue que le rendu est élégant (sauf avec la version 2.0, la dernière en date). D’ailleurs, Viget Labs avait amélioré le JS en permettant d’agrandir la fenêtre au survol. Une belle amélioration.
Malgré tout, c’était au niveau HTML que je trouvais ça laborieux. Je voulais quelque chose de tout simple.
CSS, aide-moi!
Je voulais juste un simple retour à la ligne pour éviter que les balises <pre> ne dépassent en largeur. J’ai trouvé ça sur le site de Tyler Longren :
pre {
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}
Ca fonctionne sous FF 3 et IE6. Le comble étant que le reste du site est un encore un peu cassé sous IE6… (soupir)…
