The World Wide Web has become so popular that even a 10-year-old turns to websites to complete assignments and to get information about the latest games. From surfing to e-shopping, the internet is providing us a platform for a host of needs.
Apart from the e-commerce perspective of websites, people are increasingly turning towards them for publishing their articles and/or pictures, besides promoting their businesses. This is continuing apace thanks to Tim Berners-Lee, the inventor of World Wide Web and director of the World Wide Web Consortium.
Websites used to be quite simple, consisting of simple markup language (html) and needing only one server to host a site. There was no concept of dynamic content, authorization, security and load management.
Following the dotcom boom, the goal was to design reliable, secure and more advanced websites so that the best online experience could be had. But now the websites have been developing enormously and, according to an estimate, the giant web now has more than 2 billion unique websites.
Such an astonishing figure shows that there are millions of people developing websites and playing their role in the development and growth of the World Wide Web. Most of these people, who are not professional developers, use software or tools targeted to provide easy development of a site with minimum or no background about html at all.
What You See Is What You Get (WYSIWYG) editors play an important role in making our lives easier by providing easy-to-use menus, tools, templates and variety of controls to render html content with a click of a button. Propriety software from industry giants like Microsoft and Macromedia offer such functionalities in their state-of-the-art web editors like FrontPage, Web Matrix and Dreamweaver.
On the other hand, open source community enjoys the freedom of using a huge collection of free software that are by no means lesser than the aforesaid editors. There are some companies like Brinkster that provide rapid site development with free hosting services and Website Builder for beginners.
Website Builder provides a readymade website for people like students, researchers, teachers, doctors, children and all those who want to have a website but unfortunately have no background of using web editors. However, such short cuts are taking away the joy of creating a website. Developing a website is not a complex procedure and by using latest tools and editors, even a layman can make a website in no time at all. Here is how it can be achieved.
Layout and content
It is always a good practice to write down the important points about what you want to have on your website, such as features, layout and navigation, text, images, colours, headings and number of pages. Once you have jotted all this down you should start defining the content and the overall theme of your site.
For example, if you know a lot about pets, you can create a website about pets. Other pet lovers around the world will be interested in reading tips for taking care of animals, your photos and anything else you might want to put on the site.
It is not really necessary to have an interest or a hobby. You can create a site about yourself. You can include information about your interests, education, projects and you can also place your CV, pictures, contact details and much more. You can even put your favourite jokes on it. The possibilities are endless.
Creating a webpage
We will use as our editor the Microsoft FrontPage 2003 which comes with Microsoft Office 2003. However, you are free to select any other editor if you want.
Load the software and start a one-page website. Go to File > New and from the right hand side menu select “Open one page website.” If you select “More website templates”, then you will be given several readymade templates for various types of websites.
FrontPage will ask you to provide the location of the site you are going to make. Here, you will have two options. Either you host your website inside a web server IIS (Internet Information Services) or you can place all the files inside a folder. We will place our files inside a folder to make things simple.
After defining the physical location of your site, you will be given a homepage “index.html” and an images folder to place your graphics. Once you open your homepage, FrontPage will give you several options to work with. People with html background work in the code view as it gives more control over the website, but as a beginner you can start your work inside the design view.
You can now draw a table to place images, side menus and contents. Insert a table by going to Table > Insert > Table or by entering the pattern Alt+A > Alt+I > Alt+T on your keyboard. In this menu select three rows and one column, set cell padding and cell spacing=0 and border size=0 with transparent border and background. In the three rows on your page, you can place your logo on the top, content and navigation in the middle and footer in the lowest column.
Since we have to make two separate columns for our content and navigation panel, we need to draw another table in the middle. Select second row and insert another table using the same procedure with one row and two columns and with cell padding=6.
Website logo
Essentially, you should make your logo before you begin creating the website. Now, save it inside your images folder. If you haven’t done so, you can use any image editor like Paint, Photoshop or CorelDraw for making images depending upon your level of expertise.
Select the first row and go to Insert > Picture > From File and browse to the images folder and select your logo. You can also fill the remaining part of this cell with the exact background of the logo to give a coherent layout. Right-click on the cell where you placed your logo and select Cell Properties.
Go to Background Colour option and select “More Colours”. Click onto the “Select” button and click the background of the logo to select its colour and hit OK twice. We now have our logo placed into our site. Let us move on to add text and site navigation to our cells below.
Navigation
Navigation is mandatory for websites having multiple pages to provide an option for your users to browse through your site. But since we are making a single-page site right now, we will only place a link to our homepage just to show you how to add hyperlinks to a normal text.
Write “Home” in the left hand side column, highlight the text, right click on it and select Hyperlink from the options. Select index.html file from the menu and click OK. You have now successfully transformed a simple text into a hyperlink and created a navigation panel with just a click of a button.
Content
In order to add content, we have already separated the right hand side of this column. This part will work exactly like working under any word editor. Just add relevant details and important information about your website, adjust font size and colour, and optionally add any pictures or artworks according to the theme of your site.
You will need to regularly update the content to attract people to your site. All changes, important news, highlights and updates should reside here.
Footer
The last step is to add footer text and email address of the webmaster or website manager in the last row. You can add copyright information and privacy policy if you have one or “Contact Us” details here. You can add email address in hyperlinks as well. Follow the above procedure to add a hyperlink and from the menu select “E-mail Address” to add your address which you want your user to use.
Now that you have made your homepage, you can make as many pages as you want. You don’t really have to design the remaining pages. Just go to the code section of your first page, select all markups (html tags) and copy paste them in your other pages in the code section to imitate the look of your first page and change the content accordingly.
Hosting and domain
It is now time to publish the website to a remote location so that people can visit the site from around the globe. There are many companies that provide free website hosting and domain registration like Brinkster (www.brinkster.com), Dot TK (www.dot.tk) or Geocities (www.geocities.com). Once you have made your hosting account, you just need to transfer your files to the web server.
Files can be transferred using FTP (File Transfer Protocol) through FrontPage or any FTP software. Go to File > Publish Site, insert your login credentials (ID and Password), FTP server location and start transferring your files. Once you are done, you can go to your domain name like (www.yoursite.com), test your website and start spreading the word.
This is a step-by-step “how to” for making a simple website. Following this will help you create your own website without spending countless hours in coding. If you use a Website Builder you can concentrate on improving and adding content to your site rather than getting stuck learning the techniques behind it. Make sure to visit other websites to learn from them and improve your design and content so that many people benefit from your site.
The writer muhammadzeeshan@hotmail.com is a student of the NED University of Engineering and Technology, Karachi