Revue web

On m'a fait découvrir, aujourd'hui, une belle et originale page 404 sur le site d'un développeur web. Pour ceux qui ne sauraient pas, une page 404 correspond à une page d'erreur indiquant que la page à laquelle vous essayez d'accéder n'existe pas. Techniquement, 404 est le code d'erreur retourné par le serveur web pour indiquer que la page est inexistante.

La page en question :

belle-page-404-2

Vous pouvez cliquer sur l'image pour accéder directement à la page de ce développeur.
On voit que la fenêtre met en scène des Lemmings, les héros d'un jeu de réflexion du même nom créé dans les années 90 sur PC. Ici, le concept consiste à sauver le plus de Lemmings possible. Je tire mon chapeau à l'auteur de cette page. J'en ai vu des paquets de page 404 mais celle-là, c'est la number one de ce que j'ai pu voir.

A l'occasion, si vous cherchez de l'inspiration pour créer vos propres pages 404, je vous invite à aller sur bonjour404 qui liste un grand nombre de designs pour cette page. Il y en a pour tous les goûts! D'ailleurs, il faudrait que je pense à m'en faire une un de ces jours parce que la page 404 par défaut de Joomla, elle laisse un peu à désirer...J'ose même pas mettre une copie d'écran...

Amusez-vous bien avec les Lemmings!

Revue web

logo-javaUne faille très critique a été détectée dans Java 7. Cette faille permettrait à des personnes malintentionnées (des hackers par exemple) d'installer des malwares à l'insu de votre plein gré. Les pirates pourraient installer des virus sur votre machine et de manière assez simple! Une page web suffit pour se retrouver piraté et, apparemment, cette faille aurait largement été exploitée. Heureusement, Oracle, qui s'occupe du développement de Java, a pu publié assez rapidement une correction. Si vous utilisez Java 7, je vous invite à installer ce correctif au plus vite!

Plus d'informations sur ce correctif et toutes les informations pour le déployer

Revue web

Quand on développe des sites web, on utilise toute une palette d'outils pour réaliser différentes étapes du processus de développement. Pour la création de la charte graphique, on va commencer par du papier et un crayon, puis on va passer à des outils informatiques comme Gimp ou Photoshop. Pour le codage, ça va être très varié, on va passer de l'éditeur de texte (personnellement j'utilise Notepad++) à des outils de développement plus poussés comme Eclipse. Au final, on affichera le résultat sur un navigateur web.


Arrivé à cette étape finale, on aura encore des choses à corriger ou à régler. Et là, les navigateurs web vont nous venir en aide en proposant des outils directement intégrés aux navigateurs qui nous permettront de débogueur ce qui ne va pas ou, simplement, d'améliorer certains points.

Les outils de développement de Google Chrome

chrome-outil-preview

Pour activer les outils sous Chrome, vous pouvez passer par le menu "Outils/Outils de développement" ou utiliser le raccourci "Ctrl+Shift+I".

Actu site

La marque de vêtements haut-de-gamme pour homme COUEDRO vient de lancer son site de vente en ligne.

couedro

La marque a fait appel aux services de Quokka Web pour réaliser ce site d'e-commerce. Basé sur l'application Prestashop, Quokka Web a développé ce site qui dispose aussi d'un look adapté aux smartphones.
couedro_smartphone
Dans le cadre de ce projet, de nombreux modules (extensions) ont été créés spécifiquement sous Prestashop. Pourquoi ne pas avoir utiliser des modules existants? Tout simplement pour répondre à des besoins très particuliers auquels les modules existants ne répondaient pas cependant le site se base aussi sur d'autres modules existants.

Le design se veut volontairement sobre soulignant ainsi les aspects pros et "classe" de la marque parisienne.

Je vous invite à découvrir cette nouvelle marque pleine de prestige et d'élégance.

Découvrir Couedro - Select store for men

Actu site

Emma, artiste de contorsion, qu'on a pu apercevoir dans l'émission E=M6 (chercher "Les incroyables bizarreries de la nature humaine" sur le site de M6) a posté une nouvelle vidéo sur son site. Il est toujours impressionnant de voir cet exercice de souplesse. Emma le réussit à la perfection avec grâce et charme.

lilylily2

Voir la vidéo d'Emma la contorsionniste.

Actu site

Le blog amène de plus en plus de visiteurs sur le site alors un petit coup de rafraichissement graphique pour le rendre plus agréable me semblait être une bonne idée.
J'espère avoir réussi cette tâche.

Pour ceux qui n'auraient pas connu la précédente version du site, voici un Avant/Après pour donner une idée des changements qui ont eu lieu :

Avant :
tc_old_blog_thumb

Tutoriaux

Récemment, j'ai eu besoin de mettre à jour des champs si ceux-ci existaient ou de les insérer dans le cas contraire. En soi, ce n'est pas compliqué. Il suffit de tester si les entrées existent, si oui, on les met à jour, sinon on les ajoute.

Voici une structure de table pour l'exemple :

Table statsvisit
id page_id visites date_enregistrement
1 55 152 25-10-2012 00:00:00
2 56 189 25-10-2012 00:00:00

Le but est de mettre à jour le champ visites correspondant à une page page_id à une date t. A une date t+1, nous ajouterons des entrées. Dans une même journée, le nombre de visites sera mis à jour.

Actu site

design_sensarom

Pour une fois, il ne s'agit pas de la création d'un site mais de la refonte d'un design. Il s'agit d'une boutique proposant la vente de produits naturels (aromathérapie, maquillage naturel, ...).

La demande était de rafraichir le design en place et de mettre en valeur le côté nature de la boutique. Le vert semblait, naturellement, le bon choix pour répondre à cette demande. La réalisation d'un design de boutique en ligne présente quelques difficultés. D'une part, le design doit être adapté pour de nombreuses pages (Accueil, Produit, Catégorie, Panier, ...) d'autre part, la mise en place de certains détails nécessite une retouche, voire la création de certains plugins pour l'outil de vente en ligne, ici il s'agit de Prestashop.

Cela a notamment nécessité la création d'un plugin pour la gestion de "Mon compte" et "Mon panier" (qui se trouvent en haut) avec les effets dynamiques qui vont avec (Merci Jquery et AJAX pour ce qu'ils permettent de faire de nos jours :-)). Le plugin commentaires a aussi été modifié (ainsi que le coeur de Prestashop. Enfin pas vraiment, certaines fonctions ont été redéfinies grâce à l'override ce qui évite de toucher au coeur même de Prestashop et, par la même, d'éviter des surprises lors des mises à jour du framework) pour permettre d'avoir la notation et les liens "Voir les avis" et "Déposer un avis" juste en-dessous du nom des produits (pages produit).

