Walboat : une escapade maritime

 – Maman, les beaux bateaux qui vont sur l’eau ont ils un site ?
– Mais oui, s’il n’en avait pas, artwaï serait là, pour leur en faire un !

Le site walboat.com qui vous présente le LATINI 52 Race « SOLANO ».

Un graphiste à la hauteur

Le LATINI 52 Race « Solano » est un voilier à part. En portant son choix de prestataire sur artwaï, la société walboat attendait de nous la qualité de réalisation que nous défendions mais aussi une créativité à toute épreuve. Nous nous devions donc, d’assurer un site à la hauteur des courbes italiennes de ce bien beau bateau.
Sur ce point, on peut féliciter Tony d’avoir plus qu’assurer. En ayant proposé plusieurs mise en page, une dizaine de teinte différente, et tester le poids de tout ceci; le choix fut finalement  porté sur ce bleu nuit qui fait ressortir les magnifiques photos prises en mer.

Les fondamentaux habituels

Le site walboat.com ne déroge pas à la règle de notre application systématique des standards; à savoir : XHTML / CSS Le CSS (Cascading Style Sheets) est un langage utilisé pour décrire l'apparence et la mise en page des documents HTML, en définissant des styles comme les couleurs, polices, marges, et positionnements des éléments sur une page web. , le  tout vérifié dans notre brochette de navigateurs témoins : Firefox, Opéra, Safari et Internet Explorer.

Un prototype qui n’en est plus un !

Une fois de plus, nous nous appuyons sur prototype. js JavaScript est un langage de programmation dynamique principalement utilisé pour ajouter des fonctionnalités interactives aux pages web. Il permet de manipuler le DOM, de gérer des événements, et d'effectuer des requêtes asynchrones. et la bibliothèque d’effets associés sciptaculous. Ici le défi était de parvenir à un résultat équivalent aux sites références de walboat qui eux utilisent la technologie flash pour leur diaporama. Ainsi la page d’accueil présente quelques photos avec cette barre horizontale faite à l’aide de scripacoulus.

On notera l’utilisation d’une lightbox pour une phototèque façon mur d’image.

Intermède : un souci « Microsoftien »

Malgré l’usage de prototype, nous avons pu constater un problème d’exécution des effets javascript sous Internet Explorer 7 (sous XP et Vista) qui n’existe pas avec la version 6 du navigateur de chez microsoft. Toutes les transitions en fondu avec changement d’opacité des images étaient saccadées voir inopérantes dans le suc-cité navigateur. Imaginez la tête de votre humble rédacteur devant la menace du retour à la technologie Flash*.
Quelques poignées de cheveux en moins plus tard, nous avons constater que les effets concernés fonctionnaient parfaitement dans un autre contexte CSS. La solution : remplacer une image au format png mis en fond d’un bloc par un format gif. Mais qu’est-ce à dire ? Il s’avère qu’Internet Explorer 7 digère très mal les changement d’opacité d’images sur des fonds avec des images png. Bref une fois résolu ceci, l’exécution des scripts se comportaient à merveille dans l’ensemble de nos navigateurs témoins.

* Attention, qu’il n’y ai pas de quiproquo : Flash est une technologie éprouvée très intéressante pour les animations complexes. Mais dans ce cas l’utilisation de Flash est inutile et complexifierait les mises à jours. Il est à noter que nous ne rechignons pas à utiliser cette technologie lorsque son usage est justifié, comme le prouve ce qui suit.

En action sur les vagues

Fier d’une promotion par DVD de son voilier, la société Walboat nous a demandé de mettre à dispositions des internautes son clip vidéo. En faisant appel à un partenaire (dont nous vous parlerons un autre jour), nous nous assurions de la qualité de mise a disposition de la dite video. En effet, il fallait que la vidéo soit légère, de résolution suffisante et diffusable en plein écran sans trop de pixel et en s’adaptant au format d’écran. Le choix du lecteur intégré fut porté sur sur le player JW FLV utilisant la technologie Flash qui vous permet de regarder la vidéo sans attendre son chargement complet.

Coté serveur

Rien d’exceptionnel puisque PHP PHP est un langage de programmation côté serveur utilisé pour créer des pages web dynamiques. Il est largement utilisé pour gérer les bases de données, traiter des formulaires, et générer du contenu HTML. 5 est utilisé essentiellement dans un objectif de factorisation des éléments composants les pages.

L’image de marque avant tout

On ne peut pas dire que technologiquement, le site walboat.com révolutionne le genre. Nous avons soignez la réalisation technique mais c’est avant tout le travail du graphiste et des photographes qui sont mis en avant. Notre accompagnement consiste essentiellement à la mise en ligne des ces biens jolies photos de ces escapades maritimes rafraîchissantes.