Valéry-Xavier Lentz.eu

To content | To menu | To search

Sunday 29 August 2010

En chantier : le redesign du Taurillon

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

  • 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.

    • 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.
    • 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
    • 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.
    • 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.
  • 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.

  • 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.

Sunday 22 August 2010

Mes liens de la semaine n°4

  • 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
    • Christian Paul, l’auteur de cette pro­po­si­tion de loi, est député socia­liste de la Nièvre depuis 1997. Il fait parti des rare dépu­tés (autant à droite à qu’à gauche) dis­po­sant de bonne connais­sance sur le monde du numé­rique, et s’est dis­tin­gué lors du pas­sage de la loi Hadopi à l’Assemblée par son oppo­si­tion féroce à la loi.
    • Aujourd’hui, cer­tains de ces acteurs sont ten­tés, par recherche d’un pro­fit à court terme, de por­ter atteinte au carac­tère ouvert et égali­taire de l’Internet – de por­ter atteinte à sa neu­tra­lité, notam­ment en pri­vi­lé­giant tel ou tel type de com­mu­ni­ca­tion ou cer­tains contenus.
    • Elles sont déjà une réa­lité dans « l’Internet mobile »
    • l’encombrement du réseau d’un opé­ra­teur ne sau­rait consti­tuer pour ce der­nier un blanc-seing à n’importe quel fil­trage ou prio­ri­sa­tion de contenu.
    • L’inquiétude des indus­tries cultu­relles, en pleine muta­tion, peut elle aussi sus­ci­ter la ten­ta­tion de bri­der les échanges afin de faire per­du­rer des modèles écono­miques deve­nus obso­lètes.
    • La neu­tra­lité de l’Internet doit être, en quelque sorte, simi­laire à celle du réseau élec­trique.
    • L’internaute doit égale­ment retrou­ver ou conser­ver une totale liberté d’utilisation de sa connexion au réseau.
    • Comme sou­vent sur l’Internet, sous un fin ver­nis de tech­ni­cité, se cachent d’importants enjeux de société.
    • la loi doit pré­ve­nir, et ne pas seule­ment ten­ter de répa­rer quand il est trop tard.
    • Nous ne sommes ni pour le laisser-faire, ni pour une fausse régu­la­tion en trompe-l’œil affir­mant un prin­cipe en même temps qu’un droit uni­ver­sel à y déro­ger.
    • C’est une véri­table laï­cité infor­ma­tion­nelle, une neu­tra­lité de l’espace public où cha­cun est libre de venir avec ses pra­tiques numé­riques pour peu qu’il res­pecte les autres, qu’il nous faut bâtir.
    • tags: ecrans hadopi neutralité

    • tags: socialmedia

    • 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

    • tags: spip

    • tags: spip

    • 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

    • 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.

      Sunday 8 August 2010

      Mes liens de la semaine n°3

        • 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.
      • 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
      • 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
      • 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.

      Sunday 1 August 2010

      Mes liens de la semaine n°2

      Au sujet de france.fr :
      Au sujet des réseaux sociaux :
      Et encore :

      Sunday 25 July 2010

      Mes liens de la semaine N°1

      Une sélection de mes lectures de la semaine :

      Monday 12 July 2010

      Les inscriptions à Paris Web 2010 sont ouvertes

      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.

      Paris-Web 2010, j’y vais ! (du 14 au 16 octobre).

      Monday 10 May 2010

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

      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.

      Sunday 14 March 2010

      Un domaine par langue pour un site SPIP

      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="<: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

      Tuesday 26 January 2010

      Premier anniversaire de Bloggingportal.eu

      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.

      - page 1 of 13