Asbestos.com Backpage Update
Boosted Google Ranking 2 points on average. Conversion increased by 17%.
A new back page template for asbestos.com was created with the primary goal of maximizing content visibility above the fold without compromising the design and readability.
The Problem
- The existing layout couldn’t accommodate all the relevant content requested to appear higher up on the page.
- Videos, which occupied a significant portion of the page, were not getting much traction.
- The primary call to action wasn’t as prominent as it could be.
- The page felt flat and hard to read.
The Solution
- Updated typography to use more legible fonts.
- Enhanced visual separation between the hero section and the rest of the content.
- Reduced the video size and moved trust signals and authorship higher up the page.
- Added a sticky side navigation to increase the amount of visible content without overly distracting users.
- Increased contrast on the table of contents to improve page navigation.
Before & After
The left page displays the old layout, while the right showcases the new design.
- Videos had a low CTR, reducing the size increased visiblity of primary CTA.
- New Dark header and more visible fact checked box promotes trust.
- Moving Related articles to the sidebar from the bottom of the page for easier naviagation.
- Easier to see Table of Contents bar.
Sidebar Functionality
The original template featured a single-column layout to achieve horizontal balance on the page. To accommodate more content above the fold, we implemented a sticky side navigation. This change allows us to position the recommended reading section higher on the page and keeps our call-to-action (CTA) visible as users scroll. In the original template, the CTA occasionally overlapped text in the bottom right corner on certain screen sizes, an issue we’ve now resolved.
Profile pages
In addition to the new back page template, we also updated the profile pages. The old layout was cluttered and lacked adequate white space. The new template moves key content above the fold and introduces collapsible menus to reduce visual clutter and noise on the page.
Sticky navigation
On the old template, you had to scroll back to the top of the page to see the main navigation. The sticky nav allows users to see it on upscroll.
This also highlights the updated table of contents. The old ToC was white on white, making it easy to get lost.
Mobile Mockups
new pull quote style
