Neocodex Design Class - HTML
12 lessons to get started in HTML - Article 1
Hello how are you?
I'm Emilio Dami Silva and this is my first article to introduce you to the html world in a practical way.
This course is very basic and is intended to introduce you to HTML only.
HTML (Hypertext Markup Language), is the standard markup language for creating web pages, describes the structure of a web page and consists of a series of tags and elements that tell the browser how to display the content
In short, it is a markup language used by browsers to display content on computers in general, browsers read the html codes and convert them into visible text pages to be displayed on the screen. HTML is a form of script interpreted by the browser.
What will we need to assemble our first page?
- • A Computer with Windows;
- • a text editor and a browser, I suggest Google Chrome Browser
For now, let's create our first website, then I will explain each line in detail in this article and in the next one we will study other TAGS in the next articles.
- Open a text editor on your computer, it can be Notepad and type the following lines:
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<meta name="author" content="Emilio Dami Silva"/>
<meta name="description" content="Course basic HTML"/>
<meta name="keywords" content="Courses, HTML, site, web, website, development"/>
<title>Neocodex Design Class</title>
</head>
<body>
<h1>
Our page OFICIAL
</h1>
<p>
Our first page created in HTML.
</p>
</body>
</html>
- Create a working directory and save the file with the name index and the .html extension inside that directory, then open it in your browser and run the saved script, see the screen below:
Click on the file and you will run your first website in pure html and congratulations to you who finished this first lesson!
In HTML everything works with TAGS, let's explain step by step each item of the file that we type inside our script:
<!DOCTYPE html>
All HTML documents must begin with a declaration that will tell the browser what type of document it needs to expect, so the HTML type tells the browser it can expect HTML instructions.
<html>
The <html> tag is the root element of an HTML page, every html page must start with this tag. Everything inside this tag will be considered to be the site itself.
<head>
The <head> tag contains meta information about the HTML page, inside this tag it will contain all the information of your page, this information will be used so that the search engines can classify your page and show it to the users who search for information. The main search engine nowadays is Google Search. Specializing in Google Search today can earn you good money and is essential for anyone working in marketing and sales.
<meta>
The <meta> tag help search engines (search engines) to find your site on the web and serve as information, because they are the ones that give a small summary of what will be found on your page, this is one of the ways to index available web content. In our example, we have three TAGS, the author tag that contains the name of the author of the code, description that contains the code description and the meta keywords that contain the keywords to be indexed in search engines.
<title>
The <title> tag specifies a title for the HTML page (which is shown in the browser's title bar or page tab)
<body>
The <body> tag defines the body of the document and is a container for all visible content such as titles, paragraphs, images, hyperlinks, tables, lists, etc. Everything inside this tag will be interpreted by the browser to show the user.
<h1>
The <h1> tag defines a large title that will be displayed in the browser, the numbers 1,2,3,4,5,6 define the type of title, as the number grows the higher its subtitle level.
<p>
The <p> tag defines a paragraph, all texts must be placed inside paragraphs and they will be shown on the monitor screen when called by the user.
</> This slash ends each tag, it must be placed when the tag ends, looking like this:
- <body>
- <p> content </p>
- </body>
- Save your work in the workbook you created for this course.
You have completed your lesson, congratulations!
That's all for now.
I'm Emílio Dami and we'll be back soon.
Watch our videos on our you-tube channel, subscribe there to continue to receive all the news automatically and leave your comment, oh and share!
You can send an email to info@neocodexdesign.com