Overview
Miss Bonnie's website was converted from a flat file site to WordPress in 2011 bringing an updated design and the ability to edit the pages using a CMS and converting the site to have an actual online store.
In 2018, things had changed substantially with mobile devices taking over and accounting for 60% of website traffic.
The site needed to be converted to be more mobile responsive, and an upgrade was needed for the e-commerce system to give it smoother capabilities that were not available in 2011.
Phase 1 - Reviewing Website on Different Devices
The first thing we needed to figure out was if it was possible to write media query rules to make the existing website mobile responsive. When it was clear that there were elements that would push important content down, we suggested to switch the design to a new updated framework that would be responsive.
Phase 2 - Transferring Assets to a new WordPress Install
To accomplish the need for a better mobile experience we took some elements like the background image for the body and menu from the old website. To give the website a little more fresh feel the desktop version had the body made wider and to give it a more responsive module feel we used a page builder to let her keep a lot of the layout of the old website but make it easier to update content.
Priority on a better Mobile Device Experience
Changes made to make the page more mobile friendly is the main menu is now a hamburger mobile menu that slides out.
Fixed to the bottom is the 3 most popular items the client sells making it easier for people to find quickly what they are looking for.
The website also received and updated fonts that are made for a more consistent mobile experience for all mobile users.