Building a simple one page website.

For these who study web design, it will be a good experience to build a first site as soon as possible, even if it is just a single webpage. By building it, you will understand how it feels to be a web-designer and what difficulties you will work upon and overcome in the future.

The easiest approach would be to use a ready-made editor and create our page as we would create an office or Word document. This though, would be a cheating, because if you don’t make your webpage on your own, you will be unlikely to learn about how it actually works.

In order to create a simple webpage, you should open a text editor and create a new file. Both WordPad and Notepad tools that come pre-installed with your windows would do just fine for this purpose. Do not try doing this in Word Office, or it will not work!

Name your file as “index.html” and make sure you did not capitalize any letters. The web servers treat capital and small letters differently, so if you used capitals, the web server may return a “not found” error. “Index” basically means your main page, and it is accessed automatically as you type your site’s URL in the browser. The “html” part is a simple markup file extension, which will make our file to be treated as an actual webpage.

Now, before you start, at the very top of the file you should specify your doctype. Please refer to the google search for more details about the valid doctype definitions. Defining a doctype will discourage the browsers from displaying your page in quirks mode and show your page as according to the latest web standards.

Next you need to create an HTML tag, which will define that the document will now use an HTML markup language. Inside the HTML tags you should make HEAD and BODY tags. The HEAD tag is used to define any CSS markup, Title & Description, scripts, and references to external documents, which should be loaded before displaying the actual page. The BODY tag will be the place to put the actual content of your webpage.

The good idea is to start with a header. The main header uses the tag H1, though as most of the designers find it too huge, you could also often use the H2 or H3 tags for your title purposes. Then you just need to write some text. To create line break use the BR tag. Save the file and upload it to the server. Voila – you are done!