Medium Infinite Scroll Footer
Screenshots powered byGetScreenshot Screenshot API
✋ What is it?
This is a layout solution found in Medium.com. Medium's website home uses infinite scrolling to reveal and aid with the discovery of the extensive content available on their platform. Unlike other websites that have to drop their footer to use infinite scrolling, Medium keeps a small footer visible as a part of a fixed scroll component to the right of the main feed.
🤲 How does this interaction or solution work?
Medium is a popular blogging and written content network that gives access to thousands of pieces contributed by an active user base of publications and writers.
Since there is a significant amount of content that gets published in their network on a daily basis, Medium relies on different interactions to aid discoverability of content and engagement.
One of those interaction solutions is an infinite scroll feed in their home page. When a user lands on Medium.com, they can either choose to browse one of the featured or editorial sections or scroll explore the main feed which is a list of articles with a thumbnail, a title, and a text excerpt.
As a user scrolls through this feed, new content will load dynamically. Since every new scroll will increase the size of the document, there's no practical way to reach the end of the page where the footer usually sits. Medium fixes this issue by adding a small footer with relevant links below the reading list container that is fixed to the right of the feed.
🙌 How does this interaction or solution work?
Layout and Visibility.
Infinite scrolling is a preferred solution by multiple websites since it increases engagement and allows users to discover content without very low friction. However, infinite scroll can come with a lot of caveats like not being able to support footers that are usually meant to aid with other critical navigation tasks.
By creating a small footer and placing it below a fixed navigation element that follows the users as they scroll, Medium can provide a more comprehensive and less confusing navigation to its users.
This layout, in particular, allows the presence of other navigation elements that usually live below the main grid or list of items. Components like 'subscribe widgets' or 'share widgets' could be fixed to the right or left of an infinite feed and combined with mini footers like the one seen on Medium.
That's it! If you like the content, consider subscribing to Waveguide Next, a newsletter / blog where I share new examples and lessons on User Experience.