CSS + IE6 : comportement hover sur tous élements HTML
Internet Explorer 6, version fournie avec Windows XP est LA plaie de tout webmaster. Et quand j'emploie le mot "plaie", je suis même plutôt gentil... Ce navigateur devrait même être banni tellement il ne respecte pas les standards d'affichage et de codage...
Si vous utilisez le comportement :hover sur autre chose qu'une balise de lien (a) avec IE6, ça ne marche tout simplement pas (ou du moins ça bug énormément). Le "hover" permet de définir un comportement lorsque vous survolez l'élément avec la souris.
Sous IE6, pour pouvoir faire du :hover sur autre chose qu'une balise A, vous devez utiliser un "hack".
- Télécharger le fichier csshover3.htc que vous trouverez sur http://www.xs4all.nl/~peterned/csshover.html
- Le copier dans le dossier que vous utilisez pour vos feuilles de style.
- Rajouter dans la partie head de vos fichiers .html le code suivant :
<!--[if IE 6]> <link rel="stylesheet" href="css/ie6.css" /> <![endif]-->
(ce code permet de définir de nouvelles règles spécifiques pour IE6. Ces règles seront définies dans la feuille de style ie6.css)
Dans ie6.css :
body {
behavior: url("csshover3.htc");
}
Maintenant vous pouvez faire un hover avec d'autres balises que le A (exemple des images ou des div).
import CSV : Excel 2007 et PhpMyAdmin
Excel a la fâcheuse tendance d'enregistrer les fichiers .CSV au format ISO-8859-1 (encodage de l'Europe occidental).
Or PhpMyAdmin (outil graphique pour gérer ses bases de données) lui, gère l'import .CSV au format UTF8 (universel). Le résultat est que si vous importez des données comportant des caractères spéciaux ou accentués, le rendu sera catastrophique.
La solution la plus fiable (sans recourir à des convertisseurs externes) est :
- dans Excel, enregistrer le fichier au format CSV (séparateur: point-virgule).
- Ouvrir le fichier dans Notepad.
- Enregistrer le fichier en précisant l'Encodage UTF-8.
- Importer le fichier .csv dans PhpMyadmin.
Les données importées seront au bon format et les caractères accentués apparaîtront sans problème.
Excel 2007 modifier l’auteur dans les nouveaux commentaires
Excel 2007 permet d'insérer des commentaires sur les cellules (clic droit > Insérer un commentaire).
Contrairement à OpenOffice Calc, Excel ajoute automatiquement le nom de l'auteur en début de commentaire. Le nom de l'auteur est le nom d'utilisateur Windows.
On peut modifier ou supprimer le nom affiché directement dans le commentaire.
Il y a également une technique pour modifier le nom de l'auteur affiché pour tous les nouveaux commentaires :
- Cliquez sur le bandeau Office en haut à gauche de la fenêtre Microsoft Excel
- Options Excel (en bas de la nouvelle fenêtre affichée)
- dans le menu Standard > Personnaliser votre copie de Microsoft Office > Nom d'utilisateur
- cliquez sur OK
Une fois la manipulation faite, tous les nouveaux commentaires commenceront par le nom d'utilisateur défini.
MySQL et PHP : problème d’encodage UTF-8 et ISO-8859-1
Lorsqu'on créait des tables Mysql avec PhpMyAdmin (par exemple), elles sont créés par défaut avec l'encodage latin1 (ISO-8859-1).
Même en convertissant manuellement les tables en UTF8, PHP interprète toujours les données de la table au format latin1, ce qui se traduit par des erreurs d'affichage sur les caractères spéciaux.
Le fait que le fichier source PHP ait UTF-8 comme encodage par défaut (paramètre définit dans Dreamweaver) et que le meta http-equiv="Content-Type" est bien défini à text/html; charset=utf-8 n'y changera rien.
La solution :
Après avoir établi la connexion à la base de données, on défini le type d'encodage via la fonction
mysql_set_charset("utf8");
Ce qui donne par exemple :
class dBEx {
private $dbh;
private $encodage:
function connect ($dbuser, $dbpassword, $dbname, $dbhost) {
$this->dbh = @mysql_connect($dbhost, $dbuser, $dbpassword);
$this->encodage = mysql_set_charset("UTF-8");
...
}
...
}
PHP et Apache affichent maintenant les caractères en UTF-8 tels quels dans la table.
Problèmes avec Seven 32 et 64
Je rencontre plusieurs problèmes avec Windows Seven version 32 bits et 64 bits sur mon PC de bureau.
Sur la version 32 bits :
- obligation de forcer l'installation de ma carte Wifi Hercule en mode compatiblité Vista 32bits SP2. Mais ça marche.
- les pilotes de ma carte son M-Audio MDelta 192 sont indisponibles (en beta privé). En forçant l'installation comme la carte Wifi, ça fonctionne mais des bugs persistent comme l'impossibilité de désinstaller les pilotes.
- impossible de faire une évaluation de l'indice de performance Windows (à cause de la carte son M-Audio ?). Le message d'erreur est :
impossible de calculer l'indice de performance Windows pour votre système. Impossible d'effectuer l'évaluation demandée.
Cet ordinateur n'offre pas la prise en charge multimedia requise pour effectuer l'évaluation demandée.
Sur la version 64 bits :
- Pilotes M-Audio MDelta à installer en forçant comme en version 32 bits.
- Impossible d'arrêter Windows (très certainement à cause de la carte son)
- Impossible de mettre l'ordinateur en veille (écran bleu). C'est un bug connu des cartes sons M-Audio qui ne sont pas faites pour ce mode.
- Carte wifi Hercule G non reconnue et impossible de faire du forcing pour les pilotes : poubelle
- ma version de Power DVD ne veut pas s'exécuter (erreur .dll). Poubelle et retour à VLC.
J'attendrais donc avant de faire de Seven mon OS principal.
Et vous, avez-vous des soucis avec votre matériel ?
Windows Seven : le début d’une nouvelle ère ?
Aujourd'hui 22 octobre 2009 est le jour de la sortie officielle de Windows Seven, le digne remplaçant de Windows Vista, fortement boudé par les utilisateurs pour sa lourdeur mais aussi par les entreprises qui préfèraient garder leur parc informatique sous Windows XP. Est-ce que Windows Seven va réussir là où Vista a lamentablement échoué ?
OUI. Windows Seven est LE produit que tout le monde attendait à la sortie de Vista fin janvier 2007. J'ai personnellement testé la version RC (Release Candidate ou Version Admissible avant la sortie finale, le temps de corriger certains bugs) de Windows Seven (j'écris même cet article avec...) et je dois reconnaître que c'est un très bon cru. Nettement plus léger que Vista, mieux organisé, avec des fonctionnalités dignes d'un Mac OS X comme un système de barre de taches complètement revus. La barre des taches n'avait pas évolué depuis Windows 95 (il y a 14 ans tout de même !).
Les programmes "phares" de Windows ont également été complètement refondus, comme la fameuse Calculatrice (qui n'avait subi aucune modification depuis Windows 95).
Es-ce que Seven va révolutionner le monde de l'informatique comme l'avait fait Windows 95 ou plus récemment Windows XP ?
Je ferais un test plus complet en début de semaine prochaine. En attendant voici une capture d'écran de Windows Seven RC (cliquez sur l'image pour l'agrandir).
Pourquoi j’ai banni Deezer au profil de Spotify
Pour écouter de la musique à la demande 100 % gratuite (et surtout 100% légale), la solution idéale était de créer un compte sur Deezer.com. Grâce à ce compte on a accès à une énorme quantité des titres et albums des artistes mais on a également la possibilité de créer des playlists, sans rien installer car directement accessible via un simple navigateur web. Deezer a également une énorme partie communautaire qui vous permet de partager vos playlists avec des amis, de suivre leurs goûts musicaux, leurs favoris et réciproquement.
Deezer est aujourd'hui très médiatisé car leader dans l'offre gratuite de musique à la demande.
Or Deezer, qui est un formidable portail très complet est loin d'être parfait.
Voici les inconvénients de Deezer :
- La nouvelle version (v3) est lourde. TRES lourde. La faute à du contenu 100% adobe flash qui nécessite une bonne configuration et fait grimper de manière hallucinante l'utilisation de la mémoire vive (heureusement Firefox 3.5 a amélioré sa gestion de la mémoire mais c'est toujours pas ça pour Deezer). Le processeur est également très sollicité. Il arrive fréquemment que le navigateur plante tout simplement.
- Les pubs en flash participent à ce gaspillage de ressources systèmes.
- L'indisponibilité. Il arrive fréquemment que les résultats de recherche, les playlists ou les titres ne se chargent pas de suite. On peut attendre quelques dizaines de secondes voir une éternité et les rafraichissements de la page n'y changeront rien. Si vous voulez écouter une musique dans l'urgence (quel l'intérêt de la musique en direct si elle est différée ?), un bon conseil ressortez vos CD audio du placard.
- Des titres « bannis » de vos playlists. Pour des raisons diverses mais principalement car les majors changent d'avis, de nombreux artistes retirent leurs compositions de Deezer, ce qui se traduira par des titres « grisés » dans vos playlists et par le fait que vous ne pourrez plus les écouter. Ce système de rectification existe chez toutes les plateformes de musique à la demande (dont Spotify) mais j'ai remarqué que cela se produisait de plus en plus sur Deezer. Clairement : c'est chiant d'avoir passer des heures à construire le contenu de ses playlists pour au final les voir à moitié détruites et inutilisables. C'est à se demander si les majors ne font pas exprès de proposer leurs artistes sur Deezer pour au final tous les retirer dans le but que les auditeurs accrocs passent à la caisse. Attitude totalement scandaleuse mais de la part des majors on s'attend à tout.
- La qualité d'encodage. Deezer propose du streaming MP3 à un taux moyen de 128 Kbps, ce qui est vraiment peu comparé à un CD original ou à un MP3 « correct » (256 Kbps minimum). A mes débuts sur Deezer, il m'est même arrivé de tomber sur des titres très mal encodés (64 Kbps) mais je ne sais pas si Deezer a réencodé ces fichiers.
Deezer est gratuit donc il ne faut pas non plus trop taper dessus. Mais j'ai constaté que de plus en plus de gens se tournaient vers Spotify, une application légère disponible sur Mac OS, Windows et Linux (via Wine). J'ai décidé de tester Spotify par curiosité.
... et Dieu inventa Spotify
Spotify est disponible soit en version gratuite (seulement sur invitation) soit en version payante (day pass à 0.99 € / jour ou Premium 9.99 € / mois). Pour créer un compte gratuit sans invitation il suffit de se rendre sur https://www.spotify.com/fr/get-started/ (Merci Bruno :^).
L'application est légère (2.68 Mo seulement). L'interface ressemble énormément à celle d'Itunes (faut aimer). Et première constatation : ça va vite. Contrairement à Deezer, taper le nom d'un artiste ou d'un morceau dans l'outil de recherche ne prend pas des dizaines de secondes. Les résultats s'affichent quasiment immédiatement ! Une fois lancée, on voit très rapidement les avantages de Spotify par rapport à Deezer :
- la qualité du son. Bluffante tout simplement ! Au casque ou avec une bonne paire d'enceintes on ne fait pas la différence avec un CD original. Spotify a décidé d'encoder ses fichiers au format OGG avec un débit de 160 Kbps. Un vrai plaisir aux oreilles.
- La légèreté du logiciel. Contrairement à l'interface lourde en Flash de Deezer, le logiciel est très léger, quasiment invisible aux yeux de votre CPU (1% d'utilisation sur un vieux Double Core) et votre RAM (19 Mo contre 250 Mo pour Deezer).
- Un catalogue étoffé. On trouve certains artistes sur Deezer et non sur Spotify mais en général le catalogue est gigantesque : de Fernandel à Miley Cyrus en passant par de la musique classique à du gros metal (Trust, Slayer, Pantera Cannibal Corpse, etc.) mais aussi des artistes peu connus en France mais qui cartonnent dans les autres pays comme la Turquie ou en Suède (pays d'origine de Spotify). Et le catalogue grossit de jour en jour (voir l'évolution sur le blog de Spotify)
- La fluidité et rapidité d'écoute. Contrairement à Deezer on attend plus pour écouter les titres. C'est instantané. Les morceaux ne sont plus coupés par les effets « en attente de chargement » ou les attentes interminables « streaming... 10, 20, 35, 60, 70, 80, 85, 88, 92, 94, 95, 96, 100% ». Quel plaisir d'écouter un album sans aucune coupure ! Et si jamais vous avez une connexion vraiment pourrie, il est même possible dans la version Premium de bénéficier d'une copie locale des fichiers (plus besoin d'être connecté pour écouter vos titres, tout se passera sur votre poste). Cette rapidité d'écoute est dûe au fait que Spotify fonctionne en partie en P2P (les fichiers sont installés chez les utilisateurs qui s'envoient réciproquement ceux dont ils ont besoin).
- L'interface de Spotify à la Itunes. Vu la part de marché des Ipod chez les audiophiles, les utilisateurs seront ravis d'avoir la même interface qu'Itunes, le logiciel nécessaire pour transférer ses morceaux sur Ipod. Le design est sobre mais efficace et contrairement à Deezer, on ne doit pas regarder dans tous les sens pour chercher des informations. Tout est très clair.
- L'accès rapide aux nouveautés et au « TOP 50 » des morceaux, des albums et des artistes du moment.
- Le partage d'URL. Sympa de pouvoir envoyer ses playlists du moment via MSN, Facebook ou Twitter.
- Disponible sur Mobile. Dans la version Premium il est possible d'utiliser Spotify sur les mobiles Iphone, Androïd et bientôt Symbian. Il est donc possible d'écouter ses titres en 3G ou en local (mode « hors connexion ») dans les transports en commun.
- Qualité maximale en premium. En accès payant, la qualité sonore est identique à un CD audio.
Les points à améliorer :
- en version gratuite, les publicités sont sous forme de bannières discrètes mais aussi sous forme audio (jingle publicitaire toutes les 15 minutes environ). Cela est chiant pour la majorité des gens, moi je ne trouve pas (ce que je trouve chiant c'est de se farcir 25 minutes d'affilé de pubs par heure en écoutant la radio). Heureusement en version payante, il y a aucune publicité.
- Social 2.0 : Deezer permet de suivre les goûts de ses amis en temps réel, de laisser son avis sur une chanson, un artiste ou une playlist. Ce côté réseau social manque cruellement à Spotify (en même temps c'est surtout pour écouter de la zik).
Améliorer la présentation de son wiki Mediawiki avec des CSS
Les thèmes fournis avec Mediawiki sont plutôt pauvres et ressemblent à l'interface de Wikipedia. Sans rentrer dans la création d'un thème complet pour Mediawiki (je m'en fou de l'aspect global, c'est qu'un wiki local que j'ai installé et dont je suis le seul à consulter), j'ai quand même envie de rajouter des fonctionnalité d'affichage. Par exemple pour des paragraphes importants, j'aime qu'ils soient mise en valeur.
En tenant compte des possibilités de CSS, le code HTML directement à insérer dans une page wiki doit ressembler à ceci :
<p class="important">
<strong>NOTE</strong> : Pour garder une compatibilité avec la version 4 de PHP, il est possible de déclarer l'attribut avec le mot-clé
var, qui est équivalent au nouveau mot-clé public. L'utilisation de la syntaxe PHP 4 provoquera une erreur de niveau E_STRICT
pour avertissement.
</p>
Pour afficher de manière très visibles ce paragraphe avec le style "important", il faut que Mediawiki en tienne compte. Pour cela on doit insérer le contenu de la feuille de style directement dans la page du Wiki à l'adresse /MediaWiki:Common.css. Ainsi mon fichier /MediaWiki:Common.css ressemble à ceci :
/* Le CSS placé ici sera appliqué à tous les habillages. */
.important {
border: 2px solid black;
background: #F60;
color: white;
padding: 20px;
font-size: 110%;
}
Mon WAMP maison
En attendant de tester un système WAMP tout-en-un récent (type WAMPServer ou EasyPHP), je bidouille pour ma propre installation du trio "Apache / MySQL / PHP" sous Windows XP/Vista (dans le cadre de l'étape de developpement, pas en cas de serveur de prod, je suis pas inconscient non plus :^)
La raison pourquoi je n'utilise pas de système WAMP tout-en-un est que leur interface personnalisée me gonfle assez. Même si je dois reconnaître que WAMPServer a des qualités indéniables comme le fait de pouvoir installer et utiliser plusieurs versions d'Apache / Php et MySQL : très pratique si on héberge ses sites chez les serveurs de plusieurs prestataires qui utilisent des versions de MySQL différentes (4.1, 5.0, 5.1).
Je ne vais pas détailler l'étape d'installation (dont je traiterais plus tard) d'un serveur WAMP. Cet article est plutôt utilisé comme mémo personnel :
Après avoir installé et configuré Apache, MySQL et PHP dans les répertoires respectifs V:\Webmaster\Apache, V:\Webmaster\MySQL et V:\Webmaster\PHP, je peux changer de machine ou réinstaller Windows, je n'ai pas à réinstaller à chaque fois ces serveurs. Je fais juste ceci (en tant qu'administrateur) :
- Copier mon php.ini (situé dans V:\Webmaster\PHP) dans C:\Windows
- Copier libmcrypt.dll, libmysql.dll et libmhash.dll (situés dans V:\Webmaster\PHP) dans C:\Windows\System32. Ces extensions me sont utiles pour PhpMyAdmin.
- Copier mon fichier hosts personnalisé qui tient compte de tous mes hôtes virtuels Apache (vhosts) (que j'ai placé dans V:\Webmaster\ADMIN\A INSTALLER\C-Windows-System32-drivers-etc pour ne jamais l'oublier) vers C:\Windows\System32\drivers\etc.
- Ensuite j'installe Apache en tant que service : dans une ligne de commande :
>v:\Webmaster\Apache\bin\httpd -k install
Installing the Apache2.2 service
The Apache2.2 service is successfully installed. - Ensuite j'installe le service MySQL :
>v:\Webmaster\MySQL\bin\mysqld --install
Service successfully installed. - Pour PHP, il n'y a rien à faire, puisque la configuration d'Apache (le httpd.conf) tiens compte de l'extension PHP. Dans V:\Webmaster\Apache\conf\httpd.conf :
PHPIniDir "V:\Webmaster\PHP\"
LoadModule php5_module "V:\Webmaster\PHP\php5apache2_2.dll" - Ensuite je démarre les services Apache et MySQL en ligne de commande :
>net start apache2.2 && net start mysql
Le service Apache2.2 démarre.
Le service Apache2.2 a démarré.
Le service MySQL démarre.
Le service MySQL a démarré.
Certes, c'est une bidouille plus complexe que l'installation d'un EasyPHP ou WAMPServer, mais je n'ai pas besoin de tout ce côté "pris par la main / facilité" d'un tout-en-un. Je ne sais pas si les tout-en-un se sont améliorés mais je garde un mauvais souvenirs de EasyPHP qui par défaut permettait à n'importe qui d'accéder à l'interface d'administration (et de l'ensemble des dossiers des projets web, vhosts, etc..) directement via http://votre_adresse_ip/. Au moins avec ma solution tirée par les cheveux je reste maître des accès.
Et hop mes sites locaux parfaitement accessibles :
Note pour plus tard : Faire un script batch qui ferait tout ceci de manière automatique.
Comment empêcher <pre> de faire dépasser le texte de la page ?
En HTML, la balise pre dit "pré formatée" permet de conserver la mise en page d'un texte sans aucune interprétation. C'est très utile pour conserver les espaces ou les caractères spéciaux normalement interpretés par HTML (comme < ou >). Mais cette balise a un gros défaut, c'est que si la ligne est très longue, elle va dépasser de la page.
Recommandée dans la rédaction d'articles de wiki de leur intranet, beaucoup d'employés recourent à la balise pre pour un peu tout et n'importe quoi. Puis lorsque les employés impriment certaines documentations, le texte est tronqué. Pas très sérieux tout ça...
La solution est de recourir à un ajout de code CSS, directement dans le fichier main.css stocké dans le répertoire du thème utilisé par MediaWiki (par défaut /skins/monobook). Ce hack permet les retours à la ligne automatiques :
pre {
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap !important; /* 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+ */
}
(hack pris sur labnol.blogspot.com)