Yes, you can build a website, and using nothing but your keyboard and a text editor! Anyone can learn how to code a website, and thanks to the many tutorials and documentation around on the web, you can get started for free as you learn. The best part about building your own website is that you have complete control over how you want it to look, behave, and everything is up to you.
Building a website can seem difficult, but half the battle is just getting started! We wanted to put this guide together as an easy compilation of tutorials and places to learn exactly what you need to get started.
Here are some common misconceptions about coding your own website:
None of these are true!
We hope this guide helps make everything feel more accessible to you, because it is! The internet belongs to all of us, so be sure to stake your claim in it.
There is a whole hobby surrounding building websites for personal use. Websites can cover, display, or talk about anything you're interested in, and building a website can be a great way to supplement your already-existing hobbies. Before you start down the path of building your own website, think about what type of content would be the most motivating to build or maintain. For instance, what is missing from social media profiles? Human context. You're more than just posting images to Instagram or funny statuses on Twitter. Having a website can fully encompass all different types of media all in one place, showcasing the full breadth of your interests.
What can a website be about? Here's some ideas from the community:
Or your website can just be all about you, which could include all of these things!
While I'm sure you've heard of services like Wix and Squarespace from your favorite podcasts, what you want for this is a webhost or a hosting provider. Most likely, what you're looking for is static hosting. Services like Wix and Squarespace are good options for professional portfolios, business websites, and stores, but as far as individualized and unique websites go, these are not good options for expressive, hand-coded, personal websites.
If you want a standard blog that looks like every other website out there, then sure, maybe give those hosts a try with standard templates. If you want to learn skills that not only help you create a website for you to display whatever you want and express yourself but also help you expand your skillset that could be used for jobs, projects, or a hobby all on its own, then let's keep going!
Webhosts have been around for a long time, and because of this, we've generally figured out who the better ones are (spoiler: the ones that have been around for a long time). The good news is, depending on the webhost, you might not even have to buy a domain to start, which is perfect for getting started. Many free webhosts offer an included subdomain and some paid webhosts offer an included domain, so you will have a URL ready to go that you can begin linking.
💡 More might be listed on the 32-Bit Cafe's Resource List.
Your host will likely either have a web interface system to upload your site, but if not, you'll need to dig into the host's documentation about how to upload your files.
The below table is a compilation of methods to upload your site using the hosts suggested above, ranked in level of difficulty. None of these are hard, but some may require some additional learning to understand. Ultimately, you want to make sure you're reading and understanding how things work to better learn how to use these methods to your advantage.
A web interface means that the uploading process is entirely accessible from the web, which can include an upload form or a button to find files on your computer. FTP (File Transfer Protocol) means transferring (often dragging and dropping) files from one server to another. A repository is using Git to push your files to the published site, but this tends to be a more advanced method.
Level | Method | Host | Tutorial |
---|---|---|---|
Easy | Web Interface/FTP | Neocities | Absolute beginner's guide to Neocities |
Easy | Web Interface/FTP | Dreamhost | How do I upload my site to Dreamhost? |
Intermediate | FTP | NearlyFreeSpeech.NET | NearlyFreeSpeech.NET Getting Started Guide |
Intermediate | FTP | Most | How to Upload Files to an FTP Server |
Advanced | Repository | GitHub Pages | Publish and share your own website for free with GitHub |
A domain, such as 32bit.cafe, can be a great way to have a catchy site name or have something short to share easily. And, if anything happens to any of your hosts, you can always transfer your domain to your new host. A domain is also good way to maintain a short URL, which can be easier to share or remember. The great news is that some webhosts can either give you a free domain with paid hosting or you can buy domains through the host. There's a couple of different routes to go, but it's completely up to you. Try not to use any of EIG/Newfold Digital providers if you can avoid it.
You don't need images or a bunch of custom graphics to get you started. You can make a website entirely from text and coded shapes, just like the 32-Bit Cafe! Think of a website as a stick figure, a stick figure with clothes, and a clothed stick figure waving. The stick figure is the HyperText Markup Language (HTML), the clothes are the CSS (Cascading Stylesheets), and the waving is JavaScript (and totally optional!). HTML and CSS are some of the easiest types of code to learn, because it's written in a way that's easier to remember and centered on the content that fills it. You can code a website entirely in HTML without CSS or JavaScript, but you have to have the stick figure first.
With some webhosts, you are able to edit and save your .html files directly using their web interface. However, since it's always best to have a backup, you can have a built-in backup by creating and editing your .html files locally. You can access your local files and test your website as you go.
Any plaintext editor (that makes .txt files) is what you're looking for here. Here are a list of some favorites, but it may make sense for you to start with your operating system's default, such as Windows' Notepad, to get started.
You can just open your text editor, put in some HTML, and save it as an .html file instead of a .txt in a folder on your computer, and open it in your favorite browser. Boom!
There are so many tutorials across the web, so we want to link some here that will take you, from start to finish, how to code your website. Some tutorials here even have barebones website layouts, so you can have a framework to the content you want to have inside of it.
If you have to pick an order of what to learn, understand HTML before diving into CSS. It's hard to put clothes on a stick figure you're not sure the size of yet! CSS heavily relies on understanding how different HTML elements work with each other, so learning how to structure your site with HTML first will put you at an advantage in learning CSS.
The next step of having a website is having people see it! This part is totally optional, but knowing folks are visiting your site can be a real motivational push to maintain and keep your site up to date. On Neocities, there is a built-in following/activity feed, where you can see sites that are being updated in real time and find websites to follow that you enjoy. You can also find directories of websites for "this side of the web" including personal sites, like Yesterlinks, Peelopaalu, and Gossip's Web.
Webring directories, like Sadgrl's Webring Directory and Ray's Webring List, highlight that webrings are the best way to be linked by a wide array of like-minded folks. Webrings aren't seen as often anymore, but they're returning to the personal web, as indicated by the directory above. Once you've published your site, check out webrings and see which ones you or your site falls into. You very well might even make some friends!
In visiting a lot of sites, you might begin seeing that there's static ways of interacting with the website owner: guestbooks, shoutboxes (also known as Cbox), and comment systems. It's polite to comment on the site you're visiting; in particular, it'll make that person's day to give them a compliment about some aspect of their site! It's also a great way to get your site out there, since whoever is receiving your comment will likely come to your site to return the favor and browse yours. (And then you'll see how good it feels!)
Want to learn more about interacting with other websites once you have yours built? Check out our Interacting with Other Websites guide.
At some point, you feel like you've added everything you've thought of to your website. Struggling to come up with ideas and seeing websites that look "better" than yours, you might begin to slowly dedicate less and less time to this new hobby of yours. I implore you to keep at it!
Learning more about how HTML and CSS interact can eventually open you up to advanced methods of design, allowing you to experiment with new methods and ways to display your content. You'll learn different ways to design your site, and you might want to change up your layout! All it takes is for you to search for it and seek out code snippets, CSS tricks, and other ways to improve your coding. It can be really helpful to use your favorite search engine to search for keywords like "how to do XYZ in HTML" if there's something specific you want to learn how to code.
Keep in mind that this isn't a competition, and there's no Hall of Fame here. People will enjoy your site because of what you put on it, not because it's the best-coded website ever (whatever that means). Nobody is comparing your site to someone else's, because they exist for different reasons. You might showcase your photography, which will look completely different from a site of someone displaying their pixel art.
We all started where you are now, regardless of where we are now. You are not alone, and a ton of communities like the 32-Bit Cafe exist because we want you to create the website you want. If you eventually outgrow the current iteration, change things up or start all over again. It's your world!