Découvrir Sens'Arom, la boutique de produits naturels

Actu site

thumb_catherinecruanes

J'ai terminé tout récemment de réaliser le site d'une artiste-peintre, Catherine Cruanes.

Dans un site épuré mettant en avant le travail de cette artiste, vous pourrez découvrir ses oeuvres et ses expositions, qui se déroulent principalement en région parisienne.

La principale difficulté a été de réaliser des galeries indépendantes les unes des autres avec chacune sa propre présentation. Une attention particulière a été apportée à réaliser un design adapté à chaque page tout en respectant un certain équilibre.

Je vous invite à découvrir les peintures de Catherine Cruanes.

Revue web

Voici une petite application que vous avez surement déjà rencontré, Skype click to call. Il s'agit d'une extension du logiciel Skype. Skype est une application permettant de chatter, de téléphoner ou de faire des vidéo-conférences.
Skype, en lui-même, est bien pratique. Je l'utilise principalement pour chatter et il fonctionne bien pour le reste. Rien à redire là-dessus. Par contre, comme tout logiciel actuel qui se respecte, il se met à jour. On bénéficie ainsi des dernières évolutions et corrections du produit ce qui est une très bonne chose cependant si vous n'avez pas fait attention lors de ces fameuses mises à jour, vous vous êtes retrouvé avec "Skype click to call" installé sur votre machine. Quand vous faites des installations, vous avez souvent tendance à cliquer un peu vite sur "Suivant" sans lire les boites qui apparaissent et c'est comme ça qu'on retrouve avec un logiciel en plus installé sur la machine.

Une fois le logiciel installé, on ne se rend pas compte tout de suite de sa présence mais, en utilisant les navigateurs web, on constate que les numéros de téléphone ne s'affichent plus de la même façon. voici ce que ça donne : skype-phone.
C'est plutôt discret et cela rajoute des fonctionnalités comme la possibilité d'appeler directement un numéro présent sur une page web avec Skype.

Alors, pourquoi faire un billet intitulé "l'incrusteur"?

  • Il s'est installé sans qu'on lui demande rien, un peu à l'insu de notre plein gré
  • Il s'est foutu sur tous les navigateurs webs
  • Il ouvre régulièrement une boite demandant de le mettre à jour alors qu'on se demande ce qu'il fout sur notre machine. Ca fait un peu logiciel espion
  • Il y eut une période où il rendait instable les navigateurs web. A priori, cela semble résolu ou, du moins, bien moins fréquent.
  • Il peut dénaturer une page web. Ca c'est le coté webmaster qui ressort. Vous vous évertuez à faire un beau design niquel au pixel près. Et bim! Le style du numéro change et fout en l'air votre design et vous vous retrouvez obligé d'expliquer à votre client pourquoi ça bugue!!! "Mais euh...Ca marche très bien chez moi avec toutes les configurations possibles et imaginables" -> Envoi copie d'écran -> "Hmm Ok, je vois ce que c'est, vous avez Skype Click to call installé sur votre machine" -> Le client : "Euh...quoi? J'ai rien installé moi" -> "Vous avez Skype?" -> Le client : "Euh oui mais j'ai pas installé ce truc" -> "Non il s'est installé à l'insu de votre plein gré".
    Obligé de mettre à jour le design à cause de cette foutu appli!

Comment s'en débarrasser?
Le plus simple est de le désinstaller de votre machine et de faire attention à ne pas le réactiver lors des prochaines mises à jour de Skype.
Il y a aussi la possibilité de désinstaller le plugin correspondant pour chaque navigateur mais c'est plus long.