DESIGNING WEBPAGES

 

Designing a website is very simple. You can have a very good site just in a single day. Follow the tips below and you will learn to make a very good website.

Step 1. Make a new folder

All you need to do first is to make a folder. Right click the mouse on the desktop and a menu box will appear.

SELECT NEW AND THEN FOLDER IN IT.

 

When a new folder is made, right click it again and then select rename.

 

Name it any word you like but it should not contain spaces, underscores or any slash etc. For example the name of your folder should be 'mysite' not 'my site'.

Step 2. Put all your files (pictures,music files) that you want to use in website in this folder.

 

Now open this new folder and add pictures in it , those pictures you wish to add in your website. You can copy and paste the pictures like this.

Copy the picture where you have stored it from like my documents or my pictures or anywhere else and then in the new folder ,right click and paste it.

The selected copied picture would be added to this folder. Now same case should be with any other file like music file but remember that the name should contain no spaces at all.

Step 3. Working with your webpage

Now select a normal page or a framed page. Framed page contain many pages added in one single page. You can select the frame style pages by opening the templates in MS front page.

 ..

You can add more frames by opening the webpage in MS word by selecting format and add frames

Now you can select the background color by going in format button and selecting background, a background menu will appear.

 

In it you can select the background color or even a picture , by selecting the background picture option but remember that the picture used for background should be small in size like 1-10kb and should be present in the ‘new folder’ which you made. now comes the background music option , you can add any midi as a background file by clicking format and then background and then general, add your midi by new folder by copying and pasting it first in the folder or use a link for a music file like http://dreamquest.us/midi/love/listentoyourheart.mid

Then click forever or the times you wish the background music to be played.

Now select the title of the page by clicking format and then general and then the page title.

.

Now you can start working with the things you wish to add, the text or the pictures. You can select different fonts by clicking format and then font and select the type you wish to add. A window of fonts will appear , select the font and the color and a preview would be shown below. 

.

Now to add the pictures in your webpage, go to the insert button and click picture and then from file.

Now select your new folder by clicking browse button and now select the picture by clicking the file and a picture would be added. You can add text over a picture too like this example.

By selecting the picture and then right click over it.

In the picture properties , go to general tab and then write the text you wish to write like this.

Now when you will move your mouse over the picture the text will appear like this.

Now we will work with hyperlinks, hyperlinks are the links which we click on and reach the website , a hyperlink like :http://www.yahoo.com . You can add hyperlinks to your files too but remember that every file made by you should be uploaded on a server first so that people can view it.

      Now what is a server? A server provides you space for your files. You can have your own server too but that is only by payment. If you need a free and a good quality server then here are some. hostrator or like geocities. Go get registered by them.

Step 3. Uploading files on web

 

Now how to upload your files?

 Like you want to upload a picture or a folder for example on roxette.org server then go and write this address in the internet browser address bar.

 .

Now you have reached ftp server. While going to any ftp server your computer may will be momentarily slow until ftp server is connected, don’t try to restart your computer. You may not be able to open ftp directly, in that case, type the ftp address and in 'view' select 'open ftp site in windows explorer'.

Once you reach here, everything is then alright. Now go to file button and select login option..

If you have applied for a roxette.org id and you have been mailed your id along with your password then enter your login name and then type your password and click login.

                       

 

.Now again the computer will slow down until you’re logged on but then it works normally. When you are logged on,

Go and copy the file or the folder you wish to upload on the internet. And now go to ftp server and right click and paste the file.

A menu box will appear indicating the time required to upload your files. This time entirely dispends on the speed of your net. if net is fast then you can upload heavy files in less time and if slow then it will take some time but this time is not the correct time. Wait till this box disappears.

Now when this box disappears it means your file has been uploaded. Now go and click the file , the file will open in a new window. The address would be like:ftp://ftp.yourname.roxette.org/foldername/filename/

There are two important things now. First is this that if you are uploading the files directly in ‘content’ folder then the file name would be, ok lets suppose you upload a picture named’me.jpg’. The address for the viewers of this picture would be ‘http://mywebsite.roxette.org/me.jpg’ and if you have created a folder in the content folder and uploaded files in that then the address would be

‘http://mywebsite.roxette.org/foldername/filename/’.Remember that only ftp address is for you .No one other than you can view your file by ftp address, when you want people to view your files then write the address by removing ftp and adding http.like for example , I view my files myself only by ftp://ftp.geocities.com/coolbluepage/ but the world views my files by http://www.geocities.com/coolbluepage/

So that's the difference.

Step 4. Adding hyperlinks

 

Now your files have been uploaded and you know the address. Now to add hyperlinks to your files , write a word like ‘my favorite singer' 

and select it by right clicking the mouse and right click again , a menu box would appear. Select hyperlink option.

In the hyperlink option write the address.

  The hyperlink has been added and someone who clicks over the word ‘my favorite singer’ would reach to the link added.

       You can also specify whether the link should be opened in a new window or in some frame by changing the target frame settings. select the word linked and right click and then select ‘edit hyperlink’ and then select target frame button

 

In the target frame you can choose ‘new window’ to open for the link specified. if you are adding frames , then you can also select links to open in another frame.

For example this is a framed webpage of you having two pages in one page. one is named ‘a’ having contents and the other is ‘b’ ,the frame where links would open.

.

Now write a link for example of yahoo in frame ‘a’ and then right click and click edit properties. 

And then go in target frame and write ‘b’ or the second frame name where you wish the website to be viewed. 

Now the website or the webpages would open in the second frame like this.

So now you can do this too. 

Step 5. Adding more to the webpage.

 

  You can add beauty to your website by this method. Go to insert and then click web component. 

Now click ‘marquee’

And then click finish, a menu box would appear , type any text here , select background color and adjust the speed. for more good shape , click style and then borders and shading.

Now see how would this appear.It would appear as moving text. You can enlarge it’s size , then go to borders and shading by style button and then select background picture 

now it will appear as

Similarly you can change the color and font and size of the hyperlinks when moved by a mouse.

Make a hyperlink first like this. Now go to format and then to background and select enable hyperlink rollover style

now click rollover style and select the font, size and color you wish to be viewed when links moved under the mouse. Now see below.It is normal and now see the effect.

So now you have learnt basics of web developing. 


For more help, type in comment box or sign the guest book.


Written By Dr.Muhammad Wasif Haq, Islamabad, Pakistan.


The Page Is A Part Of Cool Bluez

(2001)

HTML Comment Box is loading comments...