CreativeJuiz - Du jus, des fruits, du fun !
Quand veille technologique et veille graphique font bon ménage !

Retina, ou la haute définition de manière plus générale pour les images de nos sites web pose un problème relatif. En effet depuis la sortie du premier Mac Book Pro à écran Retina (et avant pour certain), la question qui revient le plus souvent est : doit-on boycotter Retina, ou au contraire y accorder de l’importance ?

Je viens de tomber sur le cul en suivant une publicité pour IE10 croisée sur ma liste de lecture sur Grooveshark. Microsoft a adapté un jeu en multi-touch (qui fonctionne aussi à la souris, mais c’est vraiment pas jouable) avec un graphisme et un bande son que je trouve magnifiques. Apparemment il existerait depuis au moins Juin 2012, mais j’ai loupé un épisode.

J’ai souvent eu l’occasion à travers mes divers projets Web mobile (responsive), d’avoir à réduire la taille des polices de titre car même un simple mot ne passait pas en largeur. Pour éviter d’avoir une césure sur chaque mot du titre, le plus simple était de s’autoriser une réduction approximative du corps. (approximative… façon de parler). Je vous propose des solutions relative.

Les microdatas apportés par HTML5 sont un nouveau pan des microformats que vous connaissez certainement déjà à travers les schémas réunis sur le site microformats.org. Les microdatas apportent leur lot de nouveautés au niveau des attributs, mais également au niveau des schémas et de leur prise en charge.

Il y a quelques jours de cela je répondais à un petit tweet d’un confrère pour donner une astuce sur la création d’un effet graphique de feuilles superposées en CSS3. Le défi était de ne pas multiplier les éléments HTML pour réaliser cet effet. C’est chose faite. Jetons un œil sur la technique utilisée.

Si vous suivez le compte @NoupeMag sur Twitter (ça marche aussi pour mon compte), vous avez certainement vu passer mon slideshow en CSS3 datant de l’an dernier.
Ce n’était pas ma première tentative de slideshow comme le présentent ces premier et second travaux datant de mai 2010.

Je vous parlais d’une solution pour forcer le téléchargement grâce à un morceau de code dans votre fichier .htaccess dans l’article précédent, alors que je venais juste de découvrir cet attribut HTML5 permettant de faire la même chose en mieux. Pour le moment seul Chrome supporte cet attribut.

HTML5 nous apporte l’attribut translate. Cet attribut permet de limiter l’impact d’une traduction par des outils tels que Google Translate en interdisant la traduction de certains contenus.
Ainsi le contenu de votre site web est composé avec davantage de précision. Voyons comment agir et sur quoi appliquer cet attribut.

Il y a quelques temps déjà, Lea Verou proposait d’utiliser la propriété max-height afin d’effectuer des animations sur un élément sans toucher à la propriété height. Avec une petite adaptation, il est possible de créer un menu déroulant au survol avec un petit délai créé grâce à la propriété CSS 3 transition.

Retour des tutoriels CSS avec quelque chose d’un peu original pour cet article : un effet parallaxe uniquement en CSS3.
C’est à la suite de l’article de Simon Kern sur Alsacréations que m’est venue l’envie de tenter d’utiliser CSS pour reproduire cet effet initialement conçu avec JavaScript.

HTML5 apporte son lot de nouveautés également dans nos bons vieux formulaires. Proposant historiquement un nombre assez limité de types de champs (text, password, file, radio, checkbox, submit, image, hidden, reset,button) et d’éléments de contrôle (<textarea>, <select>, <option> et <optgroup>, <button>), HTML5 vient bousculer nos habitudes en proposant de nouveaux types notamment.

Google affiche un certain nombre d’informations dans ces résultats de recherche. Un aperçu du site, un titre, une description et l’URL référencée est un assemblage assez classique. Des choses peuvent être rajoutées dans l’affichage, dont un système de notation (ou vote). Voyons voir comment procéder.

Manière un peu originale d’aborder les transitions, j’ai lu un article en anglais il n’y a pas longtemps qui proposait d’étudier les transitions sur l’événement hover en CSS.
Par défaut, la transition sur cet événement comme on a l’habitude de l’utiliser nous propose des effets équivalents au «mouseover» comme

Ces dernières semaines, j’ai tenté de trouver de nouvelles méthodes pour faciliter la tâche dans l’intégration de certains éléments précis d’un site Web. Je me suis également essayé a des choses plus poussées, comme le remplacement du JS d’un slideshow par du CSS.

Il existe un certain nombre d’indices lors de l’exploration d’un site qui peuvent aider le hacker à dévoiler des failles de sécurité. Il existe également des choses basiques à mettre en place pour vous prémunir de ces quelques failles.

… je crois…
CSS3 c’est bien, c’est neuf, mais comme c’est nouveau on a envie d’en mettre partout à toutes les sauces.
C’est beau tant d’enthousiasme, je suis comme cela aussi, mais j’essaye d’inviter Modération à la partie quand je le peux.