Aller au contenu
multimdigital

Sites d’exemple · Mesuré le 17 octobre 2026 avec Lighthouse 13.5.0

Sept sitesd’exemple,mesurés.

Une clinique, une maison d’hôtes, une école, un atelier de céramique, une pizzeria qui livre, un loueur de voitures et un hôtel en réservation directe : des commerces inventés, et des sites bien réels, construits par l’agence. Ouvrez-les sur votre téléphone. Leurs mesures sont publiées à côté, avec la date et l’outil qui les a prises.

  1. Clinique de consultations
  2. Maison d’hôtes de la médina
  3. École primaire et collège
  4. Atelier de céramique
  5. Pizzeria qui livre
  6. Location de voitures
  7. Hôtel en réservation directe
Accessibilité, sur quatorze mesures
100
Bonnes pratiques, sur quatorze mesures
100
Performance sur ordinateur, sept sites
100

Scores sur 100, notés par Lighthouse, l’outil d’audit de Google intégré au navigateur Chrome. La mesure de chaque site, sur téléphone et sur ordinateur, est dans sa fiche.

01 — Les sept sites

Un métier par site, un film à l’ouverture.

Les commerces sont inventés, les sites sont réels : en ligne, navigables de page en page, et faits par l’agence. Chacun s’ouvre en plein écran sur un film et se pense d’abord pour un téléphone. Les numéros y sont fictifs, et aucune demande, commande ni réservation n’y est transmise à personne.

  1. Clinique de consultations, Guéliz, Marrakech

    Le parcours d’un patient, de la demande de rendez-vous au jour de la consultation : les spécialités et leurs jours, les heures d’ouverture, l’accès jusqu’à la porte.

    Ce qu’il apporte au commerce

    • Une demande de rendez-vous en ligne, à toute heure : la spécialité et les créneaux voulus arrivent ensemble à l’accueil, qui rappelle.
    • Tout le site en français ou en arabe, d’un seul geste, l’arabe lu de droite à gauche.
    • Un message WhatsApp déjà commencé, pour qui préfère écrire qu’appeler.
    • Un avertissement net : le site ne sert pas aux urgences, et il donne les numéros à composer.

    Langues : Français et arabe

    Ouvrir sur votre téléphone : clinique de consultations (nouvel onglet)

    exemple-clinique.multimdigital.com

    Le premier plan du site d'exemple d'une clinique de consultations à Guéliz : l'entrée vitrée d'un bâtiment blanc et ocre, un olivier en pot sur le seuil, la rue calme sous les palmiers en fin de journée.

    Sur téléphone · 4G lente simulée

    Performance
    97
    Accessibilité
    100
    Bonnes pratiques
    100
    Contenu principal affiché (LCP)
    2,0 s
    Temps où la page ne répond pas (TBT)
    67 ms
    Décalage de l’affichage (CLS)
    0
    Poids transféré
    1 505 Ko

    Sur ordinateur · réglages par défaut

    Performance
    100
    Accessibilité
    100
    Bonnes pratiques
    100
    Contenu principal affiché (LCP)
    0,5 s
    Temps où la page ne répond pas (TBT)
    3 ms
    Décalage de l’affichage (CLS)
    0,001
    Poids transféré
    1 505 Ko

  2. Maison d’hôtes de la médina, médina de Marrakech

    La visite de la maison pièce par pièce, de la porte de la ruelle au salon, puis le chemin à pied depuis le taxi jusqu’à l’entrée.

    Ce qu’il apporte au commerce

    • Une demande de réservation en direct : les dates prises dans un calendrier, le nombre de voyageurs, un mot pour la maison. La nuitée ne passe par aucune plateforme.
    • Un message WhatsApp qui reprend les dates déjà choisies.
    • Trois langues, d’un seul geste, sans quitter la pièce qu’on visitait.
    • L’arrivée expliquée en quatre étapes, jusqu’à la porte : la médina cesse d’être un labyrinthe.

    Langues : Français, anglais et arabe

    Ouvrir sur votre téléphone : maison d’hôtes de la médina (nouvel onglet)

    exemple-riad.multimdigital.com

    Le premier plan du site d'exemple d'une maison d'hôtes de la médina : une ruelle ocre-rose, une porte de cèdre cloutée entrouverte sur une lumière chaude, deux lanternes et des bougainvilliers en fleurs.

    Sur téléphone · 4G lente simulée

    Performance
    97
    Accessibilité
    100
    Bonnes pratiques
    100
    Contenu principal affiché (LCP)
    2,1 s
    Temps où la page ne répond pas (TBT)
    64 ms
    Décalage de l’affichage (CLS)
    0
    Poids transféré
    1 416 Ko

    Sur ordinateur · réglages par défaut

    Performance
    100
    Accessibilité
    100
    Bonnes pratiques
    100
    Contenu principal affiché (LCP)
    0,5 s
    Temps où la page ne répond pas (TBT)
    3 ms
    Décalage de l’affichage (CLS)
    0
    Poids transféré
    1 416 Ko

  3. École primaire et collège, Targa, Marrakech

    Ce que des parents comparent avant d’appeler : la journée d’un élève heure par heure, le projet de l’école, et les étapes d’une inscription.

    Ce qu’il apporte au commerce

    • Une demande de visite en ligne ou sur WhatsApp, avec la classe où entre l’enfant et les jours qui conviennent à la famille.
    • L’inscription en quatre étapes, de la visite au dossier, avec la liste des pièces à réunir.
    • La journée racontée heure par heure, de l’accueil du matin à la sortie.
    • Toute la page en arabe, de droite à gauche, d’un seul geste.

    Langues : Français et arabe

    Ouvrir sur votre téléphone : école primaire et collège (nouvel onglet)

    exemple-ecole.multimdigital.com

    Le premier plan du site d'exemple d'une école primaire et collège : un portail en bois sous des arches blanches, un jacaranda en fleurs violettes au-dessus du mur ocre, un banc et deux cartables posés dans la cour.

    Sur téléphone · 4G lente simulée

    Performance
    95
    Accessibilité
    100
    Bonnes pratiques
    100
    Contenu principal affiché (LCP)
    2,4 s
    Temps où la page ne répond pas (TBT)
    137 ms
    Décalage de l’affichage (CLS)
    0,01
    Poids transféré
    1 476 Ko

    Sur ordinateur · réglages par défaut

    Performance
    100
    Accessibilité
    100
    Bonnes pratiques
    100
    Contenu principal affiché (LCP)
    0,5 s
    Temps où la page ne répond pas (TBT)
    0 ms
    Décalage de l’affichage (CLS)
    0
    Poids transféré
    1 476 Ko

  4. Atelier de céramique, Guéliz, Marrakech

    Toute la collection en ligne, prix compris : chaque pièce a sa fiche, avec sa photo, sa taille et son prix, et des filtres par famille.

    Ce qu’il apporte au commerce

    • Le message WhatsApp part avec le nom de la pièce : le client demande si elle est disponible sans rien avoir à décrire.
    • La semaine d’ouverture tracée en barres, jour par jour, et l’itinéraire jusqu’à la boutique.
    • La livraison et le paiement à la livraison, annoncés là où on les cherche : sous la collection.
    • Trois langues, dont l’arabe lu de droite à gauche.

    Langues : Français, arabe et anglais

    Ouvrir sur votre téléphone : atelier de céramique (nouvel onglet)

    exemple-ceramique.multimdigital.com

    Le premier plan du site d'exemple d'un atelier de céramique de Guéliz : une rue pavée et calme, la vitrine blanche où sont alignés des vases et des bols bleu cobalt, une porte en bois et un olivier en jarre.

    Sur téléphone · 4G lente simulée

    Performance
    95
    Accessibilité
    100
    Bonnes pratiques
    100
    Contenu principal affiché (LCP)
    2,0 s
    Temps où la page ne répond pas (TBT)
    58 ms
    Décalage de l’affichage (CLS)
    0,02
    Poids transféré
    1 181 Ko

    Sur ordinateur · réglages par défaut

    Performance
    100
    Accessibilité
    100
    Bonnes pratiques
    100
    Contenu principal affiché (LCP)
    0,6 s
    Temps où la page ne répond pas (TBT)
    1 ms
    Décalage de l’affichage (CLS)
    0,034
    Poids transféré
    1 181 Ko

  5. Pizzeria qui livre, livraison à domicile

    Une commande complète, de la carte au suivi du livreur. On choisit d’abord sa ville de livraison : la carte, la devise, les frais et le délai suivent.

    Ce qu’il apporte au commerce

    • Quatre villes, trois devises : le panier se recalcule si l’on change de ville.
    • Chaque plat se compose, taille, suppléments, ingrédients retirés sans frais, et le total suit.
    • Un compte sans mot de passe, ouvert par un code à usage unique, et une carte de fidélité : dix pizzas payées, la onzième offerte.
    • La course du livreur suivie sur un plan, et une roue de parts pour choisir sa pizza.

    Langues : Français, arabe et anglais

    Ouvrir sur votre téléphone : pizzeria qui livre (nouvel onglet)

    exemple-restaurant.multimdigital.com

    Le premier plan du site d'exemple d'une pizzeria qui livre : un pizzaïolo en tablier tient une margherita sur sa pelle, à l'entrée d'un four à bois en briques, les flammes vives au fond de la voûte.

    Sur téléphone · 4G lente simulée

    Performance
    92
    Accessibilité
    100
    Bonnes pratiques
    100
    Contenu principal affiché (LCP)
    2,7 s
    Temps où la page ne répond pas (TBT)
    147 ms
    Décalage de l’affichage (CLS)
    0
    Poids transféré
    1 477 Ko

    Sur ordinateur · réglages par défaut

    Performance
    100
    Accessibilité
    100
    Bonnes pratiques
    100
    Contenu principal affiché (LCP)
    0,6 s
    Temps où la page ne répond pas (TBT)
    6 ms
    Décalage de l’affichage (CLS)
    0,001
    Poids transféré
    1 477 Ko

  6. Location de voitures, quatre agences d’aéroport, au Maroc, en France et en Suisse

    Une location de bout en bout, comme chez un loueur établi : l’agence et les dates se choisissent sur le film d’accueil, chaque voiture de la liste dit ce qu’elle coûtera vraiment, et la réservation se conclut par son numéro.

    Ce qu’il apporte au commerce

    • Le moteur de recherche posé sur le film d’accueil, déjà rempli : l’agence de départ, la prise et le retour se règlent sans quitter le premier écran.
    • Le coût total réel affiché dès la liste : le prix à payer, la caution bloquée et la franchise, en trois barres à la même échelle, recalculées quand on change de protection.
    • Les prix dans la devise de son choix, MAD, EUR, CHF, USD ou GBP, avec le montant réellement payé au comptoir rappelé sous le total.
    • Quatre agences d’aéroport dans trois pays, Marrakech, Casablanca, Nice et Genève, chacune avec sa flotte, ses tarifs et ses heures de comptoir.
    • Une réservation complète, des options jusqu’au numéro de réservation, retrouvée ensuite dans « Ma réservation », et sur téléphone une barre de navigation fixe, WhatsApp compris.

    Langues : Français et anglais

    Ouvrir sur votre téléphone : location de voitures (nouvel onglet)

    exemple-location-voiture.multimdigital.com

    Le premier plan du site d'exemple d'une location de voitures : une route côtière au bord d'une mer turquoise, et le moteur de recherche posé sur le film d'accueil.

    Sur téléphone · 4G lente simulée

    Performance
    86
    Accessibilité
    100
    Bonnes pratiques
    100
    Contenu principal affiché (LCP)
    3,2 s
    Temps où la page ne répond pas (TBT)
    0 ms
    Décalage de l’affichage (CLS)
    0
    Poids transféré
    2 293 Ko

    Sur ordinateur · réglages par défaut

    Performance
    100
    Accessibilité
    100
    Bonnes pratiques
    100
    Contenu principal affiché (LCP)
    0,6 s
    Temps où la page ne répond pas (TBT)
    11 ms
    Décalage de l’affichage (CLS)
    0,001
    Poids transféré
    2 293 Ko

  7. Hôtel en réservation directe, trois hôtels au bord de l’eau, au Maroc, en France et en Suisse

    Une réservation en direct, sans plateforme entre l’hôtel et son client : on choisit l’hôtel, les dates et les voyageurs sur le film d’accueil, on compare les chambres au prix de chaque nuit, et le séjour se réserve jusqu’à son numéro.

    Ce qu’il apporte au commerce

    • Le moteur de réservation posé sur le film d’accueil, déjà rempli : l’hôtel, les dates du séjour et les voyageurs se règlent dès le premier écran.
    • Un calendrier qui affiche le prix de chaque nuit sous chaque date, week-ends et haute saison repérés d’un coup d’œil.
    • Deux tarifs par chambre, non remboursable ou flexible, avec le total du séjour, et la taxe de séjour comptée à part, réglée à l’hôtel.
    • Trois hôtels dans trois pays, Essaouira, Annecy et Montreux, et les prix dans la devise de son choix, MAD, EUR, CHF, USD ou GBP.
    • Une réservation complète, des options au numéro de réservation, que l’on retrouve ou annule ensuite, et sur téléphone une barre de navigation fixe.

    Langues : Français et anglais

    Ouvrir sur votre téléphone : hôtel en réservation directe (nouvel onglet)

    exemple-hotel.multimdigital.com

    Le premier plan du site d'exemple d'un hôtel en réservation directe : une maison blanche au bord d'une longue plage, et le moteur de réservation posé sur le film d'accueil.

    Sur téléphone · 4G lente simulée

    Performance
    93
    Accessibilité
    100
    Bonnes pratiques
    100
    Contenu principal affiché (LCP)
    2,7 s
    Temps où la page ne répond pas (TBT)
    116 ms
    Décalage de l’affichage (CLS)
    0
    Poids transféré
    1 814 Ko

    Sur ordinateur · réglages par défaut

    Performance
    100
    Accessibilité
    100
    Bonnes pratiques
    100
    Contenu principal affiché (LCP)
    0,6 s
    Temps où la page ne répond pas (TBT)
    13 ms
    Décalage de l’affichage (CLS)
    0
    Poids transféré
    1 915 Ko

