Scribd
Upload
0 views

Full Stack Unit - 1 (HTML)

This document provides a comprehensive overview of HTML, including its history, structure, and key elements. It covers HTML tags, attributes, and the evolution to HTML5, highlighting new features such as semantic elements and support for audio and video. Additionally, it discusses HTML editors and the construction of web pages, emphasizing the importance of dynamic and interactive content.

Uploaded by

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

Full Stack Unit - 1 (HTML)

This document provides a comprehensive overview of HTML, including its history, structure, and key elements. It covers HTML tags, attributes, and the evolution to HTML5, highlighting new features such as semantic elements and support for audio and video. Additionally, it discusses HTML editors and the construction of web pages, emphasizing the importance of dynamic and interactive content.

Uploaded by

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

Unit -1

HTML
Prepared by:
Dr. Susheela
HTML
• Hyper Text Markup Language
• HTML was first created by Tim Berners-Lee, Robert Cailliau, and
others starting in 1989
• HTML is the standard markup language for creating Web pages
• HTML elements tell the browser how to display the content
• Hypertext means that the document contains links that allow the
reader to jump to other places in the document or to another
document altogether.
• A Markup Language is a way that computers speak to each other to
control how text is processed and presented. To do this HTML uses
two things: tags and attributes.
• The latest version is known as HTML5.
HTML Tags
• HTML tags are used to mark up the start of an HTML element and
they are usually enclosed in angle brackets. An example of a tag
is: <h1>.
• Most tags must be opened <h1> and closed </h1> in order to
function.
• When using multiple tags, the tags must be closed in the order in
which they were opened. For example:
<body>
<p>This is really important!
</p>
</body>
HTML Tag’s Attributes
• Attributes contain additional pieces of information. Attributes take
the form of an opening tag and additional info is placed inside.
• An example of an attribute is:
<img src="GEHU.jpg" alt="A photo of Graphic Era Hill University.">
HTML Editors
• Notepad++
• Auto-completion feature
• No support for Mac.
• TextEdit (Mac)
• Sublime Text 3
• Easily customizable
• Beginner-friendly
• Pleasant color schemes to choose from
• Available for Mac, Windows, and Linux
• Can’t print documents or code
• No toolbar or dashboard available.
• Komodo Edit
• Available for Mac, Windows, and Linux
• Impressive language support
• No autocompletion by default
Basic Construction of an HTML Page
• <!DOCTYPE html> — This tag specifies the language you will write
on the page (HTML 5).
• <html> — This tag signals that from here on we are going to write in
HTML code.
• There is one tag that is always included: <title>
• <head> — This is where all the metadata for the page goes — stuff
mostly meant for search engines and other computer programs.
• <body> — This is where the content of the page goes.
• The HTML <body> is where we add the content which is designed for
viewing by human eyes.
<!DOCTYPE html>
<html>
<head>
<title> Title of Page </title>
</head>
<body>

<h1>First Heading</h1>
<p>paragraph</p>

</body>
</html>
HTML 5.0
• HTML5 is a cooperation between the World Wide Web Consortium
(W3C) and the Web Hypertext Application Technology Working Group
(WHATWG).
• HTML5 introduces a number of new elements and attributes that can
help you in building modern websites.
• HTML5 is designed, as much as possible, to be backward compatible
with existing web browsers.
• HTML5 comes with a lot of flexibility, and it supports the
following features −
• Uppercase tag names.
• Quotes are optional for attributes.
• Attribute values are optional.
• Closing empty elements are optional.
Dynamic Page Support
Now a days there is need of dynamic as well as
interactive websites rather than static websites. Here are
enormous features that provide the dynamic touch to the
website :
• time – This helps in adding current time as well as date
to the webpage.
• meter – It helps in indicating that how much space in
the storage disk is still there.
• progress bar – It helps in knowing the progress of the
task that has been assigned for its completion.
New Elements in HTML 5
• Navigation Tag <nav>
• Header Tag <header>
• Footer Tag <footer>
• Section Tag <section>
• Article Tag <article>
• Main Tag <main>
• Figure Tag <figure>
• Figure caption Tag <figcaption>
• Mark Tag <mark>
• Progress Tag <progress>
• Sematic Tag <sem>
• Audio Tag <audio>
• Video Tags <video>
• Media Control
• Scalable Vector Graphics Tag <svg>
• Canvas Tag <canvas>
HTML HTML5

