+5 votes
Learning basic Html and my first web page

in HTML5 / CSS3 by (360k points)
reopened | 108 views

1 Answer

+3 votes
Best answer

What is HTML? Its acronym means "Language for hypertext markup". It is defined as a language of labels that allow the development of a web page. Among the elements with which this language counts, are the controls (labels, text boxes, text areas, buttons) to implement forms, lists, tables, insert images, video, audio, among others.

It is a very simple language to learn because it is not in itself a programming language, but a language that makes. In addition to that the reserved words that compose it are easy to remember and very descriptive.

The most basic environment to start practicing and developing a web page is the common "Notepad" which is a text editor, although there are also special compilers (for example, Netbeans) that have the function of autocorrection for when a word in the syntax it is wrong, it marks it and makes it easier to locate.

HTML files should always be saved with the extension .html, whether the developer adds it manually or the editor adds it automatically. The type of .html file will be opened with the browser or browser of the user's preference (for example: Internet Explorer, Firefox, Google Chrome, Opera, Safary, etc.) since, as previously mentioned, the HTML language is composed of tags which the browser is ready to interpret.

Your first web page ...

In this case we will open the notebook, because we are working under windows environment and we will introduce the following code, for the typical "Hello world!":


As can be seen in the image, the file has not yet been saved. Then we go to the File> Save menu. To have well organized the files that we develop during this tutorial we will create a folder with the name "BASIC HTML", we access this folder and we personalize the file name, we introduce the name "index.html" remembering that it is important to establish the extension, because but it will only be saved as a text file ie .txt.


Go to the location of the file, double click on icon with the name "index.html" and this will open in the default browser in this case Google Chrome. This is what you will see:


Now let's go back to the code ...

<html> Tells the browser that it is opening an HTML file.
<head> Document header.
<title> My first web page. </ title> Title of the page.
</ head> Close the document header.

<body> Body, all the contents of this section will appear on the page.
Hello World!
</ body> Body closure.

</ html> Close the HTML file.

The <html> tag tells the browser that an html document is being opened, this is where it begins to interpret the content. It is important that each label that opens be closed, the closing tag can be displayed at the end of the document.

<Head> indicates the header of the document, here among other things that we will learn later will be placed the title of the page. Which brings us to the line of code <title> My first web page. </ title>, the result of this line will be reflected in the browser's title bar. The closing of the </ head> tag is shown below.

In the <body> and </ body> tags the content of the page will be placed, which can directly contain text and / or other format tags.

The attributes ...

Some tags have one or more attributes, these are defined as characteristics for the main tag. We must take into account some aspects for the definition of attributes:
  • They have the structure name = "value"
  • The value always goes in quotes.
  • They are placed on the opening label.
Example: In the <body> tag we will add the bgcolor attribute assigning a value that is hexadecimal and that will be enclosed in quotes. For a color guide I leave the following link " HTML color codes ".


We save our file to visualize the changes, and the result will be:


* IMPORTANT:: The labels can be written in lowercase as we have been visualizing them in the examples and in uppercase for example <BODY>. The World Wide Web Consortium (W3C) recommends the use of lowercase, in addition to XHTML which is the most updated version of HTML, only accepts the use of lowercase.

by (2.2m points)

Related questions

+3 votes
1 answer
asked Jun 23, 2019 in HTML5 / CSS3 by backtothefuture (360k points) | 134 views
+5 votes
1 answer
asked Sep 26, 2019 in HTML5 / CSS3 by backtothefuture (360k points) | 132 views
+4 votes
1 answer
asked Jun 24, 2019 in HTML5 / CSS3 by backtothefuture (360k points) | 129 views
+3 votes
1 answer
asked Jun 24, 2019 in HTML5 / CSS3 by backtothefuture (360k points) | 6k views
+5 votes
1 answer
asked Jun 23, 2019 in HTML5 / CSS3 by backtothefuture (360k points) | 73 views
Please leave a comment about whether the solution works or not (with device model)   [X]Close
6,895 questions
6,992 answers
2 users