Mac OSX sous Windows
Installer Mac OS X sous windows, c'est possible.
Pour cela vous aurez besoin d'un logiciel de virtualisation, VirtualBox par exemple (version récente).
Ensuite il vous suffit de télécharger l'image ISO de Snow Leopard crackée par la Team Hazard (cherchez "Hazard osx" sur Google).
La suite est assez simple si vous suivez bien le tuto suivant :
- Après avoir créé le disque virtuel, faite "Configuration" > "Système" et décochez "Activer EFI"
- Lancez l'installation
- Quand il vous demande sur quel disque l'installer, normalement vous ne voyez aucun disque disponible. En haut de l'écran allez dans "Utilitaire de disque", choisissez le disque virtuel créé précédemment puis onglet "effacer", donner un nom à la partition puis cliquez "Effacer" (le disque virtuel sera reformaté avec le bon système de fichiers)
- Vous pouvez maintenant choisir d'installer OSX sur le disque virtuel... faites suivant, puis "Options".
Dans les options d'installation, vous devez cocher certaines cases suivant la marque de votre processeur :
Processeur AMD:
Cochez les deux mises à jour Leopard
Dans "Kernels" choisissez le kernel "Legacy"
Cochez les options "AMD System support"
Processeur Intel:
Cochez les deux mises à jour Leopard
Dans "bootloaders" cochez la dernière version du loader "Chameleon"
Dans "Kernels" choisissez le kernel "Legacy"
... Lancez ensuite l'installation, et voila ! Vous avez un Snow Leopard dans une machine virtuelle sous Windows !
Source : http://lifehacker.com/5583650/run-mac-os-x-in-virtualbox-on-windows
PS: Les "Guest additions" n'existent pas encore pour OSX dans VirtualBox, si vous voulez faire fonctionner le son ou avoir une meilleure résolution graphique, reportez vous aux commentaires de l'article source qui explique très bien comment faire.
IxEdit: générateur d’animations interactives
IxEdit est le premier outil permettant de créer des animations interactives en JavaScript : au lieu de mettre la main dans le cambouis, il suffira de remplir des formulaires avec l’effet souhaité. C’est un véritable outil pour les designers qui pourront créer et gérer les animations en quelques clics, dans leur environnement, c’est-à-dire dans leur site Web ou blog.
Faire un StoryBoard web avec Balsamiq Mockups
Je viens de découvrir aujourd'hui un site très sympa qui propose une appli web permettant de créer vos "story board web".
Cette appli est disponible gratuitement online, ou il existe aussi une version desktop (adobe air) pour 79$.
http://www.balsamiq.com/
Pratiquement tous les types de fenêtres, containers, boutons... sont disponible et utilisables pas un simple drag'n'drop.
Le rendu "façon dessin" est très sympa je trouve (L'exemple ci-dessus à été fait en moins de 1 min)
CACTI : Superviser un serveur (graph)

Bonjour (et bonne année),
Au menu aujourd'hui, un petit article sur la supervision d'un serveur dédié (graphiques de CPU, Mémoire, Traffic, Process...) avec CACTI.
NB: CACTI est un soft en PHP et nécessite donc un serveur web installé et configuré avec PHP/Mysql).
Je m'y suis attaché il y a quelques jours sur un serveur Kimsufi d'OVH.
Avant tout, il faut savoir que certain hébergeur (OVH en l'occurrence) installent des patchs sur les noyaux linux.
Verifier donc d'abord la version de votre noyau en lançant un "uname -a" ce qui devrait vous donner un truc du genre "2.6.27.10-grsec-xxxx-grs-ipv4-64".
Si vous voyez "grsec" ... c'est que le patch de sécurité "grSecurity" est installé sur votre noyau... et que certains graphs ne fonctionneront pas normalement (impossible de grapher le trafic réseau et nombre de processus incorrect).
Donc avant tout, faites en sorte de booter sur un noyau sans "grsec" (chez OVH vous pouvez simplement utiliser le netboot sur un noyau sans ce patch).
Vous pouvez maintenant vous lancer en installant CACTI ("apt-get install php5-cli php5-mysql php5-snmp snmp snmpd rrdtool cacti" ou en suivant ce guide).
NB : Reférez vous ensuite à cette page pour configurer correctement l'agent SNMP et CACTI lui même.
Une fois tout cela fait, attendez une dizaine de minutes et vous pourrez commencer à voir vos graphs.
Exemple:

Zen Coding, comment gagner du temps
<div id="container">...<a href="#">...</a><strong>...</strong></div><span>...</span>... etc
Tout développeur de site web s'est déjà forcement arraché les cheveux sur une page HTML constituée d'une suite interminable de balises <XXX>...</XXX> plus ou moins enchevêtrées et en s'efforçant de bien indenter leur code pour ne pas oublier une foutue balise fermante...
Bref, c'est long, chiant et pas très intéressant... mais il faut le faire !
Heureusement, il existe une façon pour un peu moins se prendre la tête (je ne vous parle pas des outils comme Dreamweaver ou autres... que je n'affectionnent pas particulièrement) non !
Je vous parle là simplement d'une autre façon de coder dans votre éditeur préféré : Le Zen Coding !
Ce code par exemple :
<div id="content">
<h1></h1>
<p></p>
</div>
Pourra s'écrire :
div#content>h1+p (un div d'id "content" contenant un h1 et un p)
Il vous suffit simplement d'ajouter l'extention à votre édteur (si elle est dispo... au pire c'est pas trés compliqué à coder) et c'est parti.
Plus d'infos sur ce site.
Zen Coding v0.5 from Sergey Chikuyonok on Vimeo.
Compliez et Partagez vos codes sources, en ligne !
Après le célèbre pastebin.com qui permet de partager un code source rapidement, un nouveau site vient de voir le jour : ideone.com
Ce dernier vous permet comme son compère, de partager votre code, mais aussi (et surtout) de le compiler en ligne !
Les langages supportés sont nombreux : Assembler, Bash, Brainfuck, C, C++, D (dmd), Haskell, Icon, Java, Lua, Nice, Ocaml, Pascal, Perl, PHP, Pike, Python, Ruby, Vala.
Un petit exemple de "brainfuck" ![]()
>++++++++++
[>++++++++>++++++++++>+++++++++++>++++++++++++>++++++++++++>+++>++++++++++>++++++++++>++++++++++>+++++++++++>++++++++++++>+++>+++++++++++>++++++++++>++++++++++>++++++++++++>++++++++++>++++++++++++>+++++++++++>++++++++++++>+++>++++++++++>++++++++++>+++>++++++++++++>++++++++++>++++++++++>+++++++++++>++++++++++++>+++++++++++>++++++++++++>++++++++++>+++++>++++++++++>+++++++++++>+++>+++><<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<-]
>+++>--->-->--->---->++>->++++>+>++++>----->++>-->+>->---->+>--->++++>----->++>>+>++>->+>-->+++>--->+>---->+>---->++>++++>++>+++>
<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.>.
Microsoft SuperPreview
Microsoft vient de lancer ces derniers jours un nouvel outil (gratuit) permettant de comparer un site web sur Internet Explorer version 6, 7 et 8 !

A la différence de IEtester ou MultipleIE, celui-ci est censé afficher le site exactement comme s'il l'était dans la version choisie.
Seul Internet Explorer est supporté pour le moment, mais Firefox et Safari seront ajoutés.
Il devrait être possible d'accéder à des navigateurs par le réseau pour tester d'autres plate-formes (par exemple Mac).
Il est possible de comparer deux versions cote à cote ou même par transparence !
Microsoft SuperPreview est disponible en téléchargement ici.
Edit: Pour le moment il semblerait qu'on ne puisse pas vraiment naviguer via les liens (c'est pas comme si c'était une fonctionnalité primordiale sur un site web
) du coup ça devient un peu lourd de devoir saisir chaque URL une par une ! Le but est donc UNIQUEMENT de comparer l'affichage sur les différentes versions d'IE.
Alias Gmail : savoir reconnaitre les spammeurs
Aujourd'hui au menu : les alias Gmail.
Si comme beaucoup votre boite mail est sur gmail (sinon commencez à y réfléchir... c'est vraiment la meilleure !) il faut savoir que vous avez une infinité d'alias (un autre mail qui pointe dans la même boite).
En effet, lorsque vous vous inscrivez sur un site, on vous demande dans 99% des cas votre mail.
Seulement parfois ces sites collectent et revendent ces adresses mail et vous devenez très vite la cible de spammeurs.
L'astuce que je vous présente ici consiste à utiliser le système d'alias de Gmail pour connaitre le site qui a revendu votre email (ou sur lequel le spammeur à trouvé votre adresse).
Voici l'astuce :
Lorsque vous saisissez votre adresse mail sur un site, il suffit d'ajouter le signe "+" après votre adresse, suivi de n'importe quoi (email+N_IMPORTE_QUOI@gmail.com)
Qui donnerait par exemple si votre mail est "jean@gmail.com" : jean+facebook@gmail.com
Vous recevrez donc tous les mails comme si vous aviez saisi votre adresse mail classique mais vous pourrez (en le suffixant par +nom_du_site) connaitre l'origine du mail (si vous recevez plus tard du spam envoyé à "jean+facebook@gmail.com", vous saurez donc tout de suite d'où ça vient !
NB: En utilisant cette astuce, vous pourrez aussi plus facilement créer des filtres/libellés selon la provenance des mails que vous recevrez.
Générateur de sprites
Qu'est-ce qu'un sprite ?
Un sprite est une image qui en contient plusieurs.
Comme un exemple vaux mieux qu'un long discours, voila une exemple de sprite :
![]()
et un autre

Le premier, comme vous l'aurez remarqué viens de google. C'est en fait l'une des seules images du site !
A quoi ça sert ?
L'intérêt principal des sprites est de minimiser les temps de chargement et d'affichage sur les pages d'un site.
En effet, l'image chargée par le navigateur puis mise en cache peut être utilisée n'importe où dans la page sans qu'il y ai besoin d'en télécharger une nouvelle.
Là où l'effet se fait le plus ressentir est sur les "rollover" (les boutons qui changent d'aspect au survol de la souris, voir 2eme exemple) car l'image qui remplace la première au survol de souris est déjà chargée ! (donc plus besoin de pré-charger les images des rollover comme nous le faisions il y a quelques années en javascript).
Comment ça fonctionne ?
C'est là qu'intervient le CSS.
a.lang {
padding-right: 20px ;
background-repeat: no-repeat ;
background-image: url(drapeaux.png) ;
}
a.lang.fr { background-position: 0px 0px }
a.lang.de { background-position: -20px 0px }
a.lang.it { background-position: -40px 0px }
a.lang.es { background-position: -60px 0px }
a.lang.uk { background-position: -80px 0px }
Ici imaginez un sprite avec des drapeaux de pays... au lieux d'avoir une image par drapeau, vous n'en avez donc qu'une.
Il suffit alors dans le CSS de définir la position de chaque drapeau via "background-position" et le tour est joué.
Comment créer des sprites rapidement ?
Pour vous éviter de faire les sprites à la main, vous pouvez simplement utiliser quelques outils online qui vous allez le constater... sont bien pratique !
spritegen.website-performance.org vous propose un générateur de sprites :
Vous mettez toutes vos images dans un .zip, vous uploadez ce fichier zippé et spritegen vous génére de lui même le sprite en vous donnant même le code CSS avec les positions qui conviennent !
spriteme.org vous propose quant à lui un "plugin" javascript à ajouter à vos favoris qui analyse les images de n'importe quel site sur lequel vous surfez et vous propose de générer des sprites avec ces images.
[MAJ] Des graphs sur votre site

Vous voulez inserer des graphiques sur vorte site mais ça vous semble compliqué au premier abord ?
Et bien non, c'est très simple puisqu'il existe heureusement quelques librairies gratuites qui vont vous les générer automatiquement en leur envoyant simplement les données et quelques paramètres.
Je ne vous présenterai ici que mes 2 préférées :
- highcharts (librairie Javascript produisant du SVG/VML) :
De loin ce que j'ai trouvé de meilleur !
Une seule petite librairie Javascript à inclure, un code simple à écrire.
Particularités intéressantes : Combinaisons de différents graphs, multi-axes, zoomable, chargement en ajax des données pour un rendu "temps réel", conversion des graphs en PNG,PDF et JPG ... presque tout est configurable (même les actions de survol, de clic ...)
Plus d'exemples ici : http://www.highcharts.com/demo/
- FusionCharts (Flash) :
Tous les exemples ici.
La doc ici.
Voila, je vous laisse choisir... (message subliminal : highcharts c'est de la bombe !
)


