When we browse the Internet, we move from one web page to another, pulling up a myriad of types of information and using various services. It’s like consulting an immense virtual library where each book can be compared to an interconnected web page with other pages on the network.
A web page is a digital document containing information of various kinds that can be accessed by an end user. But how is it possible to create documents like this?
At the base of every web page is the HTML language. Born in the late 80s, it is the acronym for HyperText Markup Language. HTML is a language through which we can semantically specify which elements we want to display within a web page and how to arrange them. Through this language, we can create rich user experiences with text, including the following:
Each web page follows a well-defined structure, and each individual part that makes it up has a specific meaning: Titles, paragraphs, lists, tables, and words in bold or emphasis are specified through appropriate tags or labels, the HTML markers that give instructions to the brower on how to format and display the content of the tags themselves.
A simple example:
<p> Hello LPI! </p>
This way, we define a paragraph that will be displayed on the browser. The corresponding tag that tells the browser to create a paragraph element is “p,” and in this case, “<p>” is the opening tag, while “</p>” is the closing tag. The tags will not be visible to the web site’s visitor, but the “Hello LPI!” text contained between the opening and closing tags will be shown on the screen.
Don’t worry! At first, writing in HTML may seem a bit strange. Still, as you become familiar with this language, it will feel natural, as if you were writing simple text. As with everything, you just have to practice a lot!
In your learning path for the Web Development Essentials certificate from the Linux Professional Institute (LPI) , you will learn how to create and format web pages by understanding the main tags that define the essential elements in a document, their semantic meaning, and their main attributes that are helpful in specifying the details of the element to which they refer.
Learning the HTML language is often considered the first step toward the world of web programming. To write HTML pages, you do not need complex tools; you simply need a common text editor such as the classic Notepad (vim or Kate if you want to stay FOSS).
Some tools that can help you are:
To start, I suggest you use a basic text editor on your computer: this way, you can become familiar with the main tags and their attributes, consolidating your knowledge as much as possible. Once familiar with the HTML language, you can use a text editor like the ones just mentioned and explore its functionalities. Discovering such an editor’s features can be very interesting for your learning path.
You have surely heard of Microsoft’s Visual Studio or Apple’s Xcode, just to name two of the most popular IDEs in circulation. Again, you have plenty of FOSS alternatives: Eclipse, MonoDevelop, or Apache NetBeans, to name a few.
There are also more sophisticated and complete development environments that you will undoubtedly encounter once you enter the world of work. They are called integrated desktop environments (IDEs) and are designed to make developers’ lives easier so that they can work more efficiently, supported by a single program. An integrated development environment provides programmers with a text editor and other more or less sophisticated tools that cover the entire software development process: Code creation and automation, intelligent completion, compilation, testing, and debugging are some of the features offered by an IDE that will allow you to improve your productivity and become a more efficient programmer.
As shown in Figure 1, the functionality of a code editor is a subset of the functionality of an IDE.