Valéry-Xavier Lentz.eu

En chantier : le redesign du Taurillon

Valéry — Sun, 29 Aug 2010 07:55:00 +0100

Le Taurillon est un magazine en ligne édité par l'association Les Jeunes Européens. Fondé en septembre 2005, afin de capitaliser sur l'expérience de publication online acquise par l'association au cours de la campagne référendaire, et de participer à la promotion des idées européennes et fédéralistes, il est devenu depuis multilingue en ajoutant de nouvelles versions linguistiques qui sont en fait autant de magazines distincts, chacun ayant sa propre rédaction, dans le cadre des Jeunes Européens Fédéralistes.

Une nouvelle version est actuellement en cours de réalisation. L'objectif est de mieux valoriser le contenu en se débarrassant autant que possible des éléments divers venus encombrer sa page d'accueil, mais aussi de mettre en valeur les différentes versions linguistiques ou encore de mieux prendre en compte les médias sociaux. Enfin, il s'agit aussi d'intégrer dans les squelettes les innovations des dernières versions de SPIP, son outil de publication de contenu.

Le Taurillon - version 1 (2005) :

Le Taurillon - version 2 (2008) :

Le Taurillon - version 3 (en chantier) :

Et vous qu'est-ce que vous amélioreriez sur ce site ?

Mes liens de la semaine n°5

Valéry — Sun, 29 Aug 2010 07:30:00 +0100

Twitter / Tweet Button - Annotated

Add this button to your website to let people share content on Twitter without having to leave the page. Promote strategic Twitter accounts at the same time while driving traffic to your website.
24 ways: Make Your Mockup in Markup - Annotated
- Die Photoshop, die
- Get started by getting naked : Content precedes design. Design in the absence of content is not design, it’s decoration. Jeffrey Zeldman
- Flush out the layout
- Start your styling
- Let’s get sexy
- I believe we shouldn’t have to design for the lowest common denominator (cough, IE6 users, cough); instead we should create designs that are beautiful in modern browsers, but still degrade nicely for the other guy.
Conception dans le navigateur avec HTML5 & CSS3 (amélioration progressive) - Annotated
- Le design dans le navigateur est une technique de Webdesign qui fait l’impasse sur la maquette Photoshop.
- L’amélioration progressive est une méthode de conception centrée sur le contenu : les effets graphiques sont ajoutés dans un deuxième temps pour les navigateurs modernes.
- La dégradation gracieuse privilégie l’apparence : utilisation des dernières technologies en première intention et mise en place de fallbacks pour que la page reste fonctionnelle sur les configurations plus modestes.
- 1. Baliser le contenu
- 2. Ébauche de la page
- 3. Choisir les couleurs
- 4. Squelette de page HTML5
- 5. Préparer Internet Explorer pour HTML5
- 6. Structure générale de la page
- 14. Appliquer un reset CSS
- Les effets CSS3
- 19. Égaliser les colonnes avec Javascript
Tous inégaux devant le numérique « internet et opinion(s) – françois guillot et emmanuel bruant – web, médias, communication, influence, etc. - Annotated
- Un des problèmes de l’évangélisation au numérique est que l’on tend à faire croire à toutes les marques et entreprises qu’elles sont Apple ou Obama.
- les marques, entreprises et organisations sont très inégales devant le potentiel numérique qui s’offrent à elles.
- Au contraire, je me suis livré à un exercice de modélisation visant à permettre une lecture des enjeux du numérique en fonction de plusieurs paramètres : la nature de l’offre, le profil des publics, les attributs de la marque, la taille d’entreprise, le modèle de distribution et la culture d’entreprise.
US Political Campaign Websites - The Basics - Acqal - Annotated
- They are always temporary
- Most campaigns have small budgets, especially for web sites.
- The main purpose of a campaign web site is fundraising and it is essential to take online donations.
- With very few exceptions, we almost always use Wordpress for campaign web sites. It meets all the needs and we can offer a very competitive price compared to a TYPO3 site.
Should You Copy a Famous Site's Design? (Jakob Nielsen's Alertbox)

