Recent post

mardi 31 mars 2015

Filled Under:

des modèles responsive gratuits pour Blogger




Design : des modèles responsive gratuits pour Blogger



Google a annoncé que les sites compatibles avec les mobiles seraient mieux mis en avant que les autres dans les résultats de recherche à partir du 21 avril. Si votre site n’a pas encore opté pour le responsive design, il est donc grand temps de s’y mettre !

Astuce à tester

 

Imaginons que vous ayez passé un temps fou à personnaliser votre design de blog… pour découvrir au final grâce au test de compatibilité Google qu’il n’est pas du tout adapté aux mobiles. Pour éviter de tout recommencer à zéro, je vous suggère d’essayer la petite astuce qui suit.

Sur les mobiles, Blogger essaie par défaut d’adapter votre design principal en le redimensionnant. Le problème, c’est que si le design n’est pas responsive (= compatible mobiles), il ne va pas se redimensionner comme il faut : les textes et les liens seront trop petits, les icônes trop collées les unes aux autres, il faudra scroller pour voir le menu en entier. Bref, catastrophe à bord ! Et bien sûr, Google considérera que votre site n’est pas adapté aux mobiles.

La solution consiste à obliger Blogger à choisir un modèle mobile parfaitement adapté, sans toucher à votre design principal : en résumé, si Blogger détecte que votre visiteur est sur un ordinateur, il lui affichera votre beau design personnalisé. Sur un mobile, il affichera un design par défaut, différent de votre design principal mais totalement adapté à la taille de l’écran.

Dans le menu « Modèle », cliquez sur la petite roue située juste sous le modèle Mobile puis choisissez l’option « Oui, afficher le modèle mobile sur les mobiles ». Ça oblige Blogger à afficher le modèle mobile de votre choix au lieu de tenter de redimensionner votre modèle principal. Choisissez ensuite un modèle dans la liste déroulante et après avoir enregistré, refaites le test de compatibilité mobile Google : en principe, votre blog devrait passer le cap de la validation !

                   




tout a telecharger gratuitement


C’est une solution imparfaite car votre design sur les mobiles sera un design par défaut de Blogger et non un design vraiment personnalisé à votre image. Par ailleurs, cela signifie que votre thème principal risque de ne pas être adapté à certaines tailles d’écran intermédiaires (tablettes, petits écrans d’ordinateur, etc).

Modèles Blogger gratuits et responsive

Vous trouverez ci-dessous une sélection de 12 modèles pour Blogger : ce sont tous des thèmes gratuits en responsive design. Je les ai testés sur l’outil de compatibilité mobile de Google et ils sont tous considérés comme adaptés aux mobiles à l’heure où j’écris cet article. En effet, certains sites vous annoncent que les templates sont compatibles mais en réalité, ils ne répondent pas aux critères de lisibilité de Google (texte trop petit par exemple, etc).

Classic Tradition par VeeThemes

Ce modèle Blogger épuré fait la part belle aux images, affichées en grande taille. Il possède un menu mobile, est compatible avec les principaux navigateurs (Chrome, Mozilla, Safari, Internet Explorer 8+). Il est également livré avec un widget qui affiche des suggestions d’articles similaires en bas de chaque post et un widget pour afficher un article aléatoire.




                               Démo                 Télécharger

Trendy par Themexpose

Pour les adeptes des menus latéraux, impossible de ne pas parler de Trendy, un joli design signé Themexpose, qui propose une version rouge (ci-dessous) et une version où c’est le vert qui domine. Des titres bien visibles et en majuscules et une présentation claire pour ce thème responsive gratuit.




                                       Démo                 Télécharger

Sora Craft par Sora Templates

Tous les thèmes de Sora Templates ne passent hélas pas avec succès le test de compatibilité de Google… mais c’est bon pour Sora Craft ! Un thème gratuit au look assez pro, avec un menu mobile qui fonctionne sans problème.





                               Démo                      Télécharger

Simplify par My Blogger Themes

Simplify est un thème responsive gratuit pour Blogger qui va à l’essentiel sans perdre d’espace en haut de page pour le logo, affiché sur la même ligne que le menu. Il comporte aussi un moteur de recherche bien visible. Ne vous arrêtez pas au fond d’écran façon « carreaux de piscine », Blogger vous permet de modifier le code de vos templates donc il est assez facile de le retirer et de le remplacer par un fond uni ou différent pour un résultat plus épuré !




                               Démo               Télécharger

Wedding Mag par Templateism

Ce thème 100% responsive pour Blogger permet d’afficher une grande bannière en page d’accueil si vous le souhaitez et présente les posts d’une manière claire et concise qui donne en un clin d’oeil une idée du contenu. Le design permet aussi d’afficher des suggestions d’articles sous chaque post.




                                 Démo                  Télécharger

Bridal par Sora Templates

Comme Wedding Mag, Bridal est un thème présenté autour de l’univers du mariage… mais adaptable à bien d’autres thématiques ! Un menu déroulant, un slider en page d’accueil pour mettre en valeur des photos, une place importante donnée à l’image et un design responsive bien sûr !





                                   Démo                  Télécharger

Dream Grid par OddThemes

Un design très chic avec un menu latéral sur fond noir, un affichage « type grid » très lisible et efficace.





                                  Démo                 Télécharger

Loveria par Sora Templates

Loveria est un thème épuré aux couleurs acidulées. Avec un footer sur trois colonnes, un slider pour mettre en valeur les derniers posts et un menu avec effet de survol sur les liens, ce modèle Blogger permet d’imaginer pas mal de possibilités de personnalisation.




                                     Démo                     Télécharger

Proxima par ThemeXpose

Un modèle Blogger gratuit dédié aux adeptes des images ! Ces thèmes ne me paraissent pas toujours très fonctionnels car ils obligent le visiteur à scroller pour accéder au contenu… mais si vous adorez, voici un thème pour vous. En plus du grand slider en page d’accueil, les posts eux-mêmes sont présentés grâce à des images avec des effets de survol.




                                  Démo                     Télécharger

Velocity par VeeThemes

Un autre très joli design signé VeeThemes avec Velocity. Il est mobile-friendly, il est sobre tout en ayant une touche de couleur pour égayer tout ça.




                               Démo                  Télécharger

Pratico par ThemeXpose

Sobriété pour ce modèle Blogger qui a tout de même sa petite touche bien à lui avec son effet « coin de page corné » et son menu fixe en haut de page (le menu reste visible même quand le visiteur descend sur la page).


                                    Démo                   Télécharger

FreshNews par PBTemplates

FreshNews est un thème assez complet : des menus déroulants, un slideshow, un widget pour afficher des articles similaires, un fil d’Ariane pour indiquer à vos visiteurs où ils se trouvent. Beaucoup de possibilités avec ce template gratuit ! Le fond de base est sombre mais il peut être changé sans problème.
NOTE – La démo est considérée comme « non adaptée aux mobiles » par Google mais en installant le modèle sur Blogger et en choisissant dans modèle mobile l’option « Personnaliser », tout marche bien !





                                Démo                 Télécharger

J’espère que cette sélection vous donnera quelques idées pour personnaliser votre blog Blogger… et vous montrera un échantillon de ce qu’il est possible de faire sur cette plateforme ! Vous avez eu du mal à trouver votre thème de blog la première fois ?

0 commentaires:

Enregistrer un commentaire