On t’en avait parlé un peu parlé sur les réseaux sociaux ou dans notre Newsletter, mais ça fait des mois qu’on travaille d’arrache-pied sur une toute nouvelle version de notre blog de voyage Novo-monde. Il faut dire que le dernier coup de jeune qu’on avait donné à notre blog date quand même d’avril 2013 et que 4 ans dans le monde du web c’est carrément une éternité :). En plus, avec nos projets d’entreprenariats, il nous fallait une vitrine toute neuve qui reflète vraiment nos compétences actuelles dans le domaine du web.
Allez viens… on t’emmène faire un tour sur notre nouveau bébé 🙂
Novo-monde sous WordPress
Le premier très gros changement c’est que notre blog utilise dorénavant le CMS bien connu de tous: j’ai nommé WordPress.
Alors pourquoi avoir décidé de migrer notre blog sous wordpress?
Quand nous avons commencé Novo-monde, j’avais décidé de n’utiliser aucun CMS pour apprendre la programmation web sur de bonnes bases. Alors c’était effectivement une bonne idée pour le côté didactique de la chose… mais avec le temps, c’est devenu un frein pour l’évolution du site. Imagines toi, jusqu’à maintenant, toutes les pages de notre site étaient écrite à la main, en html et php ;)… Chaque fonctionnalité du site devait être codée par mes soins… Bref, on commençait à envier un peu nos copains blogueurs qui écrivaient leurs articles directement dans l’éditeur WordPress et qui bénéficiaient d’une montagne de plugins pour ajouter de nouvelles fonctionnalités à leur site. C’est donc comme ça qu’on a décidé de migrer notre site sous wordpress.
Par contre, ce à quoi on n’avait pas forcément pensé, c’est la masse de travail que représente une telle migration… Et peut-être que c’était mieux ainsi car pas sûr qu’on se serait lancé dans l’aventure si on avait su avant 🙂
Novo-monde sur mobiles et tablettes
Si tu nous lis depuis quelques temps déjà, tu sais que notre site n’était pas vraiment agréable à lire sur mobiles et tablettes. Du coup, on s’est plié en 4 pour que Novo-monde soit maintenant aussi sympa à consulter sur ton petit smartphone, ta tablette, ton laptop ou encore ton grand écran de bureau. On espère que le résultat te plaît et n’hésite pas à nous faire des remarques si quelque chose te semble bizarre pas ou que tu vois un bug 😉
Garder l’esprit de notre blog
Migrer sous wordpress, avoir un site responsive, moderne et tout et tout c’est bien joli… Mais ce qu’on voulait éviter par dessus tout, c’est de perdre la personnalité, l’esprit un peu “familial” et “bon enfant” que dégageait notre blog. On a donc bossé dur avec notre pote designer Val pour améliorer l’expérience utilisateur tout en gardant le look, les couleurs, l’ambiance qu’on aimait tant sur notre ancien site.
Quand tu arrives sur notre site, on veut que tu te sentes comme à la maison, dans ton canapé en train de discuter voyage avec 2 bons potes.
Plugin Novo-map version 2.0
Tu te rappelles du plugin WordPress Novo-map que j’avais développé pour les gens qui nous avaient demandé comment on avait intégré notre carte google map sur notre site. Eh bien maintenant qu’on utilise aussi WordPress, on peut nous aussi utiliser notre propre plugin 😉 (enfin!)… Mais il faut avouer que lorsque j’avais fait la 1ère version du plugin, j’étais encore un bleu en développement de plugin. Du coup, il était hors de question que j’utilise le plugin sur notre nouveau site sans une grosse mise à jour de ce dernier.
Voici en gros les nouveautés du plugin:
- Le code a été complètement nettoyé et retravaillé pour être plus à jour avec les standard wordpress 2017 🙂
- On peut dorénavant utiliser des pins en format svg pour un résultat parfait même sur les écrans Retina
- utilisation avec shortcode, widget ou des fonctions
- Il est maintenant possible d’afficher plusieurs map par page.
- Affichage des articles par catégories.
- Personnalisation des couleurs des maps
- …
Si tu te demandes à quoi ça peut ressembler, passe sur une sur une de nos pages catégories et cliques sur le bouton en haut à droite. Tu verras une carte apparaître avec tous nos article sur la page d’accueil et les articles de la catégorie sur les pages catégorie. Sympa non?
Pour les utilisateurs et futurs utilisateurs du plugin, sachez que la version 2.0 n’est pas encore téléchargeable (je n’ai pas encore eu le temps de mettre à jour la documentation et tout et tout). Mais j’espère avoir le temps de faire ça pour le mois de Mai. Sinon, j’aimerai aussi mettre le repository du plugin en public afin que d’autres développeurs intéressés puissent m’aider dans son développement.
Un design plus moderne
Exit la sidebar, on voulait laisser plus de place aux photos sur notre site (il faut dire qu’on essaie de s’améliorer en photo et qu’on voulait vraiment mettre ça un peu plus en avant sur le blog). Du coup, on a laissé tomber le menu latéral, mis de grandes photos en début d’articles, on mettra dorénavant aussi plus d’images qui s’ouvrent dans des lightboxes.
On a aussi revu les styles des articles avec des éléments plus homogènes, de nouvelles boxes “infos utiles” (nos trucs verts étaient vraiment moches), une nouvelle police d’écriture. On espère que le résultat actuel te plaît autant qu’il nous plaît (et n’hésite pas si tu as des suggestions à nous faire 😉 ).
Du côté technique
Pour ceux que ça intéresse, voici aussi quelques petits détails techniques:
- Notre site est en fait un thème enfant 100% fait maison du framework Genesis. Pourquoi avoir décidé d’utiliser Genesis? Simplement parce que je trouve important que les fondations d’un site (HTML5, microdonnées…) soient solides et mises à jour par une équipe de développeurs dédiée à ça. De plus, Genesis est un framework ultra flexible et qui laisse un maximum de liberté aux développeurs.
- HTTPS : Ces derniers temps, google fait le forcing pour qu’un maximum de sites passent en https (emails, notifications dans le webmaster tool)… Et comme avec let’s encrypt, le certificat ssl sont maintenant gratuits, j’ai profité de cette nouvelle version du blog pour le passer sous https.
Ce n’est que le commencement
Alors on t’avouera qu’on a beaucoup hésité à mettre notre nouveau site en ligne dans son état actuel. Même si on est déjà très fier et content du résultat actuel, on est encore loin d’avoir mis en place tout ce qu’on avait prévu. Mais après de longs mois de travail, on ressentait le besoin de sortir quelque chose et de le confronter à nos lecteurs pour avoir des feedbacks extérieurs. Les nouvelles fonctionnalités viendront donc par la suite, au fur et à mesure. Voici ce qu’on a dores et déjà prévu de faire :
- Rajouter un peu de contenu sur la page d’accueil et les pages catégories qui sont un peu vide à notre goût.
- Ajouter un menu sur la page d’accueil pour changer facilement l’affichage entre les articles récents, populaires, par catégories…
- Ajouter la fonction de recherche d’articles
- Comme beaucoup de gens semblent imprimer nos articles, on va ajouter la possibilité des les sauver en format pdf ou de les imprimer facilement.
- ajouts d’albums photos en fin d’articles.
- Mise à jour de notre e-book gratuit
- Optimiser le site pour améliorer encore son temps de chargement (j’ai fait le strict minimum pour l’instant)
- …
Évidemment, si tu as d’autres idées ou remarques, n’hésite pas à nous en faire part en commentant cet article ou en nous envoyant un petit e-mail.
Infos Utiles
On remercie infiniment notre pote Val pour son magnifique travail sur le design du site… Sans ses idées, Novo-monde n’aurait pas la même tête aujourd’hui.
Alors voilà pour les principales nouveautés de ce Novo-monde 3.0. Mais comme on te l’a dit, le site va être en constante évolution ces prochains mois et la version 3.1 ou encore 3.2 ne devraient pas tarder à voir le jour :). Donc n’hésite surtout pas à nous donner ton avis, nous faire des remarques ou encore nous dire si tu vois des bugs. Ça nous serait super utile!
En ce qui nous concerne, la tout de suite on est juste super content d’avoir ce nouvel outil de travail à notre disposition. On t’avouera qu’on a investit BEAUCOUP de temps et d’énergie dans la création de ce nouveau site et qu’on se réjouit maintenant de faire une petite pause dans le développement et d’enfin l’utiliser pour te faire voyager.
Alors je dois dire que je suis jaloux pour plusieurs points. D’abord le redesign, je suis en plein dans cette réflexion, notamment pour la même raison (pas très mobile friendly mon blog…), sachant d’abord que je réécris des articles pour les remettre au goût du jour (en intégrant notamment les photos directement plutôt qu’à l’aide d’un plugin devenu obsolète), je sais que c’est un long chemin à parcourir avant de pouvoir faire vraiment peau neuve.
Ensuite je suis jaloux pour le plugin…. qui réalise ce que je veux intégrer depuis si longtemps sur mon blog (et je tâcherai du coup de l’essayer, un grand bravo pour ta ténacité, je pense pas que j’aurais eu les co*** de m’y atteler…)
Bravo globalement pour le nouveau design et bienvenue dans le monde merveilleux de WordPress !
Salut Romain,
Merci beaucoup pour ton commentaire ;)… Ça nous a vraiment demandé beaucoup de travail de migrer notre site sous WordPress mais c’était devenu nécessaire pour la suite. Disons simplement que ça a été un challenge qu’on n’aurait jamais pu relever avec un travail à côté… On a passé une bonne partie de notre temps à Chiang Mai (et avant déjà) sur ce projet et on est content de pouvoir sortir une 1ère version 😉
Pour le plugin attend encore un peu… maintenant que je l’utilise aussi pour notre site, je vais le maintenir beaucoup plus sérieusement qu’avant. J’ai déjà pas mal d’idée pour le rendre plus sympa encore. Mais comme toujours, le seul frein c’est le temps ;). Mais je devrais pouvoir mettre la V2 en téléchargement bientôt 🙂
Franchement un grand bravo parce que c’est beau, c’est neuf, c’est moderne mais votre esprit n’a pas quitté les lieux. Il va falloir que je me fasse à tous les effets sur les images et les boutons (il y en a vraiment beaucoup) mais c’est vraiment top. Vous verrez, WordPress c’est vraiment vraiment sympa
Je m’intéresse aussi à votre plugin pour donner un petit plus à mon blog mais du coup, j’attends la mise à jour avant de tenter l’installation
Welcome back et si jamais vous avez du temps pour une petite rando, on fait volontiers votre connaissance avant que vous vous envoliez je ne sais pas où
Salut Letizia,
Merci beaucoup pour ton retour… C’était vraiment le truc le plus important pour nous alors ça nous fait plaisir ce que tu dis. A quoi bon avoir un beau blog wordpress super moderne et performant s’il ne nous ressemble plus ;). Et oui on se réjouit vraiment de blogueur avec WordPress! Ca va nous faire gagner beaucoup de temps… on a aussi beaucoup plus de possibilités sur cette plateforme et on a 10000 idées de trucs à essayer 🙂
Pour le plugin oui il vaut mieux attendre un petit peu… dès que j’ai un peu de temps je m’attaque au dernier détails et je met ça en ligne.
Et pour la rando ça sera avec plaisir :)… Cet été on sera pas mal en Suisse et on a prévu beaucoup de randos :). On se tient au courant!
Très bien cette nouvelle version! Très agréable, sobre dans les couleurs. J’aime beaucoup aussi l’effet sur les extraits du blog quand on passe dessus.
J’utilise moi-même Genesis, j’aime bien aussi. Et j’ai aussi dégagé la sidebar il y a quelques temps, ça n’a plus beaucoup d’intérêt, il est possible de mettre les mêmes infos ailleurs sur le site.
L’inconvénient d’un site WordPress par rapport à un site fait maison ça reste quand même la vitesse. Mais bon j’imagine qu’on ne peut pas tout avoir, et en limitant les plugins ça peut rouler.
Un conseil tout de même: ne mettez pas tout le blog en page d’accueil, question de SEO. La page d’accueil doit être unique et ne doit surtout pas comporter plusieurs pages comme c’est le cas maintenant. Il est très facile de faire une page d’accueil personnalisée avec Genesis en plus (voir par exemple la mienne) !
Salut Vincent,
Merci pour ton retour :)… Oui Genesis est une excellente fondation pour un site web qui veut durer dans le temps je pense. En plus c’est vraiment super flexible. Je ne me suis encore jamais retrouvé dans une situation où il me manquait un filtre ou une “hooks” pour faire ce que je voulais. Mais créer un site sous WordPress c’est quand même vraiment différent que de faire un site sans CMS. On dira qu’il faut s’habituer 🙂
Côté vitesse de chargement, je ne crois pas que le problème vienne de wordpress même… C’est vrai qu’il vaut certainement mieux limiter un peu les plugins mais en optimisant bien les images, avec une bonne mise en cache du site (je n’ai pas encore eu le temps de m’y mettre mais ça va venir) ou encore avec un CDN, tu peux avoir un site WP ultra rapide je pense.
Et finalement pour le SEO, c’est vrai qu’il y’a beaucoup de théories et de “choses à ne surtout pas faire”… Par exemple notre ancien blog était ultra lent et pourtant on était plutôt bien référencé. Tu me diras que s’il avait été plus rapide on aurait peut-être été mieux référencé ahah ;)… Ce que je veux dire c’est qu’au final on préfère se concentrer à créer du contenu de qualité plutôt que de penser trop au SEO. Mais pour la page d’accueil on est assez d’accord, on aimerait mettre plus d’infos dessus qui aiguilleraient les nouveaux visiteurs et pas seulement des articles.
“créer un site sous WordPress c’est quand même vraiment différent que de faire un site sans CMS. On dira qu’il faut s’habituer”
-> Oui, quand on n’a pas commencé directement avec WordPress, ça peut être prise de tête. J’ai des potes développeurs ultra-doués (sites, logiciels, apps), ils ont jamais pu se mettre à WordPress. Moi ayant commencé tout de suite avec, ça va.
“tu peux avoir un site WP ultra rapide je pense.”
-> Oui! Mais ça demande un peu plus de travail.
“Et finalement pour le SEO, c’est vrai qu’il y’a beaucoup de théories et de “choses à ne surtout pas faire”… Par exemple notre ancien blog était ultra lent et pourtant on était plutôt bien référencé.”
-> La vitesse de chargement et le score sur Page Insight n’influe pas directement sur le référencement. C’est juste “mieux”, c’est une question de confort. Mais quand on a beaucoup d’images, c’est dur d’avoir un bon score… Vous verrez, vous aurez beau optimiser le poids des images à fond, même en perdant en qualité, l’algorythme de Google est tellement bâtard que ça change pas grand-chose (il réduit des image sde 500k à 2k –‘). WP Smush.it est réputé. J’utilise aussi ImageOptim avant téléchargement. Je vous conseille de faire une formation SEO sur udemy par exemple, il y a souvent des promos et c’est vraiment intéressant.
Pour la mise en cache j’utilise WP Fastest Cache. WP Rocket est meilleur mais assez cher. Autoptimize est utile aussi.
Il y a un plugin (je ne sais plus le nom mais facile à trouver) permettant de vérifier si un plugin empêche le site de se charger rapidement. Ça m’a permis de faire le ménage…
Salut Vincent,
On vient de mettre en ligne une nouvelle version de notre page d’accueil… Je pense qu’elle est maintenant beaucoup plus claire et statique qu’avant. Ca va dans le sens de ce que tu disais 🙂
On l’attendais avec impatience et on est pas déçu ! J’adore cette nouvelle version, c’est vraiment du beau boulot, j’y connais rien mais j’imagine le travail derrière.
Continuez comme ça ne changez rien 🙂 Bon retour en Suisse.
Merci beaucoup Loïse,
Et ne t’inquiète pas, pour le reste on n’a pas prévu de changer 🙂
Oh qu’il est beau le nouveau site ! J’aime bcp le coté “marin”
Si je devais changer des trucs :
– le temps de transition sur le menu. Je trouve en effet qu’il met un peu trop de temps à se déplier :p Mais bon, rien de gênant en soi.
– je suis pas fan sur la homepage du header. Je le trouve trop saturé avec les derniers articles sur la gauche.
– Dans le menu du haut, on a envie de cliquer sur l’image du livre quand on déplie TDM
Les pages “pays” sont trop belles !
Bref, bravo 🙂
Salut Capitaine,
Merci beaucoup pour ton retour :)… t’as bien raison pour l’image dans le menu. Il faut que je la mette en cliquable.
Après pour le temps de transition et pour le header de la homepage, je note mais ça reste quand même le goût et les couleurs de chacun 🙂 (après si on reçoit 10 commentaires qui vont dans ce sens, je ferais pas mon têtu et je changerai ça 😉 )
Salut Capitaine 😉 ,
Alors on a suivi tes conseils… le header sur la home page est maintenant beaucoup plus simple même si ensuite on a rajouté pas mal de contenu en dessous :). Et l’image du livre dans le menu est maintenant clicable 😉
J’avais vraiment hâte de voir votre nouveau blog et vraiment, je le trouve super ! ça va peut-être nous motiver à nous attaquer au notre qui sait !
En tout cas beau travail, impatiente de voir la suite 🙂
Merci Aline 🙂 ,
Ca nous a pris un temps monstre mais on est aussi contents du résultat… On va avoir encore plus de plaisir à bloguer maintenant ;). Et si ça peut vous motiver à vous lancer ben c’est cool !
Ah, j’attendais ça avec impatience. J’avais un peu peur que ça soit un peu trop le “grand ménage”, mais je suis assez content de toujours trouver la patte Novo Monde, le fond, l’encre, les poissons… etc. Trop de thèmes sont aujourd’hui une copie conforme, c’est bien d’avoir sa signature.
Chapeau en tout cas, et je comprends mieux toutes ces bières, parce que porter tout ça n’a pas dû être une mince affaire, chapeau ! Surtout qu’en effet, à un moment donné, on finit par saturer grave de satané code !
Alors comme je suis (peut-être) un grand malade qui aime regarder dans les détails, voici quelques points de ci de là :
J’aime bien :
– Le sous-menu dans les articles avec les compteurs qui vient se caler sous le menu avec le logo Novo Monde au milieu, c’est vraiment top. Simple, mais top.
– Le style “timbre” autour des boîtes d’encart, j’aime beaucoup.
– Le menu qui se déroule gentiment, c’est plus agréable.
J’aime moins :
– Dans les pages catégorie de chaque pays, je trouve dommage que la carte ne soit pas le header en fait, qu’il faille cliqué sur le bouton pour la voir. En fait, j’avoue avoir dû chercher, car je ne trouvais pas la carte, alors que c’est un élément essentiel, surtout qu’elle est chouette, sans le fond standard Google.
– Il semble y avoir un bug quand on clique sur le partage Facebook en fin d’article. La fenêtre FB s’ouvre bien, mais l’article est caché par un overlay noir qui ne disparaît pas quand on ferme la fenêtre FB.
– Attention, pas taper, pas taper, mais j’avoue de pas être fan des liens surlignés. Je trouve ça un peu lourd visuellement. Mais j’ai cru comprendre que vous y teniez 😉 J’hésite aussi souvent à essayer de cliquer sur les sections de texte en couleur, mais qui ne sont en fait pas des liens. Mais là encore, c’est comme c’était avant, juste que je ne fais qu’aujourd’hui mon coming out 😉
Mais bon, comme d’hab, les goûts et les couleurs, c’est vous les patrons hein, je donne juste mon avis qui peut-être aussi tout pourri 😉
Remarques annexes :
– Il existe une version du Captcha Google où il n’y a même plus de croix à cocher maintenant.
– Ça me manque le code antispam qui était refusé de temps à autre 😉
Allez, z’avez mérité un pack entier là 😉
Salut Laurent,
Merci beaucoup pour ton super retour! Je dois t’avouer m’être entre autre beaucoup inspiré de ton blog… car comme tu le dis bien, il y’a trop de blogs WordPress qui se ressemblent tellement et le tien fait partie de ces blogs qui ont une âme et un style propre. C’était ma hantise principale lorsqu’on a décidé de migrer sous WP… j’avais un peu peur de ne pas réussir à dompter la bête et en faire ce que je voulais donc ton retour me fait bien plaisir.
Sinon c’est vrai que la migration n’a pas vraiment été une mince affaire… Mais ça m’a permis de bien maîtriser WordPress, le développement de thème et tout et tout. Mais c’est clair qu’après avoir passé autant de temps dessus, on sature grave et je me réjouis de ne plus voir de lignes de codes pendant quelques temps 😉
Concernant tes remarques :
– Pour les pages catégories je note… on a prévu de rajouter du contenu propre à chaque catégorie avant la liste d’articles. Du coup ça pourrait nous permettre d’enlever la box dans le header et d’afficher la map à la place de l’image.
– Ahh oui effectivement, la lightbox fait des siennes. Ce n’est pas le 1er bug à cause de la lightbox… bref je vais regarder ça
– ahah oui, c’est vrai que ces liens et ces couleurs ne plaisent pas à tout le monde… Mais ça fait un peu partie de notre identité visuelle et on n’a pas trop envie de s’en séparer pour le moment 😉
– Concernant la Captcha de google… il faut que je regarde parce que pour l’instant il y’a encore pas mal de commentaires spam qui passent à travers et j’ai aussi des petits problèmes quand j’aimerai mettre 2 captcha dans 2 formulaires différents sur une même page (genre commentaire et inscription à la newsletter). Du coup tu retrouveras peut-être ton code antispam bien aimé 🙂
Allez… merci encore pour ton retour et comme tu dis, on a bien mérité une pause 😉
Resalut Laurent,
Yeahhh 2ème version de la nouvelle version 🙂 … On a suivi tes conseils et on a mis la carte par défaut sur les pages catégories! C’est vrai que si c’est caché derrière un bouton, il y’a des chances que personnes ne l’utilise.
Sinon il reste les liens surlignés qui gardent leur place :)… la page d’accueil a elle aussi pas mal changé!
Pour avoir fait des dizaines et dizaines de refontes graphiques, je sais à quel point ca peut être chiant, chronophage. En tout cas le résultat est là, ca change bien par rapport à avant ! En revanche je n’aime pas trop le surlignage des ancres de lien, même si c’est très (trop?) visible 🙂
Salut Nicolas,
Merci pour ton commentaire ;)… Alors de notre côté on n’en a pas fait des dizaines mais c’est clair que c’est moins prise de tête de partir de 0 :).
Ahah pour le surlignage on va y réfléchir 🙂
Wooah!! je ne connaissais pas le blog avant. Mais celui la pour moi et juste parfait. le look, la navigation, les images…
Je commence tout juste à “bloguer” et je me rend compte du travail que vous avez fait. C’est un plaisir de vous suivre, bonne continuation.
Coucou les Novo-Monde !
Je ne sais pas trop où poster ce commentaires, je me suis dit que cette page était peut-être la plus appropriée…
Waouw votre nouveau nouveau site, il est super !!! Et il reste original, chapeau 🙂 On trouve les info super facilement, et avec plus de 300 articles j’imagine que ce n’était pas gagné d’avance ! Il n’y a que la carte de vos voyages que j’ai eu du mal à retrouver, mais j’ai fini par tomber dessus au hasard des pages 🙂
Une toute petite remarque, sur mon écran l’onglet “Tour du Monde” tout en haut ne s’affiche pas correctement dans sa version “réduite” (quand je fais défiler la page vers le bas). Il s’affiche sur deux lignes et donc sort de son cadre.
Et puis, parce qu’il faut quand même le dire, un énorme merci pour tout le boulot que vous fournissez !!
Marion
Salut Marion,
Merci pour ton commentaire qui est parfait ici 🙂 et qui nous fait super plaisir
On est super contents si tu trouves le nouveau site original et bien organisé 🙂 Concernant ta remarque, j’ai vu que effectivement sur une toute petite plage de taille d’écran, l’onglet tour du monde s’affiche sur 2 lignes… je vais m’occuper de corriger ça dans la soirée 🙂
à bientôt