Description:
|
Headlines.
Types of HTML:
Define HTML Version:
HTML5 documents:
<!DOCTYPE html>
<html>
or <head>
elements. Also, there is no closing tag.
Other DOCTYPES you might encounter
HTML 4.01 Strict
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML 4.01 Transitional
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
HTML 4.01 Frameset
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
XHTML 1.0 Strict
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML 1.0 Transitional
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 1.0 Frameset
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
XHTML 1.1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Explain in Details.
Finally, I would not suggest you to use an older version. Use v5.0 which is
the latest version and I hope this will be the best choice. And also that
v5.0 is very simple. This task of web developing or coding is very simple,
you just have to learn it once and for all. I will create a simple and basic
web page.
First of all, remember that each site has four major
sections.
- Header
- Content
- Sidebar
- Footer
I have already told you how to create an HTML file, but if you do not know how to create an HTML file, you can learn by clicking here.
After creating the HTML file, open it in any coding editor. I will suggest you "Notepad ++" if you are doing this for the first time, but if you want to work faster you can use "Brackets Coding Editor". But it is a bit heavier software than "Notepad ++".
Then you can start coding in it. Coding is not difficult at all, if you follow me you can learn it very easily.
This is a simple web code (HTML):
(Every tag that starts is also closed. Each tag is written off in < >. And to close it, / is used at the start inside < > ie: <example> </example>)
<!DOCTYPE html><html><head><title>My Website</title></head><body><header><h1>My Website</h1><nav><ul><li><a href="#">Home</a></li><li><a href="#">About</a></li><li><a href="#">Contact</a></li></ul></nav></header><div id="content"><p>Welcome to my website!</p><p>Here you can find information about me and my work.</p></div><aside><h3>Additional Information</h3><p>Here is some additional information about me and my work.</p></aside><footer><p>Copyright ©2022 My Website</p></footer></body></html>
My Website
Welcome to my website!
Here you can find information about me and my work.
Header: This section usually contains the site's logo, main navigation menu, and search bar.Content: This is the main area of the website where the majority of the information is displayed.Footer: This section typically contains links to additional information such as legal disclaimers, contact information, and privacy policies.Sidebar: It is the section which contains the links, additional information, call to action etc.
We can create a aside tag inside body after the header or content element to add sidebar. We
can enter this
<link rel="shortcut icon" type="image/jpg"
href="Favicon_Image_Location/image.x"/> code inside the head section to apply the favicon.
"Favicon_Image_Location"
is replaced by an image link, whether the image is on an online server or
on a local host.
"image" is replaced by image name
&
"x" is replaced by image extension.
Advertise...
For Example:
<link rel="shortcut icon" type="image/jpg" href="https://letslearnlights.blogspot.com/favicon.ico">
On the other hand, the title is also entered in the head section and the <title>Your site Tittle</title> code is used for it.
The full site blog will be written in the coming posts. If you follow all my blogs related to HTML, you will be able to do all things that are done with HTML.
Final Lines.
<!DOCTYPE html> <html> <head> <title>Your site Tittle</title> <link rel="shortcut icon" type="image/png" href="https://i.ibb.co/NpX46f7/61-Ck-JY2cp-KL.png"/> </head> <body> <header> This is a header section </header> <p>This is a body section</p> <footer> This is a footer section </footer> </body> </html>
Above I have given the link of an online png file for Favicon so for that I
have also written png in image type. And the same title is appearing.
This
is what HTML is all about. How to make it? How does this make a webpage or
website? The above are just examples. We haven't created a complete website
yet. For a complete site, it is important to use styles (CSS) with HTML. In
the coming post we will learn how to link a stylesheet ie CSS with HTML and
design the site and also see with an example how javaScript is used in
websites and how it works.
3 Comments