HTML does not provide native audio and video support. HTML5 provides native audio and video support.

HTML only supports vector graphics if used in conjunction with different HTML5 supports SVG (Scalable Vector Graphics), Canvas, and other virtual
technologies like Flash, VML, or Silverlight. vector graphics.

HTML doesn’t allow users to draw shapes such as circles, triangles, and
HTML5 allows users to draw shapes such as circles, triangles, and rectangles.
rectangles.

HTML5 uses web SQL databases, local storage, and application cache for
HTML only uses browser cache and cookies to store data temporarily.
storing data temporarily.

JavaScript and browser interface run in the same thread. JavaScript and browser interface run in separate threads.

Longer document type declaration. Shorter document type declaration.

Longer character encoding declaration. Uses the ASCII character set. Shorter character encoding declaration. Uses the UTF-8 character set.

Only compatible with newer browsers, considering there are many new tags
Compatible with almost all browsers.
and elements which only some browsers support.

Built based on Standard Generalized Markup Language (SGML). HTML5 has improved parsing rules providing enhanced compatibility.

HTML5 has a JavaScript geolocation API, which can be used to identify any
Programmers are unable to use features that determine a user’s geolocation..
user's location when accessing the website.
Semantic Elements in HTML5
• Semantic elements in HTML refers to the tags that
provide meaning to an HTML page rather than just
presentation.
• It makes HTML more comprehensible by better
defining the different sections and layout of web
pages.
• The semantic HTML tags help the search engines
and other user devices to determine the
importance and context of web pages.
• The pages made with semantic elements are much
easier to read.
• It has greater accessibility. It offers a better user
experience.
Navigation <nav> Tag
Article Tag <article>
• The <article> tag specifies independent, self-contained
content.
• An article should make sense on its own and it should
be possible to distribute it independently from the rest
of the site.
• Potential sources for the <article> element:
• Forum post
• Blog post
• News story
The <article> element does not render as anything
special in a browser. However, you can use CSS to style
the <article> element (see example below).
Header Tag <header>
• HTML <header> tag is used as a container of introductory content or
navigation links. Generally a <header> element contains one or more
heading elements, logo or icons or author's information.
• You can use several <header> elements in one document, but a
<header> element cannot be placed within a <footer>, <address> or
another <header> element.
Footer Tag <footer>
• The <footer> tag defines
a footer for a document
or section.
• A <footer> element
typically contains:
• authorship information
• copyright information
• contact information
• sitemap
• back to top links
• related documents
Main Tag <main>
• HTML <main> tag is used to represent the main content of the
<body> tag.
• The <main> tag is written within <body> tag. It is used to accurately
describe the primary content of a page.
• The content of the main tag is directly related to the central topic of
the document.
• Author should not include more than one <main> tag within a
document.
• The <main> element should not used as a child of an <article>,
<aside>, <header>, <footer>, or <nav> element.
Mark Tag <mark>
• HTML <mark> tag is used to highlight the text
Progress Tag
• The <progress> tag represents the completion progress
of a task.
• Always add the <label> tag for best accessibility
practices
Figure & Figure Caption Tag
1. HTML <figure> tag is used to mark up a photo in the document on a
web page.
2. HTML <figcaption> tag is used to add a caption to a photo.
Figure & Figure Caption Tag
1. HTML <figure> tag is used to mark up a photo in the document on a
web page.
2. HTML <figcaption> tag is used to add a caption to a photo.
<video> tag
• HTML 5 supports only mp4 & ogg audio/video
• The text between the <video> and </video> tags will only be
displayed in browsers that do not support the <video> element.
• You can set up different sources, and the first source that fits the
preferences is the one being used.
• Attributes:
• Controls - Adds video controls, like play, pause, and volume.
• Preload - auto, none
• width and height - If height and width are not set, the page might flicker while
the video loads.
• Add muted after autoplay to let your video start playing automatically (but
muted)
Audio Tag
Scalable Vector Graphics <svg> Tag
HTML Text Formatting Tags

<del> Defines deleted text


