Antistatique.net vous a concocté une liste de listes d’inspirations pour représenter des statistiques graphiquement.



<ul><li><a href="http://dzineblog.com/2009/10/27-beautiful-examples-of-infographics.html">http://dzineblog.com/</a></li><li><a href="http://blogof.francescomugnai.com/2009/04/50-great-examples-of-infographics/">http://blogof.francescomugnai.com/</a></li><li><a href="http://www.webdesignerdepot.com/2009/06/25-useful-infographics-for-web-designers/">http://www.webdesignerdepot.com</a></li><li><a href="http://www.smashingmagazine.com/2008/01/14/monday-inspiration-data-visualization-and-infographics/">http://www.smashingmagazine.com/</a></li><li><a href="http://www.webdesignerdepot.com/2009/10/30-superb-examples-of-infographic-maps/">http://www.webdesignerdepot.com</a></li><li><a href="http://sixrevisions.com/graphics-design/40-useful-and-creative-infographics/">http://sixrevisions.com/</a></li></ul>

Collection – infographie

L’une des tâches les plus rébarbatives dans le développement web, ça doit bien être l’envoi d’email (après la gestion des formulaires, qui pourrait bien faire l’objet d’un futur article).



Certes, il existe la fonction&nbsp;mail()&nbsp;intégrée à PHP, mais celle-ci est très basique et loin d’être pratique. Comment envoyée facilement un mail multi-part ? attacher une pièce jointe ? envoyer le mail à plusieurs destinataire ? etc, etc.



C’est là qu’intervient la librairie&nbsp;Swift Mailer. Cette librairie, entièrement orientée objet, est extrêmement riche en fonctionnalités et est basée sur un système de plugin modulable. Elle a été écrite par&nbsp;<a href="http://twitter.com/d11wtq">Chris Crobyn</a>&nbsp;et est désormais maintenue par&nbsp;<a href="http://fabien.potencier.org/article/33/swift-mailer-takeover">Fabien Potencier</a>&nbsp;(lead developer of the symfony framework).



Allez, un peu de code faut mieux qu’un paragraphe:



<h2 class="wp-block-heading">Création du message</h2>



<pre class="wp-block-code"><code>&#91;php gutter="false"]
require_once ‘/path/to/swift-mailer/lib/swift_required.php’;

// create the message
$message = Swift_Message::newInstance();
// hop, on défini le sujet du mail
->setSubject(‘Recherche mangeur de kiri’)
->setFrom(array(‘jean@example.com’ => ‘Jean Bond’))
->setTo(array(‘destinataire1@example.com’))
->setBody(‘Le corps du mail en texte.’, ‘text/plain’)
->addPart("&lt;p>La version HTML.&lt;/p>", ‘text/html’)

// Ajout d’une pièce jointe depuis un fichier
->attach(Swift_Attachement::fromPath(‘document.pdf’))
// Ajout d’une pièce jointe crée dynamiquement
->attach(Swift_Attachement::newInstance(
$data, ‘document2.pdf’, ‘application/pdf’
))
;
&#91;/php]</code></pre>



<h2 class="wp-block-heading">Envoi</h2>



<pre class="wp-block-code"><code>&#91;php gutter="false"]
// Création du "moyen de transport"
// (via serveur SMTP, Sendmail ou fonction mail() php)
// Ici, envoi via serveur SMTP
$transport = Swift_SmtpTransport::newInstance(‘smtp.example.com’, 25)
->setUsername(‘user’)
->setPassword(‘PaSswoRd’)
;

$mailer = Swift_Mailer::newInstance($transport);
$result = $mailer->send($message);

if($result)
{
/* … */
}
else
{
/* … */
}
&#91;/php]</code></pre>



Et voilà! plutôt simple non ?



Et pour finir, je vous invite à lire la&nbsp;<a href="http://swiftmailer.org/docs">doc détaillée</a>&nbsp;de la librairie. Par ailleurs, n&#8217;hésitez pas à&nbsp;<a href="https://antistatique.net/fr/nous/travaillons/avec/vous">nous contacter</a>&nbsp;si vous avez des questions spécifiques.&nbsp;



<h3 class="wp-block-heading">Références:</h3>



<a href="http://www.swiftmailer.org/">Swift Mailer, la lib magique pour l’envoi d’email</a>

Envoi d’email avec PHP grâce à Swift Mailer