Although successful websites typically have high usability, average sites can hurt their business by copying design elements that don't work well in other contexts.
Tweet Your MEP: coming soon!

Toute l'Europe lancera le site 'Tweet your MEP' ('Twitte ton Eurodéputé' dans sa version française) le 22 septembre 2010. L'objectif : permettre aux internautes notamment aux plus jeunes, d'interpeller et de dialoguer avec les eurodéputés de manière simple, directe et immédiate.

Posted from Diigo. The rest of my favorite links are here.

Mes liens de la semaine n°4

Valéry — Sun, 22 Aug 2010 07:30:00 +0100

7 façons de valoriser les commentaires dans un blog - Annotated

tags: wordpress plugins
- 1. Afficher les derniers commentaires sur la homepage
- 2. Afficher les billets les plus commentés
- 3. Afficher les « meilleurs » contributeurs
- 4. Afficher les informations complémentaires sur les commentaires
- 5. Ajouter des tags aux commentaires
- 6. Mettre en exergue les commentaires de l’auteur du blog
- 7. Afficher un commentaire au hasard dans un ticker
Christian Paul publie une proposition de loi sur la Neutralité du Net | ReadWriteWeb France - Annotated
- Christian Paul publie une proposition de loi sur la Neutralité du Net
- Christian Paul, l’auteur de cette proposition de loi, est député socialiste de la Nièvre depuis 1997. Il fait parti des rare députés (autant à droite à qu’à gauche) disposant de bonne connaissance sur le monde du numérique, et s’est distingué lors du passage de la loi Hadopi à l’Assemblée par son opposition féroce à la loi.
- Aujourd’hui, certains de ces acteurs sont tentés, par recherche d’un profit à court terme, de porter atteinte au caractère ouvert et égalitaire de l’Internet – de porter atteinte à sa neutralité, notamment en privilégiant tel ou tel type de communication ou certains contenus.
- Elles sont déjà une réalité dans « l’Internet mobile »
- l’encombrement du réseau d’un opérateur ne saurait constituer pour ce dernier un blanc-seing à n’importe quel filtrage ou priorisation de contenu.
- L’inquiétude des industries culturelles, en pleine mutation, peut elle aussi susciter la tentation de brider les échanges afin de faire perdurer des modèles économiques devenus obsolètes.
- La neutralité de l’Internet doit être, en quelque sorte, similaire à celle du réseau électrique.
- L’internaute doit également retrouver ou conserver une totale liberté d’utilisation de sa connexion au réseau.
- Comme souvent sur l’Internet, sous un fin vernis de technicité, se cachent d’importants enjeux de société.
- la loi doit prévenir, et ne pas seulement tenter de réparer quand il est trop tard.
- Nous ne sommes ni pour le laisser-faire, ni pour une fausse régulation en trompe-l’œil affirmant un principe en même temps qu’un droit universel à y déroger.
- C’est une véritable laïcité informationnelle, une neutralité de l’espace public où chacun est libre de venir avec ses pratiques numériques pour peu qu’il respecte les autres, qu’il nous faut bâtir.
« Dans ce rapport, ce qui saute aux yeux, c’est l’incompétence »- Ecrans

tags: ecrans hadopi neutralité
Du ROI (Return On Investment) au RONI (Risk Of Non-Investment) « internet et opinion(s) – françois guillot et emmanuel bruant – web, médias, communication, influence, etc.

tags: socialmedia
Symfony YAML - A PHP library that speaks YAML

Symfony YAML is a PHP library that parses YAML strings and converts them to PHP arrays. It can also converts PHP arrays to YAML strings.

tags: php yaml symfony
Présentation de Textwheel - ZZZ

tags: spip
Appelle-moi dès que tu bloques - romy.tetue.net

tags: spip
ErgoLibre pour l'ergonomie des logiciels libres