02 — Avec quoi ils sont faits

quatre briques, et ce qu’elles vous rapportent.

Les sept sites reposent sur la même base technique. Chaque brique y tient un rôle que vous pouvez constater vous-même, en ouvrant un site sur votre téléphone.

  • React 19

    Les pages changent sans se recharger : une langue, une ville, un panier, et l’écran suit aussitôt.

  • Vite 8

    Le site part en ligne en fichiers statiques allégés, que le navigateur garde en mémoire : aucun serveur ne recalcule la page à chaque visite.

  • TypeScript 5

    Le code est relu par un vérificateur automatique avant d’être mis en ligne : bien des erreurs s’arrêtent là, avant d’atteindre vos visiteurs.

  • Tailwind CSS 4

    La mise en page ne garde que les styles réellement employés : une feuille de style courte, qui se charge vite sur un téléphone.

03 — Comment ils ont été mesurés

Une mesure datée, un outil nommé.

Lighthouse 13.5.0Mesure du , sur les sites en ligne

Le référencement n’est pas noté sur cette page. Chaque site d’exemple est volontairement tenu à l’écart des moteurs de recherche, par une balise « noindex » : Lighthouse compte cette exclusion comme une faute, et son score ne dirait rien de la qualité du site.

Chaque site a été mesuré trois fois sur chaque appareil, et nous gardons la mesure du milieu. Sur téléphone, Lighthouse simule un appareil de milieu de gamme et une connexion 4G lente ; sur ordinateur, il garde ses réglages par défaut.