Google earth permet, depuis la version 4.0, de visualiser l’évolution dans le temps de données géographique. Un exemple d’utilisation serait de montrer le déplacement d’un ouragan au fil des heures dans une zone donnée mais les possibilités sont infinies. Nous constatons l’avénement d’une nouvelle dimension dans les outils SIG (systèmes d’informations géographiques). Et cette option arrive dans les SIG sur Internet.



Pour la réalisation du <a href="http://www.antistatique.net/fr/portfolio/onair.html">mandat multimédia pour la société OnAir</a>, nous avons utilisé cette dimension du temps pour animer les différents vols tout au long de la journée.



<figure class="wp-block-image size-large is-style-default"><img decoding="async" loading="lazy" width="440" height="245" src="https://content.antistatique.net/app/uploads/2020/12/gis_temps.jpg" alt="" class="wp-image-2172" srcset="https://content.antistatique.net/app/uploads/2020/12/gis_temps.jpg 440w, https://content.antistatique.net/app/uploads/2020/12/gis_temps-300x167.jpg 300w" sizes="(max-width: 440px) 100vw, 440px" /></figure>



Bien qu’expérimentale, l’application de ces technologies dans les logiciels web sont déjà nombreuses. Notamment <a href="http://www.cannonade.net/timemap.php">cet exemple</a> présentant les différents événements de la seconde guerre mondiale dans l’échelle du temps parallèlement à la carte du monde.



<figure class="wp-block-image size-large is-style-default"><img decoding="async" loading="lazy" width="440" height="246" src="https://content.antistatique.net/app/uploads/2020/12/gis_temps2.jpg" alt="" class="wp-image-2173" srcset="https://content.antistatique.net/app/uploads/2020/12/gis_temps2.jpg 440w, https://content.antistatique.net/app/uploads/2020/12/gis_temps2-300x168.jpg 300w" sizes="(max-width: 440px) 100vw, 440px" /></figure>



Ou encore&nbsp;<a href="http://rozsavage.com/adventure/roztracker/">cette application web</a>&nbsp;qui permet de suivre en direct l’avancement de la traversée du pacifique à la rame (heure par heure) lié également au tweets et autres photos publiées.



A lire également : <a href="http://googlegeodevelopers.blogspot.com/2009/09/our-favorites-time-based-maps.html">Our Favorites: Time-Based Maps (en)</a>

Une dimension supplémentaire, le temps

Vous savez déjà que nous sommes fan de l’iPhone, découvrez notre nouveau site optimisé pour celui-ci.



Nous développons sur le web par passion,&nbsp;<a href="http://www.michaelbraude.com/2009/05/why-ill-never-be-web-guy.html">les déplorations de Michael Braude</a>&nbsp;sur le manque de professionnalisme dans le web, nous le constatons évidemment mais faisons partie des «&nbsp;web guys&nbsp;» qui mettent en place des solutions précises et pointues.



Pour preuve, voici un développement spécifique à l’iPhone. Le site Antistatique.net destiné spécialement pour cette plate-forme. Un code optimisé et l’utilisation ingénieuse des spécificités de l’iPhone pour présenter notre entreprise.



<h2 class="wp-block-heading">Faciliter le contact</h2>



Le but principal de ce site iPhone est de faciliter la démarche de contact pour nos futurs et actuels clients. Ainsi, la page d’accueil utilise les options de l’iPhone pour nous localiser sur la carte, nous appeler ou nous envoyer un e-mail.



<h2 class="wp-block-heading">Présenter nos projets</h2>



Un clignement de cils et voici la liste des mandats réalisés par Antistatique.net. Toutes les informations sont présentées et permettent de trouver facilement une référence pertinente. La fiche détaillée du projet réserve également une surprise, tourner l’iPhone à l’horizontale et les photos apparaissent.



<figure class="wp-block-image size-large is-style-default"><img decoding="async" loading="lazy" width="440" height="99" src="https://content.antistatique.net/app/uploads/2020/12/iphone_as_home_detail_0.jpg" alt="iphone" class="wp-image-2179" srcset="https://content.antistatique.net/app/uploads/2020/12/iphone_as_home_detail_0.jpg 440w, https://content.antistatique.net/app/uploads/2020/12/iphone_as_home_detail_0-300x68.jpg 300w" sizes="(max-width: 440px) 100vw, 440px" /></figure>



<h2 class="wp-block-heading">Notre actualité</h2>



<a href="http://www.antistatique.net/fr/stream.html">Notre veille technologique</a>, les nouveautés,&nbsp;<a href="http://www.antistatique.net/blog/category/lausanne/">les bons plans à Lausanne</a>&nbsp;et les partenaires sont les sujets principaux de notre blog. Pour que vous puissiez profiter de toute notre actu’ nous vous proposons également la version iPhone.



