Project Goal
To create a modern informational website on WordPress for an ointment designed to quickly relieve pain from injuries (sprains, bruises, dislocations). The primary tasks included updating the design, implementing responsive layout, and migrating and structuring all existing materials (composition description, usage instructions, patient reviews, trauma center map) on a new platform.
Challenges
- The content was scattered across outdated HTML pages and PDF files, making it difficult for users to quickly find up-to-date information about the product.
- The old design was not mobile-friendly and had slow loading speeds, negatively impacting user experience and potentially deterring visitors.
- Content was unstructured: patient instructions and professional materials were stored in different places, making updates and maintenance inefficient.
- The client needed to quickly launch the new site while ensuring the accuracy and completeness of medical information.
Work Performed
Structure Analysis and Planning
- Collected all source materials: ointment composition, descriptions of active ingredients, usage instructions, dosage recommendations, and real user reviews.
- Identified target audiences: patients with injuries, athletes, and trauma doctors.
- Designed the section structure:
- Homepage with a short product overview, benefits, and quick links to key sections;
- Instructions for patients;
- Medical information for professionals;
- Reviews and case studies: stories from patients and doctors;
- Contact page and feedback form.
- Created page prototypes and defined UX paths for different user types.
Content Migration and Structuring
- Exported texts from PDF instructions and outdated sites, updated them according to the latest guidelines from the Ministry of Health.
- Divided content into themed blocks and marked them with tags for easy navigation.
- Optimized all images (product photos, anatomical diagrams, infographics) for the web: reduced file size while maintaining clarity at different scales.
Responsive Layout for WordPress
- Based on approved design mockups, developed a custom WordPress theme using Flexbox and CSS Grid.
- Ensured correct rendering of all elements (ingredient tables, videos, review sliders) on all screen sizes — from wide desktop monitors to narrow smartphones.
- Configured a responsive burger menu for mobile navigation.
WordPress Integration and Plugin Setup
- Installed WordPress on the client’s server and configured an SSL certificate for secure access.
- Installed and configured key plugins:
- Yoast SEO for proper meta tag generation, sitemap creation, and better search visibility;
- WP Super Cache + Autoptimize for caching and performance optimization (CSS/JS);
- Advanced Custom Fields (ACF) for flexible management of structured content such as composition and contraindications;
- MetaSlider for creating review sliders and showcasing product benefits.
Testing and Optimization
- Performed cross-browser testing in Chrome, Firefox, Safari, and Edge; validated layout on iOS and Android devices.
- Minified CSS and JavaScript; configured lazy loading of images and videos, which reduced homepage load time by at least 40%.
- Set up redirects from old URLs to new ones to retain traffic and preserve SEO rankings.
Results
- The new WordPress site was launched on time without errors or bugs.
- All materials (product composition, usage instructions, reviews) were migrated into a unified structure with consistent formatting.
- User-friendly navigation allows both patients and doctors to easily find the information they need — from usage guidelines to the trauma center map.
- Responsive layout significantly improved mobile experience: mobile traffic increased by 55%.
- Site load time decreased by 40%, positively impacting bounce rates and user retention.
- The client received a fully editable CMS: staff can independently add new articles, upload videos, and update instructions without developer assistance.
Conclusion
This project not only refreshed the website’s appearance but also centralized all information about the pain relief ointment into one accessible resource. Thanks to a well-thought-out structure, responsive design, and optimized content, the site became more informative and user-friendly for both end users (patients and athletes) and medical professionals. We’re proud to have helped the client create a modern and effective tool for educating the public about fast and safe injury treatment.