Create a Personal Website

Most people if you are new to HTML so it will create a website on profile
himself. This is because he does not know what to publish. This time we
will try to create a simple personal homepage.

PREPARATION

Before doing the designing to do the following points.

Create a folder in the directory C: \ HTML
Give the name of the folder Exercise
Create a folder in the directory C: \ HTML \ we created a new exercise
Give the name of the folder image.

All HTML files associated with html exercises will we save on Exercise folder. So
Also with pictures relating to the exercise would we save in a directory
C: \ HTML \ Exercise \ images.

SKETCH PROJECT

Web site that you make is a personal website that contains the profile data me.
I want on the website there are photos of me, family or home my house.
I want to profile the data is located on different pages
I want to have the links on my website

When designing a website make it a habit to make a rough sketch first. This
useful for our work becomes more focused. No matter if you later
make changes to the last, crucial stage sketch already exists.
To make a sketch of your design can draw on a sheet of paper or on the program
image processing on the computer. Whose name do not have a good sketch important
general illustration only. Examples of sketches for our project this time you can see on
picture 1.0.

MAKING STEPS

As you can see in the picture sketch of the project, the website has a
The main table and 2 tables of children, photographs and table menus table. The main table consists of 2 columns
and 1 row. While on the table photos and menus each have a 1 column and 1 row.


Picture 1.0

Home [index.html]

Well let's start working. First run PHP DESIGNER 2006 click the menu File-New-
HTML / XHTML. As always let us type in the codes that are delicious.

<html>
<head>
<titlegt; Hendro Sinaga Website </title>
</head>
<body bgcolor="#D7E7F3">
<table border ="1" style="border-collapse:collapse" width="100%" cellpadding="8"
bordercolor="black">
<tr>
<td width="20%">
<! - This table image ->
<table border="1" style="border-collapse:collapse" width="100%"
cellpadding="8" bordercolor="black">
<tr>
<td align="center"> <img border="1" height="100 "width="100" src="">

</td>
</tr>
</table>
<p> </p> 

<Table border="1" style="border-collapse:collapse" width="100%"
cellpadding="8" bordercolor="black">
<tr>
<td> It later for links </td>
</tr>
</table>
</td>

<td valign="top"> <p align="center">

<b> Welcome </b> </p> >/td>
</tr>
</table>
</body>
</html>

When finished save the above code with the name index.html and place it in the folder CHAPTER 3. Need
known to the main file to a website named index.html. The server will first
find a file named index.html. If he does not find the server will display the
error message. For more information later will be explained in the next chapter.
Open the file tersebeut with Internet Explorer, the result will look like figure 1.1.

Picture 1.1

This image file we will use to display images. (If you can yes your photos
itself, if it does not have any photos that's okay too)
Remember configure content src = "" in accordance with your file name.
Now it's time to update the website with the actual content. For that open the file
index.html and change the code that is color-coded so that it becomes like a yellow diamond
follows. Do not forget to change the border attribute on each table to "0".

<html>
<head>
<title> Hendro Sinaga </ title>
</head>
<body bgcolor="#D7E7F3">
<font face="verdana">
<Table border="0" style="border-collapse:collapse" width="100%" cellpadding="8"
bordercolor="black">


<tr>
<td width="20%">
<! - This table image ->
<Table border="0" style="border-collapse:collapse" width="100%"
cellpadding="8" bordercolor="black">
<tr>
<td align="center"> <img border="1" height="100" width="150"
src="images / fotoku.jpg"> </td>
</tr>
</table>
<p> <hr> </p> 

<table border ="0" style="border-collapse:collapse" width="100%"
cellpadding ="8" bordercolor="black">
<tr>
<td> <font size="2">
<ul>
<li> <a href="profil.html"> Profile </a> </li>
<li> <a href="kegiatan.html"> Activities </a> </li>
<li> <a href="foto.html"> The photos </a> </li>
<li> <a href="puisi.html"> My Friend </a> </li>
<li> <a href="mailto: pschinaga1@gmail.com"> Email me </a>

</li>
</ul>
</td>
</tr>
</table>
</td>

<td valign="top">
<p align="center"> <font size="4">

<bv WELCOME TO HENDRO SINAGA WEBSITE</b> </font> </p>
<p> <font size="2"> I thank you for your visit to the website
me. On this website you can view data profiles myself and the activities
I do. Below is a poem I made some time ago.

This poetic inspiration came when I was alone and pensive nan broad look

at the sky.</font> </p>
<p> Me and My God </b> </p>
<p> <font size="2">
<i> When I look at the sky <br>
I asked myself 

I ... 



who am I really? 

Where I come from? 

I'm far from my Lord? 

I ....



God ... 

how much power you 

created the heavens and the earth 

to feed the people 

like I 



I ... 

if I've devoted to you? 

it's just me and you who know <br>
</i> </font> </p>
</td>
</tr>
</table>
</body>
</html>

When finished editing the save file. Run the file through Mozilla Firefox The result can you see in the pictur 1.2.