<h2 class="wp-block-heading">Notre souhait</h2>



Se concentrer sur les aspects essentiels du site internet original et donner l’accès à ses informations depuis un mobile est notre souhait. En espérant que ce nouveau site vous plaise et vous donne l’envie de développer votre communication sur iPhone. Nous sommes là pour répondre à vos questions.

Fan d’iPhone ? Nous aussi !

Faute de partir à la plage, Antistatique.net vous emmène sur les virtuelles ! Sur le web poussent comme des cocotiers : des sites internet avec des illustrations de paysages paradisiaques.



Un petit tour avec nous, voici une liste de site bon pour les yeux !



<ul><li><a href="http://twibbon.com/">twibbon.com</a></li><li><a href="http://volll.com/">volll.com</a></li><li><a href="http://dc2009.drupalcon.org/">dc2009.drupalcon.org</a></li><li><a href="http://bradcolbow.com/">bradcolbow.com</a></li><li><a href="http://www.divvoted.com/">divvoted.com</a></li><li><a href="http://www.vimeo.com/">vimeo.com</a></li><li><a href="http://www.lionite.com/">lionite.com</a></li></ul>



Cette liste provient des résultats de nos recherches pour la création des maquettes&nbsp;<a href="http://www.antistatique.net/fr/portfolio/maquettes_places_de_jeux.html">places-de-jeux.ch</a>&nbsp;et&nbsp;<a href="http://www.antistatique.net/fr/portfolio/maquettes_pique_nique.html">pique-nique.ch</a>

Collection – Site illustration

Swiss Post Box c’est le nouveau service de la Poste suisse. La poste scan vos enveloppes et vos lettres.



<a href="http://www.swisspostbox.com/fr/">swisspostbox.com</a>

Finis les e-mail .. euh ?

Le nouveau moteur de recherche de malade mentale qui résout vos équations.



Un moteur de recherche d’un autre genre est sorti dernièrement. Il s’agit de&nbsp;<a href="http://www.wolframalpha.com/">WolframAlpha</a>&nbsp;qui a été développé par l’équipe du célébre logiciel&nbsp;<a href="http://www.wolfram.com/products/mathematica/">Mathematica</a>.



La principale particularité de celui-ci est qu’il se base sur plusieurs bases de données de connaissances (mathématiques, statistiques, astronomies, noms et langues, …). Il est par exemple possible de résoudre des équations mathématiques (en cette période d’examens universitaires, tout le monde se demande que vaut la dérivée de <code>ln(1/x+3)</code>, <a href="http://www62.wolframalpha.com/input/?i=ln%281%2Fx%2B3%29">il connait la solution!</a> avec même une partie du développement.). Ou encore de connaître le nom du <a href="http://www62.wolframalpha.com/input/?i=President+of+France+in+1985">président de la France en 1985</a> (il connait encore trop mal la Suisse…).



Bref, sympa, à tester!

Wolfram|Alpha, le moteur de recherche pour intellos

Plusieurs livres sur le&nbsp;<a href="http://www.antistatique.net/fr/symfony">framework PHP symfony</a>&nbsp;dans sa version 1.2 viennent de sortir. Symfony est de plus en plus utilisé comme base de développement pour les applications PHP professionnels.&nbsp;Et l’on peut que s’en réjouir!



Je viens de commander le livre « Symfony : Mieux développer en PHP avec Symfony 1.2 et Doctrine », je vous dirais si il est aussi bien que le livre sur symfony 1.0 😉



A noté aussi que le 11 et 12 juin 2009 se prépare la&nbsp;<a href="http://www.symfony-live.com/">conférence «&nbsp;Symfony Live&nbsp;»</a>&nbsp;à Paris.



<a href="http://www.symfony-project.org/blog/2009/06/02/books-on-symfony">Le post parlant de la sortie des livres</a>



<a href="http://www.symfony-project.org/">Le site officiel de symfony</a>



<a href="http://www.symfony-live.com/">Le site symfony live</a>

Nouveau livre sur symfony 1.2

Par cette chaleur, vous reprendrez bien un concentré d’informations ?



