100% found this document useful (1 vote)
137 views62 pages

Essential Fetaures of Website

The document provides information about essential features of website navigation. It discusses 13 essential features including website logo, header, menu, body, highlighted content, call to action, sidebar, posts and feed content, internal links, forms, buttons, footer, and social links. It provides examples and definitions of each feature to effectively explain their importance in website navigation.

Uploaded by

Nhowellyn Samar
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
100% found this document useful (1 vote)
137 views62 pages

Essential Fetaures of Website

The document provides information about essential features of website navigation. It discusses 13 essential features including website logo, header, menu, body, highlighted content, call to action, sidebar, posts and feed content, internal links, forms, buttons, footer, and social links. It provides examples and definitions of each feature to effectively explain their importance in website navigation.

Uploaded by

Nhowellyn Samar
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 62

QUARTER 2 WEEK 3

Navigate a website using essential features,


e.g. using headings, links, etc.
(EN7V-IV-d-23.1)
1.What is search
engine?
2.What are the
Let us benefits of using
Review! search engine?
What are the websites
that you usually visit?
Are you familiar with word twister?
We will have a game similar with that!
Are you ready?
First Word

BESTIWE
WEBSITE
Second Word

NOVATINGIA
NAVIGATION
Third Word

PRYXTEHET
HYPERTEXT
Fourth Word

LIPKHEYRN
HPYERLINK
Fifth Word

FURNOMI EUSRRCEO LARTOOC

UNIFORM RESOURCE LOCATOR


Are you getting the best of these
websites?

Do you really get the information you


need when you browse a website?
“Living in a modern world where technology is
predominantly used and internet is a necessity;
website navigation is a skill that you must learn.
This lesson will help you in familiarizing yourself
with the things that you need to know in
navigating a website.”
A website is a group of World
Wide Web pages, e.g.
Facebook, Youtube, Twitter,
Amazon, etc. It is usually
containing hyperlinks which
are made available online by
What is a an individual, company,
website? educational institution,
government, or organization.
Example of Websites
Website navigation is the
process of navigating pages,
apps, and websites on the
internet. The technology
What is a behind it is called hypertext or
website hypermedia.
navigation?
Hypertext or media are text-
based web pages that use
hyperlinks to connect them to
other pages on the internet.
What is
hypertext?
A hyperlink is a link that leads
your web browser to a URL.
What is
hyperlink?
HYPERLINK VS. HYPERTEXT
The URL or Uniform Resource
Locator indicates which file
the browser
should access from the
server. It downloads and
What is renders the data so the user
URL? can see it.
Activity 1.A.
Directions: Tell whether the given examples below are an
examples of website. Write YES if it is an example of
website and NO if not.

YES
_____1. https://www.wikepedia.com
_____2.
NO Microsoft excel
_____3.
YES https://www.wikihow.com
_____4.
YES https://www.canva.com
NO
_____5. PowerPoint
NO
_____6. Microsoft Edge
YES
_____7. https://www.google.com
YES
_____8. https://www.youtube.com
NO
_____9. VLC Media Player
YES
_____10. https://www.shoomp.com
In your English notebook,
list at least 5 websites that
you usually visit.
What do you think is the
importance of website
navigation?
What is the difference between
website and website navigation?
Are you familiar with the different
Features of a Website?

Can you give some features that


you know?
Try to name a few essential features of a
website. Choose your answers inside the box.

social links menu Highlighted content

 
post and “feed content” call to action (CTA)
 
Website logo Sidebar body Footer
 
Internal links forms buttons header
Essential Features of Website
1. Website Logo 8. Posts and “feed” content
2. Header 9. Internal Links
3. Menu 10. Forms
4. Body 11. Buttons
5. Highlighted Content 12. Footer
6. Call to Action (CTA) 13. Social Links
7. Sidebar
Essential Features
of a Website
1. WEBSITE LOGO
The logo section of the website will
commonly be the space for
identifying the website brand. This
image or text is often linked to the
website main page, often known as
“home”.
2. HEADER
The header is the top portion of the
website, often containing the website
logo as well as the main menu. The
header contains information that is
important to website navigation.
3. MENU
Menus, often placed at an easy-to-
reach place on the website, provide a
way to navigate the website in an
easy way. A main menu is often
contained in the header.
4. BODY

The body area of a website is the


area that contains the most content.
There are a number of different kinds
of content. Specific pages will contain
specific content.
5. HIGHLIGHTED CONTENT
Highlighted content, often exclusively on the home
page, guides visitors to parts of a website that will
convert into website goals. Website goals are the
actions, interactions, etc. that fulfil the very purpose
of a website. Booking a flight on a travel agent’s
website or buying goods on an online store are
examples of this.
6. CALL TO ACTION (CTA)
CTAs are important for guiding visitors to a website
to important information, completing website goals,
and navigating website. CTAs can be obvious, such
as buttons, or like linking within text, but all serve
the same purpose: guiding visitors to information
that is relevant to them.
7. SIDEBAR

Sidebars, like menus, often help with navigation.


Sidebars are often used in displaying related bits of
information, contain CTAs, or guide visitors to the
next step after they have read a post or added a
product to their cart (for example).
8. POSTS AND “FEED” CONTENT

A handy way to get visitors engaging with the


content on a website is by offering a “feed” of
content. This, like a slideshow of recommended
products, serves to catch the visitor’s interest and
guide them to completing website goals.
9. INTERNAL LINKS

Internal links are useful for creating an ideal flow


through a website. In the example, the link takes
users to the blog page, where they can see the full
list of blog posts and find something that interests
them and effectively completing a website goal.
10. FORMS
Forms are ideal ways of gathering information from
visitors. Contact forms are very common, and work
to get the name and a means of contacting visitors
at the very least. Sign-up forms, application forms,
shipping information forms, and the like are other
examples of how forms are used on websites.
Forms are an easy way to get the correct
information from visitors.
11. BUTTONS

Buttons are handy interactive parts of a


website that prompt engagement.
12. FOOTER

The footer is the round-up of the website.


Typically, the footer will contain important links
on the website, or, sometimes, links to all the
pages of the website.
13. SOCIAL LINKS

Social media links are a popular addition to most


websites. It connects the user to the different
social media accounts of an individual, brand, or
company. While the example shows the links in
the footer, social media links can be displayed
on any part of the website.
Activity 1. T or F?
Directions: Write T if the statement is true and F if it is false.

T
_____1. The website logo is where the visitors see the website brand.
F
_____2. The header can be found at the bottom part of a website.
T
_____3. Menu provides ways to navigate the website in an easy way.
T
_____4. CTAs are important in guiding visitors to a website to important
information, completing website goals, and navigating website.
F
_____5. The body area of a website contains the least content.
Activity 2.
Directions: Identify what is being defined in the following sentences. Choose your answer
from the box and write the letter of your choice on the space before each number.
a. Website
b. Hypertext
c. URL
d. Hyperlink
e. Website Navigation
B 1. These are text-based web pages that use hyperlinks to connect them to other pages on
_____
the internet.
E 2. It is a group of World Wide Web pages usually containing hyperlinks to each other
_____
and made available online by an individual, company, educational institution, government, or
organization.
D 3. It is a link that leads your web browser to a URL.
_____
A 4. It is the process of navigating pages, apps, and websites on the internet.
_____
C 5. It indicates which file the browser should access from the server and it downloads
_____
and renders the data so the user can see it.
ENUMERATE

What are the thirteen


essential features of
website?
Essential Features of Website
1. Website Logo 8. Posts and “feed” content
2. Header 9. Internal Links
3. Menu 10. Forms
4. Body 11. Buttons
5. Highlighted Content 12. Footer
6. Call to Action (CTA) 13. Social Links
7. Sidebar
Group Activity

“What is the importance of knowing and


understating the different essential
features of a website?”
Website navigation is an essential part of web
design because it contributes to the user
experience. Understanding website navigation
can help you allow users to access the
information they want as quickly as possible by
presenting an enjoyable, intuitive layout while
increasing ease of use.
“Are you getting the best of these websites?

Do you really get the information you need when


you browse a website?”
Activity 1 Arrange It!

Directions: Arrange the jumbled letters to


determine the essential features
of a website described in the following
sentences. Write your answers on
the space provided before each number.
__________ 1. It connects the user to the different social media accounts of an
individual, brand, or company. COAISL KNLIS
__________ 2. These are handy interactive parts of a website that prompt
engagement. UNTOTBS
__________ 3. This feature guides visitors to parts of a website that will
convert into website goals. IIGLHGHHDET NETOCNT
__________ 4. These are often used in displaying related bits of information,
contain CTAs, or guide visitors to the next step after they’ve read
a post. RSIBEDA
__________ 5. It is the top portion of the website, often containing the website
logo as well as the main menu. EHADRE
__________ 6. These are useful for creating an ideal flow through a website.
LARENITN KLINS
__________ 7. These are important for guiding visitors to a website to
important information, completing website goals, and navigating
website. LACL OT INOATC
__________ 8. It is the round-up of the website. OFORTE
__________ 9. This section of the website is commonly the space for
identifying
the website brand. SETIBWE GOOL
__________ 10. These are ideal ways of gathering information from visitors.
RFMSO
Answer:

1. Social Links 6. Internal Links


2. Buttons 7. Call to Action
3. Highlighted Content 8. Footer
4. Sidebar 9. Website Logo
5. Header 10. Forms
Assessment
Directions: Type this link https://www.youtube.com/watch?
v=ZjFzkhrqIZs on
your computer or mobile device. Navigate the website to find out the
top 10 best places to visit in the Philippines by “Touropia” and list
them down below.

1. 6.
2. 7.
3. 8.
4. 9.
5. 10.
What I have Learned

I have learned that a website


is_______________________.
REVIEW
The teacher will ask the students to give the meaning of the
following:
• Website
• Website navigation
• Hyperlink and hypertext
• URL
• The 13 essentials feature of navigating a website.
Example of
Website
PERFORMANCE TASK

Assume that you are a


Developer. You will create your
own website with your chosen
ideas/topic. The essential
features of a website must be
present/observe in your work.
“I would prefer even to
fail with honor than win
by cheating.”
MASTERY TEST
NO. 2

You might also like