Back Starting Your Site

Before you do anything, you should get an idea as to what you want on your site. If you're stuck, look at other people's sites for inspiration. Make your site about whatever you want. It's your site, don't be afraid to write about a certain interest or topic.

Now it's time to learn how to craft a site. Don't expect to make anything magnificent right away. Look at my site, I've been doing this for years and my pages still look like this! It takes time to get things just right. You'll probably come across a lot of problems in getting things how you want them, but over time you'll figure out how to fix them. When I first started making Misty's World, for some reason the navigation bar always stuck to the bottom of the page. I had no idea how to fix it, until one day, it just came to me.

As I mentioned on the previous page, if you're making your site from scratch, you'll need HTML and CSS. I'm not going to teach you exactly how to use them, but I'll explain the basics. I recommend using W3Schools' guides to get the basics down. If you're browsing someone's site and want to know how they used HTML, just right click and use "Inspect Element" to have a look. You can actually learn a lot that way.



What is HTML and CSS?

Hypertext Markup Language is the basic framework of a webpage. It tells the browser what things go where, and helps it display the page properly. Each page of a website is made of a ".html" or ".htm" file, and they're linked together with hyperlinks. Nowadays not all webpages are ".html" files, but the ones on Neocities are.

I originally thought that HTML was a programming language, but it's not counted as one. You can't program games and apps with it. All you can make is a website full of information and links. If you want to make something like Facebook or YouTube, you're going to have to go somewhere else to learn how to do that.

In early days of the Internet, using just HTML for a website was perfectly fine. Nowadays, it's almost impossible to get by without using CSS. Cascading Style Sheets tell the browser how the website is styled, like the font colour, the background and the margins. It's usually contained in a separate file, but you can put CSS it straight into a HTML file if you want. I'm actually not that good at CSS, I usually just copy and paste it from online guides because I forget how to use it. It can be quite complicated, but once you understand it, it's not that hard.

As long as you have the basics of HTML and CSS down, you're ready to make your own website! You don't need to be good with numbers or computer science to learn. And there are plenty of resources available online. You can even find books at the library to help.



Organising Your Website

With my sites, I like to create a folder on my computer for them. If you are creating your site in the Neocities browser editor, you don't have to worry about this. However, I would recommend that you build your site offline first.

Inside my site's folder, I usually put a subfolder just for the images. This keeps the image files from cluttering up the main folder space. I keep my pages in the main folder. If I want to make a subsection of the site, I make a separate folder for those pages. (For example, this section of the site is in the "webguide" subfolder)

You may use images from other sites on your pages to save storage space, but it is best to have the files kept on your own site. Otherwise it takes longer for the image to load on your end, plus it uses up bandwidth on whatever site the image is hosted on. You may think that images take up a lot of storage, but they actually don't. Don't worry about storage space when you're just starting out. After a while, you might want to include subfolders in your image folder, cause things might get a bit crowded as you grow your site.



When someone types in your URL, the first page they're going to end up on is "index.html". For example, if someone goes to "example.com", they actually end up at "example.com/index.html". So the index page is where you're going to want to put your homepage, not "home.html". Or you could do what I did and make the index page a sort of front door, where you click "enter" to get onto the main homepage.

Keep your page file names short and sweet, they can even be complete nonsense like mine. The shorter they are, the easier it is to type the hyperlink.



Designing Your Page

Don't go for a complicated page design if you're new to HTML.

A lot of people like the same design throughout their site. If you're gonna do that, make a blank page containing the basic code and page design but without any content. Save it in your site files, and use it as a template for making new pages. An example from my old site is here.

A decent page layout is one that has a navigation bar at the top or on the side. It's an easy, simple layout that is easy to navigate. There are lots of other interesting designs you can try out. Experiment and find out which one suits you best. There are even HTML templates floating around online for you to use if you're stuck and can't get your own designs to work. A lot of webpage creation software contains templates too.

If you need colours for your site, use this handy HTML colour picker. Don't worry if you can't make your own graphics. There are plenty of sites on Neocities that are giving them out for free! You can even use GIFCities or Glitter Graphics too. Just make sure that it's OK for you to use the graphic before you save it.

Choosing a good font is important. You can't easily pick whatever font you want. It may display fine on your computer, but one someone else's PC, it may not be installed. Then it'll just show up as a default font. If you want to use a specific font, you've got to upload it yourself and do some extra steps. I'm not sure how to do it exactly, so you'll have to look it up. Luckily for us, there are some fonts that are installed on most devices! These include:

Times New Roman
Verdana
Arial
Comic Sans MS
Trebuchet MS

A complete list of common fonts can be found here. A lot of them are very boring, so it's understandable why people choose to use custom fonts.



One last thing I would like to mention is mobile devices. Most mainstream websites have a version of their site made specifically for mobile devices. Some people on Neocities like to cater to the smartphone crowd, but I wouldn't worry about it too much. If your site's code is basic enough, it should work fine on a phone. My old site was at one point so basic that it worked on my DSi's browser. I don't think many people use phones to access Neocities anyways. Just make sure that your site's design still holds up if you resize the window. I didn't check that on my old site, so if I resized it the whole design would fall apart! This is still a problem with my current site, if I resize the window, some of my images look a bit wonky. Luckily nowadays most people have the same monitor size, so it's not that much of a problem anymore.

Back