Pre-construction
Planning, coordination and value thinking before mobilisation.
Explore →← All website projectsProject 17 / 24
Industry · Riyadh, Saudi Arabia
Construction Group
The company needed to make capabilities, project evidence, governance and tender readiness easy to verify during procurement.
Complete scope15 core page types
Portfolio presentationOne large full-site snapshot
Designed forA regional contractor bidding for commercial, residential and infrastructure work
Primary audienceDevelopers, consultants, procurement teams and joint-venture partners
01 / Full website snapshot
One large picture. The complete visual story.
This single website snapshot shows how the header, hero, services, imagery, detailed content, proof, enquiry action and footer work together.
See first. Read second.
The large snapshot gives the complete visual direction. The details below explain the 15-page architecture, functionality, SEO, speed and image work behind it.
Who it is for and why it should exist.
The company needed to make capabilities, project evidence, governance and tender readiness easy to verify during procurement.
- Organisation
- A regional contractor bidding for commercial, residential and infrastructure work
- Audience
- Developers, consultants, procurement teams and joint-venture partners
- Market
- Riyadh, Saudi Arabia
Visual decisions with a commercial purpose.
A robust corporate grid connects every capability claim to relevant project evidence and routes serious opportunities into a structured tender enquiry.
Project-specific colour and type system
03 / Full website architecture
15 connected page types—not isolated mockups.
The structure supports the full decision journey. Repeatable service, listing, product or article templates can create further URLs without redesigning the system.
- 01Corporate homepage
- 02Sector and capability pages
- 03Project evidence archive
- 04Safety, quality and ESG centre
- 05Tender enquiry room
- 06Capabilities overview
- 07Pre-construction detail page
- 08Project delivery detail page
- 09Specialist works detail page
- 10About the organisation
- 11Sector experience
- 12Project evidence
- 13Quality, safety and governance
- 14Insights and resources
- 15Tender or quote enquiry
04 / How the website is made
Strategy first. Components second. Polish throughout.
A website becomes commercially useful when content, UX, code and acquisition work as one system.
Discovery and positioning
Clarify the offer, priority audience, market language, proof, objections and the action the website must create.
Content architecture
Map 15 core page types around confirm capability → inspect relevant projects → review governance → open a tender conversation.
Visual and UX system
A robust corporate grid connects every capability claim to relevant project evidence and routes serious opportunities into a structured tender enquiry.
Responsive component build
Create reusable navigation, cards, detail templates, forms and content blocks that remain consistent across desktop and mobile.
SEO, QA and launch
Validate metadata, schema, internal links, accessibility, forms, analytics, performance and indexing before controlled release.
Project functionality
What the website actually does.
- Capability and sector navigation
- Filterable project evidence
- Tender or quote qualification
- Governance and document centre
- Location or route content
- CRM-ready opportunity handover
05 / Automatic SEO and organic acquisition
SEO foundations are built into every reusable page.
The objective is to attract qualified organic enquiries so the business is not forced to pay for every first visit. Technical defaults are automated at template level; useful content and internal links then build a discoverable website over time.
Automatic technical SEO
- Page-specific title and meta-description fields
- Clean URLs, canonical tags, robots rules and XML sitemap
- Organization, Service, Project and Article structured data
- Automatic breadcrumb and related-content links
- Open Graph data, descriptive image alt text and social previews
- Reusable CMS fields so new pages inherit the correct foundations
Organic enquiry route
01Confirm capability02inspect relevant projects03review governance04open a tender conversation
Search intent is connected to the most useful service, location, guide or detail page; trust content and a relevant call to action then move the visitor towards enquiry.
Responsible expectation:
Automatic SEO improves crawlability, relevance and publishing consistency. Rankings and enquiries are not guaranteed; they depend on competition, content quality, authority, market demand and time.
06 / Speed and image engineering
Premium visuals without careless loading.
Large photography is treated as a performance problem to solve, not an excuse for a slow website.
Fast by architecture
- Static-first pages and server or CDN caching where suitable
- Lean, reusable CSS and minimal JavaScript
- Critical assets prioritised; non-essential scripts deferred
- Third-party widgets reviewed for real business value
- Core Web Vitals measured after launch and monitored over time
Right image, right size
- AVIF or WebP delivery with a compatible fallback
- Responsive widths and
srcsetfor mobile, tablet and desktop - Compression tuned to the visual role of each image
- Explicit dimensions to prevent layout movement
- Hero images prioritised; below-the-fold media lazy-loaded
Anonymous portfolio study
This project protects client privacy and demonstrates a credible commercial implementation. It does not publish a client identity, claim a live deployment or invent performance figures.