I'm checking out free hosting providers that can be used for fun and personal websites. I wanted to know what to recommend to people who want to make their own website, so I decided to try things out for myself! Also see Testing Blog Hosts.
I'm uploading a version of this page. That link is to the version hosted on my own server. Does it look different from the others? The same? We'll find out!
My test website is very simple, just an index.html and css file, and is about 8kb total.
Web Host Tests
Testing Web Hosts
yay.boo
shannonkay.yay.boo hosted by yay.boo - This was really fast and easy to use.
- I dragged the folder with my index.html and css files in it onto the uploader, chose a subdomain and typed in my email address. They sent me a "magic link" to manage the account.
- They offer free websites up to 10mb for free on the yay.boo subdomain, and there's a little ghost icon in the corner of the site.
- You can subscribe to support the site starting at $25/year to use your own domain names, upload sites up to 25mb, and remove the ghost mascot.
Neocities
shannonkay.neocities.org hosted by Neocities
- Signing up was pretty simple. Once signed in, I headed to the site dashboard. It had some placeholder files already there. If you don't already have a site made, you can edit the starter index.html and css file in their browser-based editor. I used drag and drop to upload the files from my test website folder, overwriting the default index page with my own file.
- A free Neocities account gives you 1GB storage and 200GB bandwidth. The Supporter account for $5/month gets you 50GB storage and 3000GB, custom domain support, and some other things.
- After updating my website, Neocities made a new thumbnail to add to their community gallery. I added a few tags on signing up for Neocities, including pink, coffee, and books. The next time I visited the Neocities main page, it showed me a bunch of other fun-looking pink websites to visit.
- You can also use your Neocities subdomain as a Bluesky username.
Nekoweb
shannonkay.nekoweb.org hosted by Nekoweb
- Sign-up was easy. I signed in and went to the dashboard. There are some placeholder files, index and CSS, plus a couple of interesting other files like a custom cursor. I can edit the files that are already there with their browser-based editor.
- Nekoweb has a nice file manager and editor combined. The CSS file that's included actually contains examples of how to style custom elements for Nekoweb, so don't overwrite it. My CSS file is named something different, so it won't be a problem.
- There's an upload button, to browse for files and upload them. It's not obvious if I can drag or drop to upload or not, so I tried. It uploaded my CSS file, but didn't overwrite the default index file. I used the upload button to select my index file, and that worked to upload it and overwrite the default one.
- Nekoweb has a 500MB storage limit for free accounts. Become a patron(starting at $3/month) to add custom domains, get 10GB max storage, access to FTP and git, and some other things.
- You can also use your Nekoweb subdomain as a Bluesky username.
Codeberg Pages
shannonkay.codeberg.page and codeberg.shannonkay.com hosted by Codeberg Pages
- I first registered an account at Codeberg.
- Using the instructions, I created a new repository and called it "pages". To do this, I clicked the + and selected + New Repository. I set the Repository name to "pages", changing no other settings. Then I clicked "Create repository".
- On the next screen, I was brought to my repository named "pages"
- I clicked the "upload" button, and was brought to a file upload with drag and drop support, or click to upload. I selected my html and css files and uploaded them, and clicked "commit changes" at the bottom.
- That was it! The site is now available at shannonkay.codeberg.page
- I want to try using a custom domain. Based on the instructions, I created a new file in my "pages" repository by going to add file/new file, then named it
.domains
. In the "new file" text box, I typed the domain I want to use. I'm going to use a subdomain,codeberg.shannonkay.com
. Scroll down and click "commit changes". - At my domain registrar(mine is Porkbun), I edited the DNS settings for my domain name. I created a subdomain by adding a CNAME record with Host:
codeberg
(.shannonkay.com) and Answer/Value:shannonkay.codeberg.com
. - It worked! I can now access my test site at my custom subdomain, and going to shannonkay.codeberg.page forwards me to the custom domain.
- You can also use your Codeberg Pages subdomain as a Bluesky username.
Glitch
shannonkay.glitch.me hosted by Glitch
- I clicked "sign up" and chose the "email magic link" option. After getting the code in my email, I was signed in.
- There are several choices under the Projects header, all types of website projects including a link tree page and static site generator blog. You can also import projects from GitHub.
- I'm choosing to Remix "Blank Website" under the "Website" header.
- Clicking the link to Remix "Blank Website" led me to an in-browser project manager. The project has a ReadMe.md file open, and is populated with index.html, stript.js, and style.css files.
- I can create and edit HTML and CSS files directly in the Glitch editor, but I have my files made already, so I want to upload them if I can. I clicked the + next to Files then selected "upload a file". It says you can also use drag-and-drop. I selected and uploaded my HTML and CSS files, overwriting the index.html file that was there with my own.
- Now what? The project has a random name, so I changed it by clicking on settings and selecting "edit project details". I made the Project Name shannonkay and added a description, then clicked "save".
- From settings, when I click "Go to project page", it opens the project page that has a little preview of my test site on it. Clicking the "Visit" link below the preview leads me to my test site at shannonkay.glitch.me.
- There is a way to add a custom domain for free, but I haven't tried it.
Netlify
- Netlify - I've used Netlify by deploying a blog through GitHub and I've also used their drag-and-drop uploader. Their free tier is plenty for most users, and they support custom domain names.
Infinity Free
I tried Infinity Free without success.
- Set up had an extra step with creating an account at Infinity Free, then creating a "hosting account" to choose a tier. The free tier gives you 5GB of space and supports domain hosting. They have some low-cost paid tiers with php support, email, more space, and other things. I chose the $0 tier for this test.
- I was prompted to create a subdomain with a selection of a few domains to choose from. I chose shannonkay.infinityfreeapp.com
- In another screen, I chose a label for this hosting account, and a different short password(apparently for use with ftp, etc).
- I got a DNS error and tried again. I went back and picked a different domain for the subdomain, and got another DNS error. That's my limit of attempts.
GitHub Pages
shannonkay.github.io and github.shannonkay.com hosted by GitHub Pages
- GitHub Pages will give you a
yourname.github.io
subdomain and has support for custom domain names. - You need an account at GitHub. I already had one, so I signed in. The instructions are at pages.github.com
- I created a new repository called
shannonkay.github.io
. Under description, I put Shannon Kay's Website. I left the Public radio button selected, left everything else in the default settings, and clicked the Create Repository button at the bottom of the page. - There's a quick setup thing offering advice for setting things up in GitHub Desktop or SSH, but I'm going to test doing this through the website. Below the quick setup thing, there is some text with links which says "Get started by creating a new file or uploading an existing file".
- I clicked on the uploading an existing file link, which takes me to a drag-and-drop(or browse) uploader.
- I dragged my two website files,
index.html
andhome.css
into the uploader. - Under Commit changes, there are two fields to describe the changes you made. I put
uploaded index and css file
andfirst website files
in the two fields. - I pressed the Commit changes button.
- It brought me to the project page for the repository.
- Going to shannonkay.github.io brings me to the website I uploaded.
- To update your website, you can use GitHub desktop or another git client, or you can do it right on the website by using the add file button to upload or create files.
- Going to my site's repo(short for repository), I can tell that GitHub wants me to make a ReadMe file. I clicked the green Create ReadMe button.
- This creates a new README.md file opened in a browser-based text editor. Since this is a Markdown file, I can use Markdown in the text box. I already have a copy of my test website's text in Markdown, so I'm going to paste that in and commit changes.
- There's also a settings icon. Clicking it gives me options to enter a website address and a box to check for Use your GitHub Pages website. Choosing those options puts a link in the About section of your repo.
- GitHub Pages supports custom domains, so I want to test setting one up. I'm going to use the documentation to configure a subdomain.
- From my domain registrar, I made a subdomain called
github.shannonkay.com
by creating a CNAME record with Host:github
(.shannonkay.com) and Answer/Value:shannonkay.github.io
. - In my site's repo, I clicked on the settings icon near the top, then clicked
Pages
from the sidebar menu. Under the Custom Domain header, I typed the subdomain that I created into the box,github.shannonkay.com
, and clicked the Save button. I got a message that said Custom domain "github.shannonkay.com" saved. The settings page now says Your site is live at http://github.shannonkay.com at the top. - Clicking the link brings me to my GitHub Pages site at the new subdomain I configured.
- You can also use a github subdomain as a Bluesky username.
Testing Blog Hosts
Bear Blog
shannonkay.bearblog.dev hosted by bearblog.dev
- Signing up was simple. I chose a subdomain and entered a little bit of homepage text, then entered my email address and a password.
- I was logged in and brought to the editor for the Home page. You can choose an emoji to be your favicon. I chose the two pink hearts emoji.
- The editor supports Markdown. In fact, pretty much all the editing is Markdownish.
- It looks like inserting media is a pro feature.
- I pressed publish, and my website is working.
- There's a choice of themes, and you can edit the CSS right in the browser.
- You can upgrade and "keep the tiny internet awesome" to get custom domain support, media uploading, and some other things. The pro upgrade is $5/mo(or $49/yr).
- I decided to put the same text from my homepage test on the homepage of my bearblog. I did this quite easily by copying from my website and pasting it into Obsidian. Then I copied and pasted the Markdown version from Obsidian into the bearblog.dev page editor.
Curtain Call
Make Your Own Website - A beginner's guide to making a hand-crafted personal or hobby website with HTML and CSS.
Have Your Own Website - Why you should have a website, and ideas for types of websites you could make.
Helpful guides at Pixel Shannon
Check out my personal website, ShannonKay.com, it's my Classic Homepage.
Go to my Follow Page to learn where else to find me on the web.