HTML Tips: Some useful tricks available in HTML5

Join the AI Workshop to learn more about AI and how it can be applied to web development. Next cohort February 1st, 2026

The AI-first Web Development BOOTCAMP cohort starts February 24th, 2026. 10 weeks of intensive training and hands-on projects.

Warning: this post is old and might not reflect the current state of the art

Autofocus

<input autofocus="autofocus" /> will put the focus on the specified HTML element when the page loads

Downloading files

<a href="file.pdf" download="pdf-file">Download</a> will download the specified file, with the name provided.

Hide elements

<div hidden="hidden"></div> despite putting the presentation in the HTML, which is bad, this can sometimes turn out useful.

Turning off (or on) spellchecking

Operating systems configured to spell check everything a user types can sometimes get in the way - <input type="text" spellcheck="true|false"> can help.

Auto suggestion text input control

<input list="mylist" name="mylist" />
<datalist id="mylist">
  <option value="CSS"></option>
  <option value="HTML"></option>
  <option value="PHP"></option>
  <option value="Jquery"></option>
  <option value="Wordpress"></option>
</datalist>

Lessons in this unit:

0:	Introduction
1:	Preserving white space and line breaks in a string in HTML
2:	HTML, avoid displaying a broken image if the image is not found
3:	The HTML figure tag
4:	Change image source in dark mode
5:	Accept only images in file input
6:	HTML comments
7:	▶︎ Some useful tricks available in HTML5
8:	How to make an hr invisible
9:	Conditionally set an HTML attribute
10:	An HTML element id is a global variable