Scribd
Upload
84 views29 pages

Web Design Basics Workshop Guide

This document outlines an workshop on basic web design and development. It discusses introducing web design, the visual elements of web design, and tips for persuasive and effective web design. The objectives are to define web design, identify design elements, and understand effective website tips. It then covers what web design is, the design process, key visual elements like layout, color, graphics, fonts and content, and why an effective website is important for businesses. The workshop will have groups identify elements of web design and provide dos and don'ts of website creation.

Uploaded by

Justin Reyes
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
84 views29 pages

Web Design Basics Workshop Guide

This document outlines an workshop on basic web design and development. It discusses introducing web design, the visual elements of web design, and tips for persuasive and effective web design. The objectives are to define web design, identify design elements, and understand effective website tips. It then covers what web design is, the design process, key visual elements like layout, color, graphics, fonts and content, and why an effective website is important for businesses. The workshop will have groups identify elements of web design and provide dos and don'ts of website creation.

Uploaded by

Justin Reyes
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPT, PDF, TXT or read online on Scribd

A WORKSHOP ON:

BASIC WEB
DESIGN
AND
DEVELOPMENT
TOPICS:
1. Introduction to Web Design
2. Visual Elements of Web Design
3. 5 Simple Tips on Persuasive &
Effective Web Design
OBJECTIVES:
• Define and explain the Web Design.
• Identify the Elements of Web Design.
• Understand the tips of effective
website.
What is web
design?
Web design is a process of
conceptualizing, planning, and building
a collection of electronic files that
determine the layout, colors, text
styles, structure, graphics, images, and
use of interactive features that deliver
pages to your site visitors. Professional
Web design helps to make your
business appear credible online.
?
DESIGN
1 2 3
Collect Implement Apply
these ideas design
ideas principles
WEB
DESIGN
Follows the same process in design

Present the design through


web pages
Create an effective
web design
by applying key visual
elements
ELEMENT 1:

LAYOUT
Maintain balance, consistency and
the integrity of the design.
ELEMENT 2:

COLOR
Color should represent your
personality or the brand of an
organization.
ELEMENT 3:

GRAPHICS
Logos, images, and graphics that can
help enhance your design.

Make sure to place them strategically.

Use graphics wisely!


ELEMENT 4:

FONTS
Typography can enhance your
design… when used wisely.
ELEMENT 5:

CONTENT
Should be useful and relevant.

Optimize for search engines.


ANALYSIS:
• Have you experienced
surfing website having
poor or dated visual
design?
ANALYSIS:
• How can you make your
website look professional
and attractive?
• Make your menu/site navigation
prominent, and simple.
• Keep your content distinct from other
elements, and easy to read.
• Make your buttons stand out. They're
where the action happens.
• Decide what is most important on any
page, and then give it prominence. ...
• Don't put too much on the same
page/screen.
Why should you have a
good website?
A quality website is important for a
business. ... Looking good is important
because your website is often your
first impression you give potential
customers. If they found you through a
search or through a link a friend gave
them, your website will be your first
point of contact with them.
APPLICATION
The class will divide into 4
Groups and give one dos
and one don’ts in making
a website in 5 mins.
¼ cw. Identify the Elements of Web
Design.
1. Should be useful and relevant.
Optimize for search engines.

2. Typography can enhance your


design… when used wisely.

3. Maintain balance, consistency


and the integrity of the design.
4. Should represent your
personality or the brand of an
organization.

5. Logos, images, and graphics


that can help enhance your
design.
ANSWER KEY:
1. Content
2. Font
3. Layout
4. Color
5. Graphics

You might also like