Vous avez dû le remarquer, nous sommes fanatiques des applications web. Encore plus lorsqu’elles permettent de se simplifier la vie. Pour partager l’information recueillie lors de <a href="http://fr.wikipedia.org/wiki/Veille_technologique">veille technologique</a> (on ne parle pas ici de <a href="http://www.korben.info/il-remet-en-marche-un-modem-300-bauds-de-1964.html">vieille technologie</a> 😄), nous utilisons les applications web telles que <a href="http://www.delicious.com/">Delicious</a>, <a href="http://www.google.com/reader">Google Reader</a>, <a href="http://www.twitter.com/">Twitter</a> et compagnie … Afin de réunir ces informations en un seul endroit, nous vous proposons une page <a href="https://antistatique.net/fr/stream.html">« Live Stream »</a> sur notre site.



<a href="https://antistatique.net/fr/stream.html">Découvrez notre live stream</a>



Un article détaillé suivra pour expliquer les techniques utilisées pour canaliser tous ces flux.

Antistatique.net Live Stream

C’est la crise ! Et pourtant, continuer à communiquer est indispensable. Je dirais même qu’il est primordial de montrer à vos relations (clients, partenaires, fournisseurs et contacts potentiels) que vous êtes là et que les opportunités existent.&nbsp;



Chez Antistatique.net, nous pensons que l’envoi de newsletters est un sérieux plus dans votre communication multimédia. Nous ne parlons pas ici de spam, mais bien de maillings professionnels à vos couleurs et personnalisés pour chaque client.



Comme toutes solutions techniques et spécialement dans le domaine d’Internet, les newsletters contiennent des contraintes techniques exigeantes. La diversité des logiciels de messagerie et autres webmails rend complexe la réalisation d’une newsletter. Il est donc indispensable de faire appel à des professionnels en la matière. L’avènement des&nbsp;<a href="http://www.email-standards.org/">standards pour les clients mail</a>&nbsp;est important pour nous car il rendra cette pratique encore plus professionnelle.



Une campagne de mailling ne s’arrête d’ailleurs pas à l’envoi. L’analyse des statistiques générées est une étape importante. Ceci afin de toujours mieux cibler vos futurs envois.



Nous avons récemment effectué une campagne de newsletter pour La Régie de La Couronne, n’hésitez pas à&nbsp;<a href="http://www.antistatique.net/fr/portfolio/newsletter_couronne.html">consulter notre portfolio pour en savoir plus</a>

Les newsletters comme outil de communication

Une nouvelle version du navigateur Safari de Apple basé sur WebKit est disponible en beta. Nous donnons nos impressions.



Tout le monde parle de ces nouveaux onglets à la façon Google Chrome ou de l’introduction de CoverFlow dans la consultation de l’historique. Nous savons qu’Apple présente ces nouveautés pour faire parler de son nouveau navigateur. Mais ce qui nous intéresse vraiment, c’est ce qui se trouve sous le capot.



Cette nouvelle version est maintenant compatible avec les feuilles de style CSS 3, HTML 5 est le stockage client d’information pouvant faire fonctionner des applications web off-line. L’exécution du JavaScript a aussi été optimisée. De bonnes nouvelles donc.



<a href="http://www.apple.com/fr/safari/features.html">www.apple.com/fr/safari</a>

Safari 4 Beta, que de bonnes nouvelles

Avant d’entrer dans le vif du sujet, il est important de comprendre plusieurs concepts.



La mise en place de codes Javascript non-obstructif permet de faire fonctionner le site sans l’utilisation du javascript. (aujourd’hui presque tout le monde active le javascript ce qui n’est donc pas l’argument principal).



Cette technique permet surtout de garder le code xhtml propre et de l’utiliser pour ce dont il est conçu, c’est-à-dire, l’organisation du contenu.



Un code xhtml tout basique, il s’agît d’un bouton de formulaire de ce type :



<pre class="wp-block-code"><code>&#91;code lang="html"]

&#91;/code]</code></pre>



ce bout de code est sémantiquement correct, il décrit un bouton tel que spécifié dans les standards du W3C.



Mais nous aimerions que le design de celui-ci soit plus … disons …. attractif comme ça :



Et moi un beau bouton



Pour ce faire, il faut donc dynamiquement remplacer le code html du bouton par une balise de type lien. Nous en reparlerons, mais l’utilisation de la technique «&nbsp;sliding-doors&nbsp;» permet d’avoir un bouton redimentionnable.



Le framework&nbsp;<a href="http://www.jquery.com/">jQuery</a>&nbsp;permet facilement d’effectuer ce remplacement.



<pre class="wp-block-code"><code>&#91;code lang="javascript"]
$(document).ready(function() {
// dès que la page est chargée
// pour chaque élément contenant la class "submitbutton"
$('.submitButton').each(function(e){
//récupéré les attributs suivants
var val = $(this).attr('value');
var formsend = $(this).attr('name');
var bt_id = $(this).attr('id');
// remplacer le bouton par un lien
$(this).parent().html(''+val+'').click(function(){
// comportement du lien lors du clique
$('form#'+formsend).submit();
});

});
});
&#91;/code]</code></pre>