Performance
La vitesse ressentie, notée sur 100 : le temps avant que la page s’affiche, réponde et cesse de bouger.
Accessibilité
Ce qui permet à tous de lire et d’utiliser la page : contrastes, textes des images, navigation au clavier, lecteurs d’écran.
Bonnes pratiques
La page est servie de façon sûre et propre : connexion chiffrée, aucune erreur dans le navigateur, images à la bonne taille.
Contenu principal affiché (LCP)
Le temps avant que le plus grand élément de l’écran, un titre ou une image, soit peint.
Temps où la page ne répond pas (TBT)
Pendant le chargement, le temps cumulé où un appui du doigt resterait sans effet.
Décalage de l’affichage (CLS)
Ce qui bouge sous les yeux pendant le chargement ; zéro, c’est une page qui ne saute jamais.
Poids transféré
Tout ce que l’appareil télécharge pendant le chargement de la page, en kilo-octets.

04 — Le prix d’un site comme ceux-ci

Le prix se lit dans votre pays.

Un site vitrine, ou un catalogue avec demande de devis, a sa ligne dans la grille de chaque marché, dans sa devise et hors taxes. La commande et la réservation en ligne, comme celles de la pizzeria, de la location de voitures et de l’hôtel, se chiffrent sur devis.

Un site de cette tenue, pour votre métier.

Décrivez-nous votre commerce en vingt minutes au téléphone : le devis écrit suit sous deux jours ouvrés, et rien ne vous engage avant de l’avoir signé.

+212 774 816 365WhatsApp