Stay at Home,Stay Safe. We're all in this together God bless us all

WELCOME TO THE TUTORIAL

To begin writing our code we need a text editor, if you're using a pc notepad is enough and if you're using a mobile device click the link below to download.

WebMaster's HTML Editor Lite

Remember to save your document as .html(example: myclass.html).

Common Use tags

The <> defines opening tag.(example:<title>) the opening tag only have the < and > arrow.
    
The </> defines closing tag.(example:</title>) the closing tag have <,/, and > arrow. A / was added after the < arrow.
    
The <!DOCTYPE html> tag defines this document to be HTML5.
    
The <html> tag defines HTML document.

The <head> tag contains title,style and meta tag.

The <title> tag specifies a title for the document.

The <style> tag defines the style of your document.

The <meta> tag defines metadata about an HTML document the metadata is information about data.

The <body> tag contains the vissible page content.

The <h1> to <h6> tag defines a heading from largest to smallest.

The <p> tag defines a paragraph.

The <marquee> tag defines a moving text.

The <a> tag defines a hyperlink.

The <br> tag defines a single line break.

The <!-- --> tag defines a comment.

The output when using the following tags

1.TITLE TAG

This is the title of your page(highlighted)

2.META TAG

The meta tag 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 Metadata is used by browsers (how to display content or reload page), search engines (keywords), and other web services.

The followings are the meta attribute:

charset = Specifies the character encoding for the HTML document
content = Specifies the value associated with the http-equiv or name attribute
http-equiv = Provides an HTTP header for the information/value of the content attribute
name = Specifies a name for the metadata

Example of our meta attribute:

Define keywords for search engines

Define a description of your web page:

Define the author of a page:

Refresh document every 10 seconds:

Defines the UTF-8:

with meta charset="UTF-8"

without meta charset="UTF-8"

Setting the viewport to make your website look good on all devices:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

The viewport is the user's visible area of a web page. It varies with the device - it will be smaller on a mobile phone than on a computer screen.

This gives the browser instructions on how to control the page's dimensions and scaling. 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.

You should include the following meta element in all your web pages:

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

To Start your own webpage click the link below

Install WebMaster's HTML Editor Lite

3.BODY TAG

The Body tag is an important element that contains all the content displayed on a web page in a browser. The body tag comes after the closing head tag.
Is the body tag important? The body tag is important, imagine a head without a body it's freaky right? It's important because it contains all content and functions and they are the headings, texts, hyperlinks, images, videos, and other things.
The tag can also contain Javascript.
So a body tag can contains the content of our document like the example given below

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
  <h1>Heading of the document</h1> /* This is the Heading */
    <p>Content of the document</p> /* This is the Paragraph */
    <a href="myclass.neocities.org"></a> /* This is the Hyperlink */
    <img src="image.jpeg"> /* This is the Image */
<video width="320" height="240" controls> /* This is the Video */
  <source src="video.mp4" type="video/mp4">
</video>
  </body>
</html>

4.MARQUEE TAG

Marquee tag is a moving text, marquee tag is used to have a notice of your website for news and update, some use it to have a cooler website to attract more visitors like humans,robot or perhaps an alien, let's move on to the code where you want to move your text it's easy as counting as 1,2,3 or A,B,C.

<marquee> This is our moving text</marquee>

This is our moving text

Basic Sample

HTML Headings

HTML headings are defined with the <h1> to <h6> tags.
<h1> defines the most largest heading. <h6> defines the smallest heading: 

<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>

HTML Paragraphs

HTML paragraphs are defined with the <p> tag:

<p>This is a paragraph.</p>

HTML Links

HTML links are defined with the <a> tag:

Example

<a href="myclass.neocities.org">This is a link</a>

The link's destination is specified in the href attribute.