Archives

Hi! this section is about displaying all the posts published on this site. Yes, like a blog!
Création graphique

Nouvelle proposition de logo pour le HTML-FP

J’ai présenté en novembre dernier deux versions d’un logo qui n’ont pas fait l’unanimité. Pour me rattraper, j’ai remis cent fois l’ouvrage sur le métier (oui, j’en rajoute un peu) pour sortir une troisième version et prendre en compte les remarques et les suggestions. J’ai travaillé vite (une petite heure) pour un résultat qui devrait être plus lisible tout en restant ludique et coloré. Cette proposition existe en deux parfums : une version brute d’Illustrator (vectorielle, lisse, etc.) et une version plus organique travaillée dans Photoshop à coup de filtres Textures et Grains. →

Frameworks Javascript

cssQuery — accédez au DOM

cssQuery — Interroge le DOM via les sélecteurs CSS 1, CSS 2 et une partie de CSS 3. Alternative à jQuery et autres frameworks Javascript pour accéder aux éléments constitutifs du DOM quelque soit le navigateur pour environ 7 KB ! →

Helper CSS

Balance Columns — Équilibrer des colonnes avec Javascript

balance_columns — ce script astucieux et non instrusif vous permettra d’équilibrer des colonnes entre elles (contenu et barre latérale, par exemple). Les identifiants des blocs à équilibrer se placent dans l’en-tête du script et ce dernier se dégrade harmonieusement si Javascript n’est pas activé sur le navigateur.

Applications autonomes

DOMTab — Menu à onglets simple et efficace

DOMTab — Ce script non-intrusif transforme une liste de liens en un système de menu à onglets (plusieurs menus sur une même page possibles). Parmi les plus : la possibilité de faire un lien vers un onglet et la mise en place de liens suivant et précédent pour accéder aux onglets (y compris avec une image). Voir mon comparatif entre DOMTab et idTabs pour en savoir plus.

Helper HTML

FlashReplace — insérer du Flash proprement

FlashReplace — Script très léger pour insérer une animation Flash dans votre page web avec une seul ligne de code :

<script type="text/javascript">// <![CDATA[
    FlashReplace.replace("flash-content", "/flash/my-movie.swf", "flash-element-id", 800, 200);
// ]]></script>

En option : possibilité de préciser la version de Flash requise ou d’ajouter des paramètres à votre animation Flash.

Création graphique

« css 4 design » — Nouvelle charte graphique et redesign du logo

La nouvelle version de css 4 design que j’avais évoqué dans Screenshot de mon prochain design est en ligne. Il reste des ajustements à faire et quelques pétouilles que je corrige au fur et à mesure. Comme vous pouvez le constater la mise en page est sobre avec une palette de couleurs blanche et grise rehaussée de teintes chaudes. Ce thème se situe à mi-chemin entre le format blog et le style magazine dont j’ai beaucoup parlé à une époque. J’ai gardé la succession des billets et la traditionnelle sidebar qui fait tous le charme d’un blog, avec au-dessus, le début d’un article qui se distingue par une illustration généreuse accompagnée de sa légende. →

Plugin jQuery

Infobulles stylées et accessibles avec jQuery

Styled and accessible tooltips — Après Tipsy, ce script permet de remplacer l’infobulle par défaut qui apparait lorsqu’on passe la souris (ou le clavier) sur un élément possédant un attribut title par une infobulle du plus bel effet et accessible, ce qui ne gâche rien. Aucun marquage HTML supplémentaire n’est nécessaire : ce script se charge de tout et enlève le superflu lorsque la souris quitte l’élément en question. Via AccessTech.

Frameworks Javascript

dLite — une librairie Javascript « petit mais costaud »

dLite — Cette bibliothèque propose des fondations pour faciliter vos développements : trouver les éléments avec le même identifiant ou la même classe ; lancer une fonction lorsque le DOM est prêt ; ajouter ou enlever une classe à un élément ; ajouter ou enlever un gestionnaire d’événement (addEvent), etc. Tout ça, pour 4 ko seulement en version compressée, parce qu’il n’y a pas que jQuery dans la vie !