Mark-10 Website Redesign
Old vs. New
The original Mark-10 website was built entirely with static .html files. This made it very difficult to maintain since there was no content management system or templates/shared parts. To make a change in the site navigation, code had to be edited in every single file.
The original layout appeared dated and lacked any responsive elements.
The new landing page includes a hero video, responsive slider, and interactive icons.Static vs. Responsive
One of the primary goals for the redesign was to make the site fully responsive for display on mobile devices. All page layouts for the new site are based on the bootstrap4 responsive grid. Other responsive elements include:
- An off-canvas mobile menu.
- Responsive scrollable tables
- Responsive sliders
Search function
A search function was implemented to improve navigation of the product catalog. Products are searchable by name and by SKU.
Indexed Product Data
All of the content on the product pages is stored as custom data attributes. This makes all product data much more manageable and consistent because product information such as price is set once in the database and then displayed wherever it is needed on the website.
Product Photography
The quality and implementation of product photography is vital to communicating product value online.
An updated gallery design was implemented to make images more accessible and informative.
