First the font: 
download the AlKatib1 font by  clicking here
it is free and detailed instruction for installing is here. 

Now your system is set up to read the urdu font. But you will need a utility to write in urdu font. 
Urdu nigar is a program that uses the AlKatib1 font. 
download  the urdu nigar from here. 

Once you have installed Urdu Nigar. just start writing in the box. 

Then cut or copy and paste it into the page that you are creating. It may appear gibberish , if it does just highlight the entire text that you pasted and then change the font to AlKatib1. 
 

voila! now it appears in Urdu. 

For designing purpose I would suggest making a table and making its dimension width fixed  to 400 pixels. Yes the text would be smaller but then if someone has smaller window it won't mess up your text formatting. It is good that Urdu Nigar only let you type one line at a time. 

Save the page upload it to the web. Please direct your visitor to this web page for instructions and downloading of the urdu font . Once font is installed they can read the urdu text. the URL for sending your visitors for font is 

 http://www.urdustan.com/download/

And please don't forget to let webustaad know about your page or any problem that you encountered while making one.  e-mail webustaad@urdustan.com