.jpg "html guide")
What is HTML?
HTML
stands for HyperText Markup Language. HTML is a markup language that describes
the structure of a document and its content. HTML is used to create web pages,
which are displayed in a web browser.
HTML is
not code that makes websites work; it's what you see on a website. If you are
writing an article about how to use your favorite social media platform, you
may use HTML tags like (headings) to label the beginning and end of each
section of text in your article.
Why Learn HTML?
● Build
websites. HTML is a markup language used to create web pages, which are viewed
by people using a browser (like Chrome). Without HTML, you wouldn't be able to
make your website!
● HTML
is the foundation for all other web languages like CSS and JavaScript. This
means that learning just one component of these languages will give you an
understanding of how they work together as well as some experience working with
them on real projects.
● It is
easy. Learning HTML takes less time than learning any other programming
language out there because it has fewer concepts than those others (like PHP).
Plus there aren't any crazy syntax rules that need memorizing before
starting—just basic copy-and-paste commands. If this sounds good then let's get
started on our journey through this awesome guide...
Structure of a web page
The
first step to creating a web page is to write the code that will make up your
page. You can do this in two ways:
● Using
HTML tags, which are small pieces of code that contain information about how a
web page should look and behave.
●
Writing plain text, which consists of sentences like "Hello world",
but with no formatting or styling.
HTML Doctype
The
doctype is the first line of code in a web page, and it defines the version of
HTML that will be used. It must be placed at the top of your document, just
below the opening
tag.
The
doctype can be one of two values: "XHTML 1.0 Transitional" or
"HTML 4." If you don't specify either value, then it defaults to
XHTML 1.0 Transitional (this is also known as "transitional").
You
should always use an explicit doctype when writing HTML5 documents; otherwise,
browsers may misinterpret them as being written in older versions of HTML and
render them incorrectly or not at all!
Basic Tags
HTML is
a markup language used for structuring and presenting information on Web pages.
The tag is a punctuation character that tells the browser what content to
display. HTML tags are enclosed in angle brackets (<>), and each tag must
be properly closed.
HTML
defines many different types of tags, including those that create paragraphs,
lists, links, and other structures. Each tag has a corresponding opening and
closing angle bracket pair ( </>).
<head>
</head>
Heading
- A heading is a descriptive title for your page and appears at the top of each
page in a browser window. A heading can also be referred to as a heading level,
title level, or h1-h6 element. Headings are typically displayed in bold text
underlined in some browsers (but not others).
<title>
</title>
Title -
The title element specifies the name of your site or web application; it
appears at the top center in a browser window when it's printed out or viewed
onscreen. Titles are typically displayed as bold text with no underlining or
italics (but you can change this by adding CSS styling).
Headings
Headings
are used to defining the heading of a document. There are six levels of
headings, with h1 being the largest and h6 being the smallest. In general, you
should use headers for navigation and content organization:
< h1
> Heading 1 Heading tag with a large amount of text that is emphasized or
has special meaning.
< h2
> Heading 2 Second level heading tag with less emphasis or special meaning.
< h3
> Heading 3 Third-level heading tag with still less emphasis or special
meaning.
< h4
> Heading 4 Fourth level heading tag with still less emphasis or special
meaning.
< h5
> Heading 5 Fifth level heading tag that is used in lists to improve
readability when more than one item is being listed together in the same
paragraph. It is also used for short-form headings such as main points in a
list or key points in an article which are typically shorter than those found
at higher levels of headings on their lines. In other words, this is the lowest
level at which you can use this type of heading within your document.
Images
Adding
images in HTML is a very simple process. You just need to use the <img>
tag and give it an ID attribute, so that you can refer to it later. For
example, if you want to add an image of a cat, you would write:
<img
id="cat" src="images/cat.gif">
Now, if
someone were to visit your page and click on the image, they would be taken to
your server where they could download the image.
Text Formatting
You can
format text in different ways to make it stand out.
● Bold:
B, boldface type
●
Italicized text: I, italic type (with a wider stroke than normal)
●
Underlined words: U (the underline goes inside your word).
Links
Link
text should be clear and descriptive. The link text is what a user will see
when they mouse over your link, so it must be easy to understand. For example,
if you're linking to an article about traffic signs and you say
"signs," people won't click on the link unless they have some context
for what you are talking about.
To create
a link, use the following syntax:
<a
href="https://www.google.com/">Google</a>
The
"href" attribute is required for every link element. It specifies the
location of the target page or document. The value of this attribute should be
a valid URL (i.e., not a relative path). This can be either an absolute URL or
one that uses a protocol when applicable.
Tables
A table
is a type of HTML element that defines the layout of a document. It consists of
a series of rows and columns, each with its own set of cells, which are
separated by horizontal lines called gutters. The number of rows and columns
can be specified by setting table attributes on the element.
To
create a table, use the <table> tag as follows;
<table>
<tr>
<td>Row
1</td>
</tr>
<tr>
<td>Row
2</td>
</tr>
</table>
Lists
Lists
are used to organize information hierarchically. They can be ordered or
unordered, with the latter being called bulleted lists and the former numbered
ones.
Unordered
lists are great for showing off your favorite things quickly and easily, while
ordered ones make it easier for users to find what they are looking for by
providing context around each item on the page.
Example
of an unordered list:
<ul>
<li>One</li>
<li>Two</li>
<li>Three</li>
</ul>
Forms
Forms
are used to collect information from users, and they can be used in many
different ways. One of the most common uses for forms is to gather data for
surveys or contact forms. For example, you could use a form with text boxes,
checkboxes and dropdown menus to gather customers' opinions about your
company's products or services. Example
<form action="" method="post"> <input type="text" name="name1" value="Lorem ipsum dolor sit amet1"> <input type="text" name="age1
HTML Attributes
HTML
Attribute is a tag that is used to define a HTML Element. HTML Attributes are
attributes that can be added to a tag, such as <p> or <img>.
The
most common HTML attributes are:
class -
defines the style for an element in terms of what CSS classes it belongs to.
The class attribute is used to group related elements of the same type (e.g.,
images).
id -
defines an element's unique identifier within a document
title -
sets the title of an element
lang -
sets the language of an element
dir -
specifies the directionality of text displayed inside an element (ltr or rtl)
style -
sets CSS styles for an element
Conclusion
This
guide to HTML for beginners provides all the basics you need to begin coding in
HTML.
If you
are looking for a quick guide on how to get started with HTML, look no further
than The HTML Ultimate Guide.
