Test terrain de Adobe Portfolio : « mon expérience »

Grégory Dziedzic

« Pour tout photographe abonné à la suite Adobe, Adobe Portfolio se pose comme une solution web très crédible dont on saura d’autant plus apprécier les forces que l’on sera conscient de ses limitations. Mon nouveau site internet a été conçu avec cet outil et cet article est le fruit d’une réflexion engagée pendant son élaboration.

Si comme moi vous avez passé les 15 dernières années à papillonner d’une plateforme web à l’autre dans l’espoir de trouver la perle rare répondant à tous les besoins du photographe, vous êtes depuis arrivé à la seule conclusion logique: il s’agit d’une quête vaine. Il en va dans l’univers du web comme dans celui de la photographie: tout est affaire de compromis. Prix attractif, simplicité, flexibilité, polyvalence, fiabilité, multilinguisme, blogging, vente en ligne… le CMS ou la plate-forme de service ultime pour les photographes n’est pas encore né.

Ainsi, après avoir fait la paix avec moi même et réalisé que je payais beaucoup trop pour une plateforme formidable mais surdimensionnée par rapport à mes besoins, j’ai décidé de tester Adobe Portfolio, découvert pendant ma certification professionnelle à l’École nationale supérieure de photographie d’Arles à l’occasion d’un atelier dirigé par notre expert national Lightroom Jean-François Vibert.

Très vite convaincu de laisser tomber ma vieille version 6 de Lightroom et le hack maison qui me permettait de lui faire lire les fichiers .arw de mon Sony A7III, je suis passé du côté obscur pour découvrir l’univers Creative Cloud.

Un choix rationnel pour les utilisateurs Adobe CC

Les petits malins de chez Adobe ont bien étudié le positionnement de leur produit en terme de prix et de service. En plus d’inclure Lightroom CC, Lightroom Classic, Photoshop CC, Spark et 20 Go d’espace cloud, l’abonnement « Adobe pour les photographes » donne en effet la possibilité de créer jusqu’à cinq sites My Portfolio.

Lightroom CC étant en train de s’imposer comme un outil incontournable pour tous les photographes, on se retrouve là avec un outil inédit de création de site internet sans investissement supplémentaire. Pour faire un beau portfolio en ligne répondant à mes besoins (élégance des templates, construction simple via une interface graphique, mise à jour des galeries via Lightroom, rapidité d’affichage des galeries, possibilités d’éditer des pages statiques, multilinguisme, blogging) les alternatives abordables sont en effet rares. Pour ne prendre que trois exemples :

• un site Squarespace limité à 20 pages coûte 128€ par an. La facture passe à 192€ pour faire sauter la limitation et pouvoir injecter du code. On est d’accord, c’est beau, c’est élégant, facile d’utilisation… Et on peut même blogger! Par contre le contenu n’est pas réutilisable (pas de galerie accessible depuis l’ensemble du site, il faut uploader dans chaque page), il n’y pas d’intégration avec Lightroom et le multilinguisme est très mal géré.

• un site WordPress hébergé — disons sur Gandi Simple hosting taille S + SSL pour quelque chose de pas trop dégueulasse niveau performance — coûte 86€ par an à quoi il faut ajouter le coût d’un template pro et de plugins adaptés pour assurer un minimum d’intégration avec Lightroom et pallier la gestion de media relativement basique de WordPress. En tête sur le créneau, Imagely vend un package thème et plugins (le fameux NextGen) à 139€. Afin de réaliser un site réellement multilingue, il faudra également investir dans le plugin WPML CMS multilingue, soit 79€ cash pour la première année plus 59€ par an par la suite. Le site nous coûtera donc 304€ la première année plus 145€ par année supplémentaire.

• Wix, que je connais mal (et c’est sans doute un tort), est utilisé par énormément de photographes. Les templates sont élégants, la gestion multilingue est native et le moteur de blog semble décent. Il n’y a par contre aucune intégration avec l’écosystème Adobe. La formule Unlimited à 12€ par mois semble particulièrement adaptée pour un site professionnel pour photographe.

