Build it from scratch
Here, we will not cover using site building programs that assist the building process, but rather the use of text editors to create your code. Many developers and designers still use this method, as it gives them total control from the start over the code in their pages, and makes the code extremely easy to edit when needed. Our goal here is not to instruct you on how to build your website with this method, or to go in depth to teach you the basics of HTML and CSS, but to give you some basic information of what will be required to do so, and show you some basic examples of what coding actually is.
Learning basic HTML & CSS
The basic coding needed for a web page to display content, images, colors, etc., is HTML ( Hypertext Markup Language ). HTML itself is fairly easy to understand. There are hundreds of tutorials online that show you how to create webpages using HTML, and just as many guides that list the many tags that can be used to create certain things like bold text, background colors, links, etc., within your HTML. Many of these tags can be used within your HTML, but it is generally recommended to use CSS ( Cascading Style Sheets ) to control many of these items instead.
It is a generally followed concept that HTML should help to deliver your content, while CSS is used to control the overall look and style of your page, although the layout/style can be controlled with just HTML. This may sound confusing, but it basically means that HTML can control the layout, style and content if you want ( in other words, the whole enchilada ), but you can and should set up your pages so that HTML handles delivering content while CSS handles the look. As an example, the page you are reading right now contains the following:
- · HTML that acts like a framework to hold everything together & delivers the content of the page;
- · A separate CSS file that controls the page size, colors, image placement, fonts and other visual aspects;
- · CSS and Javascript which control the menu design and functionality at the top of the page.
This page has a basic HTML structure, however a separate css file is imported into this page, and that files controls all of the visual elements that you see. One of the main benefits of this setup is that, if you have many pages within your website and decide to change the style of the fonts, for example, you only need to make that change in the external css file, and the change automatically happens in all of your pages. By reading tutorials you can find online, this basic system should be fairly easy to follow and use to create some basic static web pages.
Learning dynamic languages
No, it really isn't as ominous as it sounds. Scripting languages are basically programming languages that create events and actions on your website. These allow for user interaction, file uploads, changing content, ecommerce transactions, and hundreds of other types of interactivity and on-site events. While creating plain HTML pages don't allow you to add this type of interactivity, creating files for these languages allow you to embed standard HTML within them so that your site still displays as you want it to.
How do you select a language to study and learn? There is really no hard and fast rule for this. Much of it depends on which one you can catch onto and learn by browsing through some sample codes, the type of server you want to host your site on, simplicity to understand, etc. PHP is the most popular language currently being used, it works nicely with MySQL databases, is fairly simple to understand the basics of, and has a huge number of online communities for assistance and code samples.
The easiest way to study and test these languages is by setting up programs on your PC to replicate a webserver; most languages will not work on standard PC's without the download and setup of some additional software, or some modifications of your system, however many of these are free to obtain. ( Remember that standard HTML pages you want to develop do not need additional software or programs on your PC ).
What do I need?
You can actually build a web page with what you already have on your PC, and that is Notepad, which is a very basic text program. Notepad will save your code as you have it written, and not add additional characters or symbols like some other text programs do. There are many other text editors which are like Notepad and add some additional options to what you are doing, like Notepad++, which is a free program you can download and use.
Using basic HTML and CSS may be great for static pages, but these alone will not help you build a dynamic website, for example sites for ecommerce or community forums. To move into that area, you will also need to find tutorials and learn a dynamic scripting language, like PHP or Perl, which may be more technically involved, and possibly learn some basics about databases. Obviously this increases the amount of coding you'll need to study and understand, as well as add to the time involvement you'll need to learn the different aspects.
If you are interested in working with dynamic scripting on your own computer, we cover this in our PC Development section.
Is this my best option?
Following are the benefits and drawbacks of building your own website.
- · Free to design your pages any way you like.
- · Ability to add the elements and functions you want in your site.
- · Understanding of what actually happens in creation and rendering of your pages.
- · Minimal costs to set up your site.
- · Length of time, research and testing required to learn coding.
- · Possiblity of having an "amateurish" look when done.
- · Requires setup of additional software for dynamic scripting.
- · Higher potential for coding errors, or inability to create the exact look/layout you want.