Download to read offline
Grade 7_HTML.pptx
- 1.
- 2. What is HMTL? •Hypertext is the method by which Internet users navigate the web. The use of hyper means it is not linear, so users can go anywhere on the Internet simply by clicking on the available links. • Markup is what HTML tags do to the text inside of them; they mark it as a specific type of text. Hypertext Markup Language it has two components:
- 3. Advantages of HTML 1.HTML is Easy to Learn and Use 2. HTML is Free 3. HTML supports almost all browsers around the globe. 4. HTML is one of the friendliest search engines in comparison to all the programming languages available in the market 5. HTML is very easy to edit as there is no need to have a special interface or platform to edit it. 6. HTML can be easily integrated with multiple languages and does not create any issues in it.
- 4. 7. HTML islightweight language. It has a high signal to noise ratio as compared to other forms of communication. It is also faster to download HTML code, which means it is highly compressive also. 8. HTML is Basic of all Programming Languages. 9. One of the biggest advantages of HTML is that one can see the changes instantly just by saving it and reload the previous HTML page. 10. HTML is a user-friendly programming language. One does not need to have any prior knowledge of any language. Understanding simple English is sufficient to work with it.
- 5. Basic terms Usedin HTML Tags - An HTML tag is a special word or letter surrounded by angle brackets, < and >. You use tags to create HTML elements. Attributes - Attributes define additional characteristics or properties of the element such as width and height of an image. Attributes are always specified in the start tag (or opening tag) and usually consists of name/value pairs like name="value" . Attribute values should always be enclosed in quotation marks. Elements - The <html> element is the root element, and it defines the whole HTML document. It has a start tag <html> and an end tag </html> . The <body> element defines the document's body. Two types of element: container element and empty element
- 6. HTML Editor An HTMLeditor is a software for editing and creating HTML code that is used for websites or other web documents. Examples: WYSIWYG editors and Text editor
- 7. Textual HTML Editor These are text-basededitors where the developers can write their codes and compile them. The code appears in the same manner we write it, thus it requires basic knowledge of HTML. Some of these editors also provide features of making a project, managing all the files related to the web, etc. Examples of HTML Text editors include-Notepad++, VSCode,Sublime Text.
- 8. WYSIWYG editor • Whatyou see is what you get’ is its full form. WYSIWYG are editors that provide the preview of the output of the source code i.e. as it would appear on a browser. There is a drag and drop feature available in most of them that eases the handling. It does not require any hardcore knowledge of HTML, thus enabling non-technicals to easily develop websites. Examples include- Adobe Dreamweaver, Amaya, BlueGriffon, etc.
- 9. Creating and savingHtml document Step 4 View the HTML Page in Your Browser Step 3 Save the HTML Page Step 2 Write Some HTML Step 1 Open TextEdit
- 10. Structure of anHTML document • HTML: marks the beginning and end of each HTML document. • Syntax: <HTML></HTML> • HEAD: specifies the header information about the HTML document such as title, keywords, etc. • Syntax:<HEAD></HEAD> • TITLE: provides a title to a web page. • Syntax: <TITLE></TITLE> • BODY: provides content to your web page. • Syntax: <BODY></BODY>
- 11. Recap How should we writethe HTML tag? Ans: <HTML> Which HTML element provides content to your web page? Ans: Body Element What are the four major elements of an HTML document? Ans: HTML, HEAD, TITLE and BODY Is the <BODY>tag placed immediately after the closing tag </HEAD>? Ans: Yes
- 12. HW – answerin green notebook Discuss the two major components of HTML. 1 Differentiate between container and empty elements. 2 Explain the terms ‘tag’, ‘attribute’ and ‘element’. 3
- 13. Practical Activity – Structure ofan HTML document Example code: <HTML> <HEAD> <TITLE>SAVE ENVIRONMENT</TITLE> </HEAD> <BODY> Going green is easier than you think. There are little things you can do every- day to help reduce greenhouse gases and make a less harmful impact on the environment. </BODY> </HTML> Note: Saves the document with the name ‘First.html’ and then shows it in the web browser. Copy both the files and attach it as an assignment in MS Teams.
- 14.