Un client industriel n’attend pas de grandes promesses : il veut voir rapidement si l’entreprise fabrique le bon produit, si elle a sa propre production et comment demander un devis. À travers l’exemple d’Unitechnology, je vous explique comment j’ai créé un site d’entreprise avec un catalogue de 16 gammes, des pages de services et des formulaires de demande de conseil.
L’entreprise et sa demande
Unitechnology (marque UNI METAL technology) est une entreprise ukrainienne active depuis 2009. Elle a débuté dans l’ingénierie technique des bâtiments industriels et civils et prend aujourd’hui en charge des solutions complètes d’études et de construction. Elle dispose de ses propres capacités de production, d’un équipement moderne et d’un cycle complet : de l’analyse du projet du client jusqu’à la mise en service de l’ouvrage, avec tout le dossier de documentation. Le principe qu’elle met en avant sur le site : un seul prestataire à toutes les étapes, un seul responsable du résultat.
La gamme d’un tel fabricant est très large : armoires électriques, rayonnages, panneaux sandwich, siphons de sol industriels, conduits d’air, façades ventilées, équipement d’abris antiaériens, portes, portails et clôtures, mobilier et cheminées en inox. S’y ajoutent des services de travail des métaux sur commande. Le rôle du site : organiser tout cela pour qu’un ingénieur, un acheteur ou un promoteur trouve vite sa gamme et contacte l’entreprise sans détour.
En-tête, menu et navigation
L’en-tête est commun à toutes les pages et sert de carte de visite de l’entreprise. En haut : le logo UNI METAL technology, le téléphone, l’e-mail et l’adresse avec les mentions « Appelez-nous », « Écrivez-nous », « Rendez-nous visite », et à droite un bouton sombre « Être rappelé ». En dessous, le menu principal :
- « Entreprise » – une liste déroulante avec « À propos », « Emplois » et « Blog » ;
- « Catalogue » – un menu déroulant avec les 16 gammes, des armoires électriques aux équipements de ventilation ;
- « Services » – la liste déroulante des services de travail des métaux ;
- « Galerie » et « Contacts » ;
- les icônes YouTube, LinkedIn, Facebook, TikTok et Instagram ;
- un sélecteur de langue avec drapeau.
Au défilement, l’en-tête se réduit à une barre compacte avec le menu et le bouton de rappel : le catalogue et la demande restent accessibles partout sur la page. Les pages internes s’ouvrent sur un bandeau vert et graphite avec le titre et un fil d’Ariane, pour que le visiteur sache toujours où il se trouve.
Page d’accueil : du carrousel au formulaire de conseil
La page d’accueil accompagne le client industriel de la découverte jusqu’à la demande :
- un carrousel de cinq diapositives en premier écran, avec compteur « 01 – 05 » et flèches ; la première annonce « Technologies de construction » et la promesse de répondre pleinement aux exigences du client ;
- « Produits » – une grille de cartes avec photo et bouton fléché rond, et un bouton « Tous les produits » ;
- « Services de l’entreprise » – un carrousel sur fond graphite avec flèches et points : soudage TIG et laser, pliage, poinçonnage CNC et d’autres services ;
- « Atouts de l’entreprise » – quatre vignettes avec icônes : en croissance depuis 2009, capacités de production propres, équipement moderne, cycle de production complet ;
- « Travailler avec nous » – clé en main, documentation d’accompagnement et solutions complètes pour bâtiments industriels, publics et civils, laboratoires et centres de recherche, sites énergétiques ;
- « Simple de travailler avec nous » – quatre étapes sur une ligne verticale : demande et conseil, offre commerciale dans le délai convenu, cahier des charges ou documentation sur demande, contrat et réalisation ;
- un formulaire « Obtenez un conseil dès maintenant » avec les champs « Nom » et « Téléphone ».
Le pied de page reprend toute la structure du site : rubriques, liste complète des gammes, tous les services et les contacts. Chaque page est à un clic depuis le bas de l’écran.
Catalogue et pages de gamme
Le catalogue est le cœur du site. Chacune des 16 gammes a sa propre page, toutes construites de la même façon : le client compare plus facilement et ne se perd pas. Prenons la page « Façades ventilées » :
- le premier écran est partagé entre une moitié verte avec le titre et le fil d’Ariane et une grande photo de façade ;
- une vignette « Documentation technique » avec icône PDF – les documents se téléchargent directement depuis la page ;
- un texte détaillé sur le produit : panneaux utilisés, domaines d’application, garantie sur les produits et la pose, prix calculé au cas par cas ;
- un bloc « Bénéfices et avantages » – esthétique, efficacité énergétique, résistance aux intempéries et protection des murs ;
- un bouton « Plus d’exemples de produits » ;
- un formulaire de conseil, un carrousel « Vidéos » sur la production et le bloc des étapes de collaboration.
Ce gabarit fonctionne pour n’importe quelle gamme : armoires, rayonnages, panneaux sandwich ou portes. L’entreprise ajoute texte, photos, documentation et vidéos – et la page est prête.
Services de travail des métaux
Les services ont leur propre rubrique, car d’autres clients les commandent, pour d’autres besoins. La page « Services » est une grille de neuf vignettes avec de grandes photos et une légende sur une étiquette blanche fléchée :
- serrurerie et thermolaquage ;
- découpe plasma et laser ;
- poinçonnage CNC ;
- soudage laser et TIG ;
- pliage, tournage et fraisage.
Les photos de vrais procédés – étincelles de soudure, faisceau laser, presse plieuse – montrent de quel travail il s’agit avant même que le visiteur lise la légende.
Entreprise, galerie, emplois, blog et contacts
Les autres pages répondent à ceux qui cherchent un prestataire fiable ou un emploi :
- « À propos » – les blocs « Objectif principal » et « L’entreprise », une bande de quatre atouts et un formulaire de conseil ;
- « Galerie » – photos réparties entre « Produits », « Production et équipement » et « Réalisations » ;
- « Emplois » – des fiches de poste avec attentes et missions : ingénieur méthodes en programmation CNC, directeur des ressources humaines, directeur commercial ;
- « Blog » – un fil d’articles avec pagination « Première », « Précédente », « Suivante », « Dernière » ;
- « Contacts » – téléphone, e-mail, adresse, coordonnées du responsable commercial et du conseiller technique, et un formulaire de conseil.
La palette du site : le vert de la marque et le graphite avec du blanc, de grandes photos de production et une grille rigoureuse. Ce style convient à une entreprise industrielle : sobre, professionnel, il laisse toute la place aux produits.
Ce qui compte dans le site d’un fabricant
Les clients industriels arrivent sur le site d’un fabricant avec une tâche précise et lisent peu. D’après ce projet, le site d’une entreprise de métallerie ou de construction fonctionne lorsque :
- le catalogue est accessible depuis le menu sur chaque page – on cherche sa gamme, on ne fait pas défiler l’accueil ;
- chaque gamme a sa page avec texte, avantages et documentation – facile à transmettre à un collègue et mieux référencée ;
- les services sont séparés des produits – autre public, autres recherches ;
- les atouts du fabricant sont bien visibles : année de création, capacités propres, équipement, cycle complet ;
- on comprend comment tout commence – les étapes de la demande au contrat rassurent avant le premier appel ;
- le formulaire de conseil est court – nom et téléphone, le responsable précise le reste.
Si vous dirigez une entreprise de production avec une large gamme, commencez par la carte de vos gammes et un gabarit de page unique pour chacune. Votre site grandira alors facilement avec votre offre, et vos clients trouveront toujours ce qu’ils cherchent et sauront où envoyer leur demande.
Détails du projet
Type de projetsite vitrine-catalogue
CatégorieSite d’entreprise
TechnologiesHTML5, CSS3, JavaScript
Rôledéveloppement du site : intégration des pages, menu déroulant du catalogue, carrousels, pages de gamme et de services, formulaires de conseil
ClientUnitechnology (UNI METAL technology)
PaysUkraine
Travaux réalisés
- Intégration des pages : accueil, à propos, emplois, blog, catalogue, page de gamme, services, galerie, contacts
- En-tête commun avec contacts, bouton « Être rappelé », réseaux sociaux et sélecteur de langue
- Menu déroulant du catalogue pour 16 gammes et en-tête compact au défilement
- Carrousel du premier écran avec compteur et carrousel de services sur l’accueil
- Blocs atouts, collaboration et quatre étapes de travail avec le client
- Gabarit de page de gamme : texte, avantages, documentation technique, vidéos et formulaire
- Page de services en neuf vignettes et galerie en trois rubriques
- Offres d’emploi, blog paginé et contacts des responsables
- Formulaire de conseil et pied de page avec la carte complète du catalogue et des services
Résultat
- Un site vitrine-catalogue de fabricant, en ukrainien
- 16 gammes de produits avec un gabarit de page commun et la documentation
- Une rubrique dédiée à neuf services de travail des métaux
- Les atouts du fabricant et les étapes de collaboration sur l’accueil
- Formulaire de conseil et demande de rappel depuis chaque page
Voir le site du projet