La propreté du code dans une page web, c’est surtout les avantages suivants :



<ul><li>Une meilleure sémantique améliore grandement le référencement dans les moteurs de recherche</li><li>Une meilleure «&nbsp;maintenabilité&nbsp;» du code, et donc moins de frais&nbsp;🙂</li></ul>



<a href="http://dev.antistatique.net/js-unobstructive/">Voir la démo</a>



<h3 class="wp-block-heading">Pour aller plus loin</h3>



<ul><li><a href="http://www.thefutureoftheweb.com/talks/2006-10-ajax-experience/slides/">Présentation sur le javascript non-obstructif</a></li><li>Les boutons dans les applications de google&nbsp;<a href="http://ajaxian.com/archives/how-many-engineers-does-it-take-to-create-a-cross-browser-button">Quelques pistes</a></li><li>Une technique moins extensible pour&nbsp;<a href="http://svnpack.com/">svnpack</a></li></ul>

Javascript non-obstructif

Google Earth, le célèbre outil SIG arbore une nouvelle version permettant (entre autre) l’accès à plus d’information sur les fonds marins.



<a href="http://earth.google.fr/">Google Earth v5</a>

Google Earth, nouvelle version

<h3 class="wp-block-heading">Bienvenue chez Antistatique.net !</h3>



Nous sommes passionés par l’interactivité, avec la volonté de toujours être à la pointe des dernières technologies de l’information. Vous trouverez dans les semaines à venir des billets sur ces thèmes. Tout au long de nos recherches, de nos analyses et de nos réalisations, nous sommes confronté à de nouveaux défis, nous avons le désir de les partager à travers ce blog.



Au plaisir de vous revoir !

Antistatique.net, l’agence interactive

<h3 class="wp-block-heading">Comment ça marche</h3>



Le plugin&nbsp;FileCache Par défaut, une page en cache est valide durant un jour (ceci est configurable via le fichier&nbsp;config.php&nbsp;du plugin).



<h3 class="wp-block-heading">Installation</h3>



<ul><li><a href="http://www.antistatique.net/blog/wp-content/uploads/as_cache_0_2b.zip">Télecharger le plugin</a></li><li>Copier le dans le répertoire&nbsp;plugins</li><li>Créer un répertoire&nbsp;caches&nbsp;à la racine de votre site</li><li>Définir les permissions d’écriture sur ce répertoire (par exemple:&nbsp;chmod 777 caches)</li><li>Rendez-vous dans la console d’Administration/Plugins et activer le File Cache plugin.</li></ul>



<h3 class="wp-block-heading">Utilisation</h3>



Le plugin est simple d’utilisation: il suffit de l’activer pour qu’il fonctionne ! Par défault, toutes les pages sont mise en cache mais vous avez la possibilité de désactiver le cache pour certaines page qui contiendrait un contenu dynamique par exemple (voir l’option sur la première capture d’écran).



<h3 class="wp-block-heading">Captures d’écrans</h3>



<figure class="wp-block-image"><img decoding="async" src="https://antistatique.net/sites/default/files/uploads/inline-images/frog_1.jpg" alt="frog1"/></figure>



<figure class="wp-block-image"><img decoding="async" src="https://antistatique.net/sites/default/files/uploads/inline-images/frog_2.jpg" alt="frog2"/></figure>



<h3 class="wp-block-heading">Download</h3>



Note : Ce plugin est encore en version beta, n’oublier pas de faire une sauvegarde avant de l’installer.



Le plugin ajoute une colonne&nbsp;is_cacheable&nbsp;à la table&nbsp;page&nbsp;de votre base de données.



Requiert au minimum :&nbsp;Frog 0.9.3 Version :&nbsp;0.2.0 beta



<a href="http://www.antistatique.net/blog/wp-content/uploads/as_cache_0_2b.zip">Télécharger la dernière version</a>



N’hésitez pas à reporter les problèmes rencontrés en envoyant un email à gilles[AT]antistatique.net.



<h3 class="wp-block-heading">Todo</h3>



<ul><li>Support des en-têtes Etag</li><li>Add cache on snippets</li></ul>

Notre enthousiasme est contagieux

La vie de l’agence, les dernières infos et les mandats remportés

La vie de l’agence, les dernières infos et les mandats remportés