# HTML

![ARPANET - Genesis of Internet](https://3903980405-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M_kux1uuaXhHbpyCSYu%2F-MbeBOhRV8U4UvA5zh4u%2F-MbeBShKjiy307dG_ZP_%2Fimage.png?alt=media\&token=f9ca176c-e23a-4950-bd9d-5e47c5cc4686)

### Web Browser

&#x20;A web browser, or simply "browser," is an application used to access and view websites. Common web browsers include Microsoft Internet Explorer, Google Chrome, Mozilla Firefox, and Apple Safari. The primary function of a web browser is to render HTML, the code used to design or "mark up" webpages.

![Illustration on how a Website works!](https://3903980405-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M_kux1uuaXhHbpyCSYu%2F-M_uDV-gp559t0gbigjR%2F-M_vB-Uzz8bCMzbOOsSM%2Fimage.png?alt=media\&token=3d4f2d7c-b354-4023-90d0-a3ae1ad0dc86)

When a user launches a Universal Resource Locator (URL) on a browser, it hits the respective domain web server and launches the web pages which are required by the user. The below image illustrates the workflow of the launch of the website.

![](https://3903980405-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M_kux1uuaXhHbpyCSYu%2F-MbSL4790IAzUp03Y1-7%2F-MbSLGMM4vcAFBbiJ1Tu%2Fimage.png?alt=media\&token=640e49e5-7924-4207-bee6-ae52b97cee6d)

### HTML - HyperText Markup Language

* HyperText Markup Language -lingua franca for publishing hypertext
* A simple text format to create web pages&#x20;
* Specify structure, presentation and content of a web page
* Define tags \<html> \<head> \<body> ....etc
* Allow to embed other scripting languages to manipulate design layout, text and graphics
* Platform independent
* No special software required. They are by default part of Internet browser application like Chrome, IE, Safari, Mozilla FireFox
* The below image illustrates how a basic HTML code is reflected on a browser page

![Image illustrates a basic HTML code on a browser](https://3903980405-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M_kux1uuaXhHbpyCSYu%2F-MbSM5wcjqejiKn6V2YK%2F-MbSMFy7p92-vKzfGaPr%2Fimage.png?alt=media\&token=066e08e4-e809-4c8e-a6c0-d5eff9d4d589)

* Consider headers carefully, it helps to identify your page
* The title of a Web page determines its ranking in certain search engines
* The title will also appear on Favorite lists, History lists, and Bookmark lists to identify your page
* HTML Contents include paragraph, headings, hyperlinks, images, media, lists, tables, form
* HTML Tags are considered as markup to specify the structure and style
* An opening tag and closing tag, Sometimes no closing tag Can have the attributes to specify extra info&#x20;
* HTML Validator: [http://validator.w3.org](http://validator.w3.xn--orgchecks-2d0e)
* Checks your HTML page for errors
* Like a compiler checks for errors in your program•Always write valid HTML pages even if the wrong HTML page “works”.

![Basic Strcuture of an HTML file](https://3903980405-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M_kux1uuaXhHbpyCSYu%2F-MbSM5wcjqejiKn6V2YK%2F-MbSMPb7dOrxwaatLo2J%2Fimage.png?alt=media\&token=71a1ab54-8457-460b-90c1-dcf4e8725942)

### Managing Headings and Text in HTML

![Heading tags with degree of change in their size](https://3903980405-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M_kux1uuaXhHbpyCSYu%2F-MbSN5sIjimNSHNy4cs5%2F-MbSNEgQynbocgiMx23T%2Fimage.png?alt=media\&token=da59484c-82ca-42a0-a0fd-a3e8917ea77d)

![Text formating in HTML](https://3903980405-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M_kux1uuaXhHbpyCSYu%2F-MbSN5sIjimNSHNy4cs5%2F-MbSNNR2oo52YvRQw_Xi%2Fimage.png?alt=media\&token=d1413df4-7551-4aac-a679-77758dba0ba1)

### Lists in HTML (Ordered and Unordered)

![Unordered List in HTML](https://3903980405-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M_kux1uuaXhHbpyCSYu%2F-MbSN5sIjimNSHNy4cs5%2F-MbSNU8_6SRm8_loUjsS%2Fimage.png?alt=media\&token=7f30e411-dce4-44ec-a93e-81c9dbe67eb6)

![Ordered List in HTML](https://3903980405-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M_kux1uuaXhHbpyCSYu%2F-MbSN5sIjimNSHNy4cs5%2F-MbSN_B4OIe94UMH2iyn%2Fimage.png?alt=media\&token=761108de-e4a6-4228-a0b9-43bfc0d369c1)

### Hyperlinks in HTML

![Hyperlink to URL re-direction](https://3903980405-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M_kux1uuaXhHbpyCSYu%2F-MbUtn91mDCfHKKCMuAD%2F-MbV8RCWZG6DQFdL-79G%2Fimage.png?alt=media\&token=3e62bc4f-7d34-4277-a5ec-969d02f1b825)

### Images in HTML

![Image tag in HTML](https://3903980405-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M_kux1uuaXhHbpyCSYu%2F-MbUtn91mDCfHKKCMuAD%2F-MbV8XZO0DbH-3zNaw0x%2Fimage.png?alt=media\&token=e48744ed-2a07-4300-b5fd-10d775b39f6d)

### Tables in HTML

![Table in HTML](https://3903980405-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M_kux1uuaXhHbpyCSYu%2F-MbUtn91mDCfHKKCMuAD%2F-MbV8dnSta_cRCKcS2tg%2Fimage.png?alt=media\&token=3ceb9866-5182-400e-aa42-140f12af7a14)

![Tables in HTML in detail](https://3903980405-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M_kux1uuaXhHbpyCSYu%2F-MbUtn91mDCfHKKCMuAD%2F-MbV8jQR2ahmuUC9PrFc%2Fimage.png?alt=media\&token=a8c04ed3-87b8-4039-9721-f282333d7265)

### Additional Resources

1. Complete list of HTML tags - <https://html.com/tags/>
2. End to End HTML Guide by Mozilla Foundation - <https://developer.mozilla.org/en-US/docs/Web/HTML>
3. Use below attached Sample File to understand the above examples

{% file src="<https://3903980405-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M_kux1uuaXhHbpyCSYu%2F-MbUtn91mDCfHKKCMuAD%2F-MbV9TI8acy7lqej3wAN%2FHTML_SampleFile.zip?alt=media&token=0b089809-7900-4beb-ab93-e25d4ac38d95>" %}
SampleFile\_forHTML
{% endfile %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://serciiit.gitbook.io/introduction-to-software-systems/web-technologies/html.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
