Mon portfolio photo, parti de rien (à l'exception de mes photos)

[doppelganger]

Bonjour à tous,

Je partage ici le-monde-sans-filtre.fr, mon portfolio photo.

Plutôt que de me contenter d'Instagram ou d'une plateforme toute faite, qui se réserve le droit d'exploiter nos images comme bon leur semble et accessoirement, d'entrainer ses IA... je voulais un espace bien à moi : mon nom de domaine, ma mise en page, pas de pub, pas d'algorithme qui décide qui voit quoi. Je suis parti d'une feuille blanche, surtout pour le plaisir d'apprendre et de garder la main sur chaque détail. Précision : je travaille dans le milieu du développement logiciel, mais côté backend. Le frontend (tout ce qui touche à l'affichage, au visuel) n'est pas mon domaine. Du coup j'ai fait ce site en bonne partie en "vibe coding" avec Claude Code, à qui je décris ce que je veux et qui écrit le code pendant que je garde le contrôle sur les choix. Un vrai gain de temps sur un projet solo mené sur mon temps libre.


Ce que je voulais :

- Des photos qui rendent bien : pas de compression qui massacre un dégradé de ciel ou les noirs d'un N&B. Chaque image est retravaillée pour arriver à l'écran au plus proche de l'original.
- Protéger un peu le travail : clic droit désactivé, et les fichiers ne sont jamais servis en pleine résolution d'origine. (Un système de filigrane est prêt en réserve, mais je préfère pour l'instant montrer les photos "nues".)
- Une belle expérience de visionnage : plein écran immersif, diaporama, navigation au clavier ou au doigt, chargement rapide même en connexion mobile. L'idée : que regarder les photos soit agréable, sans rien qui vienne parasiter.
- Le respect de la vie privée : pas de cookie, pas de bandeau à accepter. Les seules statistiques de fréquentation collectées sont anonymes et agrégées, sans identifiant individuel.


Deux mots de technique :

C'est un site "statique", ce qui veut simplement dire qu'il n'y a pas de gros serveur qui tourne en permanence à calculer des pages en direct. Tout est préparé à l'avance, ce qui le rend rapide et robuste.

Derrière, il y a un petit atelier personnel : chaque photo passe automatiquement dans une chaîne de traitement qui génère plusieurs tailles (mobile, tablette, grand écran), pour que le téléphone ne télécharge jamais une image plus lourde que nécessaire. Il y a aussi un petit outil fait maison (interface en ligne de commande ou dit autrement, une CLI) pour ajouter un album ou changer une couverture en quelques secondes, sans toucher au code.

Côté coulisses techniques : le code est hébergé sur GitHub (une sorte de classeur qui garde l'historique de chaque modification) et le site est mis en ligne via Vercel, un service qui republie automatiquement la moindre mise à jour en quelques secondes, sans manipulation de ma part.

Le site est pensé pour durer : tests automatisés à chaque modification, vérification d'accessibilité (pour que ça reste utilisable au clavier ou par des personnes malvoyantes), d'intégrité des données (cohérence entre le nombres d'images présentes générés et le nombre d'originaux) et une bonne visibilité sur les moteurs de recherche.

En bref : projet artisanal, autant photographique que technique.

[Faldug]

Hello,
Plutôt sympa, je trouve l'initiative intéressante et le rendu agréable.

Par contre, le contenu affiché entre Albums et Galerie semble quasi identique.
Quand on scroll sur la galerie, on voit alors qu'on peut choisir « tout » ou filtrer par album c'est bien ça ?
J'ai presque l'impression que la galerie (et page d'accueil) fait déjà tout ce qu'il faut vis à vis de la partie photo et qu'il y a presque redondance entre la page galerie et albums. En tout cas il faut beaucoup scroller (sur téléphone du moins) pour voir la différence de contenu réel.

—-

J'avais fait de même il y a quelques années pour des raisons similaires.
(La présentation était un peu plus austère par contre).
C'était aussi du statique avec un moteur qui parcourait un répertoire de fichiers tous prêts et directement uploadés sur un FTP. La structure et quelques attributs donnaient la hiérarchie « albums » et leur contenu, également adapté pour un affichage rapide ... et puis je me suis refait aspirer par la mode des réseaux...

Remarque : Même si c'est sûrement moins direct et violent que ce qu'Instagram donne à manger à des IA, je ne pense pas qu'avoir un site indépendant préserve de la récupération de données par les IA (mais je comprends tout de même la démarche car j'avais eu la même il y a quelques années et l'IA n'était pas déployée comme maintenant).

[Dunkel]

Du coup j'ai fait ce site en bonne partie en "vibe coding" avec Claude Code, à qui je décris ce que je veux et qui écrit le code pendant que je garde le contrôle sur les choix. Un vrai gain de temps sur un projet solo mené sur mon temps libre.

Le vibecoding, ce n'est pas ce que je qualifierai de résilient (fait pour durer). Si tu ne sais pas relire et corriger, refaire ce que Claude (ou n'importe quelle IA) a fait, comment fais-tu si Claude disparaît ou devient simplement hors de prix pour toi ?

