Bad Intra-Page Link Handling in Browsers
Intra-page links are hyperlinks that take you to a different place on the same page. The target
of the link is supposed to be scrolled to the top of the screen. In
most cases, this works fine. However, if there is only a small amount
of text after the link target, browsers only scroll the screen so that
the bottom of the document is at the bottom of the screen. This
leaves the poor users wondering where in the page the link was meant
to take them!
The ugly hack to make intra-page links to the end of the document work
is to pad the end of the document with lots of paragraph (<p>)
or break (<br>) tags. This causes the browser to render the
document with a long empty space at the end, allowing it to scroll the
final text to the top of the screen. However, this is a hack in the
worst sense of the word. It clutters the end of the document with
useless whitespace and increases download times. Furthermore, it is
highly platform-dependent. Users with different screen resolutions,
browser window sizes, and browser whitespace rendering algorithms see
the same tags rendered as different amounts of vertical space. Those
16 break tags may let your last-line link target appear at the top of
the window in one browser but not another. As a result, page authors
must add excess whitespace or hope that users have the same browser
and screen resolution.
The solution is for browsers to fix intra-page linking so that link
targets are consistently shown at the top of the window. Write to
your browser vendor and let them know you want this problem fixed!
Test: When you follow the link at the top of this page, is this displayed at the top of your browser?