Basic web designing

What will you learn Basic Html and css coding Learn how to create a website from

start Learn how to use script for blog such as

wordpress and might even have the time to design a template for wordpress

E-Commerce script for selling online and forum using phpbb

The standard for html coding for all browser and making it user friendly for common screen resolution

I want to learn more, how?

Well everything I learned is through www.google.com so believe me, google is your best friend!

There are MANY tutorials and e-book available for free

Good site recommend is http://www.w3schools.com/

What are the requirement Domain name (EG:

http://www.lzxe.net) with dns control Sub domain will be used for this

lesson Web hosting Ftp Client, smart ftp client will be

used as educational purpose Dreamweaver or notepad or relevant

editor is required for web making

What are the prizes Everybody will get a chance to

create a website. Regardless of using html or scripting Top three awardie will receive 1st free 1year .com or .net domain

with 6 month free hosting by vishnu 2nd and 3rd free 1 year .biz domain

with 6 month free hosting by vishnu

Why create a website?

To share your knowledge with everybody on the world wide web

To earn reveune from advertisement such as google adsense.

To provide services such as selling goods or online services

What is domain name

Eg: www.lzxe.net, www.lalala.com, www.google.com

Sorry to say but domain names requires money.

Example for domain registration Name.com, godaddy.com,

aplus.net

Sub domains As normal domain requires

payment, we shall be using free sub domain

Example of subdomains are http://yoursubdomain.lzxe.net

Hosting will provided for this lesson If you don’t like to use our sub

domains, clock redirect domains are availed

Web Hosting What is webhosting A place to store your files at a server Server are located at any country Bandwidth and disc space are two of the

most important factor Common control panel are cpanel/plesk

for linux, Helm/plesk/direct admin for windows

Therefore you might want to get a web host with a panel which you’re used to

Web Hosting cont Web hosting located in Singapore will result in

faster loading time for Singapore ISP but will result in slow for international user

It is recommend to get web hosting from other country such as US as its cheaper and faster for international users

Therefore it depends on your target of user Bandwidth is the amount of data that can be

carried from one point to another in a given time period

Example when you’re downloading file from the site, you’re using bandwidth

Web Hosting cont Space requirement A normal website for bogging requires less

then 20mb if images are uploaded at external site like imageshack.us

Mysql are required for this lesson as we will be learning about scripting.

Basic html does not requires mysql database For this lesson we will be using direct admin

panel For more information head down to

www.webhostingtalk.com

Direct Admin

Accesing your ftp using smartftp Under address type

in ftp.lzxe.net or ftp.youraddress

Under login type in your login id

Under password type in your password

Now press enter

Ftp directory As the webhost is linux, the directory

is totally different from windows /public_html will be main directory

(this is where u place your files at) Although not shown the full path

directory Is /home/yourid/domains/youdomain/public_html

this will be used in some scripts

Html Lesson with dreamweaver Standards Index.html is the frontpage of the website, if

index.html doesn’t exist index.php will be choosen

For example when accessing http://www.google.com your’re actually accessing http://www.google.com.sg/index.html

Index.html>index.php However frontpage can be other file such as

lala.html, you will be required to edit the .htacess file which we wont be teaching much on it

Introduction to dreamweaver

To create new site project click “site” then “new slide”

As we will be using our own ftp client, you may adjust the setting as shown

Introduction to dream weaver Cont Setting your

webpage properties

Title of the page can be adjusted at Title

Html Lesson with dreamweaver (images) To decrease loading time we

have to decrease files loaded on the site such as image

If a image is less then 256 colour, .gif is used to save space

Jpeg is commonly used for pictures more then 256 colour

Open the image with photoshop to edit the setting

Press “image” then “image size” (alt + Ctrl + I) to edit the image size

A monitor will not display more then 72 resolution, therefore we choose 72 to reduce size

(on to real example of showing)

Press “file” then “save for file and web device” and press 4up

Standard Screen resolution What are the common resolution? Currently In the world, most people are

still using 800x600 screen resolution or 1024 x 768

Therefore it was recommended for your site width to be around 768, we use 780 as some browser have problems with 768 on 800x600

We will be using css style sheet to set fix width and auto centering the page

Css Style shit (where the hard part is)

First of all css stylesheet is one of the hardest among this tutorial. We will be learning how to do basic alighting style sheet and etc.