- Protéger un peu le travail : clic droit désactivé, et les fichiers ne sont jamais servis en pleine résolution d'origine. (Un système de filigrane est prêt en réserve, mais je préfère pour l'instant montrer les photos "nues".)

Attention à ne pas se bercer d'illusions. Tu te protèges peut être de Timeodu66, mais n'importe qui avec un peu de volonté arrivera à récupérer tes photos. Déjà, l'affichage en plein écran facilite le travail "simple" avec une bête copie d'écran. Ensuite, quand tu ne joues que sur un affichage, il n'est pas compliqué de récupérer les photos, par exemple une version 2560 pixels largement suffisante pour des impressions de qualité voire des candidatures/concours, lien récupéré en moins de 30 secondes sans faire appel à un simple script qui pourrait automatiser cette récupération : https://www.le-monde-sans-filtre.fr/photos/au-lever/008-2560.webp 

Quand au filigrane, pour avoir fait l'exercice avec ceux des photographes de montagne qui pourtant ont une propension à utiliser des filigranes très invasifs (premiers exemples qui me viennent en tête : https://izoardphotos.com/folio/1285/01juillet.html et https://www.tamtam-photo.com/medias-search/widget/operator/and/text/-/format/-/folio/27127/date/-/time/-/gap/-/page-1.html), une IA en version gratuite m'a sorti des résultats finis à 90% en moins de 3 minutes (dont 15 secondes pour un prompt ultra basique du style "peux tu m'enlever le filigrane sur cette photo ?"), et encore, le plus gros des erreurs à corriger étaient dues aux détails sur les véhicules, en particulier les logotypes, absents d'une photo de paysage. Aujourd'hui, même une personne sans connaissance en graphisme peut enlever facilement des filigranes, et quelqu'un qui sait utiliser un logiciel de retouche pourra fignoler le travail préparé par l'IA.

Bref, demande toi de qui tu veux te protéger, le dommage subi et les moyens efficaces et proportionnels à mettre en place.

[doppelganger]

Le vibecoding, ce n'est pas ce que je qualifierai de résilient (fait pour durer). Si tu ne sais pas relire et corriger, refaire ce que Claude (ou n'importe quelle IA) a fait, comment fais-tu si Claude disparaît ou devient simplement hors de prix pour toi ?

J'ai suffisamment de recul sur tout ça et bien que je donne la main à une IA, la confiance n'exclut pas le contrôle. Le développement est mon métier, même si le frontend n'est pas mon domaine de prédilection 😉

[doppelganger]

Attention à ne pas se bercer d'illusions....
...
Quand au filigrane, ...

Je connais les limites de tout ça et bien conscient des limites de l'exercice.

[doppelganger]

Hello,
Plutôt sympa, je trouve l'initiative intéressante et le rendu agréable.

