Related Post
Hyper Text Markup Language – HTML
HTML, or HyperText Markup Language, is the fundamental building block for creating webpages and presenting content on the World Wide Web. It is a markup language that structures a webpage’s layout, text, images, and multimedia elements. HTML allows web browsers to interpret and render the content on the screen for the end-user.
HTML generally works in conjunction with other languages and technologies, such as CSS (Cascading Style Sheets) and JavaScript, to make the web page’s display and functioning all work as intended.
CSS is a stylesheet language that defines the visual appearance of HTML elements, including colors, fonts, and layout.
JavaScript is a scripting language that enables interactivity, dynamic content, and client-side processing in web pages.
On This Page
Brief History
Tim Berners-Lee, a British computer scientist, created HTML in 1991. The first version, HTML 1.0, laid the groundwork for basic formatting and linking capabilities.
After HTML 1, HTML 2.0 introduced more elements and attributes, such as forms and tables. HTML 3.2 expanded support for multimedia elements, and HTML 4.01 streamlined the language to encourage using CSS for styling.
HTML5 was developed by the World Wide Web Consortium (W3C) and the Web Hypertext Application Technology Working Group (WHATWG), with the first stable version released in October 2014. HTML5 brought features and enhancements to support better page structure information, multimedia, interactivity, and accessibility for users with disabilities.
HTML Document Setup
An HTML document begins with the document type declaration, <!DOCTYPE html> tells the web browser it’s an HTML5 document.
The core structure of an HTML document includes the <html>, <head>, and <body> tags.
The <html> tag is the root element of a webpage, encapsulating all other tags.
The <head> tag contains meta-information about the webpage, such as the title and character encoding.
Finally, the <body> tag includes the webpage’s main content, such as text, images, and multimedia elements.
Structure of a Web Page
HTML uses a series of nested tags and elements to describe the structure and content of a webpage. These tags are enclosed in angle brackets (< >) and often come in pairs, consisting of an opening tag and a closing tag with a forward slash (/). These paired tags enclose the content of the webpage.
Some tags, such as the image tag (<img>), are self-closing and don’t require a separate closing tag.
Key HTML tags and elements include:
- Headings (<h1> to <h6>) to create headings in descending order of importance, with <h1> being the most important and <h6> being the least.
- Paragraphs (<p>) define a text block as a paragraph.
- Links (<a>) to create hyperlinks to other webpages or resources, with the href attribute specifying the destination URL.
- Images (<img>) to embed images into the webpage, with the src attribute specifying the image source file.
- Lists (<ul>, <ol>, and <li>) to create unordered (bulleted) or ordered (numbered) lists, with the <li> tag denoting each list item.
- Tables (<table>, <tr>, <td>, and <th>) to create tables with rows (<tr>) and cells (<td> for data cells, <th> for header cells).
- Forms (<form>, <input>, <textarea>, and <button>) to create interactive forms for user input, such as text fields, checkboxes, radio buttons, and buttons for submission.
- Semantic elements (<header>, <nav>, <article>, <section>, <aside>, <footer>) to provide more meaningful structure and improve the overall accessibility and search engine optimization (SEO) of a webpage.
Conclusion
HTML5 represents a substantial step forward for web technologies, addressing the needs of modern web applications, multimedia, and mobile devices.
With HTML5, web developers can create richer, more interactive, and accessible web experiences while ensuring cross-browser compatibility and improved performance.
HTML in 5 minutes – 5 mins
