A responsive institutional website designed to present a multidisciplinary construction group through a clear one-page experience, consistent visual hierarchy and reliable technical foundation.
A2 Prado needed a professional website capable of presenting the group, its specialist companies and its experience without forcing visitors through a fragmented collection of unrelated services.
The solution was developed directly in WordPress using Divi and a compact one-page structure. The existing logo and visual identity guided the interface, while custom CSS refinements improved spacing, hierarchy and responsive behaviour across desktop, tablet and mobile devices.
The final experience brings together the group overview, specialised brands, leadership, career information, direct contact details and newsletter sign-up within a single, easy-to-follow journey.
Multiple areas and companies needed to feel connected without creating a confusing navigation structure.
Each section answers a specific user question and moves naturally toward contact or exploration of the group brands.
The interface, infrastructure, security, performance and search foundations were treated as one connected delivery.
My contribution covered the complete digital implementation: content organisation, interface construction in Divi, responsive refinement through custom CSS and the technical setup required to publish and maintain the project.
Structured the one-page journey and organised the group information into clear, readable sections.
Implemented the interface directly in the browser, combining Divi components with custom CSS adjustments.
Prepared the environment required to move the website from development into a secure live configuration.
Configured the essential foundations for security, caching, newsletter capture and search accessibility.
The project evolved directly inside WordPress rather than through a separate high-fidelity prototype. Content priorities, visual hierarchy and responsive behaviour were refined iteratively during implementation and review.
The existing identity established the colour, typography and visual tone used throughout the website.
Design decisions were tested in the real browser environment, reducing the distance between concept and final behaviour.
Custom CSS was used to correct spacing, proportions and component behaviour across different screen sizes.
Wireframe-style documentation was created to explain the hierarchy and design reasoning behind the implemented experience.
The one-page structure avoids unnecessary navigation layers. Visitors first understand the group, then discover its specialised brands, leadership, career opportunities and direct contact information.
The opening section introduces the group through its identity and institutional positioning.
A concise explanation clarifies the relationship between engineering, architecture and the wider business structure.
The group brands are presented as connected solutions rather than disconnected services.
Leadership and recruitment information strengthen credibility and communicate the human side of the organisation.
Direct contact details and newsletter capture provide clear next steps without complicating the journey.
Responsive behaviour was treated as part of the interface rather than a final correction. Navigation, image proportions, text hierarchy and touch targets were refined so the experience would remain coherent across devices.
Content priority remained consistent across every screen, while layout, spacing and navigation were reorganised to suit each device rather than simply being reduced in size.
The project combined front-end implementation with the operational work required to launch a reliable institutional website. WordPress and Divi provided the core environment, while custom CSS and occasional HTML adjustments refined the final result.
WordPress and Divi implementation with custom CSS, responsive refinement, hosting setup, security, caching, SEO configuration and occasional code editing.
The gallery brings together the transition from wireframe logic to final interface and the main desktop, tablet and mobile compositions created for the case study.
The result is a focused one-page website that presents the A2 Prado group, its specialised companies, leadership, career opportunities and contact information in a coherent and professional way.
The structure explains a multidisciplinary business without overwhelming visitors with disconnected service pages.
The same information remains readable, visually coherent and actionable across desktop, tablet and mobile devices.
Hosting, security, caching, SEO and production configuration support the interface beyond its visual presentation.