Par contre, le contenu affiché entre Albums et Galerie semble quasi identique.
Quand on scroll sur la galerie, on voit alors qu'on peut choisir « tout » ou filtrer par album c'est bien ça ?
J'ai presque l'impression que la galerie (et page d'accueil) fait déjà tout ce qu'il faut vis à vis de la partie photo et qu'il y a presque redondance entre la page galerie et albums. En tout cas il faut beaucoup scroller (sur téléphone du moins) pour voir la différence de contenu réel.

Y'a redondance au niveau de l'affichage des albums sur la page principale (gallérie) par rapport à la pages albums oui. Je vais repenser tout ça et voir si je fait différemment ou si finalement je laisse comme ça.

Merci pour tes remarques

[doppelganger]

Y'a redondance au niveau de l'affichage des albums sur la page principale (gallérie) par rapport à la pages albums oui. Je vais repenser tout ça et voir si je fait différemment ou si finalement je laisse comme ça.

Merci pour tes remarques

J'ai enlevé la section d'albums de la page d'accueil pour ne laisser que la galerie.

[Faldug]

Ok, c'est déjà mieux ^^

[Tomzé]

Site très agréable à visionner.

[doppelganger]

Site très agréable à visionner.

Merci 🙏🏻

[MFloyd]

Beau site 👍🏻. Avec my portfolio de Adobe https://portfolio.adobe.com/, vous pouvez faire quelque chose de similaire, très épuré, et qui s'adapte automatiquement au support de présentation (smartphone, tablette, écran...). Vous n'avez qu'à jeter un coup d'œil sur le mien (cliquez le globe sur le cartouche de mon post).

[Clic-Clac 51]

Cher moi, l'affichage est parfois très lent, cela est certainement dû à ma connexion...mais j'ai fini par perdre patience
J'y reviendrai un peu plus tard
Mais de ce que j'ai vu, cela m'a été bien agréable
Denis

[doppelganger]

Beau site 👍🏻. Avec my portfolio de Adobe https://portfolio.adobe.com/, vous pouvez faire quelque chose de similaire, très épuré, et qui s'adapte automatiquement au support de présentation (smartphone, tablette, écran...). Vous n'avez qu'à jeter un coup d'œil sur le mien (cliquez le globe sur le cartouche de mon post).

Merci.

L'avantage de ma solution, c'est de ne dépendre de personne et encore moins de adobe et surtout pas de creative cloud 🤮

En bref, la solution de adobe c'est gratuit... à 12,83€ par mois...

Me concernant, ça m'a couté environ 11€ pour un nom de domaine pour 3 ans.

[doppelganger]

Petit point technique sur mon site : les photos ne sont plus stockées avec le code du site (c'était une fausse bonne idée), mais chez Cloudflare.

Cloudflare, c'est quoi ? Une entreprise d'infrastructure internet. On la connaît surtout pour accélérer et protéger des sites web, mais elle propose aussi du stockage de fichiers. Celui que j'utilise s'appelle R2 : un espace où l'on dépose des fichiers pour qu'ils soient servis à la demande, un peu comme un disque dur en ligne conçu pour être lu par un site web.

L'offre gratuite couvre largement mon usage :

- 10 Go de stockage (mon portfolio en occupe environ 450 Mo) ;
- un quota mensuel d'opérations (lectures et écritures) ;
- la sortie de bande passante est gratuite, donc chaque photo affichée chez un visiteur ne coûte rien.

Pourquoi ce déménagement ? Le dossier qui garde l'historique de toutes mes modifications pesait 1,4 Go, à cause des photos retravaillées qui s'y accumulaient. Il pèse maintenant 14 Mo. C'était d'autant plus inutile que tout peux être régénéré via les originaux. Aucune raison de "versionner" ces données.

Cela ne change rien à la navigation.

[doppelganger]

Cher moi, l'affichage est parfois très lent, cela est certainement dû à ma connexion...mais j'ai fini par perdre patience
J'y reviendrai un peu plus tard
Mais de ce que j'ai vu, cela m'a été bien agréable
Denis

Va falloir passer à la fibre 😉

[pline34]

Bonjour Doppelganger,
Je trouve ta démarche intéressante et ton site fonctionne plutôt bien.
Une remarque en passant, à ne pas prendre pour une attaque parce que cela n'en est pas une, il y a beaucoup de photos et certaines que je trouve redondante. Je prends un exemple, colonne de gauche, tu as une série de photos intitulée "au lever" qui commence par un ciel rose sur des rochers, l'image à la ligne suivante est à nouveau un ciel rose sur des rochers. Et je trouve que certaines thématiques reviennent souvent sans que les images se différencient beaucoup.
Je trouve également que les photos macro jurent un peu dans l'ensemble : en couleur, tu as beaucoup de tons rosacés, violets, doux sur tes paysages. Je ne parle pas du noir et blanc qui n'a pas de couleur par principe. Et au milieu, tu mets 5 ou 6 photos macro aux couleurs vives et qui jurent un peu dans l'ensemble.

[pline34]

Ce que je veux dire : il y a pas mal de photos chouettes sur ton porte-folio mais je les trouve un peu "diluées" dans une masse.

[doppelganger]

Merci pour ton retour.

Je pense que je devrais avant tout ne pas imposer toute la galerie mais plutôt les albums et donner la possibilité de tout voir. Celui à qui cela plaira de tout voir d'un coup sera servi et ceux qui n'apprécient pas également.

En ce qui concerne la redondance, je comprends et c'est pas facile d'écarter des photos que l'on a envie de voire.

[doppelganger]

Voilà : la gallérie à sa page dédiée et l'accueil ne propose que les albums : le-monde-sans-filtre.fr

En bonus : la page d'accueil est moins lourd à charger et donc, plus rapide, Clic-Clac 51 😉