How to add preloader to Web page?

Answer 1

This is the basic idea :

1) You make your preloader (designing)
2) Set an onload listener
3) hide the preloader when all the contents are loaded.

Answer 2

You can visit spinkit website, it includes preloder's HTML and CSS codes.

Answer 3

You may find answer in https://themehunt.com/blog/19-web-tips-and-tricks/159-css-preloader

Answer 4

You can create your own preloder by using CSS animation also.