<!DOCTYPE html>
<html>
<body>
<p>This text is normal.</p>
<p><b>This text is bold</b></p>
<p><strong>This text is strong</strong></p>
<p><i>This text is italic</i></p>
<p><u>This text is underline</u></p>
<p><s>This text is strike through</s></p>
<p><small>This is some smaller text.</small></p>
<p>Do not forget to buy <mark>fruits</mark> today.</p>
<p>My favorite color is <del>blue</del> red.</p>
<p>My favorite color is <del>blue</del> <ins>red</ins>.</p>
<p>This is<sub> subscript</sub> and <sup>superscript</sup></p>
<p><em>This text is emphasized.</em></p>
</body>
</html>
HTML Elements
The HTML element is everything from the start tag to
the end tag:
<tagname>Content goes here...</tagname>

Nested HTML Elements


• HTML elements can be nested
HTML Attributes
• All HTML elements can have attributes
• Attributes provide additional information about
elements
• Attributes are always specified in the start tag
• Attributes usually come in name/value pairs
like: name="value"
Style Attribute
• The style attribute is used to add styles to an element, such as color, font, size, etc.
• HTML supports 140 standard color names.

<tagname style="property:value;">

<p style="color:red;">This is a red paragraph.</p>


<body style="background-color:powderblue;">
<h1 style="background-color:powderblue;">This is a heading</h1>
<p style="background-color:green;">This is a paragraph.</p>
<h1 style="font-family:verdana;">This is a heading</h1>
<p style="font-family:courier;">This is a paragraph.</p>
<h1 style="font-size:300%;">This is a heading</h1>
<p style="font-size:160%;">This is a paragraph.</p>
<h1 style="text-align:center;">Centered Heading</h1>
<p style="text-align:center;">Centered paragraph.</p>
<h1 style="border:2px solid Red;">Hello World</h1>
<head>
<style> /* This is internal styling */
h1
{
color: indianred;
}
p
{
color: red;
}
</style>
</head>
HTML Headings
• HTML headings are defined with the <h1> to <h6> tags.
• <h1> defines the most important heading. <h6> defines
the least important heading.
• <h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
HTML Line Breaks
• The HTML <br> element defines a line break.
• Use <br> if you want a line break (a new line) without
starting a new paragraph:
<p>This is<br>a paragraph<br>with line breaks.</p>

• The <br> tag is also an empty tag,


means that it has no end tag.
HTML Paragraphs
• A paragraph always starts on a new line and is usually a block of
text.
• <p> tag defines a paragraph.
• <p>
This paragraph
contains a lot of lines
in the source code,
but the browser
ignores it.
</p>
• <p>
The number of lines in a paragraph depends on the size of the browser window. If
you resize the browser window, the number of lines in this paragraph will change.
</p>
HTML Horizontal Rules
• The <hr> tag defines a thematic break in an HTML page and is most often
displayed as a horizontal rule.
• The <hr> tag is an empty tag means that it has no end tag
• The <hr> element is used to separate content (or define a change) in an
HTML page:
<h1>This is heading 1</h1>
<p>This is some text.</p>
<hr>
<h2>This is heading 2</h2>
<p>This is some other text.</p>
<hr>
<h2>This is heading 2</h2>
<p>This is some other text.</p>
<img> Tag
<img src=”gehu.jpg" alt=”GEHU" width="104" height="1
42">

1. Absolute URL - Links to an external image that is hosted on another


website. Example: src="https://www.gehu.ac.in/images/img1.jpg".
• External images might be under copyright. If you do not get permission to
use it, you may be in violation of copyright laws. In addition, you cannot
control external images; it can suddenly be removed or changed.
2. Relative URL - Links to an image that is hosted within the website. Here,
the URL does not include the domain name. If the URL begins without a slash,
it will be relative to the current page. Example: src="img_girl.jpg". If the URL
begins with a slash, it will be relative to the domain. Example:
src="/images/img_girl.jpg".
• It is almost always best to use relative URLs. They will not break if you
change domain.
HTML Comment Tag
• HTML Comment Tag can help document the source code.
• Comments can sometimes also used to hide content.

Syntax:
<!-- Write your comments here -->

Example:

