Aperçu en direct
Page d’accueil de Krea : une page de papier chaud portant le titre serif We build AI systems that survive contact with production, à côté d’une unique ligne sarcelle continue qui se noue en boucle
07 / THÈME ASTRO

Krea

Pour un studio qui livre, au lieu de promettre.

  • Studio IA
  • Conseil
  • Éditorial

La septième version Quaeris Design, et de loin la plus légère. Un site de studio portant une page d’expertises, une grille tarifaire avec un seul chiffre fixe et un journal — dix-huit routes et un en-tête animé au défilement sans aucune bibliothèque derrière, avec toute la démo en ligne, ouverte à l’inspection.

MESURÉ SUR LA DÉMO
3.4 KB
JavaScript
18
Routes indexables
0
Feuilles de style bloquantes
207 KB
Polices au premier chargement
3
Familles de polices
Astro 7.3
Construit avec

Chaque chiffre provient de astro-design-krea.pages.dev. Ouvrez la démo et vérifiez par vous-même.

Un site publié. TVA comprise ; le travail client relève de la licence studio. Rétractation sous 14 jours, jusqu’au premier téléchargement.

LE BRIEF

À quoi il sert, et à qui il convient.

Une direction typographique sur papier chaud, pour les pratiques qui vendent un jugement. Fraunces en corps de titrage au-dessus d’une unique ligne sarcelle continue qui boucle à travers l’en-tête — et le fond de l’illustration est exactement celui de la page, si bien que le dessin se fond dans le papier au lieu d’être posé dessus. Une seule grille de douze colonnes parcourt tout le site, mais deux sections ne revendiquent jamais la même largeur : caler chaque bande dans le même bloc, c’est ce qui fait qu’une page se lit comme une forme répétée.

  • Studios d’IA appliquée et d’ingénierie
  • Cabinets de conseil technique qui vendent un jugement plutôt qu’un catalogue
  • Petites pratiques dont le livrable est un système
  • Quiconque préfère montrer une méthode plutôt qu’une galerie
LE JEU DE PAGES

Les routes que vous obtenez, et d’où elles viennent.

Chaque route ci-dessous est générée à la compilation et servie comme un fichier statique.

Pages

Écrites une fois, modifiées sur place.
  • Accueil
  • Expertises
  • Tarifs
  • À propos
  • Contact
  • Mentions légales

Collections

Un fichier Markdown devient une route, une entrée d’index et une liste.
  • Article × 3
  • Auteur × 2
  • Catégorie × 4

Système

Générées, jamais maintenues à la main.
  • 404
  • sitemap.xml
  • robots.txt
NOTES DE CONCEPTION

Les décisions derrière le style.

01

L’illustration est dans le papier, pas dessus.

Chaque illustration est exportée exactement sur le fond de la page, si bien qu’un dessin n’a pas de bord et n’a besoin d’aucune carte autour de lui. C’est le moyen le moins coûteux de rendre une illustration native à une page — et la chose qui cesse discrètement de fonctionner le jour où quelqu’un change le jeton de fond sans réexporter.

02

Le parallaxe de l’en-tête n’a aucune bibliothèque derrière lui.

Quatre couches de crêtes dérivent à des vitesses différentes sur la première hauteur d’écran de défilement, pilotées par une scroll timeline CSS plutôt que par une bibliothèque d’animation et un écouteur de défilement. Elle est conditionnée à une requête de prise en charge, car sans scroll timeline la même déclaration figerait chaque couche à sa position finale au lieu de la laisser immobile. Toute la page d’accueil coûte 3.4 KB de JavaScript.

03

Pas d’italique sur les pages marketing, à dessein.

L’italique de Fraunces est un second fichier variable de 146 KB — à lui seul plus lourd que le HTML — et un seul glyphe italique n’importe où dans le premier rendu le tire en entier. Trois endroits en usaient : un bandeau défilant, une esperluette de pied de page, une citation. Les distinguer par la couleur et par l’axe a fait passer la page d’accueil de 354 KB de polices à 207, et le plus grand rendu de 3.7s à 2.9s. L’italique reste là pour le corps de texte, où il vaut son téléchargement.

04

Deux sarcelles, deux rôles.

Le sarcelle vif mesure 3.0:1 sur le papier : il porte la décoration et le titrage et n’est jamais autorisé sous 24px ; un plus sombre, à 5.3:1, porte les liens et le texte courant. Scinder l’accent en deux, c’est ce qui permet à la palette de rester aussi chaude tout en passant un contrôle de contraste en corps de texte.

PALETTE
  • Papier #f9efe0 Fond de page, et celui des illustrations
  • Encre #0c2340 Texte et bandes sombres
  • Sarcelle #1f9ba1 Décoration et titrage, jamais sous 24px
  • Encre sarcelle #146e70 Liens et texte courant
  • Corail #ee7f63 Le signal d’erreur, et rien d’autre
POLICES
Titrage
Fraunces Variable, corps optique de 24 à 144
Texte
Inter Graisses 300, 400 et 500
Utilitaire
JetBrains Mono Micro-libellés en capitales
CE QUI L’ACCOMPAGNE

Sachez ce que vous obtenez.

Une belle capture d’écran n’est qu’un début. Ce sont les détails qui vous aident à choisir.

01 / LES PAGES

Une vue du site entier.

Chaque version liste son jeu de pages, de la page d’accueil aux templates d’article, d’auteur et de catégorie dont votre projet a réellement besoin.

Liste des pages avec chaque version
02 / L’EXPÉRIENCE

Chaque écran compte.

Mises en page pour ordinateur et mobile, navigation, états de focus et interactions, vérifiés aux largeurs que les gens utilisent vraiment plutôt qu’à celle de la capture d’écran.

Comment fonctionne la personnalisation ↗
03 / LA LIVRAISON

Les détails, avant d’acheter.

Le code source, les prérequis d’installation, la licence et les conditions de support sont publiés sur la page du thème, pour que vous puissiez décider avant de dépenser quoi que ce soit.

Contenu exact avec chaque version
TARIFS

Un prix clair. Une offre claire.

Choisissez le design qui convient à votre projet. Une licence couvre un site publié ; le travail livré à des clients relève de la licence studio.

THÈMES À L’UNITÉ EN VENTE

Trouvez le vôtre.

59 € le thème

Une licence, un site publié. Le travail que vous livrez à des clients relève de la licence studio : 399 € pour toute la collection, et un an de tout ce qui paraît ensuite.

Une licence de thème
Un projet publié
Travail pour un client
Licence studio
Mises à jour et support
Indiqués par thème
CE THÈME

Tout ce qui précède, en un téléchargement.

Krea, sous forme de code source Astro complet. Modifiez ce que vous voulez, déployez où vous voulez en statique, et gardez-le.

Un site publié. TVA comprise ; le travail client relève de la licence studio. Rétractation sous 14 jours, jusqu’au premier téléchargement.

AILLEURS DANS LA COLLECTION

Trois autres directions.