How to Build an Information Service Website
Building websites to provide users with access to information is what many of the technologies used on the Internet were designed for. By following a series of distinct steps, you can create an informative Web system to store and present your information effectively to visitors. Information websites are composed of two broad components: the information itself, and the interface used to display it in a Web browser. An informative website, therefore, has to both hold and present information reliably.
Other People Are Reading
Instructions
-
-
1
Compile the information you plan to use in your website. Whether your information consists of text, images or any other media, collect it all and keep it in one place ready for inclusion in your site. If your site is going to contain a lot of textual information, try to keep this as short as possible. Information on the Web is easier for people to digest if it is contained in small chunks and presented within a clear layout.
-
2
Build a data store for your information. Depending on how much information you have, it is typically easiest to create a database to store it. There are many database systems that can be used for websites, including MySQL, which is free and may be provided by your Web host. Web host Control Panels normally have easy-to-use interfaces for creating databases, so log into yours and follow the instructions to create a database for your information. Insert the information you collected into your database.
-
-
3
Connect to your database and query it for your information. To present your information within website pages, you will need to make a connection to your database using a Server Side script in a language such as PHP. Use syntax similar to the following example to query your database:
<?php
//alter the host, username and password
mysql_connect("insert_host", "insert_database_username", "insert_database_password");
//alter to suit your database name
mysql_select_db("insert_database_name");
//to query a table called "articles" with a column called "text"
$article_query="select * from articles";
$article_result=mysql_query($article_query);
while($article_row=mysql_fetch_array($article_result))
{ $article_text=$article_row['text']; }
?>
Save your Server Side script with the correct file extension, using ".php" for PHP code.
-
4
Build your website interface using HTML. HTML code defines the various structures and content that you want a website to display. You can write out HTML within your Server Side scripts, as the following example addition to the PHP code demonstrates:
echo "<html><head></head><body>";
while($article_row=mysql_fetch_array($article_result))
{ $article_text=$article_row['text'];
echo "<div>".$article_text."</div>"; }
echo "</body></html>";
Build into your PHP or other Server Side code the HTML structures that you want the browser to show when your pages are viewed. Save and upload your files, browsing to them to check that your database is correctly queried.
-
5
Design your information website using CSS code. Cascading Style Sheets are the main way to tailor the appearance of a website, and can be linked to in the head section of your HTML, as follows:
<link rel="stylesheet" type="text/css" href="my_style_sheet.css"/>
Create a blank file in a text editor and save it "my_style_sheet.css" to outline your layout and appearance rules. Enter CSS as in the following example:
/*style rules for HTML <div> elements*/
div
{color:#FF9999; background:#FFFF99;}
Build your style rules one at a time, saving and uploading your files regularly to test and refine the look of your pages.
-
1
Tips & Warnings
If you don't want to code your website yourself, an alternative is using a CMS (content management system). These systems automate many aspects of creating information based websites, and they are often easy to use.
Try not to build any element of your site without taking the time to think about it first, and if possible create a rough design before you start writing any code.
References
Resources
- Photo Credit website image by 6922Designer from Fotolia.com