<!DOCTYPE html>
<html>
<body>
<!-- This is a comment -->
<p>This is a paragraph.</p>
<!-- Comments are not displayed in the browser -->
</body>
</html>
HTML Links - Hyperlinks
• Links allow users to click their way from page to page.
• <a> tag defines a hyperlink.
• Syntax:
<a href="url">link text</a>
• By default, links will appear as follows in all browsers:
• An unvisited link is underlined and blue
• A visited link is underlined and purple
• An active link is underlined and red
• The target attribute specifies where to open the linked document.
The target attribute can have one of the following values:
• _self - Default. Opens the document in the same window/tab as it was clicked
• _blank - Opens the document in a new window or tab
• _parent - Opens the document in the parent frame
• _top - Opens the document in the full body of the window
• <a href="https://www.gehu.ac.in/" target="_blank">Visit GEHU!</a>
<!DOCTYPE html>
<html>
HTML Link Colors
<head>
<style>
a:link {
color: green;
background-color: transparent;
}
a:visited {
color: pink;
background-color: transparent;
}
a:hover {
color: red;
background-color: transparent;
}
a:active {
color: yellow;
background-color: transparent;
}
</style>
•a:link - a normal, unvisited link
<h2>Link Colors</h2>
•a:visited - a link the user has visited
<p>You can change the default colors of links</p>
•a:hover - a link when the user mouses over it
<a href="html_images.asp" target="_blank">HTML Images</a>
•a:active - a link the moment it is clicked

</body>
</html>
Lists
• Ordered Lists <ol>

• Unordered Lists <ul>

• Definition List <dl>


Lists
• Ordered Lists <ol>
• Unordered Lists <ul>
• Definition List <dl>
Unordered List

SQUARE

NONE
Ordered List

<ol type=“A” start=“E”>


OUTPUT
<li> Coffee </li>
E. Coffee
<li> Tea </li>
F. Tea
<li> Milk </li>
G. Milk
</ol>
Nested List
Table Tag
Table Tag
Table Tag
cellspacing Attribute
Align =
left, right, center
HTML <form>
• <form> is a HTML tag to collect input data with interactive controls.
• It provides facilities to input text, number, values, email, password,
and control fields such as checkboxes, radio buttons, submit buttons,
etc., or in other words, form is a container that contains input
elements like text, email, number, radio buttons, checkboxes, submit
buttons, etc.
• Forms are generally used when you want to collect data from the
user.
• For example, a user wants to register for an event, so he/she has to
first enter name, mail id, contact number etc. in the registration form
to get registered.
Form Tags
<input> tag Attributes
<input> tag type Attribute values
• Text
<input type="text" name = "sname" size = "50" required>
• Radio
<input type = "radio" name = "Gender" value = "Male”>
• Checkbox
<input type="checkbox" name="color" value="red" />Red</li>
• Textarea
<textarea rows = "5" cols = "50" name = "description">
Enter description here...
</textarea>
• Submit
<button type="submit">Submit</button>
Text Box
•Single-line text input controls − This control is used for items that
require only one line of user input, such as search boxes or names. They
are created using HTML <input> tag.
•Password input controls − This is also a single-line text input but it
masks the character as soon as a user enters it. They are also created
using HTMl <input> tag.
•Multi-line text input controls − This is used when the user is required
to give details that may be longer than a single sentence. Multi-line
input controls are created using HTML <textarea> tag.

<label>Username : <input type="text" name = "sname" size = "50" required>


</label>
<label>Password : <input type="password" name = "pass" /></label>
<input> tag
<label>Username :
<input type="text" name = "sname" size = "50” required>
</label>
<label>Password :
<input type="password" name = "pass” maxlength = “10” />
</label>
textarea
<label>Description : </label><br>
<textarea rows = "5" cols = "50" name = "description">
Enter description here...
</textarea>

Output:
Radio button
<label> Gender: <input type = "radio" name = "Gender" value = "Male"> Male
<input type = "radio" name = "Gender" value = "Female"> Female

Output:
checkbox
Choose Colors:<br>
<ol>
<li> <input type="checkbox" name="color" value="red">Red</li>
<li> <input type="checkbox" name="color" value="blue”>Blue</li>
<li> <input type="checkbox" name="color" value="green" >Green</li>
</ol>

Output:
Select Box (Drop Down) Control
A select box, also called drop down box which provides option to list down various options in the form
of drop down list, from where a user can select one or more options.
<select name = "dropdown">
<option value = "Maths" selected>Maths</option>
<option value = "Physics">Physics</option>
</select>
Output:

<select name = "dropdown" size = "2">


