The project
Anson Metal is a global supplier of high-performance metal solutions for the aerospace and energy sectors, with nearly two decades of experience since 2007. The website needed to reflect their expertise and professionalism while making it easy for international clients to understand their capabilities and get in touch.
We were tasked with rebuilding the website for Anson Metal, transforming the outdated site into a modern, high-performing platform that better serves their global client base.
Previous site
Key pain points
Outdated Design and Content
Dated visual design that didn't reflect the company's expertise
Typographical errors and unclear content structure
Mixed language navigation (English/中文) without clear separation
Poor User Experience
Unclear navigation structure
Content scattered across multiple sections without clear hierarchy
Difficult for visitors to understand services and capabilities at a glance
Performance Issues
Slow load times affecting user engagement
Poor Core Web Vitals scores impacting SEO
Not optimised for mobile devices
Accessibility Concerns
Low contrast ratios making content hard to read
Missing semantic HTML and ARIA attributes
Poor keyboard navigation support
Our recommendations
- Rebuild with modern web standards and a clean, professional design
- Restructure content to clearly communicate services and expertise
- Optimise performance with modern image formats and efficient code
- Ensure full responsiveness across all devices
- Improve accessibility to meet WCAG 2.2 AA standards
New site
Improvements
Clear Information Architecture
Simple, intuitive navigation: Products, Materials, Quality, Contact
Clear value proposition highlighting expertise and global reach
Better content structure making services easy to understand
Modern Design
Clean, professional aesthetic that reflects the company's expertise
Improved visual hierarchy ensuring key information stands out
Consistent branding throughout
Performance Optimisation
Significant improvements in Core Web Vitals scores
Faster load times through image optimisation and efficient code
Better mobile performance and user experience
Accessibility Enhancements
Improved colour contrast for better readability
Proper semantic HTML and ARIA attributes
Full keyboard navigation support
Meeting WCAG 2.2 AA standards
Colour palette
The colour palette reflects Anson Metal's professional, industrial identity. The deep blues and charcoal tones convey trust and reliability, while the dodger blue provides a modern accent that suggests innovation and precision. The palette balances professionalism with approachability, suitable for a company serving global aerospace and energy sectors.
-
- Black
- #1a1a1a
- rgb(26 26 26)
- hsl(0deg 0% 10%)
-
- White
- #ffffff
- rgb(255 255 255)
- hsl(0deg 0% 100%)
-
- Dodger Blue
- #0088ff
- rgb(0 136 255)
- hsl(211deg 100% 57%)
-
- Congress Blue
- #002d66
- rgb(0 45 102)
- hsl(211deg 100% 25%)
-
- Charcoal
- #333333
- rgb(51 51 51)
- hsl(0deg 0% 20%)
-
- Silver
- #cccccc
- rgb(204 204 204)
- hsl(180deg 1% 80%)
Performance and Core Web Vitals
Previous site
Mobile
Performance:
89%
Accessibility:
56%
Best practices:
67%
Search Engine Optimisation:
82%
Full details
-
Largest Contentful Paint:
2.7s
Success: < 2.5s Warning: 2.6s - 4s Error: > 4s
-
First Contentful Paint:
1.4s
Success: < 1.8s Warning: 1.81s - 3s Error: > 3s
-
Speed Index:
7.4s
Success: <3.4s Warning: 3.5s - 5.8s Error: > 5.8s
-
Cumulative Layout Shift:
0
Success: < 0.1 Warning: 0.11 - 0.25 Error: > 0.25
-
Total Blocking Time:
0ms
Success: < 200ms Warning: 201ms - 600ms Error: > 600ms
-
Page weight:
1.01MB
Success: < 1.50MB Warning: 1.50MB - 2.23MB Error: > 2.23MB
Desktop
Performance:
92%
Accessibility:
56%
Best practices:
70%
Search Engine Optimisation:
82%
Full details
-
Largest Contentful Paint:
0.6s
Success: < 2.5s Warning: 2.6s - 4s Error: > 4s
-
First Contentful Paint:
0.4s
Success: < 1.8s Warning: 1.81s - 3s Error: > 3s
-
Speed Index:
3s
Success: <3.4s Warning: 3.5s - 5.8s Error: > 5.8s
-
Cumulative Layout Shift:
0
Success: < 0.1 Warning: 0.11 - 0.25 Error: > 0.25
-
Total Blocking Time:
0ms
Success: < 200ms Warning: 201ms - 600ms Error: > 600ms
-
Page weight:
1.01MB
Success: < 1.50MB Warning: 1.50MB - 2.23MB Error: > 2.23MB
New site
Mobile
Performance:
99%
Accessibility:
100%
Best practices:
100%
Search Engine Optimisation:
100%
Full details
-
Largest Contentful Paint:
1.5s
Success: < 2.5s Warning: 2.6s - 4s Error: > 4s
-
First Contentful Paint:
1.1s
Success: < 1.8s Warning: 1.81s - 3s Error: > 3s
-
Speed Index:
3.7s
Success: <3.4s Warning: 3.5s - 5.8s Error: > 5.8s
-
Cumulative Layout Shift:
0
Success: < 0.1 Warning: 0.11 - 0.25 Error: > 0.25
-
Total Blocking Time:
0ms
Success: < 200ms Warning: 201ms - 600ms Error: > 600ms
-
Page weight:
206KB
Success: < 1.50MB Warning: 1.50MB - 2.23MB Error: > 2.23MB
Desktop
Performance:
100%
Accessibility:
100%
Best practices:
100%
Search Engine Optimisation:
100%
Full details
-
Largest Contentful Paint:
0.3s
Success: < 2.5s Warning: 2.6s - 4s Error: > 4s
-
First Contentful Paint:
0.3s
Success: < 1.8s Warning: 1.81s - 3s Error: > 3s
-
Speed Index:
0.3s
Success: <3.4s Warning: 3.5s - 5.8s Error: > 5.8s
-
Cumulative Layout Shift:
0.002
Success: < 0.1 Warning: 0.11 - 0.25 Error: > 0.25
-
Total Blocking Time:
0ms
Success: < 200ms Warning: 201ms - 600ms Error: > 600ms
-
Page weight:
206KB
Success: < 1.50MB Warning: 1.50MB - 2.23MB Error: > 2.23MB
Tech used
- Static site generation with Eleventy (11ty)
- CSS transformations with PostCSS
- Front end build tasks with Gulp
- Hosted on Vercel
- Code stored on GitHub
- Emails powered by Resend
Reyt good
The new Anson Metal website successfully transforms their online presence into a modern, high-performing platform. The improved performance, accessibility, and user experience make it easier for global clients to understand their capabilities and get in touch. The site now properly reflects the company's expertise and professionalism in the aerospace and energy sectors.