2010 - Thèmes Version 2 - L'époque de la standardisation (partie 2)

Blogger - Thèmes 2010 - Layouts Version 2

En 2010, Blogger franchit un nouveau cap avec l’arrivée des thèmes Version 2. Plus modernes, plus flexibles et portés par un outil inédit de création visuelle, ils ouvrent la voie à une personnalisation jusqu’alors inédite.

Entre polices web, arrière-plans signés iStockphoto et mise en page repensée, Blogger se dote enfin d’un visage contemporain, capable de rivaliser avec les grandes plateformes de l’époque. Une nouvelle ère commence.

Un peu d'histoire

Retour au contexte (2009–2010)

À la fin des années 2000, Blogger n’est plus un petit atelier artisanal : la plateforme fête déjà ses dix ans d’existence et peut s’enorgueillir d’avoir vu éclore des millions de blogs à travers le monde. Pour marquer l’événement, Google multiplie les nouveautés : apparition du marqueur d’expansion pour raccourcir les articles, intégration des vignettes de commentaires, introduction des nuages de libellés pour une navigation plus visuelle, ou encore de nouveaux skins pour la fameuse navBar. Tout cela témoigne d’une volonté claire : montrer que Blogger continue d’évoluer et n’est pas figé dans ses acquis.

Mais derrière cette vitalité, un vent nouveau souffle sur le web. La concurrence est plus forte que jamais. WordPress.com s’impose comme une alternative sérieuse, offrant une grande variété de thèmes professionnels et une souplesse technique qui séduit les créateurs confirmés. Tumblr, de son côté, séduit les plus jeunes avec sa simplicité et son côté communautaire, ouvrant la voie à une culture de micro-blogging visuel. Quant à TypePad ou Posterous, ils cherchent à occuper la niche des professionnels et des utilisateurs en quête d’outils plus pointus.

Dans ce contexte bouillonnant, Blogger ne peut se contenter de petites évolutions incrémentales. Google a conscience qu’il faut frapper fort pour maintenir la plateforme dans la course. Une refonte en profondeur s’impose : plus moderne, plus standardisée, et surtout capable de répondre aux attentes d’un web qui entre dans l’ère du 2.0, marqué par la personnalisation, la rapidité et l’explosion du partage social.

C’est précisément ce qui se prépare en coulisses, et l’année 2010 va devenir le théâtre de ce virage majeur.

Les grandes nouveautés de 2010

L’année 2010 s’ouvre avec une série d’innovations qui vont changer la manière dont on conçoit un blog sur Blogger. La plus marquante est sans doute l’arrivée des pages statiques. Jusque-là, un blog restait enfermé dans une logique chronologique : articles classés par date, sans réelle possibilité de créer des rubriques fixes. Avec cette nouveauté, il devient enfin possible d’ajouter une page “À propos”, une section “Contact” ou encore une présentation permanente d’un projet. Une avancée qui transforme Blogger en un outil hybride : à la fois carnet personnel et véritable petit site web.

Pour accompagner ce changement, Google introduit le gadget Liste de pages. Il offre aux blogueurs la possibilité de créer un menu clair, sous forme d’onglets ou de liens, facilitant la navigation entre les différentes sections. C’est un tournant symbolique : Blogger se rapproche d’une structure de site classique, donnant plus de crédibilité aux blogs qui, jusque-là, pouvaient paraître limités ou trop informels.

Mais 2010 n’apporte pas que des bonnes surprises. Google déploie aussi le système d’auto-pagination. L’idée est simple : optimiser la vitesse de chargement en limitant automatiquement la quantité de contenu envoyée à chaque page, en fonction de son poids en HTML. Résultat : des blogs plus rapides, un meilleur confort de lecture… mais aussi une certaine frustration. Beaucoup de blogueurs dénoncent une perte de contrôle sur le nombre d’articles affichés en page d’accueil ou dans les archives. Une décision qui illustre bien le dilemme de cette époque : améliorer les performances techniques, quitte à bousculer les habitudes des utilisateurs.

Entre ces nouveautés pratiques et ce choix controversé, l’année 2010 confirme que Blogger n’a pas peur de trancher. La plateforme cherche à redéfinir son identité, prête à faire quelques paris audacieux pour préparer le terrain aux changements encore plus profonds qui se profilent.

La naissance des Layouts Version 2

L’été 2010 marque un véritable basculement : après quatre années d’expérimentation avec Blogger Beta et les Layouts V1, Google dévoile enfin les Layouts Version 2. Derrière ce nom un peu austère se cache une révolution silencieuse qui va donner à la plateforme un souffle de modernité et d’uniformité.

Tout commence avec le lancement de six thèmes pharesSimple, Picture Window, Awesome Inc., Watermark, Ethereal et Travel. Leur particularité ? Ils ne sont pas de simples variations graphiques bricolées, mais de véritables modèles standardisés, construits sur un XML soigné, structuré et réfléchi. Chaque thème devient un canevas stable sur lequel les utilisateurs peuvent bâtir, personnaliser et expérimenter. Pour la première fois, Blogger sort de l’hétérogénéité de ses débuts et propose une base cohérente.