Cette association a pour but de promouvoir l’ergonomie des logiciels libres ; de favoriser les rencontres et les échanges d’information et d’expérience entre professionnels de cette discipline ; de soutenir et de faciliter les recherches et les études en IHM.

tags: Ergonomie floss
SPIP pour les débutants - davduf|net - Annotated

tags: spip
- Et si on lançait un site destiné aux débutants de SPIP ? Entre aide de base, pédagogie et pistes pour se lancer. Avec une idée simple : ni dupliquer ni se substituer à ce qui existe déjà, mais servir de gare d’aiguillage aux nouveaux venus...

Posted from Diigo. The rest of my favorite links are here.

Mes liens de la semaine n°3

Valéry — Sun, 08 Aug 2010 07:30:00 +0100

Aucune vie privée avec Internet Explorer - Gizmodo - - Annotated
- Les ingénieurs Microsoft voulaient une fonctionnalité intégrée par défaut à Internet Explorer 8 pour limiter les pouvoirs des third-party tracking cookies selon le Wall Street Journal.
- Microsoft à fait un 180° et les options de protection ne sont pas actives par défaut.
- L’acquisition d’aQuantive, une agence de Web-ad par Microsoft semble être encore une raison de plus de baisser la protection de la vie privée des utilisateurs au profit des annonceurs.
Free Blog Ware: Pourquoi je déteste Drupal (et la plupart des autres CMS) - Annotated

tags: drupal cms
- Voici donc les reproches que je peux adresser à Drupal
- L'approche procédurale
- Une modularité très discutable
- modules hétéroclites, et surtout très souvent en conflit les uns avec les autres
- Un emploi déraisonnable de la base de données
- Dans Drupal, tout ou presque se passe dans la base de données
- les CMS sont conçus uniquement pour un public de non-développeurs
- Pour un développement sur la base d'un cahier des charges précis, utilisez des frameworks, c'est-à-dire des environnements maîtrisés de bout en bout, lesquels vous fourniront le cadre nécessaire pour écrire un code métier efficace et maintenable
The Facebook Gravitational Effect | Monday Note - Annotated

tags: facebook
- social networks represent about 10% of the total internet time
- Facebook dwarfs other social networks: worldwide, measured in time per month
- Of the half billion users, 250 million are logging every day
- 150 million access Facebook through their mobile phone
- on the US market, users spend more time on Facebook than on sites owned by Google, Microsoft and Yahoo combined
- Facebook accounts for 68% of social networks referrers, vs. 25% for Twitter and only 4% for LinkedIn
- Social Networks not only act as powerful traffic attractor and referrals, but also as gateways toward other sites: this takes place when users log on one site using their ID from another.
- Twitter is, by far, the best tool for quickly sharing a news item
- The “Like” feature,introduced by Facebook last April at its F8 Developer Conference, seems to be a traffic booster.
- on mature markets such as the US, 75% of people get their news through social recommendation
Save paper & ink printing only what you want « PrintWhatYouLike.com

PrintWhatYouLike is a free online editor that lets you format any web page for printing in seconds!

tags: tool print

Posted from Diigo. The rest of my favorite links are here.

Mes liens de la semaine n°2

Valéry — Sun, 01 Aug 2010 09:12:00 +0100

Au sujet de france.fr :

Au sujet des réseaux sociaux :

Et encore :

Mes liens de la semaine N°1

Valéry — Sun, 25 Jul 2010 11:31:00 +0100

Une sélection de mes lectures de la semaine :

E-Blogs France de Wikio : La revue européenne des Blogs : excellente initiative de Wikio consistant à sélectionner et traduire des billets des blogs les plus populaires dans cinq pays d'Europe.
10 Useful WordPress Security Tweaks - Smashing Magazine : intéressant, même si vous n'utilisez pas Wordpress
Baromètre des navigateurs : IE sous pression sur Écrans
An awesome visual summary of cognitive biases : psychologie appliquée au marketing

Les inscriptions à Paris Web 2010 sont ouvertes

