Before we begin the projects, you will need some knowledge to guide you through so that the codes provided do not confuse you or make you unfamiliar. Read them through once and come back again in case you missed something.
What is HTML?
HTML stands for Hyper Test Markup languages. Markup languages are designed for
the processing, definition and presentation of text. The language specifies
code for formatting, both the layout and style, within a text file. The code
used to specify the formatting are called tags. HTML is a an example of a
widely known and used markup language.
the processing, definition and presentation of text. The language specifies
code for formatting, both the layout and style, within a text file. The code
used to specify the formatting are called tags. HTML is a an example of a
widely known and used markup language.
Basic structure of a HTML Document
1. Download this HTML file: Introduction To HTML 1
2. Open the HTML file with notepad instead of your normal browser, by right clicking it and selecting notepad. Now, open the same HTML file in your browser. There you have your first webpage.
3. HTML elements or tags
For eg. <html>, <head>, <title>, <body>, <p>, <h1> describes different document content. They have an opening tag like <p> and closing tag like </p> . Sometimes they do not need a closing tag like<br>.
A HTML element has attributes and values. Values are enclosed under double quotes. For eg. consider the html tag: <p align="center">. Here align is the attribute and center is the value. Values are enclosed under either " " or ' '.
Also note that HTML tags are not case sensitive. so and works the same way. But this is not so in html5. So, better stick with lower case letters.
A HTML element has attributes and values. Values are enclosed under double quotes. For eg. consider the html tag: <p align="center">. Here align is the attribute and center is the value. Values are enclosed under either " " or ' '.
Also note that HTML tags are not case sensitive. so and works the same way. But this is not so in html5. So, better stick with lower case letters.
4. Some HTML Tags or Elements
- <html> : describes the HTML document.
- <head> : provides information about the document
- <title> : see the title above the address bar in your browser. that is the title assigned by this.
- <body> : all the things you see in a webpage are inside this.
- <p> : assigns a new paragraph.
- <h1> : HTML heading. They are used by search engines for search optimization.
It ranges from h1 to h6. Texts are bold and enlarged inside these tags. - <a> :
links are defined using this tag. For eg: <a href="http://www.twowiz.com">Twowiz.com</a>. Copy this code and paste in inside <body> and check how it works. - <img> : images displayed in a browser as done using this tag.
For eg. <img src="http://www.twowiz.com/image.jpg"
alt="twowiz" height="100" width="100">
4. Writing a HTML document using notepad.
- open Notepad
- write the HTML code
- save it as "all files" instead of "txt" with '.html' at the end of the file name.
- now you can click on the saved file and open it using your browser or notepad.
5. HTML Attributes.
HTML attributes provide special meanings to HTML elements/tags. For example, assigning the text color of the paragraph inside the <p> tag. They are important in search engine optimization. In the later part of your life when you start making money using ads in your website, you will start optimizing your website for better search optimization for better views/visits. Since, a search engine is not a human being it uses attributes etc. to find information, index pages, etc.
ONLINE TOOL
Instead of notepad or other text editors, you can use w3schools' online text editor and webpage tool.
Check this link out: Tool. I suggest you use this tool instead for now to make learning easier.
No comments:
Post a Comment