Dentist Clinic Web Design
Mayfield Dental
Mayfield Dental is a family-orientated private dental practice located in the heart of South Croydon. With a small dedicated team, they aim to bring gentle, honest and reliable dentistry with clear pricing and treatment options to keep their patients informed and reassured their oral health is well taken care of.
Brand Mission
Mayfield Dental is well established, providing excellent dental care in Croydon since 1972. They continually strive to modernise their knowledge and use innovative dental technologies to deliver the best treatment options for their patients. Purposefully small and intentional, they create a welcoming, naturally-lighted, judgement-free environment suited to families, nervous patients and those seeking flexible appointments. They excel in building trust within the patient-dentist relationship to alleviate patient anxieties and fears visiting the dentist, educating children to form good dental habits and are particularly adept in swiftly dealing with dental emergencies and trauma.
The Need
They required a refreshed dentist clinic web design to align with their high quality service, brand values, improve navigation and mobile performance, in order to stay relevant, keep growing and continually attract new patient enquiries in a highly local competitive niche.
They also needed to refine the site for their key target audiences – primarily nervous patients, families and busy individuals requiring evening or weekend appointments. Their previous site colours relied heavily on a colour that leaned towards a feminine audience. They wanted to embrace a more gender neutral aesthetic and position themselves as the go-to long-term family dentist that’s trustworthy and authentic.
Project Phases
Phase 1: Discovery & Strategy
Deep research and strategy phase to learn about business goals, local competitors and develop a strategic roadmap for a new dental website design.
Phase 2: Strategic Design Direction
Evaluated and transformed their existing site map and design to a new, modern, refined visual direction that not only reflected the existing brand but also partly centred around the principal dentist (the sole dentist of the practice) and overall brand personality reflected in their content for their website.
Phase 3: UX & UI DESIGN
User experience design, wireframes, component and template design, technical specs.
Phase 4: Development
Website design, front and backend development, technical architecture, testing and QA with the Mayfield Dental Team.
intentional design and a more intuitive user experience
Every element of the website – information architecture, site design, and user experience, was crafted to position Mayfield Dental as a trustworthy, gentle, honest, convenient dental clinic.
The previous navigation was cluttered and posed barriers to key information. Particular attention was spent on speeding up the mobile site and introduction of a short homepage video for users to see for themselves a diverse audience and video testimonials from happy patients, encouraging trust signals and positive results, building user engagement and connection.
Content was analysed and streamlined, informed by previous user data, combining pages that made sense to merge, removing thin content, or updating if they retained potential value.
The Challenge: Dentist clinic Web Design
Mayfield Dental had a tired website that did not align with their brand values or the quality of services they provide.
Their website contained several generic stock images, duplicates and an excessive amount of pages that lacked quality content.
The previous website had a clunky navigation and a large extensive footer, built with a bloated website setup and a lot of plugins, sacrificing performance, affecting conversion rates.
With so many dental practices in surrounding areas competing for attention, a professional, functional website is crucial to stand out, improve user experience, and ensure services are easy to find for prospective patients and those curious to find out more about the practice when comparing with other local dentists.
Client requirements included:
- Consistent branding across all pages.
- Responsive website design across all devices.
- Faster and improved mobile UI and UX.
- New expert-led resource pages.
- Simpler forms for easy patient submissions.
- Remove excess pages so customers only access the most key information, increasing engagement on fewer more important pages.
- Add credibility and social proof signals – client testimonials, case studies and more real pictures from the practice.
The Solution: Responsive Dental clinic Website Redesign
As an experienced WordPress website designer, I took on the challenge of developing a solution that addressed the needs of Mayfield Dental. This involved migrating the site from Elementor to the WordPress native block editor (Gutenberg FSE)
Key Features Implemented:
- Responsive Website Design: To cater to all users, I built a fully mobile-first web design that ensures a smooth and fast experience on all devices.
The pricing page had set breakpoints between desktop and mobile – enabling a mobile version of pricing cards for easier legibility on smaller screens:
Streamlined Navigation: The user experience was at the forefront of the redesign. I simplified the site structure to minimise clicks and make it easier for users to find critical information.
For the desktop version, I implemented a mega menu element to the header to make it easy for users to see the myriad of dental treatments provided within one click with a clear categorised layout:
Service page example:
- Mobile icon Integration: On the mobile version of the site I added a strip of contact icons to the header navigation so users can easily engage with the practice as soon as they visit the website.
- Team Profiles: The new site includes an enhanced team page featuring images of staff, practice background and core values.
- Dynamic sections – using the patterns feature in the editor I created reusable blocks, to keep spacing consistent on repeated sections as well as create aligned variations, making future updates easy for anyone editing the site. The site’s block system makes it easy to assemble pages for many different content types.
The Result: A beautiful dental clinic Web Redesign
The result is an exceptional website that reflects Mayfield Dental’s mission, professionalism and better mobile access to their services.
The new website is a vital marketing tool in their brand, showcasing their heritage as a staple in the Croydon community, whilst catapulting their longstanding continued excellence in dentistry into the future.
We replaced one of their brand fonts with the sophisticated and highly accessible serif font, Lora, for a subheading, which adds a heritage feel to the site. A typeface representation of the long established reputation and trust built with the practice over decades.
Bespoke dental illustrated icons to describe the various services on offer, without images depicting invasive procedures, approachable and not too clinical. The thin to thick lines resemble the curves of the brand’s logomark.
Conclusion: Hire a Dental Practice Web Designer for Your Dental Website Redesign
I helped Mayfield Dental achieve a professional, user-friendly, and mobile-optimised online presence that aligns with their mission of exemplary dental care and building genuine relationships tailored to every patient’s unique needs, helping them to achieve their optimal smile.
The website now effectively communicates their reputation as a caring empathetic family practice, with clear pricing options and multiple points of contact to suit user preferences.
If you’re looking for a WordPress website designer to transform your organisation’s website, let’s work together to bring your vision to life.
Credits
Principal Dentist: Dr. Deepali Patel
Web Designer & Developer: Sam Ma
Tools
CMS: WordPress
Software: Figma, Illustrator, Photoshop