Basic Web Concept

WEB DESIGN
TERMINOLOGY
 NETWORK
○ Defined as several computers connected
together with purpose of sharing resources
including data, information and hardware

WEB DESIGN
TERMINOLOGY
 INTERNET
○ Worldwide collection of computers
interconnected to one another (wired or
wireless)

WEB DESIGN
TERMINOLOGY
 WORLD WIDE WEB (WWW)
○ Collection of resources and information
interconnected via internet.

WEB DESIGN
TERMINOLOGY
 WEB PAGE
○ Formatted page within a website that may
contain text, graphics, video and multimedia.

WEB DESIGN
TERMINOLOGY
 HOME PAGE
○ First webpage of a website which usually
provides information about the website, its
purpose and contents.

HISTORY OF THE
INTERNET
 Anchored on the project started by the
United state Government called DARPA
(Defense Advance Research Projects
Agency) for the development of new
technology for military use which was
established in 1958.

HISTORY WORLD WIDE
WEB
 Started in 1989 by English Physicist Sir
Tim Berners- Lee
 W3C- World Wide Wen consortium
organization

DIAL- UP CONNECTION
 Connecting to the internet using the
telephone lines.

DSL (DIGITAL SUBSCRIBER
LINE)
 Connecting to the internet using the
telephone lines but provides both data
and voice communication.

CABLE INTERNET
 Online connection to the web by the use
of cable lines already used by the cable
television providers.

WIRELESS INTERNET
 Internet connection provide by wireless
service providers wherein wireless
enable computers and gadgets can
access to.

DEDICATED LINE
 Internet using permanent and
continuous connection using this which
is reliable and stable signal for very
important internet applications.
 It is usually refer to T- carrier line and it
can be either T1 and T3 line.

DEDICATED LINE
 T1 line used to connect an end user to
the internet provider
 It has a speed of 1.544 Mbps

DEDICATED LINE
 T3 line used by internet service
providers and phone companies
 It has 44.736 Mbps

HOME BUTTON
 Usually represented by a house icon to
return to the user’s homepage

ADDRESS BAR
 Usually represented by a house icon to
return to the user’s homepage

BACK AND FORWARD
BUTTONS
 As represented by left and right arrows,
to go back to the previous page and
forward to the next

REFRESH OR RELOAD
BUTTON
 To reload the current page

STOP BUTTON
 To cancel loading the current page

SEARCH BAR
 As a means to types in topics and terms
in a search

STATUS
 To display progress of the page being
loaded

PAGE ZOOMING
 Capability to view a page closer or
further.

INTERNET EXPLORER
 Most popular
internet browser
used by more than
60 % of worldwide
browser.

MOZILLA FIREFOX
 Free and open
source web
browser
 Second most
popular web
browser

SAFARI
 Web browser for
the Mac operating
system developed
and design Apple
Inc. using the Web
kit (KHTML)

GOOGLE CHROME
 Very new web
browser from
Google Inc.
 Fourth most
popular web
browser.

OPERA
 Fifth most popular
website as of
September 2009
 1.5% of the web
browser usage
 Phishing and
malware protection

NETSCAPE
 Most popular web
browser in the
1990’s
 Legacy of it is the
base code for
Mozilla Firefox and
partly Google
Chrome
 Responsible for the
development and
introduction of
JavaScript

FLOCK
 new browser that
support Microsoft
windows, Mac OS
X and Linux
operating system is
based on Mozilla’s
Firefox codebase

BALANCE
 Concept has something to do with
symmetrical and asymmetrical
arrangement of the text and object in
web page
 Symmetrical: traditional, conservative,
professionals and simple mood of
atmosphere
 Asymmetrical: energy, modern style and
youth fullness

PROXIMITY
 Placement of the elements with logical
relationship close to each other
 Proper arrangement of related elements
 Helps to avoid clutter on a web page

WHITE SPACES
 Blank spaces which are placed around
webpage elements
 Help organize the size to emphasize
major topics over details and encourage
size navigation parts of the page and to
other pages

CONTRAST
 Differentiate the elements of a web page
 Achieved by varying size, character and
colors of the element to arrange them
according to which needs to be
emphasize and which one supports

FOCUS
 Element in the web site which should
get the attention of the viewer first
 Web page must have a focal point that
you would want the viewer to focus and
remember

UNITY
 Sense of agreement and harmony of all
elements of the web site
 The contents, it design, layout and
character truly belong to this site and
reflective of the person or company it
represents: Logo, font color and style

ALIGNMENT
 Proper arrangement and positioning of
the elements of the website
 Facilitate viewing, reading and
navigating on the web site

ACCURACY
 Ensuring the reliability of the information
you publish on the website.
 Spelling and grammar should be done
on the site

READABILITY
 Accessible and readable
 Use headings, subheadings, tables list,
color on text, an background so that the
audience will be able to read the
message with clarity

UNDERSTANDABLE
 Easily comprehend
 Lead: conclusion or summary of the
topic
 Body: details and he full story

CONCISE
 Least words to convey a message on
the internet
 Shortened information rather than
presenting them in paragraph form

ETHICAL AND LEGAL
 Use words, picture and videos that you
yourself created
 Otherwise get the written permission
from the original author
 Protect your web: naming, placing a
copyright logo etc.

CREATE THE GOAL OR
PURPOSE OF THE WEBSITE
 What you hope to achieve
 Listing down all the objectives you want
to accomplish will help you to focus on
the total design of the site

IDENTIFY THE PRIMARY
TARGET AUDIENCE
 Target on certain focus audience in
website
 Educate: your audience will be a
students

PLAN THE CONTENT OF THE
WEBSITE
 Text, pictures, videos, music and
multimedia
 Best content to attract the target
audience to your site
 It should be useful, high quality,
accurate timely and dynamic for the
audience to return to your site for more

PLAN AND ORGANZE THE
SITE STRUCTRE
 Help you to attain the objectives for the
website

STRUCTURES IN DESIGNING
A WEB
 LINEAR STRUCTURE
- Present the website one at a time
fro tutorial site (historical information)
 HIERARCHICAL STRUCTURE
- Several categories are connected
(subcategories)
 RANDOM STRUCTURE
- present it resources and information
in any order (categories)

PLAN THE WEBPAGE
DETAILS
 Very attention- grabbing homepage
 Animation design

PLANNING AND DESIGNING
THE NAVIGATION SCHEME
 Navigate go back and forth
 Should be able to search using hyperlink
index, menus, employment of buttons
etc.

PLANNING AND GATHERING
YOUR RESOURCES
 Assets that you would need
 Templates may also be created to
facilitate the site development process

Basic Web Concept

More Related Content

What's hot (20)

Similar to Basic Web Concept (20)

More from JM Ramos (20)

Recently uploaded (20)

Basic Web Concept