.png)
Web Designing Tutorial Series-2
- Doctype Declaration
- HTML Basic.
- HTML Page Structure.
- Head Section.
- Body Section.
HTML Declaration
HTML5 declaration:-
 |
| HTML5 Doctype Declaration |
The <!DOCTYPE> declaration must be the very first thing in your HTML document, before the tag.
The <!DOCTYPE> declaration is not an HTML tag; it is an instruction to the web browser about what version of HTML the page is written in.
In HTML 4.01, the <!DOCTYPE> declaration refers to a DTD, because HTML 4.01 was based on SGML. The DTD specifies the rules for the markup language, so that the browsers render the content correctly.
HTML5 is not based on SGML, and therefore does not require a reference to a DTD.
For HTML4 user:-
 |
| Description of HTML4.01 Doctype |
HTML BASIC
ELEMENTS
An HTML element is an individual component of an HTML document or web page, once this has been parsed into the Document Object Model. HTML is composed of a tree of HTML elements and other nodes, such as text nodes. Each element can have HTML attributes specified. Elements can also have content, including other elements and text. Many HTML elements represent semantics, or meaning. For example, the title element represents the title of the document.In the HTML syntax, most elements are written with a start tag and an end tag, with the content in between. An HTML tag is composed of the name of the element, surrounded by angle brackets. An end tag also has a slash after the opening angle bracket, to distinguish it from the start tag. For example, a paragraph, which is represented by the p element, would be written as
<p>In the HTML syntax, most elements are written ...<p>
For more information on HTML Elements ,Read Here(coming Soon).
ATTRIBUTES
We have seen few HTML tags and their usage like heading tags <h1>, <h2>, paragraph tag <p> and other tags. We used them so far in their simplest form, but most of the HTML tags can also have attributes, which are extra bits of information.An attribute is used to define the characteristics of an HTML element and is placed inside the element's opening tag. All attributes are made up of two parts: a name and a value:
- The name is the property you want to set. For example, the paragraph <p> element in the example carries an attribute whose name is align, which you can use to indicate the alignment of paragraph on the page.
- The value is what you want the value of the property to be set and always put within quotations. The below example shows three possible values of align attribute: left, center and right.
| Attribute | Options | Function |
|---|---|---|
| align | right, left, center | Horizontally aligns tags |
| valign | top, middle, bottom | Vertically aligns tags within an HTML element. |
| bgcolor | numeric, hexidecimal, RGB values | Places a background color behind an element |
| background | URL | Places a background image behind an element |
| id | User Defined | Names an element for use with Cascading Style Sheets. |
| class | User Defined | Classifies an element for use with Cascading Style Sheets. |
| width | Numeric Value | Specifies the width of tables, images, or table cells. |
| height | Numeric Value | Specifies the height of tables, images, or table cells. |
| title | User Defined | "Pop-up" title of the elements. |
 |
| Element, Attribute and Tags |
HTML Page Structure
Below is a visualization of an HTML page structure: |
| Page Structure |
HEAD SECTION
The head section of the webpage includes all the stuff that does not show directly on the resulting page.The
Right now it should say something like "Basics - Html Tutorial" on top of the window containing this text.
Another thing you will often see in the head section is metatags. Metatags are used for, among other things, to improve the rankings in search engines.
Quite often the head section contains javascript which is a programming language for more complex HTML pages.
Finally, more and more pages contain codes for cascading style sheets (CSS).
CSS is a rather new technique for optimizing the layout of major websites.
Since these aspects are way out of reach at this stage we will proceed with explaining the body section.
BODY SECTION
The body of the document contains all that can be seen when the user loads the page.In the rest of this tutorial you can learn in detail about all the different aspects of HTML, including:
- Text
- Formatting
- Resizing
- Layout
- Listing
- Links
- To local pages
- To pages at other sites
- To bookmarks
- Images
- Inserting images (GIF and jpg)
- Adding a link to an image
- Backgrounds
- Colors
- Images
- Fixed Image
- Tables
- Frames
- Forms
- Metatags
- Hexadecimal Colors
Thanks for Reading.
