1. INTRODUCTION TO HTML:
The modern era is the era of the evolution of the communication and transmission technologies. Internet is emerging as the major communication tool for exchanging the thought, knowledge and the feelings of the Internet users. Internet opens the doors of the world of the knowledge and the emerging technologies. The internet uses the WEB SITE, or the WORLD WIDE WEB for the information exchange.
The World Wide Web is built of Web pages, and those pages are themselves created with HyperText Markup Language, or HTML. Though many folks talk about HTML Programming with a capital P (particularly recruiters), HTML is really not a programming language at all. HTML is exactly what it claims to be: a markup language. You use HTML to mark up a text document, just as you would if you were an editor using a red pencil. The marks you use indicate which format (or style) should be used when displaying the marked text.
The HTML stands for “HyperText Markup Language”. It is the collection of the platform independent styles that defines the various components of the www documents. HTML was invented by the TIM-BERNER-LEE. With the help of HTML and www, we have the ability to bring together text, graphics, picture, songs and links at one place or in a single page. HTML files are plain text files. So they can be composed and edited on any type of the computer. To publish the information for the global access or distribution, one needs a universally accepted and understood language that all the computers may potentially understand.
HTML gives the information to publish online documentation with heading text, labels, lists, photos etc. To retrieve the online information we can use the hypertext links.
Structure Of HTML Documents:
HTML documents are essentially plain text files. They contain no image, no song, no video and no animation. How they can include “pointer” or “links” to these to other file types .HTML itself is a system of codes made up of tags and attributes that serves to identify parts and the characteristics of the HTML document. HTML tags identify logical document parts that is the major structural components are the parts of the HTML document such that headings, lists and paragraphs. The tags and browsers work together to identify the document parts and tell the browser how to display them?
The structure of a HTML document includes the following parts:
| HTML…../HTML | The opening and closing statement of the HTML syntax. |
| HEAD…../HEAD | This tag contains all the document header information. |
| TITLE…../TITLE | This container is placed within the HEAD Structure between title tag we must have the title of the document. This will appear as the top of browser title bar. |
| BODY…../BODY | Body comes after the HEAD structure. Between the body tags we find all of the staff that gets displayed in the browser window. All the text graphics and link are used in the body tag. |
2. A SIMPLE WEB PAGE:
Introduction To A Web page:
The HTML pages are the standard interface to the Internet. These pages are in turn are collection of the various tags. These tags enable the web page to perform the required task. A simple web- page is shown as follows. It contains the tag which tells the start of the web page,tag is the next one which inform the heading of the page to the interpreter,
Welcome to the World of HTML
HTML documents can be as simple as this Web page, which consists of just a single page of text and links, or as complex as a 10,000 page corporate intranet site replete with Java applets and CGI database access.
Output Of The Web page:
3. DESIGN A WEB PAGE USING HEADINGS, PARAGRAPH & BREAK TAGS:
Headings:
Headings are used in HTML documents to indicate different sections. There are six different Heading sizes, which range from very large to very small (smaller than the default body text). You should use headings judiciously, keeping them short and concise. The most common use for a heading is as the first line of a home page. In essence, it becomes a headline for your document. It is represented by ,
tags.……..
tags in HTML document. These are closed by respective
Paragraph:
One of the most commonly used tags in HTML is the paragraph marker, which is used to break apart blocks of text into separate paragraphs. Any formatting that you perform in Notepad, such as placing carriage returns, extra spaces, or tab stops, will be ignored by Web browsers. The only way to indicate separate paragraphs is by using the paragraph marker. Unfortunately, despite its simplicity, the paragraph marker is also one of the most misunderstood tags in HTML. The paragraph tag is represented by the tag in the HTML document and is closed by the
Line Breaks:
The line break tag is used to break the line in the paragraph. It is represented by the tag. This tag does not have any opening tag.
Designing The Web Page With Heading, Paragraph & Break Tags:
Union Generals of the American Civil War
This listing contains the names of the general officers of the Regular Army and of the Volunteer Army, as well as the date of their appointment to the rank.
In all cases only the full rank is given. Many officers had a rank that was often one or two ranks higher than the full rank.
Remember also, that it was possible for an officer to have rank in a state militia, the Volunteer Army, and the Regular Army; all at the same time.
With brevet ranks taken into account, it was possible for an individual to have as many as six ranks simultaneously, depending upon who he was dealing with.
Output Of The Web page:
DESIGN A WEB PAGE USING TEXT ALIGNMENT:
Aligning The Text In A Web Page:
Some HTML tags allow us to specify the alignment of the text in the HTML document. Using these tags the paragraphs can be justified according to the need i.e. left, right, or centrally aligned text. In HTML there are three tags that are used to justify the documents. These tags are align ‘left’, align ‘right’, or align ‘center’. These tags are used with the paragraph tag and they need not too be closed as they are applied only on the text written within the paragraph.
Designing An Aligned Text Web Page:
TEXT ALIGNMENT
This is the left aligned text.
This is the right aligned text.
This is the centrally aligned text.
Output Of The Web Page:
5. DESIGN A WEB PAGE WITH FORMATTED TEXT & FONT CONTROL:
Introduction:
The text formatting helps us to give a specific look to our document and to make it more attractive and more users friendly. The text formatting in the HTML includes the following tags:-
...
This tag is used to show the text in the Boldface i.e. this tag shows the text as bolded.
This tag is used to set the font as the base font.
...
This tag is used to show the text larger.
…
This tag is used to show the text smaller.
...
This tag is used to show the text in the italic format.
…
This tag is used to underline the text.
…
This tag is used to change the font of the text. This tag also includes the sub-tags to change the font according to our need. These sub-tags include fontsize, fontcolor, fontface etc.
This tag is used to show the Superscript small.
This tag is used to show the subscript small.
This tag shows the Monospaced small type-Writer font.
Designing The Web Page With Formatted Text :
the Script
a text test
I typed a superscript
of small union strike rhymes
so my
preformatted
w o r d s
subpicketlines
Output Of The Web Page:
Designing The Web Page With Formatted Text And Font Control:
A History Of
Everything
It starts with a bang
Then everything inflates like a super balloon tied up
with super stringd until the whole mess curldes into
millons of milky ways staright hits the
volcannic rocks and cooks upsome tasty double helix
treats.They get eaten by each other , the fiitest {and
least tasty} servive .a meteor kills the
big ones and when it all freezes over the growing grass.
The End
Output Of The Web Page:
Design A Web Page With Special Characters:
Q:What should you do when a British Banker picks a fight with you?
A:£some¢¢into him.
Q:What do you call it when a Judge tales part of a law off the books ?
A:§violence.
Q: What did the football coach gat from the locker room vending a
machine in the middle of the game?
A:A&frack14;back at &frack12;time.
Q:How hot did it when the police detective interrogated the mathmatician?
A:x³°
Q:What does a punctilious plagrist do?
A:©
Output Of The Web Page:
6. DESIGN A WEB PAGE WITH LINKING:
Linking To Other Web Pages:
Hypertext is a term we frequently hear associated with the Web. A hypertext document is a document that contains links to other documents, allowing us to jump between them by clicking the links.
Ø Understanding Links:
A link really has two different parts. First, there's the part we see on the Web page called an anchor. There's also the part--the URL reference--that tells the browser what to do if you click that link. When you click a link's anchor, the browser loads the file or document given by the link's corresponding URL reference. It executed by the linking tag i.e.
- Designing Linked Web Page:
- File-1 Using the Link (Main Page):
History Quiz
Complete the following Sentences:-
1. Columbus Sailed the oecan blue in ...... .
2.the Spanish Armeda mt its fate in ......... .
3.
4.Tricky Dickie served his time in .......... .
5.Billy C. went on a spree in .......... .
o File- 2 To be Linked (Linking Page):
History Quiz Answers
.......... 1492.
.......... 1588.
.......... 1666.
.......... 1969.
.......... 1993.
Output Of Main Page:
Output Of Linking Page:
Linking To A Specific Part Of The Web Page:
The HTML provides us the facility of linking the web page to the specific part of the other page. This technique is used in indexes and where we have transfer between the pages instant shifting is required and we do not want to read whole of the document. This type of linking can be shown as follows:
Ø Designing The Web Page Linked Specifically To Other:
German Philospher's club
e mail directory
Emmanuel Kant President
manny@netletter.com
Output Of The Web Page:
When we click on the e-mail address given in the html document, the OUTLOOK Express of open the e-mail compose window, where the we compose the message.
7. DESIGN A WEB PAGE USING LISTS:
Using Lists In The HTML:
The HTML provides us the facility of list in the web page. The listing provides selective opportunity.
There are three basic types of HTML lists. These are:
The numbered list at the top is called an ordered list. It begins with the tag and ends with a closing tag. Numbers and line breaks appear automatically at each tag, and the entire list is indented.
The bulleted list is called an unordered list. It opens with the tag and closes with . It looks just like an ordered list, except that bullets appear at each tag instead of numbers.
The list of terms and their meanings is called a definition list. It starts with the tag and ends with . The tag goes in front of each term to be defined, with a tag in front of each definition. Line breaks and indentation appear automatically.
Designing A Web Page Using An Ordered List:
Output Of An Ordered List:
Designing A Web Page Using An Un-ordered List:
LI>two satellites
Output Of An Un-Ordered List:
Designing A Web Page Using The Definition List:
having a sidereal period of revolution about the sun of 88.0
days at a mean distance of 58.3 million kilometers (36.2
million miles) and a mean radius of approximately 2,414
kilometers (1,500 miles).
of 6,052 kilometers (3,760 miles), a mass 0.815 times that of
Earth, and a sidereal period of revolution about the sun of
224.7 days at a mean distance of approximately 100.1 million
kilometers (67.2 million miles).
of revolution about the sun of 365.26 days at a mean distance
of approximately 149 million kilometers (92.96 million miles),
an axial rotation period of 23 hours 56.07 minutes, an average
radios of 6,374 kilometers (3,959 miles), and a mass of
approximately 29.11 x 10^24 kilograms (13.17 x 10^24 pounds).
Output Of The Definition List:
8. DESIGNING THE FORMS:
Form Designing In HTML:
HTML provides us the facility to interact with the HTML documents. The basic construction of a html form is this...
begin a form
ask for information in one of several different ways...
...there can be as many input areas as you wish
end a form
Design HTML Form In A Web Page:
Registration Form
E-mail ID :
Password :
Name :
Address :
Occupation :
Hobbies :
Music
Games
Shopping
Computers
How did you get our site? :
Search Engine
Reference in a Book
Other
Output Of HTML Form:
. DESIGN A WEB PAGE USING FRAMES:
Frame Designing In HTML:
Dividing a page into frames is actually quite simple. The basic concept goes like this: Each frame is a regular, complete html document. If you wanted to divide your page into 2 side-by-side frames, then you would put one complete html document in the left frame and another complete html document in the right frame. In addition you need to write a third html document. This MASTER PAGE (I'm coining a new phrase here folks) contains the tags that specify what goes where. As a matter of fact, that's about its only function.
There are only two main frame tags to contend with: and . Frames are designed to use the multiple web pages as follows:
Designing Frames In A Web Page:
Output Of The Web Page:
The tag does all the dividing. That's all it does... divide up windows. It specifies a few things regarding how to divide them up, but remember, whenever you want to do some dividing - use .
If we specify dividing into ROWS instead of COLS we get something else entirely.
Let's go back down to 2 frames, divided equally into columns.
We can specify 50 pixels instead of 50%. And, we can use * instead of a number. The * means whatever is left over.
10. DESIGN A WEB PAGE USING TABLES:
Table Designing With HTML:
One of the most powerful tool for creative Web Page Design is the Table which allows us to arrange text and graphics into multiple columns and rows.
The basic HTML table tags are as follows:
These HTML tags are the containers for the rest of the table data.
Each row in the table is contained by these tags. You can optionally leave off the closing tag.
Defines a cell. Table data is contained within these tags. You can also nest additional tables within a single cell. You can optionally leave off the closing tag.
These table header tags are used to define headers, usually in the first row or column of the table. You can optionally leave off the closing tag.
Designing Table In A Web Page:
NAMEOF TRAIN PLACE DESTINATION ARRIVAL DEPARTURE FARE RAJDHANI EXPRESS 7:30 08:45 989.00 9:00 10:15 450.00 BANGLORE 11:30 12:25 450.00 KONKAN EXPRESS MANGLORE 13:30 14:45 645.00 DECCAN EXPRESS 13:30 14:45 756.00
Output Of The Web Page:
11. DESIGN A WEB PAGE USING GRAPHICS AND IMAGES:
HTML provides us the facility of adding graphics and backgrounds to the document. This tool helps us to make our documents more presentable and good looking.
Output Of The Web Page:
No comments:
Post a Comment