Convertir les nombres en prix avec PHP
Il arrive parfois que les nombres d’une base de donnée ou d’un fichier ne soit pas formattés correctement pour être affichés comme prix dans un site web. Soit qu’il manque les décimales, ou parfois le nombre est difficile à lire sans espace entre les milliers et les centaines. PHP contient une fonction pratique qui nous permets de formatter et afficher correctement ces nombres pour une lecture plus facile. La fonction est number_format().
Dans mon cas, je devais afficher des prix avec des décimales même lorsque le nombre était rond, c’est-à-dire, sans décimales, comme suit: 54 alors que je voulais 54.00. J’ai pu forcer l’affichage des décimales avec la fonction suivante:
number_format($prix, 2, '.', ' ')
Le chiffre 2 indique le nombre de décimales voulues, le point qui suit est le symbol de séparation voulu, et l’espace entre guillement qui suit indique le format voulu pour séparer les chiffres en milliers des chiffres en centaines, une façon courante dans le monde francophone de faciliter la lecture du prix. Le monde anglophone a plus l’habitude de séparer le nombre avec des virgules.
La ligne de code finale ressemblait à quelque chose comme ça:
echo number_format($prix, 2, '.', ' ') . "$";
Ce qui convertit, pour prendre notre exemple, 54 en 54.00$.
Pour plus de détails, voir: number_format - Formate un nombre pour l’affichage [php.net]
Comment créer automatiquement des thumbnails avec Photoshop CS2 et Save for web
Une fonctionalité couramment requise dans le métier de webmaster est de créer automatiquement une grande quantité de thumbnails (petites images minitiatures, au imagettes) à partir d’une large collection d’images sources, de grosse dimension, dans le but de composer une page de type gallerie d’images. On cherche à obtenir une taille minimale de fichier tout en gardant une certaine qualité d’image, et ces thumbnails doivent garder leurs proportions afin de ne pas subir de distortion d’image.
Ce procédé est généralement long et lassant si on doit le faire manuellement, donc voyons comment automatiser tout ça avec Photoshop CS2 dans le tutoriel suivant. Ma version est en anglais, donc pardonnez les instructions qui font appel à des termes anglophones, mais j’essaierai de traduire le terme correspondant en français:
La premiere étape est de créer une action, l’outil dans photoshop pour automatiser des tâches. Pour programmer cette action, ouvrons une image dans le dossier d’images sources. Il est important de ne pas commencer à enregistrer l’action à ce stade parce qu’on établira le dossier source par la suite. Pour être sur de ne pas effacer ou enregistrer nos nouveaux thumbnails par dessus l’image originale, on va aussi créer un nouveau dossier dans Windows, appelé “thumbnails”, à l’endroit qui vous est le plus pratique, au choix. Il est aussi conseillé de faire une copie de votre dossier d’images sources au cas où il y aurait quelques pépins.
Une fois l’image ouverte dans photoshop, commençons à enregistrer nos actions futures. Dans le menu principal du haut, sélectionner Window (Fenêtre) et assurez-vous que le menu Actions est bel et bien affiché. Le menu Actions contient déjà plusieurs actions pré-enregistrées par défaut, mais nous allons créer les nôtres, donc il est conseillé de se créer un dossier propre. Cliquez sur la petite icône Dossier et nommez le comme bon vous sembles (”personel” serait un bon choix).
Sélectionnez le dossier, pour être certain que notre nouvelle action sera enregistré à l’intérieur, et créez une nouvelle action en cliquant sur l’icône de Nouvelle Action. Une fois nommée (disons, pour être original, “thumbnails”), Photoshop se mets automatiquement en mode d’enregistrement d’action lorsque que vous cliquez “Enregistrer”. Si ce n’est pas le cas, cliquez sur l’icône en forme de cercle au bas de la fenêtre d’Actions.
![]()
Notre premiere action sera de donner une largeur réduite fixe (ou hauteur, à votre guise) à notre image. Donc dans le menu du haut, choisir Image, et Image size (Taille de l’Image), assurez-vous que la résolution est à 72 (standard pour le web) et inscrivez, disons, 100 pixels pour la largeur. Si toutes vos images sources sont de la même taille, vous pouvez aussi déterminer la hauteur, mais cela est rarement le cas, alors pour garder les proportions, il faut se limiter à déterminer seulement une dimension. Une fois réduite, les images ont tendances à être floue, donc on va accentuer le détail avec le Filter Sharpen, situé dans le menu du haut, Filter | Sharpen | Sharpen (Filtre | Renforcement | Renforcement). Notre image est maintenant plus détaillée.
![]()
Afin d’obtenir une sauvegarde optimale pour le web avec Photoshop, il faut absolument employer leur mode de sauvegarde spéciale “Save for Web” (Enregistrer pour le Web…). Leur type de sauvegarde normale dans File | Save as… (Fichier | Enregistrer sous…) n’est pas recommendée comme elle garde une grande quantité d’information de travail dans l’image qui est inutile pour une page web, et la réduction de la taille du fichier ne sera pas optimale.
Pour ce faire, choisir le menu File | Save for Web… (Fichier | Enregistrer pour le Web…) Une fois dans ce menu de sauvegarde, choisissez le format JPG (format requis pour ce type de fichier), avec une résolution optimale en terme de taille, donc Medium ou High (Moyen ou Haut). On veut que la page gallerie s’affiche rapidement pour les utilisateurs, ce qui est le but original, et avec une grande sélection, la différence entre 2-3 Ko ou 10-20 Ko par image se fait vraiment sentir. Sauvegardez l’image dans le nouveau dossier “thumbnails”, et fermez la nouvelle image ouverte dans photoshop, sans sauvegarder cette version, parce que nous allons contrôler cette étape par la suite. Cliquez sur l’icône Stop (Arrêter) carré de la fenêtre d’Actions. Voilà, cette étape est terminée! Votre action est maintenant sauvegardée pour toutes utilisations futures!
![]()
L’étape finale va permettre d’utiliser cette série d’actions automatiques pour une large quantité de fichiers. Allons dans le menu du haut File | Automate | Batch (Fichier | Automatisation | Traitement par lots). Sélectionnez la nouvelle action dans le menu déroulant du haut, si ce n’est fait automatiquement. Choisissez le dossier source de vos images originales, et le dossier de destination pour vos thumbnails. Comme nous n’avons pas enregistré l’ouverture de fichier en particulier et nous avons fermé l’image modifiée et utilisé le mode de sauvegarde “Save for web…” (Enregistrer pour le Web…), nous sommes libres de déterminer ces actions avec ce menu d’automatisation. Dans le cas contraire ou la sauvegarde ou l’ouverture est enregistrée, il n’est pas possible de faire appel à “Save for web…”, une fonction cruciale pour des thumbnails de taille très réduite.
![]()
Cliquez OK et laisser Photoshop travailler pour vous! Après avoir observé Photoshop passer à travers toutes vos images, tous les nouveaux fichiers thumbnails devraient se trouver dans votre nouveau dossier, prêt à être inclus dans votre page gallerie.
Si vous avez besoin de renommer tout un groupe de fichiers automatiquement (par exemple, pour leur donner une extension de type “_thumbs.jpg”), je conseille le logiciel gratuit File Renamer Basic.
Les conditions d’utilisations des vidéos Youtube et Google Adsense
Google a récemment clarifié sa position par rapport aux vidéos de type youtube qui peuvent être intégrés dans un blog ou un site web, ce qui peux être une mauvaise nouvelle pour les webmasters qui se spécialisaient exclusivement dans se type de contenu, et qui, avouons-le, ont surement fait assez d’argent depuis, et ce, assez facilement.
Leur politique originale était contre la diffusion de vidéos, qui sont protégés par les droits d’auteurs, avec leurs publicités Adsense, mais ils n’appliquaient pas vraiment ce principe contre les utilisateurs. C’est présentement chose du passé. Les conditions d’utilisation de Youtube sont maintenant claires, un webmaster ne peut plus construire un site web autour de la simple exploitation de ces vidéos.
Dans quelles mesures puis-je utiliser le site YouTube à des fins commerciales ?
Nous avons récemment mis à jour nos conditions d’utilisation pour clarifier l’utilisation qui pouvait être faite du site Web et du lecteur intégrable YouTube. Notre but n’est pas de vous empêcher de mettre occasionnellement dans votre blog une vidéo YouTube qui vous fait réagir ou que vous souhaitez partager. Ce, même si votre blog contient de la publicité. Toutefois, nous souhaitons que nos conditions d’utilisation s’appliquent, par exemple, à un site Web qui ne contiendrait que des vidéos YouTube et créé uniquement pour générer des recettes publicitaires.
Comme on peut le voir, il ne suffit plus d’amasser un paquet de vidéos et d’exploiter ceux-ci pour rentabiliser un site, ce que je pense être assez sensé. Google Adsense permets quand même l’intégration de leurs vidéos si ils ne sont pas le thème principal du site, comme dans le cas, par exemple, d’ajout de matériel multimedia à un article qui contient Adsense, mais avec quelques conditions:
Also, keep in mind that publishers may not place AdSense ads on pages involved in the unauthorized distribution of copyrighted materials. Unauthorized copyrighted materials include music, movies, images, or any other copyrighted material that the publisher does not own or license from the copyright owner.
Dans le cas ou une page contient de la publicité, il faut rester vigilant et ne pas intégrer de vidéos dont vous n’avez pas la permission des droits d’auteur. Les vidéos amateurs ou créés pour la diffusion sur youtube sont acceptés, mais pas ceux qui enfreint les droits d’auteurs d’une personne ou compagnie qui n’a pas donné sa permission à youtube, comme c’est souvent le cas pour un bout de film ou une émission de télévision qu’ils n’ont pas encore retiré.
En conclusion, il n’est plus possible de créer des sites vidéos youtube en conjonction avec Adsense, mais on peut intégrer les vidéos youtube pour enrichir une page existante qui contient Adsense si les droits d’auteurs le permettent et la nature du site n’est pas exclusivement la diffusion de vidéos youtube.
Convertir les caractères non standards de Microsoft Word en ASCII
Sur plusieurs de mes sites web dont la programmation est personelle (sans utilisation de logiciel blogue ou système de gestion de contenu), les visiteurs peuvent laisser un commentaire sur un article. L’encodage de caractère des pages de ces sites (charset) est généralement du type iso-8859-1 en XHTML, comme suit:
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
Contrairement à l’encodage UTF-8, il ne permets pas l’utilisation directe de plusieurs caractères qu’on retrouve dans Microsoft Word et le problème est que certains visiteurs vont écrire leurs commentaires dans Word et copier/coller ça dans la boîte texte pour poster, ce qui crée des pages non standards en XHTML 1.0.
Après pas mal de recherche, j’ai finalement réussi à écrire une petite fonction PHP pour convertir les caractères bizarres de Word en caractère ASCII standard, inspiré par un commentaire sur la fonction get_html_translation_table dans la documentation PHP.
Le code est le suivant:
1 2 3 4 5 | function msword_text_to_ascii($str){ $str = str_replace(array("\x82", "\x84", "\x85", "\x91", "\x92", "\x93", "\x94", "\x95", "\x96", "\x97", "\xBB", "\xAB", "\xB4", "\x60"), array("\"", "\"", "...", "'", "'", "\"", "\"", "*", "-", "--", "\"", "\"", "\'", "\'"), $str); return $str; } |
Pour ajouter d’autres caractères ASCII étendu ANSI, référez-vous à ANSI character set and equivalent Unicode and HTML characters [en].
Le suivi des clics vers les liens externes avec Google Analytics
Google Analytics est un outil spectaculaire d’analyse de traffic, facile à installer, gratuit, qui mérite d’être utilisé par les webmasters de tout niveau, débutant comme expert, pour mieux comprendre toute la dynamique du traffic de son site.
Un beau cadeau de Google qui est toujours affamé d’information pour tout ce qui a trait au web. Il offre, en fait, tellement de possibilités, que peu de webmasters l’emploient vraiment en profondeur. Voyons une de ces fonctions qui sont souvent ignorées mais qui méritent pleinement d’être exploitée.
Le suivi des clics vers les liens externes (ou sortants): Cette fonction est un peu cachée et difficile à trouver à moins de fouiller dans la documentation de Google Analytics.
Il peut être important pour certains de voir combien de visiteurs cliquent sur certains liens extérieurs d’un site, comme dans une page de liens favoris vers d’autres sites, par exemple, avec qui vous faites des échanges de liens. Il est parfois important de savoir si vous envoyez beaucoup plus de traffic vers un site partenaire que celui-ci vers le vôtre, question d’ajuster l’importance que vous lui accordez.
Afin de suivre ces clics, il suffit en fait d’ajouter un morceau de code javascript à l’intérieur de la balise de votre lien qui fait appel à Google Analytics, comme suit:
onclick="javascript:urchinTracker('/sortant/nom-du-site-externe');"Ce qui devrait donner quelque chose comme ça:
<a href="http://www.example.com/"
onclick="javascript:urchinTracker('/sortant/example');">Lien Externe vers Example.com</a>La partie “/sortant/” indique la nature du suivi de la page, c’est-à-dire que c’est une page sortante, ne faisant pas partie de votre site. Vous pouvez en fait utiliser n’importe quel autre terme, pourvu que ça soit le même pour tous les autres liens. Ça pourrait être “/exterieur/”, “/externe/” ou “/outgoing/” en anglais. La partie “nom-du-site-externe” est évidemment le nom du site externe, si c’est ce blogue, il se nommerait “coinduwebmaster”.
Ensuite, lorsque vous êtes intéressé à analyser le traffic vers vos liens externes pour le mois actuel, par exemple, il vous suffit d’aller dans la section de traffic par contenu et pages et de faire une recherche pour le mot-clé des liens sortants, en ce cas, “sortant”, et Google Analytics affichera ensuite le nombre de clics pour chaque liens.
Note: Bien que mon utilisation personelle du suivi des liens a, jusqu’à maintenant, surtout été faite pour les liens sortants, ce procédé peut être aussi employé pour le suivi de fichiers sur votre site qui ne sont pas traditionellement enregistrés par Google Analytics, tel que le visionnement d’images, de fichiers PDF, MS Word, ou le téléchargement de fichiers Zip ou Exe.
Comment choisir le lien interne vers la page d’accueil
Je vois souvent des sites dont le lien vers la page d’accueil apparaît comme suit:
http://www.example.com/index.html ou ../index.html ou /index.html
Cette façon de pointer vers le fichier au lieu de la racine peut causer une dilution de Google PageRank qui sera partagé entre le fichier pointé par la structure interne et l’addresse des liens externes pointées par les autres sites web, qui est généralement comme suit:
http://www.example.com/
Pour s’assurer de maximiser notre Google PR vers une seule page, il est préférable de toujours pointer le lien vers la page d’accueil à la même addresse que les liens externes, c’est-à-dire:
http://www.example.com/ ou / (option préférable)
De cette façon, les liens externes seront unifiés vers la même page, plutôt qu’entre deux pages comme suit:
http://www.example.com/ ou http://www.example.com/index.html
Je sais que cette façon de faire n’est pas complètement intuitive pour les premiers venus, et que ça peut même être un certain inconvénient lors de la conception et la gestion quotidienne du site parce qu’un lien absolu de ce type n’est pas toujours reconnu par les éditeurs HTML lorsqu’on utilise les menus des pages dans cet éditeur pour naviguer parmi les autres pages, et l’éditeur nous informera qu’il n’y a pas de page à l’adresse “/”, ou pire, il essaiera d’ouvrir le site en-ligne au lieu de la page locale.
Heureusement, les éditeurs modernes tels que Dreamweaver peuvent par contre être configurés pour considérer la racine du site de façon absolue lorsqu’on clique sur un lien d’une page.
C’est un petit sacrifice, toutefois, qui est entièrement compensé par un meilleur positionnement du site avec Google, et possiblement, les autres moteurs de recherche. Si votre site est une boutique en-ligne, un site orienté vers le commerce électronique, ou s’il est rentabilisé par des programmes publicitiaires comme Adsense, le choix n’est pas bien difficile entre un petit inconvénient de gestion et un meilleur positionnement beaucoup plus rentable.
Installer diverses versions d’Internet Explorer sur Windows
On le sait bien, Microsoft n’a pas l’habitude de rendre la vie facile aux dévelopeurs web en intégrant leur navigateur web au système d’opération, ne permettant pas d’avoir plusieurs versions du navigateur populaire sur un seul ordinateur et de pouvoir tester un site web sur différentes versions. Il y encore un certain temps, il fallait bien s’assurer qu’un site soit compatible sous Internet Explorer 5.0 et 5.5, deux versions vraiment vieillotes qui nous ont donnés bien des maux de têtes. Après la sortie d’Internet Explorer 7.0, la grande majorité des visiteurs utilisent maintenant la version 6.0 ou le plus récent 7.0, et, avec à peine 1% des visiteurs (selon mes propres statistiques), on peut enfin reléguer la génération 5.0+ aux oubliettes et s’épargner des moments de haute pression sanguine.
Donc, comment faire maintenant pour tout de même tester un site avec la version 6.0 et 7.0? Après avoir mis à jour votre système avec la version 7.0, le site evolt.org nous offre la gamme des navigateurs 4.0, 5.0, 5.5 et 6.0 à télécharger en version Stand Alone Installation. Il suffit de télécharger une version et de cliquer directement sur l’application pour l’utiliser, bien qu’il semble que ça ne marche pas nécessairement sans quelques pépins ici et là (on peut bien vivre avec comme ils ne sont nécessaires que pendant une session de testage).
Un autres site, tredosoft.com, nous offre quelque chose de similaire avec un seul fichier d’installation qui inclut même la version 3.0, bien que personellement, je ne vois pas tout à fait l’intérêt, les puristes vont peut-être apprécier.
Le préfixe www. dans l’addressage de votre site et redirection 301
Un point important considérant le positionnement avec Google, et qui sera surement un critère de considération avec les autres moteurs de recherche dans un futur proche, est d’éviter les adresses URL doubles qui mènent vers la même page. En premier lieu, parce que Google déteste les contenus doubles et risque de décider par lui-même quelle page sera considérée l’originale, et quelle page est une copie conforme à ne pas considérer (elle sera mise dans leur liste purgatoire, les “Supplemental Results”, ou “Résultats Supplémentaux”), ce qui n’est pas toujours dans votre intérêt. Ensuite, les adresses URL doubles peuvent diluer la distribution de Google Pagerank auprès de vos pages importantes.
Une source importante de gaspillage de PageRank et de création de URL doubles est la présence, ou l’absence, du préfixe www. vers vos pages. Par exemple:
http://www.example.com http://example.com
En permettant l’utilisation de ces deux modes d’adressage, vous risquez aussi de diluer la valeur PageRank provenant des liens externes, comme certains vont employer le 1er format et d’autres vont employer le 2ème format en pointant vers votre site. Vous pourriez vous retrouver avec un PageRank divisé en deux pour votre page d’accueil, au lieu d’une seule valeur forte. Par exemple:
http://www.example.com -> Google Page Rank 5 http://example.com -> Google Page Rank 3
au lieu de:
http://www.example.com -> Google Page Rank 6
La façon de remédier à ce problème est de forcer un format ou l’autre avec une Redirection 301 dans votre fichier .htaccess (sous l’environnement Apache). En choisissant un seul mode, vous offrez une seule façon de copier et coller les adresses des pages de votre site à ceux qui vont faire un lien externe vers celles-ci, et en même temps, vous redirrigez les URL incorrect vers le format préféré, évitant ainsi la dilution de Google PageRank. Voici comment faire:
Si ce n’est déjà fait, créez un fichier .htaccess et sauvegardez-le dans le root de votre site (dossier /). à l’intérieur, copiez et collez le code suivant, tout en l’adaptant avec l’adresse de votre site:
1 2 3 | RewriteEngine On RewriteCond %{HTTP_HOST} ^example.com RewriteRule (.*) http://www.example.com/$1 [R=301,L] |
Interprétation: toutes pages dont l’adresse commence sans le préfixe doit rediriger vers la page qui contient la même adresse, mais avec le préfixe en plus. Vous pouvez tout aussi bien décider de faire le contraire et d’éviter le préfixe www. de toutes vos pages. L’important est d’en choisir un au début et de la garder pour de bon par la suite.
Voir aussi: La gestion d’un site avec .htaccess et ses fonctions de bases incontournables
Mettre à jour votre déclaration de copyright
2008 est maintenant bel et bien arrivé, n’oubliez pas de mettre à jour la date de copyright dans vos pages web. Personnellement, il m’est assez facile de changer tout ça pour un site avec la recherche globale suivante: “-2007″, que je remplace pour “-2008″, comme la plupart de mes sites utilisent la formule suivante: “Copyright © 2001-2007 Tous droits réservés”.
Une autre façon facile d’automatiser tout ça est d’employer un language serveur qui le calcule à chaque fois:
Avec ASP:
Copyright © 2001-<%=year(date)%>
Avec PHP:
Copyright © 2001-<?php echo Date(Y);?>
Toutefois, je préfère toujours la méthode à l’ancienne, comme je suis pointilleux sur la rapidité d’affichage des pages et je garde au minimum tout appel au language serveur.
Que sont les annonces contextuelles?
Les annonces contextuelles sont une forme relativement nouvelles de publicité sur le web qui considère le contenu textuel d’un site, d’une page ou un terme de recherche pour afficher automatiquement des annonces qui sont reliées au sujet et au thème correspondant. Ces annonces prennent généralement la forme de texte et liens textuels, ou d’images avec description, pour attirer les visiteurs qui pourraient être intéressés.
La publicité contextuelle est généralement très bien ciblée et mieux acceptée par les visiteurs parce qu’elle est moin intrusive, moin lente à télécharger et plus pertinente que les bannières graphiques classiques. Par exemple, une page web sur la photographie va attirer automatiquement des annonceurs qui vendent des caméras et autres accessoires reliées à la photographie. Elle facilite aussi grandement la tâche aux webmaster pour trouver des annonceurs, comme la compagnie de publicité contextuelle agit en tant que régisseur entre les webmasters et les annonceurs, qui font une offre de paiement pour des mots-clés spécifiques à partir d’un système d’encan sans nécessairement connaître les sites qui vont les afficher. La tâche est aussi facilitée pour les annonceurs qui ont dorénavant accès à des milliers de sites potentiels pour afficher leurs annonces sans les contacter un par un.
Le sytème fonctionne généralement par coût au clic, ce qui veut dire que le webmaster génère un revenu lorsque les utilisateurs cliquent sur une annonce, contrairement au système de coût par impression, un système plus vieux qui génère un certain revenu selon le nombre de fois que la publicité est affichée.
Google fut à l’avant-plan de cette innovation sur le web quand ils ont créés Google Adsense, le premier programme majeure contextuel. Au début, ces nouvelles annonces apparurent dans leurs pages de résultats de recherche, mais elles fut par la suite accessibles aux webmasters et à leurs sites web, qu’ils appellent leur “Content Network”. Avec seulement quelques lignes de code Javascript à insérer dans une page web, les webmasters peuvent inclure Adsense à leurs pages, qui vont par la suite afficher automatiquement des annonces pertinentes en utilisant l’algorithme de recherche de Google pour déterminer le sujet de la page.
Google considère aussi d’autres facteurs, comme l’origine géographique et la langue des visiteurs, pour trouver une publicité compatible, ce qui fait que la publicité peut être fort différente pour chaque visiteur.
D’autres compagnies ont suivis par la suite avec des programmes similaires, mais elles n’égalaient généralement pas le niveau de sophistication d’Adsense comme elles requiéraient au début que les webmasters fournissent eux-mêmes les mots-clés au lieu de les détecter. D’autres gros joueurs sur le web ont maintenant des types de programmes technologiques de marketing similaires, comme Yahoo! Publisher Network et MSN adCenter.
La publicité contextuelle rends dorénavant possible aux propriétaires de petits sites de rentabiliser leurs efforts sans passer la majeure partie de leur temps à trouver et communiquer avec des annonceurs appropriés qui ne sont pas toujours ouverts à négocier avec des sites plus petits.