Mais la grande nouveauté de cette génération, c’est le Blogger Template Designer (l’Outil de création de thèmes). Cet éditeur visuel change la donne : en quelques clics, on peut modifier la mise en page, choisir ses couleurs, ajuster la largeur des colonnes ou encore remplacer l’arrière-plan par une image tirée d’une immense banque en ligne, grâce à un partenariat avec iStockphoto. À cela s’ajoute l’intégration des polices web issues de Google Fonts, encore balbutiant à l’époque, mais déjà porteur d’une liberté graphique inédite.

Ce n’est plus seulement un pas en avant : c’est un bond technologique et esthétique. Pour la première fois, la personnalisation n’est plus réservée aux bidouilleurs du code XML : tout le monde peut modeler son blog à son goût, avec un rendu visuel digne des standards du web moderne de l’époque. Les Layouts V2 incarnent donc un double mouvement : professionnaliser l’apparence des blogs tout en démocratisant l’accès aux outils de design.

Une promesse qui allait rapidement séduire des millions d’utilisateurs, et repositionner Blogger face à ses concurrents.

Un service en pleine confiance

En 2010, Blogger ne se contente pas de moderniser son apparence : la plateforme gagne aussi en crédibilité et en reconnaissance. Une enquête menée par le cabinet Royal Pingdom classe Blogger comme le service de blogging le plus fiable de l’année. Avec un taux de disponibilité de 100 % pour l’interface comme pour les blogs hébergés, le service dépasse ses principaux concurrents : WordPress.com, Tumblr, TypePad et Posterous. Pour une plateforme souvent critiquée pour ses lenteurs ou ses plantages à ses débuts, c’est une revanche éclatante.

En coulisses, l’ingénierie Google tourne à plein régime. 2010 marque l’apparition de nouvelles fonctionnalités stratégiques :

  • Les statistiques en temps réel, intégrées directement au tableau de bord, permettent aux blogueurs de suivre leurs audiences sans passer par Google Analytics uniquement.

  • Deux gadgets inédits apparaissent : Statistiques et Articles populaires, qui offrent une visibilité immédiate sur les contenus les plus lus.

  • La gestion des commentaires et du spam est profondément améliorée, renforçant la convivialité et la sécurité des échanges.

  • Enfin, les premiers boutons de partage font leur entrée, signe que Blogger s’aligne sur l’essor des réseaux sociaux et du partage viral.

Avec ces avancées, Blogger s’impose non seulement comme un outil fiable, mais aussi comme une plateforme tournée vers l’avenir, capable de rivaliser avec ses concurrents et de s’adapter à la transformation rapide du web. L’année 2010 devient ainsi synonyme de maturité : Blogger n’est plus seulement un pionnier historique, il est désormais un acteur solide et confiant, prêt à embrasser les évolutions à venir.

Vers une nouvelle génération

À peine les Layouts Version 2 lancés et adoptés, Google regarde déjà plus loin. L’année 2010 n’est pas seulement celle d’un renouveau graphique : elle sert aussi de tremplin vers une nouvelle génération d’outils et d’expériences.

En interne, les équipes de Blogger planchent sur une interface entièrement repensée, plus fluide, plus moderne, pensée pour s’intégrer harmonieusement à l’écosystème Google. L’objectif est clair : mettre fin au tableau de bord un peu vieillot hérité de la première décennie et offrir une expérience digne du web 2.0.

Parallèlement, l’essor fulgurant des smartphones pousse Google à accélérer. C’est dans ce contexte que se préparent les premiers thèmes mobiles : une réponse directe à l’explosion de la navigation sur petits écrans. Pour accompagner ce virage, une application Blogger est mise en chantier, afin de permettre aux utilisateurs de publier et de gérer leurs blogs depuis n’importe où.

Enfin, dès la fin de l’année, Google commence à lever le voile sur une innovation plus expérimentale : les vues dynamiques. Basées sur JavaScript et Ajax, elles offrent une expérience de navigation immersive, transformant la lecture d’un blog en une sorte de galerie interactive. Encore balbutiantes, elles annoncent cependant la volonté de Google d’explorer des formats plus visuels et plus engageants.

En résumé, 2010 n’est pas une fin en soi : c’est une année charnière, où Blogger, fort de sa fiabilité et de ses nouveaux thèmes, prépare déjà l’étape suivante. Une étape qui ouvrira la voie à la mobilité, à de nouvelles interfaces, et à une manière plus vivante de parcourir les contenus en ligne.

Épisode suivant - 2011 - Thèmes Version 2 Mobile - Mobilis in Mobili

Les thèmes officiels

