Entreprise de construction

FELCO Construction

Le site d’une entreprise de construction présente trois domaines, deux galeries de réalisations et un contact par formulaire ou téléphone.

Structure, design d’interface, développement web et lancement3 pôles de prestations · 2 galeries de réalisations · formulaire et téléphone

Voir le site ↗

Premier écran du site en ligne de FELCO Construction

Contexte

FELCO General Construction travaille sur des projets résidentiels et commerciaux en Californie. Le site présente la planification des travaux, la rénovation et la gestion de projet. Pour une telle offre, il ne suffit pas de lister les services : il faut aussi montrer le type de bâtiments sur lesquels l’entreprise intervient.

L’enjeu

Associer une explication claire des prestations à des exemples visuels. Le visiteur doit reconnaître son type de projet, voir des réalisations comparables et trouver comment en discuter. La longue page d’accueil présente l’entreprise pas à pas, et les galeries détaillées ont leurs propres pages.

Nos choix

Trois pôles de prestations
Preconstruction Planning, Remodeling and Updating et Construction Management ont chacun leur carte. Une photo, un titre et une courte explication permettent de distinguer la préparation, la rénovation et la conduite de chantier.
L’architecture au premier plan
Une grande photo d’un bâtiment achevé appuie le message principal sur la construction résidentielle et commerciale. Le titre se pose sur l’image : le visiteur voit d’emblée le métier et son objet.
Deux portfolios distincts
La galerie est divisée en Residential Construction et Commercial Construction. Les types de bâtiments ne se mélangent pas : le visiteur choisit le domaine qui le concerne et accède à sa propre sélection.
De la découverte à la demande
L’accueil déroule les prestations, l’entreprise, la galerie et le contact, et le menu mène directement à chaque bloc. À la fin : un formulaire, un numéro de téléphone et la proposition de discuter d’une estimation.

Notre réalisation

Système visuel

Un bloc jaune de la marque ressort sur la navigation sombre et les sections blanches. Les photos de bâtiments et de chantiers occupent de grandes surfaces. Des filets jaunes sous les titres reprennent l’accent du logo et réunissent des contenus variés dans un même système.

accent#EDCD1F

dark blue#1E2D3B

dark gray#3B3A3A

light gray#F7F7F7

white#FFFFFF

Typographie de l’interface

Les tailles ci-dessous ont été mesurées sur le site en ligne avec un viewport de 1180 × 757 px CSS, zoom 100 %, DPR 1. Elles décrivent cette mise en page précise, pas des tailles fixes pour tous les appareils.

Titres: Avenir LT Heavy · fichier de graisse séparé ; graisse CSS 400
Titre du premier écran: 42 px / 46,2 px · interlettrage 2,1 px (0,05 em)
Titres des prestations: 22 px / 24.2 px · Avenir LT Heavy
Texte courant: Helvetica Light · 15 px / 24 px · CSS weight 400
Navigation: Avenir LT Light · 14 px / 37 px
Titres de section: 55 px · Avenir LT Heavy · line-height: normal

Avenir LT Heavy : le véritable titre du premier écran.

Avenir LT Heavy dans un titre de prestation et Helvetica Light dans le texte courant.

Logo et usage

Le bloc de marque du site est composite : un symbole de maison avec la lettre F et l’inscription FELCO / GENERAL CONSTRUCTION composée à part. Ci-dessous, un vrai fragment de l’en-tête : lettres et espacements d’origine sont conservés.

Le symbole et le logotype dans la composition d’origine du site FELCO.

Image du symbole: 116 × 116 px · carré 1:1
Taille du symbole sur le site: 116 × 116 px CSS pour un viewport de 1180 × 757
Inscription FELCO: Bloc de texte 220 × 42 px CSS ; corps 42 px / 42 px ; interlettrage 2,1 px
Ligne GENERAL CONSTRUCTION: Bloc de texte 220 × 16,5 px CSS ; corps 15 px / 16,5 px ; interlettrage 0,75 px

Les valeurs de couleur ont été vérifiées dans le CSS du site. Les spécimens typographiques sont des fragments d’écrans réels ; les fichiers de polices commerciales ne sont pas inclus dans cette étude de cas.

Parcours et contenus

Premier écran → la bonne prestation → galerie résidentielle ou commerciale → Contact. Le visiteur peut lire l’accueil dans l’ordre ou aller directement à une rubrique depuis le menu. Les galeries séparées permettent de parcourir les réalisations sans alourdir la page principale.

Trois pôles : planification, rénovation et conduite de chantier.

Promotion

Nous avons optimisé le site pour le référencement, configuré un compte Google Ads, puis lancé la publicité et la promotion dans les moteurs de recherche.

Le résultat

Le site institutionnel est en ligne, avec une présentation progressive des prestations de construction et des galeries de réalisations séparées. Prestations, informations sur l’entreprise et points de contact forment un parcours clair ; de vraies photos donnent à l’offre son contexte visuel.