This tutorial explains how to host a static site using Imgur. Web2Img is a free and open source tool that bundles your website files in a single image that can be hosted on Imgur. It generates a script that you can use on a web server to fetch website files from the hosted image on Imgur, unpack them in real-time, and serve the website. You can use any image hosting site, but I will use Imgur here as it can host large sized images and gives a direct link.
This tool will help you run static sites on hosts that offer very low storage for free, such as 1mbsite. You only have to host 2 simple script files, and those files will build the website dynamically when a user opens the URL. Not only that but you can host the image on multiple image hosting sites and use the image URLs to achieve multiple CDNs which in turn will boost the website availability.
How to Host Static Site on Imgur for Free?
Using Web2Img to host a static site on Imgur is very simple and there is no sign up or registration is required. Here are the steps involved in the process.
Step 1: Open Web2Img from here and then upload website assets by selecting the website folder.
Step 2: It will now generate an image automatically. Basically, it has now bundled all the website files(HTML/CSS/JavaScript) into a single image.
Step 3: Upload the image it has generated to Imgur. For that, just copy the image by right-clicking on it and then paste it on Imgur’s create post window.
Step 4: When the image has been uploaded, right-click on it to get the direct link. And then paste it back in the Web2Img tool. It will now automatically generate 2 scripts for you.
Step 5: Copy down both the scripts and then save them in separate files withe same name as mentioned there.
Step 6: If you want to run and test the website locally, then run an HTTP server in the directory where you saved the x.js and 404.html files. An HTTP server can be run using Python if you have it already installed. To do that, open command prompt inside the folder where the 2 script files are and execute the following commands.
python3 -m http.server
Step 7: Enter localhost:8000 in address bar of the browser to access the site. If the website doesn’t appear, then you simply refresh the page a couple of times. See the output in my case in the screenshot below. I simply hosted a TIC TAC TOE game website and it is being run directly from the Imgur. In the second, screenshot, you can see the decoded files in the browser cache.
If you follow the above steps carefully, then in the end, you will also have a functional static site being run on the HTTP web server. The above setup is for local server. But if you are using a hosting then put the script files in htdocs folder. Or, you can try free static site hosting platforms out there such as Netlify, DigitalOcean, GitHub Pages, Altervista, etc.
Closing thoughts:
Even though a little hacky, this method of hosting websites on low storage web hosting servers in just amazing. With this, you can cut down the hosting and storage cost to almost none. What is even more interesting about it is that you can host the image file that this tool generates on multiple image hosting platforms and use those links to serve website assets, just like a CDN.