<option value = "Maths" selected>Maths</option>
<option value = "Physics">Physics</option>
</select>

Output:
<html>
<head><title> Student Registration </title></head>
<body>
<h1> Student Registration </h1>
<form>
<label>Username : <input type="text" name = "sname" size = "50" maxlength = "10" placeholder = "Enter your name"></label> <br><br>
<label>Password : <input type="password" name = "pass" maxlength = "10"></label> <br> <br>
<label> Gender: <input type = "radio" name = "Gender" value = "Male"> Male
<input type = "radio" name = "Gender" value = "Female"> Female </label> <br> <br>
Choose programming languages you know:<br>
<ol>
<li> <input type="checkbox" name="C" value="yes" checked>C</li>
<li> <input type="checkbox" name="C++" value="yes" />C++</li>
<li> <input type="checkbox" name="Java" value="yes" checked>Java</li>
<li> <input type="checkbox" name="PHP" value="yes" /> PHP </li>
<li> <input type="checkbox" name="PHP" value="yes" />PHP</li>
</ol> <br> <br>
Choose your Favourite Subject: <br>
<select name = "dropdown" size = "2" multiple>
<option value = "OS">OS</option> <option value = "DBMS" selected>DBMS</option>
<option value = "CSA">CSA</option> <option value = "Data Structure">Data Structure</option
</select> <br><br>
<label>Description : </label><br> <textarea rows = "5" cols = "50" name = "description"> Enter description here... </textarea> <br><br>
Do you want to receive notifications: <br>
<input type="radio” name="agree” value="yes" checked>Yes <br>
<input type="radio” name="agree" value="no">No <br> <br><br>
<button type="submit">Submit</button>
</form>
</body>
</html>
The Method Attribute
• The method attribute specifies the HTTP method to be used when
submitting the form data.
• The form-data can be sent as URL variables (with method="get") or as
HTTP post transaction (with method="post").
• The default HTTP method when submitting form data is GET.
• Example
• <form action="/action_page.php" method="get">
• <form action="/action_page.php" method="post">
• GET:
• Appends the form data to the URL, in name/value pairs
• NEVER use GET to send sensitive data! (the submitted form data is visible in
the URL!)
• The length of a URL is limited (2048 characters)
• Useful for form submissions where a user wants to bookmark the result
• GET is good for non-secure data, like query strings in Google
• POST:
• Appends the form data inside the body of the HTTP request (the submitted
form data is not shown in the URL)
• POST has no size limitations, and can be used to send large amounts of data.
• Form submissions with POST cannot be bookmarked
Data List Tag
• The <datalist> tag specifies a list of pre-defined options for an <input>
element.
• The <datalist> tag is used to provide autocomplete feature in the HTML
files. It can be used with an input tag so that users can easily fill the data in
the forms using select the data.
• Syntax: <datalist> ... </datalist>
• Once the user starts typing the input element of <datalist> tag, the user
will see the pre-defined options starting with the letter or word typed by
the user.
• To use the <datalist> tag, the id of the tag must be the same as of the
<input> element attribute.
• Both <datalist> and <select> tags are used for choosing an option from the
given list. But the main difference between both is that in the <datalist> tag
the user can enter its own input and add that as an option with the help of
the <input> element whereas the <select> tag doesn’t provide this feature.
Some More Tags:
• <fieldset> tag
• The <fieldset> tag is used to group related elements in a form.
• The <fieldset> tag draws a box around the related elements.
• The <legend> tag is used to define a caption for the <fieldset> element.
• <map> tag
• The <map> tag is used to define an image map. An image map is an image with clickable areas (hotspots).
• Required attribute is “name” attribute which is associated with the <img> tag’s usemap attribute and
creates a relationship between the image and the map.
• The <map> element contains a number of <area> elements, that defines the clickable areas in the image
map.
• <bdi> Bi-Directional Isolation Tag
• The <bdi> tag isolates a part of text that might be formatted in a different direction from other text
outside it.
• This element is useful when embedding user-generated content with an unknown text direction.
• <embed> Embedded Tag
• The <embed> tag defines a container for an external resource, such as a web page, a picture, a media
player, or a plug-in application.
• <embed type="image/jpg" src="pic_trulli.jpg" width="300" height="200">
• <embed type="text/html" src="snippet.html" width="500" height="200">
• <embed type="video/webm" src="video.mp4" width="400" height="300">
• Note: It is better to use <img>, <iframe>, <video>, <audio> tag instead of
<embed> tag
Some More Tags:
• <output> Tag
• The <output> tag is used to represent the result of a calculation
HTML <meta> Tag
• The <meta> tag defines metadata about an HTML
document.
• Metadata is data (information) about data.
• <meta> tags always go inside the <head> element, and
are typically used to specify character set, page
description, keywords, author of the document, and
viewport settings.
• Metadata will not be displayed on the page, but is
machine parsable.
• Metadata is used by browsers (how to display content
or reload page), search engines (keywords), and other
web services.
Attributes of <meta> tag
HTML <meta> Tag
1.Keywords - Define keywords for search engines
2.Refresh - Refresh document every 30 seconds:
3. Viewport - the user's visible area of a web page. t varies
with the device - it will be smaller on a mobile phone than on
a computer screen.
The width=device-width part sets the width of the page to
follow the screen-width of the device (which will vary
depending on the device).
The initial-scale=1.0 part sets the initial zoom level when the
page is first loaded by the browser.
Character entities in HTML
• Reserved characters or the characters that creates
ambiguity in code must be replaced with character entities.
• Ex: less than (<) or greater than (>) signs
• Entity name or Entity number both can be used to display a
special character Copyright Mark - Decimal - &#169, Hexadecimal - &#A9