• Pensez aussi à la solution Photodeck.com, que JF utilise pour son propre site vibertphoto.com… Et qui vient de mettre à jour ses tarifs : Nouveaux tarifs attractifs pour Photodeck. . (NDLR).

Adobe portfolio, c’est pour faire… des portfolios

Parfois, rien de tel qu’une bonne vieille tautologie pour mettre les choses au clair. Adobe Portfolio vous donne tous les outils dont vous pouvez avoir besoin pour présenter votre travail photographique à travers un site élégant, rapide, ergonomique et relativement personnalisable.

Douze templates de base sont disponibles. Leur élégance est sans faille – nous avons bien affaire à un produit Adobe – et les possibilités de personnalisation très poussées. Taille, couleur et fonte des texte, largeur des conteneurs, marges, style des mosaïques… tout ou presque est modifiable à l’échelle de la page ou – très pratique – à l’échelle du site. On peut ainsi très facilement réaliser un site au look unique en modifiant l’aspect des éléments prévus par le système.

La mise en page et la personnalisation du site se font en effet de manière très carrée, intuitive… et dans les strictes limites de ce qui a été prévu par Adobe. Il s’agit d’un outil destiné aux professionnels de la photographie. Pas aux geeks ni encore moins aux codeurs. Oubliez la customisation CSS, l’injection de code java-script, ou même tout simplement l’utilisation de code html pour l’édition des pages statiques. C’est super bétonné, et si cela peut être parfois frustrant pour l’utilisateur avancé, cela a pour avantage indéniable de rendre le site totalement incassable et foolproof

Quatre types de pages disponibles

Son atout principal réside incontestablement dans les pages « Adobe Lightroom » (un des quatre types de pages proposés dans le panneau de gestion de contenu) qui proposent un modèle par défaut incluant le titre de la page, un en-tête de texte qui fait également office de meta description (attention à l’équilibre entre SEO et lisibilité pour les êtres humains) et une galerie sélectionnée depuis les galeries disponibles sur Lightroom CC, et qui apporte une souplesse d’utilisation inégalable.

Ainsi, si vous désirez modifier la galerie d’une de vos pages Adobe Lightroom (des photos à rééditer/ajouter/supprimer/réordonner…) il suffit de procéder aux modifications nécessaires dans la galerie synchronisée correspondant sur Lightroom Classic, attendre la synchronisation et… en très exactement deux clics (un pour importer les modifications depuis le cloud, puis un autre pour les appliquer sur le site), les modifications sont implémentés sur le site.

Vous êtes à 70 km de votre ordinateur et votre galerie nécessite une mise à jour immédiate? Pas de problème, vous pouvez faire les modifications depuis Lightroom CC sur votre smartphone ou depuis n’importe quel ordinateur connecté grâce à Lightroom on the web et réimporter les mises à jour depuis le back end d’Adobe Portfolio. Finis les exports jpeg aux cordeau à importer ensuite galerie par galerie depuis le back-end d’un CMS, ou pire encore par FTP. C’est la beauté de l’écosystème intégré Creative Cloud. On pourrait à ce sujet se demander s’il n’aurait pas été pertinent de permettre également une synchronisation permanente répercutant automatiquement sur le site toute modification effectuée sur la galerie depuis Lightroom sans avoir besoin d’un clic d’import explicite.

 

Ni mots clés ni texte secondaire dans les photos des galeries

 

C’est beau, ça marche, c’est fluide et ça va vite. Le template de la page est par ailleurs relativement flexible et on peut éditer à volonté — grâce aux blocs décrits plus bas — la zone située entre la description et la galerie ainsi que celle située entre la galerie et le pied de page. Deux réserves de taille: il est impossible d’attribuer une valeur au champ alt text des photos de la galerie et les mots clés présents dans les métadonnées des photos ne sont pas importés dans le site. Cerise sur le gâteau: les pages Adobe Lightroom sont partageables telles quelles en tant que projets sur la plateforme en ligne Behance.

