Homepage Redesign – Desktop


There are areas the iDrivesSafely.com homepage can improve to increase conversion. Some of the main issues include too many product offerings, the lack of hierarchy, and heavy SEO content flooding the page. Visitors leave after having a difficult time finding their product. The objective of this project is to create a new page design that tackles these problems. The optimized page will lead customers to take action right away. The body content is reformatted for quick scanning. And the overall page will be clean and professional.

This post will talk about design elements for desktop and tablet layouts. iDriveSafely Landing Page Optimization Part 2 will focus on mobile design.

New Desktop Design

The new layout is reorganized into 5 block-style sections for easier information absorption and fluidity.

Product Finder

Placing a “Product Finder” element at the top of the page (above the fold) will direct visitors to take action when they arrive. It funnels them to the appropriate page by letting them self-select the product they’re looking for and the State they are from.

To demonstrate credibility, the TrustPilot rating widget is implemented underneath the action area. The iconic features and benefits also add to customer confidence.

Popular Products

SEO content is reformatted into more legible product titles and short descriptions. With a generous amount of white space, each item is easy to understand. Visitors can browse through a list of services by toggling “Show All Products” and “Show fewer Products.” This is a more user-friendly way to implement SEO keywords without displaying a sea of text.

Selling Points and Featured Product

The next part of the page houses the rest of the SEO content. Instead of the previous design (view here), content is broken down into bullet points and shortened paragraphs for quick scanning.

Recommended Reading

Finally, the last part of the page adds credibility to the iDriveSafely brand by recommending visitors to acknowledge the company’s active leadership role through their blog.

Tablet Layout

The tablet layout of this page mostly functions the same way as desktop, except some elements are stacked into 2 columns.

Product Finder

The background image is repositioned closer to the content.

Popular Products

State selector popover is also consistent with desktop.

View All Products

View all product stacks in the same model as popular products.

Selling Points and Featured Product

This portion of the page becomes a single column. The graphic of the selling points block reorders to the top of content, while the graphic of the featured product is at the bottom.

Recommended Reading

Finally, this section is now 2 columns to stay consistent with the popular product layout. Only two most recent posts are needed to serve their purpose.

Please continue to iDriveSafely Landing Page Optimization Part 2 for mobile design details.