Valéry — Mon, 12 Jul 2010 07:32:00 +0100

Les inscriptions à l'édition 2010 de Paris Web sont ouvertes depuis quelques jours déjà. Je compte bien me rendre à ce rendez-vous, désormais traditionnel : il s'agit en effet de la cinquième édition.

Tous ceux qui travaillent à la création de sites internet y trouveront leur compte. Les archives des années précédentes, notamment les vidéos des conférences ou les présentations des intervenants, tous disponibles en ligne en témoignent. Cf. http://www.paris-web.fr/2009/Ils-parlent-de-Paris-Web-edition-2009

L'édition 2010 a lieu du 14 au 16 octobre prochain.

Premiers jours avec un téléphone Androïd

Valéry — Mon, 10 May 2010 21:09:00 +0100

Il était grand temps de se débarrasser de ce HTC DualTouch, un soi-disant smartphone sous Windows Mobile. Cette abomination ergonomique n'apportait pas même satisfaction pour le minimum que l'on aurait pu en attendre : la compatibilité avec Windows et Outlook. Arrivé en fin d'engagement j'ai donc tout naturellement téléphoné à SFR pour résilier... ou obtenir un Androphone dans les conditions des nouveaux abonnés.

Je teste donc depuis quelque jours le HTC Legend sous Androïd, l'OS mobile de Google. Pour l'instant la satisfaction est totale :

un écran lumineux et net, très réactif ;
un système d'exploitation simple et intuitif ;
des applications abondantes et simples à installer et désinstaller ;
une connexion plug and play au PC ;
la synchronisation avec les application Google et les principaux réseaux sociaux, soit par des applications livrées avec le téléphone (Google, Facebook, Flickr) soit installées depuis l'Android Market (Foursquare, Diigo). Les fonctions de partage (de liens, de photos) sont également branchées directement sur ces destinations ;
Enfin et surtout la possibilité de se connecter en WiFi tant le web mobile est une aimable fiction quand seule la 3G est disponible.

Quant au hardware, il est superbe et solide.

Les applications que j'ai testé sont de quatre types :

seul reproche, mineur est que l'OS est tellement simplifié que certaines fonctionnalités de base nécessitent l'installation d'une application : fermer les applications ou l'explorateur de fichier par exemple...
des applications sociales ou de communication supplémentaires : Foursquare, partage de liens vers Diigo, utilisation MSN Live messenger...
des appli liées au contenu : Le Monde, ou Rue89 qui permettent de télécharger des contenus et de les consulter hors connexion, ou ZD Net ;
des "gadgets" comme le lecteur de QR codes ou le nouveau et bluffant Google Goggles, dont le moindre intérêt n'est pas de dégouter les possesseurs de iphone qui n'y ont pas accès.

Les fameuses Goggles permettent de reconnaître, via l'appareil photo du téléphone faisant office de scanner, la couverture d'un livre ou d'un ouvrage, ou son titre, un code barre, un logo... et de mener à une page de résultats de recherche correspondant. On peut aussi insérer dans son annuaire les coordonnées présentes sur une carte de visite, et surtout sélectionner un texte et en obtenir la traduction. On frémit à l'idée que de telles technologies puissent être à terme couplée à celles de reconnaissance des visages.

Petite déception avec Opera Mini, que j'utilisais sur Windows Mobile : il ne reconnaît pas le multitouch. Son système d'onglets restent toutefois meilleur que celui du navigateur par défaut, mais ce dernier est tellement bien intégré aux autres fonctionnalités qu'on a plutôt tendance à l'utiliser. Fennec, version mobile de Frefox est disponible en version alpha. Je l'installe dès la beta.

