1

Web Design concepts

Web page design through Tables

2

Some terms

Tags, attributes & element Web page Web site Web client Web server

3

Website …..

Designing a good website requires more than just putting together a few pages

4

Web Page Design

Design of web pages is very important because …..

Poor design makes for - Difficult navigation Hard to locate information on page Visually unappealing

5

Design consistency Choose a common layout for your

website. The index page will probably differ but interior pages should be the same

Use tables/div to control placement throughout

Use the same font throughout! Use color scheme that is consistent Use a hierarchical structure

Web design

Design your web site through Tables Division

6

7

Tables Use tables to lay out your pages! Make the table borders invisible A 2x2 table works well

8

Areas of a Web Page

Menu

Header

Content

Logo Header

9

A 2 x 2 Layout

10

A 2 x 2 Layout

11

Table within a table

12

The outer table

13

The inner table

14

The inner table

15

Centered with three columns

16

Really complicated design!

17

Site Map

A site map is designed to show the connections between pages

A graphical site map uses lines to connect linked pages

18

Site Map

Interior orInternal

Pages

Your Website

index.html

Friends.html Personal.html Family.html

Educational.html Hobbies.html

19

Assignment – Website Design

Build your personal website. Add pages to site – like

Resume, friends page, hobbies page Minimum 4 pages Make sure design consistency

This is an individual assignment.

PresentationsGroup Members Topic Date

1 Zuhair + Zain Adobe photoshop 27.2.2013

2 Faisal + Qasim Firebug 6.3.2013

3 Junaid Rashid Dreamweavor 13.3.2013

4 Nashra+Madiha+Kanwal+Aleena

Dreamweavor 13.3.2013

5 Falak sher + Usman WebMatrix 20.3.2013

6 Affan + Usman Joomla 27.3.2013

7 Ahsan+Shafqat+Iqra Wordpress 3.4.2013

8 Mustansir+ Nouman Modernizer 10.4.2013

9 Samer OSCommerce 17.4.2013

10 Zeeshan + Haris + Rabia Magento 24.4.2013

11 Ibrahim + Ali Tariq Brackets 1.5.2013

12 Sana + Farwa 8.5.2013

13 Khurram + Hasan 15.5.2013

14 Nouman + Zeeshan + Sahar 22.5.201320

21

Thanx!