Your Own Website: Testing Free Website 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.

Replies and Comments


⬅ Back to Testing Free Website Hosts

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.

Uploading the website

  • 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 and home.css into the uploader.
  • Under Commit changes, there are two fields to describe the changes you made. I put uploaded index and css file and first 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.

Updating the website

  • 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.

Add a custom domain or subdomain

  • 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.

⬅ Back to Testing Free Website Hosts


Make Your Own Website - A beginner's guide to making a hand-crafted personal or hobby website with HTML and CSS.

Helpful guides at Pixel Shannon

Reply

Reply by email | 32-bit Cafe thread | Reply on Mastodon | Reply on Bluesky