← Back to notes

Powers of HTML Href Attribute

html

Go to top

<a href="#">Back To Top</a>

Jump to sections

<a href="#about">Jump to About</a>
<section id="about">About Features</section>

Add CSS for polished scrolling

html {
scroll-behavior: smooth;
}

Ghost refresh page

<a href="">Start Refresh</a>

Instant phone or SMS

<a href="tel:123456789">Call Us</a>
<a href="sms:123456789">Text Us</a>

Smart email links

<a href="mailto:[email protected]?subject=Subject&body=Body">Email Us</a>

Directory navigator

<a href=".">Refresh Current Page</a>
<a href="..">Go Back One Level</a>

Download

<a href="book.pdf" download="book.pdf">Download</a>

Ping

<a href="https://example.com" ping="https://example-tracking.com">Ping</a>

Open map

# Android
<a href="geo:37.7749,-122.4194">Open in Android Maps</a>
# iOS
<a href="maps://://maps.apple.com">Open in Apple Maps</a>
# Browser
<a href="https://www.google.com/maps/place/Hu%E1%BA%BF,+Hue+City,+Vietnam/@16.4533864,107.5359138,13z">Open in Browser</a>