Le type de page « galerie » affiche une mosaïque d’aperçus cliquables permettant de naviguer vers les pages lui étant subordonnées. Typiquement, c’est la page d’accueil. On se calme les geeks: seules les pages de type « Adobe Lightroom » ou « page » (oui, je sais, c’est un peu confus) peuvent être englobées dans une page galerie. Une galerie de liens et une galerie de galeries auraient certes permis d’ouvrir un peu le champ des possibles, mais non, c’est bien verrouillé de ce côté-là également.

Le type de page « page » permet à l’utilisateur de construire une page bloc par bloc depuis zéro ou presque.

Comme c’est semble-t-il devenu la norme pour le design de sites adaptatifs, le design se fait en effet par blocs, et les utilisateurs de Squarespace ou de la nouvelle et fort décriée interface Gutenberg sous WordPress ne seront pas dépaysés. Les blocs peuvent êtres stylés et réordonnés à volonté. Par contre, ils s’empilent les uns sur les autres et on ne pourra pas faire couler du texte autour d’un photo, inclure un bouton dans du texte, faire du multicolonnage…

Au rayon des blocs utilisables pour construire les « pages » ou compléter les « galeries Lightroom », on trouvera donc:

• Un bloc grille. Ce bloc affiche un beau mur de photos de type masonry (des photos de tailles variables qui s’affichent de façon harmonieuse) similaire à celui proposé dans les pages de type « galerie Lightroom » avec qui il partage les même avantages (beauté, rapidité…) et inconvénients (mauvais SEO par image). On aurait par ailleurs aimé pouvoir attribuer des liens hypertextes arbitraires aux images de la mosaïque afin de l’utiliser comme mosaïque de navigation renvoyant vers des galeries externes, des pages cachées… bref, apporter un peu de flexibilité au CMS.

• Un blog galerie qui empile des blocs image les uns sur les autres.

• Un bloc image. Une image individuelle que l’on pourra téléverser ou importer depuis une Lightroom CC. C’est un bloc photo/légende tout simple, mais que l’on aurait tort de sous-estimer. Contrairement aux images du bloc grille ou de la page « galerie Lightroom », celle-ci dispose d’un champ alt text éditable (ici appelé « texte secondaire ») et peut être cliquable si besoin pour ouvrir un lien au choix en interne ou en externe. Ce bloc permet ainsi d’aller un peu plus loin dans l’ajout de métadonnées et il m’a semblé utile d’en utiliser un au début de chacune de mes pages portfolio (avant la galerie Lightroom, par exemple ici).

• Un bloc texte. Bof bof… Oubliez les barres d’outil super complètes style traitement de texte qui faisaient le charme de TinyMCE et consorts. La nouvelle mode est au minimalisme. Grands oubliés de l’éditeur de texte: les listes. On peine à comprendre. Exit également les retraits de paragraphes, la justification, le surlignage… Et scandale ultime: aucune option de mise en forme premettant de définir un titre avec des balises h1, h2 ou h3 si chères aux bots d’indexation des moteurs de recherche.

• On retrouve les grands classiques tels que: des boutons hypertextes, des icônes de réseaux sociaux, un formulaire de contact vaguement paramétrable (on peut rajouter des champs ou des zones textes mais pas de boutons radios ni de cases à cocher); un player audio ou vidéo extrêmement minimaliste (play, pause, volume, passage au plein écran) requérant le téléversement des fichiers sources. Et oui, vous avez bien lu: le player Youtube html5 responsive n’est pas disponible, d’où les horreurs suivantes…

• <iframe>. Tous droits venus des années 90 (j’exagère à peine), le bloc <iframe>, pudiquement appelé « incorporer » dans Portfolio, est la solution qu’a trouvée Adobe pour compenser la pauvreté des blocs disponibles et faire croire le contraire à l’utilisateur lambda en faisant afficher directement depuis un site extérieur du contenu sandboxé non auto-ajustable dans un bloc dont la hauteur en pixels est fixe, ce qui est une hérésie quand on veut créer des pages adaptatives. Pour ma part j’ai fait l’impasse.

Le type de page « lien », enfin, permet de compléter la barre de navigation en y ajoutant des liens internes ou externes.