Dans les conditions idéales, batterie pleine et connecté au WiFi du domicile, l'appareil est parfait : radio, vidéo, musique, navigation web, etc. s'utilisent confortablement installé sur le canapé. Du coup la perspective de voir des tablettes sous Androïd sortir prochainement (et pas en 7 pouces avec la version 1.5 comme chez Archos) est enthousiasmante, sous réserve que les prix soient plus raisonnables que ceux du iPad (soyons sérieux, on ne peux pas payer plus cher qu'un netbook, une machine qui a beaucoup moins de fonctions, bel écran tactile ou non).

Le reste du temps, on doit surveiller la batterie (un widget permet de désactiver les fonctions qui consomment de l'énergie lorsqu'on utilise pas la machine), et renoncer à utiliser le web tant qu'un réseau WiFi n'est pas disponible : la 3G n'est tolérable que pour des situations de dépannage. Le web mobile finalement en est au stade de la téléphonie mobile du temps du Bi-Bop.

Le succès des applications mobiles et tablette(s), comme des applications desktop connectées font conclure à certains que au final, le web c'est naze, et que les standards freinent le progrès plus qu'autre chose. Pour lire ce joli troll (en anglais) : The web sucks. Browsers need to innovate.

Un domaine par langue pour un site SPIP

Valéry — Sun, 14 Mar 2010 08:59:00 +0000

Ce billet rassemble quelques notes sur les manipulations que j'ai mis en oeuvre pour permettre l'utilisation de plusieurs domaines sur le site du webzine Le Taurillon, construit en SPIP. N'hésitez pas à faire part en commentaire de vos observations sur la méthode retenue.

SPIP propose tout ce qu'il faut pour construire un site web éditorial de type magazine. C'est même ce qu'il fait le mieux. De même il dispose de nombreuses possibilités pour la construction d'un site multilingue.

Le Taurillon, conçu initialement en français, rapidement pendant l'été 2005, est un site désormais publié en quatre langues. Chaque langue correspond en réalité à une publication différente car, même si de nombreux articles sont traduits, les équipes éditoriales sont distinctes.

Le Taurillon est publié par JEF-France, en français, utilise taurillon.org ;
The New Federalist est édité par JEF-Europe en anglais, a pour domaine thenewfederalist.eu ;
Eurobull est publié par JEF-Italie, en italien, avec eurobull.it ;
Treffpunkt Europa, enfin, est publié par JEF-Allemagne, en allemand, donc, avec treffpunkteuropa.de.

Le site est organisé à l'aide d'un secteur par langue. Chaque secteur (rubrique de premier niveau) ne contiens donc que des articles dans la même langue.

Les articles et rubriques ayant une langue, il est possible au sein de la boucle ARTICLE, ou RUBRIQUE, d'utiliser la balise #LANG pour récupérer la langue du contexte. Pour le reste du site il faut utiliser un paramètre de langue dans l'URL : &lang=fr que l'on récupère à l'aide de #ENV{lang}. Le critère {lang} permet ensuite dans les boucles l'acceptant de filtrer le contenu par langue. Pour en savoir plus lire la rubrique "Multilinguisme" sur site "Programmer avec SPIP 2.0".

C'est ainsi le cas de la page d'accueil. Ainsi, http://www.taurillon.org/?lang=fr affiche la page d'accueil du Taurillon, mais http://www.taurillon.org/?lang=de affichera la page d'accueil... de Treffpunkt Europa.

Un domaine par langue

La première étape a été de demande aux propriétaires des domaines de les configurer avec les NS de OVH, l'hébergeur du site. Chez ce dernier, j'ai pu faire pointer tous les domaines vers le même répertoire, celui où est installé le site, à l'aide d'enregistrements DNS de type A.

Par défaut, c'est la page francophone (langue par défaut du site) qui s'affiche. Pour que chaque domaine retrouve la page d'accueil correspondante c'est le fichier .htaccess qui est appelé à l'aide :

RewriteCond %{HTTP_HOST}  ^www.thenewfederalist\.eu$
RewriteRule (.*) spip.php?lang=en [QSA,L]

Jusqu'à la page d'accueil, tout vas bien, donc. Le problème est qu'un clic vers un article dans une autre langue conserve le nom de domaine actif. On se retrouve donc avec des articles en français ou en allemand sous le domaine anglophone.

Et c'est mal.

Pour parer à cette situation j'ai mis en place deux systèmes :

1) Indiquer l'URL canonique de la page : afin de ne pas troubler les robots (c'est fragile ces engins), j'ai ajouté dans le head une ligne indiquant l'URL canonique de la page, c'est à dire l'URL que je leur demande de prendre en compte pour chaque page. Un article en allemand aura donc dans le code de la page une ligne du type :

