Contrast Hierarchy Alignment

Emphasis Balance
Go and browse the following websites and share your thoughts that
best describe the design of the website by using one word (ex. Simple)

www.microsoft.com www.kahoot.com/schools
 MOST ESSENTIAL LEARNING COMPETENCIES

Apply web design principles and elements using online creation tools,
platforms, and app locations to communicate a message for a specific purpose
in specific professional tracks. (CS_ICT11/12-ICTPT-Ig-h-10)

Create an original or derivative ICT content using online creation tools,

platforms, and applications to effectively communicate messages related to
specific professional track (CS_ICT11/12-ICTPT-Ig-h-11)
 WEB DESIGN PRINCIPLES

Purpose Simplicity
Is it for providing information, products or services, Keep your design as simple as possible so that the
academic consumption? users can feel it easy-to-use and can find what they
are looking.

Accommodate and meet the user’s expectation on

what you have to offer
Remember simplicity always
works in an effective web
Purpose must be crystal clear. page design.
 WEB DESIGN PRINCIPLES
Loading Time
Crowded and over-designed web design can affect
the loading time of your website.
You may lose visitors even if you have a clear
purpose.
Simplify your design to
optimize its loading time.
Communicati on
Formulate straight forward and easy-to-digest
information.
Use of headlines and sub-headlines,
illustration, and using bullet points is
a clear and consistent ways of
communication to convey
information to the users.
 WEB DESIGN PRINCIPLES

Responsive Making your website

available across
Make it mobile-friendly on which the design of your
website can shrink or expands as per the dimension multiple devices will
of the screen of the device. attract more users.
 WEB DESIGN ELEMENTS
Content
Using video, animation, relevant news, up-
to-date information and high-resolution
imagery provide a great deal for your
website to be engaging, effective and
popular.
Content is the backbone
of your website.
Usability
Anticipating user’s needs and help them fulfill their
needs with as little effort as possible.
Your website must be easily to
navigate, intuitive, accessible and
user-friendly using navigation
buttons.
 WEB DESIGN ELEMENTS
Aestheti cs
Aesthetics includes factors such as
balance, movement, pattern, scale, shape
and visual weight.
Remember the principles
of graphics layout and
design.
Visibility
The success of your website is based on the volume
of user engagement you have.
Formulate a plan to market
your website using search
engines optimizer, social
media and email
marketing.
 WEB DESIGN ELEMENTS

Interacti on The goal is to engage

users, hold their
attention, direct them and
Adding comment boxes and opinion polls in
the design of your website can help you to
encourage them to
improve the functionality of it. contact you.
 ANATOMY OF A WEBSITE
Header Navigation
Logo
Headline
Banner

Content Image

Video

Contact Form

Footer