Terminons ce tour du propriétaire par un aperçu de la structuration du site. Mis à part les pages de type « page » et « galerie Lightroom » ayant été subordonnées à une page de type « galerie » (et qui du coup disparaissent de la barre de navigation), toutes les pages sont au même niveau, sans hiérarchisation possible ni sous-menus, et la barre de navigation est automatiquement renseignée en puisant dans la liste ordonnable des pages publiées.

À noter: l’élément de navigation a obligatoirement le même nom que la page à laquelle il réfère. Il est par ailleurs possible de dépublier des pages en un seul clic tout en les gardant sous le coude pour l’édition, pour les republier plus tard ou que sais-je. Ça semble tomber sous le sens, mais certains CMS dédiés hors de prix ne proposent pas cette option (kof… Photodeck… kof…). Il est également possible d’empêcher certaines pages d’apparaître dans le menu (landing pages, offres spéciales…), voire même de protéger l’accès de certaines pages par un mot de passe.

Pas d’option multilingue mais…

Au rayon des caractéristiques désirables mais absentes: le multilinguisme, qui n’est absolument pas géré. On peut contourner le problème en mettant à profit le caractère multisite d’Adobe Portfolio et en créant deux sites jumeaux ne différant que par leur contenu textuel et leurs URLs (par exemple en utilisant des sous-domaines pour les langues secondaires ).

Par contre, la customisation et l’ajout de contenus se font à la main et on regrette de ne pas pouvoir copier les styles ou la mise en page d’un site à l’autre, voire idéalement de dupliquer le site original avant d’en assurer la traduction. Il faut refaire le travail de construction et de customisation du site pour chaque langue additionnelle. Une fois le travail de traduction et de customisation des sites à l’identique effectué, il ne reste qu’à ajouter dans la barre des menus de chaque site des liens réciproques pointant vers la page d’accueil de l’autre.

Spark, le futur du blogging made in Adobe?

Il est une malédiction dans le milieu des CMS et plateformes web dédiées aux photographes, c’est la rareté des moteurs de blogging intégrés. Si Squarespace et Wix semblent proposer des solutions viables, les autres ne proposent souvent que des solutions d’intégration WordPress souvent datée, voire périmée (Photoshelter, Photodeck). Le photographe semble être considéré comme un analphabète bas du front dont on n’imagine pas qu’il ait besoin d’aligner parfois un peu plus de mots qu’il n’en faut pour rédiger une légende sous une photo.

Adobe Portfolio ne déroge pas à la règle, et tout ce que l’aide en ligne propose en termes de blogging, c’est d’intégrer une icône de lien vers un profil Medium. Mouais…

Et pourtant la suite Adobe pour les photographes comprend un outil qui pourrait faire fureur auprès des photographes souhaitant agrémenter leurs photos avec des textes et contenus multimédias. Conçu entre autres pour réaliser avec facilité de somptueux webdocumentaires, Spark, c’est le futur du blogging pour les photographes, les vidéastes et autres « producteurs de contenus ». L’exemple suivant a ainsi été réalisé en moins d’une heure.

Malheureusement Adobe à jugé bon d’empêcher les moteurs de recherche d’indexer le contenu des publications Sparks, et cette solution n’en est donc pour l’heure pas une…

A défaut, j’utilise un blog WordPress avec le template gratuit « Make » que j’ai tenté de customiser au mieux afin qu’il s’intègre à mon site Adobe Portfolio. Au vu des derniers ballons d’essais concernant un possible doublement du prix de l’abonnement Adobe pour les photographes, cette base WordPress constitue par ailleurs ma porte de sortie au cas où il faille quitter un navire Adobe se transformant en onéreuse galère.

Pour l’heure, malgré l’absence de visibilité concernant la politique tarifaire des abonnements Adobe, Portfolio reste une solution solide, viable et efficace pour les photographes utilisateurs de la suite Lightroom CC souhaitant présenter leur travail de façon simple, claire et efficace sans se prendre la tête en mettant les mains sous le capot d’un système de gestion de contenu. »