Basic HTML & It's Usage
Pranjal gupta
You may have listened about the term HTML, but what does HTML really mean? HTML is an acronym for Hyper Text Markup Language. Markup languages are different from programming languages. While programming languages are useful for modifying data, markup languages are used to determine how an element will appear on a web page.
HTML is a simple text based structure that even beginners can easily learn and understand. Here is an example:
<html>
<head>
<title>Web Page Title</title>
</head>
<body>
<h1>Hello World!</h1>
<p>Welcome to Remote State Blog :)</p>
</body>
</html>
How does HTML work?
HTML is usually kept in files that use the .htm or .html extension. A web page can consist of hundreds or even thousands of these HTML files which are stored in different folders. When you visit a website, The server sends its HTML files to your browser.
Then your browser reads the HTML code in the files and displays it. Some web applications do not use static HTML but generate it in response to specific actions on their servers. We may also add other types of content, such as CSS and JavaScript files, images and videos, to add more functionality to the site. CSS allows us to add stylistic elements (like colors) to a web page. JavaScript allows interaction. Together, these three languages form the foundation of web development.
What is HTML used for?
Now that you understand HTML tags and elements, and the updates introduced by HTML5, let's take a closer look at what you can do with this language.
Structure website: You can use tags and elements to define web page headings, paragraphs, and other content. The browser has a built-in style sheet that visually distinguishes these elements. The content enclosed in tags is in a large, bold font with its own lines. Text enclosed in tags will be bold and slightly smaller than the element. Without these tags, all the text on a web page looks the same.
Internet surfing Without HTML: Navigating the web would be much more difficult. Imagine you have to manually enter the URL of each web page you want to access. This is the reality without anchor tags. HTML anchor tags allow you to link pages using the href attribute. Here is an example:
<a href="https://www.google.com">Google</a>
As you can imagine, the code snippet above creates a hyperlink to Google. You can also use hyperlinks to link to specific sections of a web page.
Embed images and videos: You can not only embed an image in a web page, but also customize the width, height, position, and even rendering method of the image. Previously, developers used Flash to embed video in web pages. But, with HTML5's addition of tag it's no longer needed.
In addition to embedding video, you can use other HTML attributes to customize video controls, timestamps, thumbnails, autoplay, and more.
Improved client-side data storage and offline capabilities: HTML5 has also improved the language's offline capabilities. Websites use cookies to store information about you that you can retrieve when you visit the site again. Cookies are good for small data such as authentication tokens and usernames, but adding localStorage and IndexDB to HTML5 allows browsers to store more complex data.
In addition, the application cache and cache manifest files, which can be referenced from HTML, allow users to browse websites offline by storing data on their computers. This allows the web app to continue to work even if the user is disconnected.
Game development: You can't create a video game using HTML, but you can use the element to create a video game in your browser using CSS and JavaScript. Previously, this was only possible with Flash or Silverlight. But with modern HTML, you can create both 2D and 3D games that run in your browser.
Interaction with native API: Another feature of HTML is that it can interact with the operating system as well as the web browser. With these features, you can drag files to web pages to upload or view videos in full screen.
What profession is using HTML?
All aspiring web developers need to be proficient in HTML. Front-end engineers use HTML (along with other languages such as CSS and JavaScript) to develop the structure and layout of webpage and application. Similarly, mobile developers use these languages in frameworks such as Ionic and React Native to build mobile applications. Back end engineers should also be familiar with HTML.
Even if other languages in the tech stack generate HTML, you need to understand the HTML structure to do everything smoothly. Also, use HTML outside the Internet, such as intranets and internal applications. Therefore, even if you are programming for offline purposes, you still need to learn HTML. Some marketers use it for blogging and email, which can be beneficial to non-technical teams as well.
Happy Learning!! :)
Subscribe to my newsletter
Read articles from Pranjal gupta directly inside your inbox. Subscribe to the newsletter, and don't miss out.
Written by