Une barre de progression en CSS

barre_de_progression_css.jpg

Le webmaster du site CssGloble nous propose un script très intéressant : une barre de progression uniquement en CSS ! Fini le flash ou autre Javascript, cette barre utilise une image animée .gif. Vous pouvez voir la démo par ici

Optimiser son site et améliorer les temps de chargement

Hier, il y a eu quelques ralentissement du serveur (Dreamhost) dont je fais l’éloge dans mes derniers billets. Et donc j’ai décidé de m’attaquer à l’optimisation de Webdesign-tutoriaux. Donc voici tout d’abord les outils que j’ai utilisé :

pingdom.jpg

  • PingDom tool est un outil permettant de mesurer le temps de chargement de chaque éléments d’une page web et ainsi de voir les images ou les Javascripts qui peuvent ralentir.
  • Yslow qui est une extension Firefox pour FireBug et développé par Yahoo. Yslow mesure à peu près la même chose que PingDom mais depuis votre navigateur et en vous donnant des conseils d’optimisation.

En gros pour diminuer le temps de chargement d’une page il faut :

  • Eviter d’avoir trop de requêtes http sachant qu’il y a une requête pour chaque fichier Css et Js à charger.
  • Avoir des images de poids faible (généralement préférer les Gif au Jpeg) le découpage du design joue.
  • Lancer les scripts Javascript à la fin de la page quand c’est possible.

La solution si vous ne souhaitez pas rentrer dans les détails est un script PHP d’aciddrop qui permet en 3 lignes de :

  • Regrouper les fichiers CSS et Js en un seul pour avoir moins de requêtes Http
  • Ajouter des entêtes qui expirent
  • Compresser des composant de la page avec Gzip
  • Minifier (de minify en anglais) les Css, Javascript et html : en gros on supprime les espaces, les tabulations et les retour à la ligne afin que les fichiers soit moins gros et donc moins long à charger

Enjoy !

Freeglobes le nouveau script d’annuaire à la mode

Freeglobes.jpg

 Voici un nouveau script d'annuaire Freeglobes qui est plutôt à la mode en ce moment. Ce script PHP/Mysql est facile à installer et est développé à partir d'une base de dotclear (la célèbre plateforme de blog). Tout l'intérêt ce porte donc sur les plug-in et le gestionnaire de plug-in et de thème qui sont très facile à utiliser et donc permettent de personnalisé facilement son annuaire en fonction de ces besoins. Pour l'instant, je n'ai pas vu de point négatif à cet annuaire open source. Et l'on peut espèrer une multitude de plug-in et de thème par la suite

Vous pouvez voir une démo ici  

Il existe 2 versions :

La version standard freeglobes-rc2.zip

et La version qui permet la migration depuis RewriteYourPhpAnnuaire phpmyannu2freeglobesrc2.zip
Je compte l'utiliser prochainement dans un nouvel annuaire du graphisme Mort de rire

Cryptographp version 1.3

Une nouvelle version de Cryptoghaphp vient de sortir … pour rappel, Cryptoghaphp est un script en PHP générateur de cryptogrammes de sécurité, appelés plus communément "captchas". Il permet d’éviter le spam produit par des robots sur des sites web et est entre autre le système utiliser par Webdesign-tutoriaux.com pour les commentaires de News et de tutoriaux.
Lire la suite »

Site : Mise en place de captchas

Etant depuis peu victime de spam sur les commentaires de mon site smiley, j’ai mis en place un "captchas" à la suite du formulaire de commentaire. Pour rappel un captchas c’est un « test public de Turing complètement automatique ayant pour but de différencier les humains des ordinateurs ».

Pour ce faire j’ai utilisé un petit script PHP tout prêt : Cryptographp 1.2.
(Pour info j’ai mis moins de 30 min à le mettre en place smiley)

A découvrir smiley

Site : Hack des icônes .png

Depuis quelques jours , les icônes que j’avais ajouté au format .png posaient des problèmes de transparence pour le navigateur Internet Explorer de version inférieur à la 7.0 . La cause : tout simplement IE ne gère pas la transparence Alpha sur le .png. Il a donc fallu que j’utilise un Hack que je partage avec vous ;).
Lire la suite »


Close
E-mail It