Categories
HTML

How to prevent an HTTP request just for a favicon with HTML?

To prevent an HTTP request just for a favicon with HTML, we set the href attribute of the link element to a base64 URL for the favicon.

For instance, we write

<link
  href="data:image/x-icon;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQEAYAAABPYyMiAAAABmJLR0T///////8JWPfcAAAACXBIWXMAAABIAAAASABGyWs+AAACbUlEQVRIx7WUsU/qUBTGv96WSlWeEBZijJggxrREdwYixMnByYEyOvgfsBAMG0xuDsZ/QGc3NDFhgTioiYsmkhBYGLSBkLYR0va8gSjvQXiIT7/l5ibfOd/v3pN7gSmVSMTj8ThRfzdYk8lkMpl83/+AVFVVVXU0eHiVJEmSpB8DIcpkMplsdhCYz+fzhQJROBwOh8PDQN+oQCAQCASIRFEURZHI45GkP0/e7Xa73e70AMJnjel0Op1OA6oaDB4eAkAw6PcDvZ5t6zrw/Hx2trAw/cHYZ426ruu6DtzcGEYuBzQa19etFvD4WKtls4AoRqMPDwBjjLGPrt84ilgsFovF6EOapmmaRiP6O/jbAIguL4vFYpHGqlKpVCoVomq1Wq1Wibxer9fn+w+Q9+cUiUQikQhNrfdgWZZlWf4yyGhj27Zt254MUK/X6/X6F0aiKIqiKIOCYRmGYRjGZADLsizLIgqFQqHV1SkAnp5OTn79ItK0qyuPZ7SxaZqmaU4GKJfPzxmbfAPc/f3pqaIQLS8vLtZqgOP0bYyJoiAARC5Xrwf4/Vtbb2+Th1YqlUqlErC01GgkEkCz2WxyHLC+LsuiCAiCJLlcgM+3vd3pcBzXaJTLR0dEs7Ptdv+D4TiOG/A6DsBxQKvV621sAGtru7vl8ngAjuvXv7xcXIgiwNjMjCj2h+k4fQfPA4LA8xwHCO323V2hABiG223bwPy8xwMAbvfcHGMAY32j47y+3t4OAsZpZ2dzEwAsy7IcBxAExhwHMIxOx3GAlZVUyjT/1WFIudzenstFlEpFo9M8o+Pj/X2eJzo4SCR4fnzdb2N4Pyv9cduVAAAAAElFTkSuQmCC"
  rel="icon"
  type="image/x-icon"
/>

to add a link element with the href attribute set to the base64 URL for the favicon to stop the browser from making a request to get the favicon.

Categories
HTML

How to store arbitrary data for some HTML tags?

To store arbitrary data for some HTML tags, we put the data in the data- attributes.

For instance, we write

<div data-internalid="123"></div>

to set the data-internal attribute of the div to 123.

Categories
HTML

How to trigger a file download when clicking an HTML link?

Sometimes, we want to trigger a file download when clicking an HTML link.

In this article, we’ll look at how to trigger a file download when clicking an HTML link.

How to trigger a file download when clicking an HTML link?

To trigger a file download when clicking an HTML link, we set the download attribute.

For instance, we write

<a href="url" download="filename">Download</a>

to set the download attribute to the file name of the downloaded file.

The href attribute is set to the file URL.

Conclusion

To trigger a file download when clicking an HTML link, we set the download attribute.

Categories
HTML

How to add a tooltip to a div with HTML?

Sometimes, we want to add a tooltip to a div with HTML.

In this article, we’ll look at how to add a tooltip to a div with HTML.

How to add a tooltip to a div with HTML?

To add a tooltip to a div with HTML, we set the title attribute.

For instance, we write

<div title="This is my tooltip" class="visible"></div>

to set the title attribute to the tooltip text.

Then the tooltip text would show.

Conclusion

To add a tooltip to a div with HTML, we set the title attribute.

Categories
HTML

How to detect if JavaScript is disabled with HTML?

Sometimes, we want to detect if JavaScript is disabled with HTML.

In this article, we’ll look at how to detect if JavaScript is disabled with HTML.

How to detect if JavaScript is disabled with HTML?

To detect if JavaScript is disabled with HTML, we add the noscript tag.

For instance, we write

<noscript>
  <style type="text/css">
    .pagecontainer {
      display: none;
    }
  </style>
  <div class="noscriptmsg">
    You don't have javascript enabled. Good luck with that.
  </div>
</noscript>

to add the noscript tag with the content that’s displayed when JavaScript is disabled.

Conclusion

To detect if JavaScript is disabled with HTML, we add the noscript tag.