Registered trademark
HTML | <frame> Tag
• HTML Frames are used to divide the web browser window
into multiple sections where each section can be loaded
separately.
• A frameset tag is the collection of frames in the browser
window.
• The <frame> tag was used in HTML 4 to define one particular
window (frame) within a <frameset>
• Not Supported in HTML5.
• Use the <iframe> tag instead of <frame> tag in HTML5
The W3C Markup Validation Service
• Most pages on the World Wide Web are written in computer languages (such as HTML)
that allow Web authors to structure text, add multimedia content, and specify what
appearance, or style, the result should have.
• As for every language, these have their own grammar, vocabulary and syntax, and every
document written with these computer languages are supposed to follow these rules. The
(X)HTML languages, for all versions up to XHTML 1.1, are using machine-readable
grammars called document type definition (DTDs), a mechanism inherited from SGML.
• However, Just as texts in a natural language can include spelling or grammar errors,
documents using Markup languages may (for various reasons) not be following these
rules. The process of verifying whether a document actually follows the rules for the
language(s) it uses is called validation, and the tool used for that is a validator. A
document that passes this process with success is called valid.
• ”Markup Validation" is the process of checking a Web document against the grammar
(generally a DTD) it claims to be using.
• The W3C (World Wide Web Consortium) markup validation service is used to checks the
markup validity of Web documents in HTML, XHTML, SMIL, MathML, etc.
• The W3C Markup Validator provides Perl/CGI/SGML/XML/DTD-based validation of a
variety of document types.
The W3C Markup Validation Service
• The Markup Validator is a free tool and service that validates markup: in
other words, it checks the syntax of Web documents, written in formats
such as (X)HTML.
• The Validator compares your HTML document to the defined syntax of
HTML and reports any discrepancies.
• The Markup Validator is maintained at W3C by W3C staff and benevolent
collaborators, who receive a lot of help from contributors (read the full
credits).
• Why Web professionals should choose to validate:
• WYSINWOG - What You See Is Not What Others Get
• Validation as a debugging tool
• Validation as a future-proof quality check
• Validation eases maintenance
• Validation helps teach good practices
• Validation is a sign of professionalism
https://validator.w3.org
References
• https://www.geeksforgeeks.org/
• https://www.w3schools.com/
• https://www.tutorialspoint.com/
• https://data-flair.training/blogs/web-browsers/
• https://dev.to/mahmoudessam/the-architecture-of-web-browsers-1o1k
• https://xd.adobe.com/ideas/process/information-architecture/different-
types-of-website-structures/
• https://www.infidigit.com/blog/website-structure/
• https://www.uxpin.com/studio/blog/web-structures-explained/
• https://www.naukri.com/learning/articles/top-features-of-html5-with-
examples/
• https://www.admecindia.co.in/web-design/10-new-features-html5-
examples/
• https://validator.w3.org/docs/why.html#why_pros

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy