HTML Links Notes
HTML Links Notes
EXTERNAL LINK
A link to a file or to a webpage that does not belong to the webpage's own site.
INTERNAL LINK
A link to a file or a webpage within the webpage's own site, or to any part of the
webpage itself.
DEAD LINK
A link to a webpage or file that does not exist.
ANCHOR TAG
Use to describe links, and this tag has the <a> </a> format.
The anchor tag must include a hypertext reference or href , which is a URL enclose in
quotes.
< a href="https://www.gov.ph">Republic of the Philippines</a>
<a href="project.html">this links to my project/a>
LINKING WEBPAGES AND WEBSITES
Webpages refers to the different pages found on a website. Every website has a home
page. To link webpages and websites, the HTML tag <a> and its attribute href are both
used in the HTML codes. To open a link in a new window/tab, use the target attribute.
The values for target includes:
ADDING A TABLE
Tables can contain texts, links, inner tables, images, lists, forms, etc. To add tables use
the opening and closing <table> tags. Table headers are added to the HTML table
through the use of the <th> tag. To add rows on the table use the <tr> tag (table row).
The cells that divide the rows are added with the use of the <td> tag (table data). The
<td> tag contains the content of the table.
ADDING TABLES
Tables are defined with the <table> tag. A table is divided into rows with the <tr> tag,
and each row is divided into data cells with the <td> tag. “td” stands for "table data," and
holds the content of a data cell. A <td> tag can contain text, links, images, lists, forms,
other tables, etc.
Constructed Response:
1. How can you ensure that your website links are functioning properly?
To ensure your website links are functioning properly, regularly check them through
manual testing by clicking each link to confirm they lead to the correct page. Use
automated tools or plugins designed for link checking to quickly identify broken or dead
links. Keep your URLs updated, especially when making changes to page structures or
moving content, to prevent broken links. Lastly, monitor user feedback and website
analytics to catch any potential issues with links that may not have been detected during
routine checks.
2. Why is linking web pages important in website design?
Linking web pages is important in website design because it helps users easily navigate
between related content, improving the overall user experience. It creates a connected
structure, allowing visitors to explore different parts of the site seamlessly. Internal links
help search engines understand the relationship between pages, enhancing SEO
(Search Engine Optimization). Linking also encourages users to stay on the site longer
by guiding them to additional relevant content. Lastly, it improves accessibility by
providing clear pathways for users to find the information they need.
3. Why is it important to use both ordered and unordered lists on a website?
Using both ordered and unordered lists improves the organization and readability of
content on a website. Ordered lists are ideal for steps or processes where sequence
matters, while unordered lists are great for grouping related items. They enhance user
experience by making information easier to scan and understand. Lists also aid
accessibility by helping screen readers interpret content more effectively. Additionally,
they improve SEO (Search Engine Optimization) by signaling clear and structured
content to search engines.
Coding Exercise:
1. Type an HTML code to create a link that opens the "contact.html" page in
the same window and an external website "https://www.news.com" in a
new tab
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
3. Type HTML code to create an ordered list of steps to prepare a sandwich:
"1. Get two slices of bread," "2. Add your choice of filling," "3. Put the two
slices together."
<ol>
<li>Get two slices of bread</li>
<li>Add your choice of filling</li>
<li>Put the two slices together</li>
</ol>
4. Type HTML code to create a table with 3 columns: "Name," "Age," and
"City." Include two rows of data: "Alice," "30," "New York" and "Bob," "25,"
"Los Angeles."
<table border="1">
<tr>
<th>Name</th>
<th>Age</th>
<th>City</th>
</tr>
<tr>
<td>Alice</td>
<td>30</td>
<td>New York</td>
</tr>
<tr>
<td>Bob</td>
<td>25</td>
<td>Los Angeles</td>
</tr>
</table>