<link rel="canonical" href="http://www.treffpunkteuropa.de/Chronik-eines-angekundigten-Todes" />

2) Pour les humains, et les robots malcomprenants, je modifie les #URL_ARTICLE et #URL_RUBRIQUE, qui génèrent un lien relatif, pour proposer un lien absolu avec le domaine.

Pour ce faire j'avais envisagé d'utiliser le plugin "Multidomaines". Celui-ci permet, à l'aide d'un champ Extra (oui il faut installer aussi ce plugin), d'associer un domaine à une rubrique. Je ne l'ai pas utilisé pour trois raisons : je n'ai pas besoin de toutes ses fonctions, je n'aime pas (plus) installer trop de plugins (impact sur lesperformances, complique la maintenance et l'évolutivité du site), enfin, quand je l'ai activé j'ai eu un message d'erreur et je n'ai pas insisté.

J'ai utilisé les chaines de langue de SPIP : j'ai créé une chaine <:domaine:> et indiqué dans chaque fichier de langue le domaine correspondant. Je peux donc utiliser cette chaine partout où j'ai besoin du domaine, car je dispose de la langue dans le contexte partout, soit dans la boucle, soit dans l'URL (paramètre lang). Par exemple dans une boucle ARTICLES, j'indique comme lien href="http://www.valeryxavierlentz.eu/index.php?post/<:domaine:>/#URL_ARTICLE".

Les limites de l'approche retenue

Naturellement, cette méthode a des limites.

elle implique de modifier tous les squelettes. C'est également le cas avec le plugin qui propose ses propres balises. Pour l'instant je n'ai traité que les squelettes essentiels. J'adopterai l'approche systématiquement lors d'une refonte, et au fur et à mesure d'ici là.
elle ne peut avoir d'effet pour une boucle affichant des contenus en plusieurs langues (une boucle FORUM par exemple, celle-ci n'acceptant pas le critère lang) : les URL utilisent alors le domaine en cours.
les statistiques de fréquentation sont en partie faussées, chaque URL étant comptabilisée comme un site référent tiers. Il faut que j'étudie les configurations possibles dans Google analytics

Méthodes alternatives

Plusieurs autres méthodes sont à étudier.

le mutualisé : plusieurs sites SPIP (dans des répertoires différents) qui pourraient partager une même base de données (pour permettre la gestion des liens de traduction ou des auteurs communs). À vérifier: cette solution permet-elle de partager un même jeu de squelettes ?).
Utilisation du htaccess pour réécrire l'URL en fonction du paramètre lang pour y placer le bon domaine : je ne suis pas sur que ce soit possible, il faut que j'étudie plus la syntaxe pour RewriteCond

Un billet à mettre à jour donc, si je découvre une meilleure méthode. Mais pour l'instant l'essentiel semble fonctionner.

Mise à jour

31/03/2010 : Le carnet-SPIP propose différentes méthode, notamment à base de php. Cf. http://www.spip-contrib.net/MultilinguismeExemple6

Premier anniversaire de Bloggingportal.eu

Valéry — Tue, 26 Jan 2010 12:48:00 +0000

Ce 26 janvier marque le premier anniversaire du site Bloggingportal.eu, un aggrégateur de contenu visant à favoriser la visibilité de l'euroblogosphère émergente.

Massivement multilingue, le site propose une sélection des meilleurs billets du jour, et un accès à l'ensemble de ce qui a été publié sur les 500 blogs enregistrés.