Lancée en 2010, cette nouvelle génération marque une vraie rupture avec les Layouts V1. Pour la première fois, Blogger propose une collection cohérente de 6 thèmes déclinés en 27 variantes, conçus pour être modulables et durables. Derrière leur apparente simplicité, ils partagent une même base XML solide, pensée pour offrir une personnalisation fluide grâce au flambant neuf Outil de création de thèmes.

Avec des arrière-plans issus d’iStockphoto, un large choix de polices web et des réglages accessibles à tous, ces modèles apportent une modernité bienvenue et permettent aux blogueurs de donner un style unique à leur site sans écrire une ligne de code. C’est ce qui explique sans doute leur longévité : plus d’une décennie plus tard, ils restent toujours disponibles depuis le tableau de bord, preuve de leur fiabilité et de leur importance dans l’histoire de Blogger.

Simple

Nom: Pale

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Bold

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Dark

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Deep

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Literate

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Wide

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Simply Simple

Date: 09/2010

Classification: Desktop

Theme Version: 2

Télécharger

Picture Window

Nom: Open

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Shade

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Screen

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Awesome Inc.

Nom: Dark

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Light

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Groovy

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Renewable

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Artsy

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Icy

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Watermark

Nom: Birds

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Navigator

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Flower

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Bubblegum

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Ethereal

Nom: Hummingbirds 2

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Blossoms 1 Blue

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Leaves 1

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Travel

Nom: Studio

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Flight

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Beach

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Nom: Road

Date: 01/2010

Classification: Desktop

Theme Version: 2

Télécharger

Macro - Quelques notions

Remarque :

La macro étant une norme en fin de vie, Blogger Code PE ne conserve plus que ces notions de bases dans cette archive.

La Macro est un langage complémentaire au langage XML de Blogger. Il a été instauré dans les Layouts Version 2, afin de rendre le contenu du blog flexible en fonction des réglages paramétrés dans l'Outil de création de thèmes Blogger. En d'autres termes, le système gère les sections et les widgets qu'elles contiennent.

Dans le code XML du thème, une macro-inclusion doit d'abord être créée, de préférence, après la balise </body>. Le contenu doit être en mesure de générer une balise <b:section> aux endroits où sera appelée la macro-inclusion.

Création de la macro-inclusion (Version officielle de distribution)
<macro:includable id='sections' var='col'>
  <macro:if cond='data:col.num == 0'>
  <macro:else/>
    <b:section mexpr:class='data:col.class'
               mexpr:id='data:col.idPrefix + "-1"'
               preferred='yes'
               showaddelement='yes'/>

    <macro:if cond='data:col.num gte 2'>
      <table border='0' cellpadding='0' cellspacing='0' mexpr:class='"section-columns columns-" + data:col.num'>
      <tbody>
      <tr>
        <td class='first columns-cell'>
          <b:section mexpr:class='data:col.class' mexpr:id='data:col.idPrefix + "-2-1"'/>
        </td>

        <td class='columns-cell'>
          <b:section mexpr:class='data:col.class' mexpr:id='data:col.idPrefix + "-2-2"'/>
        </td>

        <macro:if cond='data:col.num gte 3'>
          <td class='columns-cell'>
            <b:section mexpr:class='data:col.class' mexpr:id='data:col.idPrefix + "-2-3"'/>
          </td>
        </macro:if>

        <macro:if cond='data:col.num gte 4'>
          <td class='columns-cell'>
            <b:section mexpr:class='data:col.class' mexpr:id='data:col.idPrefix + "-2-4"'/>
          </td>
        </macro:if>
      </tr>
      </tbody>
      </table>

      <macro:if cond='data:col.includeBottom'>
        <b:section mexpr:class='data:col.class' mexpr:id='data:col.idPrefix + "-3"' showaddelement='no'/>
      </macro:if>
    </macro:if>
  </macro:if>
</macro:includable>

Note additionnelle pour les webmasters : La longueur de ce code peut être considérablement réduit avec l'aide de la nouvelle génération d'opérateurs et de balises.

Et enfin, aux endroits où sont traditionnellement entreposés les widgets, les balises <b:section> et tout le contenu, sont remplacés par l'appel de la macro-inclusion avec une série de paramètres prédéfinis.

Ces paramètres sont stockés dans l'objet data:col.

Appel de la macro-inclusion
<macro:include id='main-column-right-sections' name='sections'>
  <macro:param default='2' name='num'/>
  <macro:param default='sidebar-right' name='idPrefix'/>
  <macro:param default='sidebar' name='class'/>
  <macro:param default='true' name='includeBottom'/>
</macro:include>

Lorsque l'utilisateur ajoutera un nouveau gadget, celui-ce sera automatiquement placé dans des balises <b:section-contents> à la fin du thème, juste avant la balise </html>.

Spotlight

Populaires cette semaine

Call-to-Action - L'appel à l'action

HowTo & étapes numérotées