Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

iTechGuides is reader-supported. When you buy through links on our site, we may earn an affiliate commission. As an Amazon Associate I earn from qualifying purchases. Learn more

“Above the fold” is the part of a webpage visible in the initial viewport, before a visitor scrolls. On a website, that area has no fixed pixel boundary: it changes with the screen, browser window, and viewport size.

Where the phrase comes from

The expression comes from newspaper publishing. A newspaper displayed folded on a stand showed its upper front-page portion; stories and headlines in that visible area were described as being above the fold. The digital meaning carries over the idea of what someone can see immediately.

What counts as above the fold on a webpage?

It is whatever part of the page appears in the browser’s initial view without scrolling. Google AdSense Help defines the advertising usage as “the content that is visible on a page without the user needing to scroll down” (Google AdSense Help).

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Unlike a folded newspaper, a webpage has no single, stable fold. A phone, a desktop monitor, a resized browser window, and different browser interface sizes can all show different portions of the same page. As a result, advice to fit important content within a specific number of pixels is meaningful only when the viewport and context are also specified.

How to use the idea in page design

Make the first view useful

Help visitors quickly recognize what the page is about and find relevant content. The initial view should give them a clear reason to continue, but it does not need to contain the whole article or every important detail. Google’s guidance on page layout likewise emphasizes making the content users are looking for easy to find (Google Search Central, January 19, 2012).

#1 Best Overall
Sale
HTML and CSS: Design and Build Websites
  • HTML CSS Design and Build Web Sites
  • Comes with secure packaging
  • It can be a gift option

Check more than one viewport

Review the page at the screen and browser-window sizes your audience is likely to use. Check that the title, introductory context, and route into the main content remain understandable in those views; do not treat one desktop screenshot as a universal fold position.

Keep advertising from obscuring the page

In ad-supported layouts, the opening view should not be so dominated by advertisements that visitors struggle to find the page’s actual content. Google’s 2012 post about a page-layout algorithm change said that the change noticeably affected less than 1% of searches globally. That is a historical figure for that specific change, not a current estimate of ranking effects.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Prioritize what needs to render first

For loading performance, prioritize rendering the critical content visible in the initial view and defer noncritical resources where appropriate. Google’s PageSpeed documentation discusses this approach (Google PageSpeed guidance). Its specific technical values are from older guidance, so they should not be treated as current universal requirements.

Quick Recap

SaleBestseller No. 1
HTML and CSS: Design and Build Websites
HTML and CSS: Design and Build Websites
HTML CSS Design and Build Web Sites; Comes with secure packaging; It can be a gift option
$14.94
SaleBestseller No. 3
SaleBestseller No. 4
Web Design with HTML, CSS, JavaScript and jQuery Set
Web Design with HTML, CSS, JavaScript and jQuery Set
Brand: Wiley; Set of 2 Volumes
$35.05
Rank #4
Sale
Web Design with HTML, CSS, JavaScript and jQuery Set
  • Brand: Wiley
  • Set of 2 Volumes
  • A handy two-book set that uniquely combines related technologies Highly visual format and accessible language makes these books highly effective learning tools Perfect for beginning web designers and front-end developers

Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.

Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Support on Ko-Fi