INTRODUCTION
Before starting to talk about the post “Introduction to HTML” I will give you some information on the editor to use. I personally am happy with Visual Studio Code but you may not be of the same opinion. Other good editors out there are atom, this is the link atom and in any case, the editor’s choice is strictly personal, and in this you have full freedom. The browser that I take the liberty of recommending is Chrome especially for its inspector.
INSTALLATION OF VISUAL STUDIO CODE FOR THOSE WHO INTEND TO USE IT
This is the link to download Visual Studio Code. Go to this address with your browser and download the version for your Operating System. Once the installation is done, I suggest you integrate the extensions that I report in the figures below.
Once these three extensions are installed, we have the auto-completion of the code. You will see that with emmet you can do much more. At this point create a folder on your hard drive that you will use for these articles, then create a subfolder and name it Introduction. Import the subfolder into visual studio code. Create a new html file called Introduction.html using code auto-completion. To do this, just start writing html and the intellisense will appear immediately afterwards. You have several options, choose HTML5.
HTML
HTML is the acronym for Hyper Text Markup Language. It is not a programming language, and therefore does not have the logical constructs of programming. It is a Markup Language for Hypertext, the standard used for the creation of Web Pages. It allows us to indicate to the Browser which elements to show and how to arrange them on Web Pages through the use of <tag>. For example, we can define titles and subtitles, paragraphs and tables, create links between pages and insert images. Developed by Tim Berners-Lee at CERN in Geneva. The current version is HTML5.
STRUCTURE OF AN HTML PAGE
LET’S ANALYZE THE SKELETON OF AN HTML5 DOCUMENT
- <! DOCTYPE html> defines to the Browser that this is an HTML5 document
- <html> It is the root element of an HTML page
- <head> It is the element that contains meta information on the HTML page. Its content is not visible.
- <title> The element specifies a title for the HTML page (which is shown in the browser title bar or in the page tab)
- <body> The element defines the body of the document and is a container for all visible content, such as headings, paragraphs, images, hyperlinks, tables, lists, etc.
- <h1> The element defines a large header
- <p> The element defines a paragraph
DOCUMENT STRUCTURE
Here is the structure of the newly created document.
THE WEB BROWSER
The purpose of a web browser (Chrome, Edge, Firefox, Safari) is to read HTML documents and display them correctly. A browser does not display HTML tags, but uses them to determine how to display the document: To view the document in the Web Browser, right click on the document and select “Open In Default Browser”. You have just opened your first HTML document.
USEFUL LINKS
Here are some in-depth links that will be fundamental in subsequent posts:
Leave A Comment