+ All Categories
Home > Documents > Hyper Text Markup Language Developing & Hosting a Web page Lecture 21.

Hyper Text Markup Language Developing & Hosting a Web page Lecture 21.

Date post: 14-Dec-2015
Category:
Upload: aubrey-giles
View: 221 times
Download: 1 times
Share this document with a friend
Popular Tags:
34
Hyper Text Markup Language Developing & Hosting a Web page Lecture 21
Transcript

Hyper Text Markup Language

Developing & Hosting a Web page

Lecture 21

<HTML>

<HEAD><TITLE>Imran Ahmed Home Page</TITLE></HEAD>

<BODY>

<H1>Imran Ahmed</H1>

<P><B>Asst. Professor in Computer Science</B> <BR><A HREF="http://www.umt.edu.pk/">UMT</A> <BR>52 – L Gulberg III, Lahore <BR>+92 42 585 6605 <BR><A HREF="mailto:[email protected]">[email protected] </A> <BR></P>

<P>I teach the <A HREF="http:/sst.umt.edu.pk/cs101/">Introduction to Computing</A> course. </P>

</BODY>

</HTML>

HTML Code

<HTML>

<HEAD><TITLE>Imran Ahmed's Home Page</TITLE></HEAD>

<BODY>

<H1>Imran Ahmed</H1>

<P><B>Asst. Professor in Computer Science</B><BR><A HREF="http://www.umt.edu.pk/">UMT</A><BR>52 – L Gulberg III, Lahore<BR>+92 42 585 6605<BR><A HREF="mailto:[email protected]">[email protected]</A><BR></P>

<P>I teach the <A HREF="http:/sst.umt.edu.pk/cs101/">Introduction to Computing</A> course. </P>

</BODY>

</HTML>

The ones in yellow, i.e.<HTML>, </HTML>, <HEAD>,</HEAD>, <BODY>, </BODY>

are the six essential HTML tags,required in all Web pages

<HTML>

<HEAD><TITLE>Imran Ahmed's Home Page</TITLE></HEAD>

<BODY>

<H1>Imran Ahmed</H1>

<P><B>Asst. Professor in Computer Science</B><BR><A HREF="http://www.umt.edu.pk/">UMT</A><BR>52 – L Gulberg III, Lahore<BR>+92 42 585 6605<BR><A HREF="mailto:[email protected]">[email protected]</A><BR></P>

<P>I teach the <A HREF="http:/sst.umt.edu.pk/cs101/">Introduction to Computing</A> course. </P>

</BODY>

</HTML>

<HTML>

<HEAD><TITLE>Imran Ahmed's Home Page</TITLE></HEAD>

<BODY>

<H1>Imran Ahmed</H1>

<P><B>Asst. Professor in Computer Science</B><BR><A HREF="http://www.umt.edu.pk/">UMT</A><BR>52 – L Gulberg III, Lahore<BR>+92 42 585 6605<BR><A HREF="mailto:[email protected]">[email protected]</A><BR></P>

<P>I teach the <A HREF="http:/sst.umt.edu.pk/cs101/">Introduction to Computing</A> course. </P>

</BODY>

</HTML>

<HTML>

<HEAD><TITLE>Imran Ahmed's Home Page</TITLE></HEAD>

<BODY>

<H1>Imran Ahmed</H1>

<P><B>Asst. Professor in Computer Science</B><BR><A HREF="http://www.umt.edu.pk/">UMT</A><BR>52 – L Gulberg III, Lahore<BR>+92 42 585 6605<BR><A HREF="mailto:[email protected]">[email protected]</A><BR></P>

<P>I teach the <A HREF="http:/sst.umt.edu.pk/cs101/">Introduction to Computing</A> course. </P>

</BODY>

</HTML>

Link Label

Link Descriptio

n

<HTML>

<HEAD><TITLE>Imran Ahmed's Home Page</TITLE></HEAD>

<BODY>

<H1>Imran Ahmed</H1>

<P><B>Asst. Professor in Computer Science</B><BR><A HREF="http://www.umt.edu.pk/">UMT</A><BR>52 – L Gulberg, Lahore<BR>+92 42 585 6605<BR><A HREF="mailto:[email protected]">[email protected]</A><BR></P>

<P>I teach the <A HREF="http:/sst.umt.edu.pk/cs101/">Introduction to Computing</A> course. </P>

</BODY>

</HTML>

<HTML>

<HEAD><TITLE>Imran Ahmed's Home Page</TITLE></HEAD>

<BODY>

<H1>Imran Ahmed</H1>

<P><B>Asst. Professor in Computer Science</B><BR><A HREF="http://www.umt.edu.pk/">UMT</A><BR>52 – L Gulberg, Lahore<BR>+92 42 585 6605<BR><A HREF="mailto:[email protected]">[email protected]</A><BR></P>

<P>I teach the <A HREF="http:/sst.umt.edu.pk/cs101/">Introduction to Computing</A> course. </P>

</BODY>

</HTML>

<HTML>

<HEAD><TITLE>Imran Ahmed's Home Page</TITLE></HEAD>

<BODY>

<H1>Imran Ahmed</H1>

<P><B>Asst. Professor in Computer Science</B><BR><A HREF="http://www.umt.edu.pk/">UMT</A><BR>52 – L Gulberg, Lahore<BR>+92 42 585 6605<BR><A HREF="mailto:[email protected]">[email protected]</A><BR></P>

<P>I teach the <A HREF="http:/sst.umt.edu.pk/cs101/">Introduction to Computing</A> course. </P>

</BODY>

</HTML>

<HTML>

<HEAD><TITLE>Imran Ahmed's Home Page</TITLE></HEAD>

<BODY>

<H1>Imran Ahmed</H1>

<P><B>Asst. Professor in Computer Science</B><BR><A HREF="http://www.umt.edu.pk/">UMT</A><BR>52 – L Gulberg, Lahore<BR>+92 42 585 6605<BR><A HREF="mailto:[email protected]">[email protected]</A><BR></P>

<P>I teach the <A HREF="http:/sst.umt.edu.pk/cs101/">Introduction to Computing</A> course. </P>

</BODY>

</HTML>

This HTML document is developed in a plain-text editor called notepad

<HTML>

<HEAD><TITLE>Imran Ahmed Home Page</TITLE>

</HEAD><BODY>

<H1>Imran Ahmed</H1><P> <B> Asst.Professor in Computer Science </B> <BR>

<A HREF="http://www.umt.edu.pk/">UMT </A> <BR>52 – L Gulberg III, Lahore<BR>+92 42 585 6605 <BR><A

HREF="mailto:[email protected]">[email protected] </A><BR>

</P><P> I teach the <A HREF="http:/sst.umt.edu.pk/cs101/">Introduction to Computing </A>course. </P>

</BODY>

</HTML>

After typing the code into notepad,saved it as index.html

To check it, double clicked on icon of the saved file index.html

Double clicking on the icon launched the Web browser displaying my index.html

Problem!My Web page is visible only on my computer. It would be nice if it was also visible on the computers of all my friends and relatives as well.

Solution!I need to upload my Web page to a Web server that is connected to the Internet

As a result, my Web page will become accessible to anyone with a computer hooked up to the Internet

Developing Your Own Web Page

Step 1Open notepad, type in the HTML code, and save it as index.html on your PC’s Desktop

Developing Your Own Web Page

Step 2Log on to the UMT Web server and upload that index.html from your PC’s Desktop to your account on that Web server

That is it!Your Web page is now accessible on the Internet through the URL:

http://sst.umt.edu.pk/student/xxxxxxxxxwhere xxxxxxxxx is your user ID

Let’s take a brief review of the HTML tags …

<HTML>……</HTML>

HTML tags that go in the HEAD portion of

a Web page

<HEAD>……</HEAD>

<TITLE> … </TITLE>

HTML tags that go in the BODY portion of

a Web page

<BODY>……</BODY>

<P> … </P>

Paragraph

<BR>

Line break

<B> … </B>

Bold text

<A HREF = “action” > label </A>

Anchor(Anchors are used to embed links in a Web page)

<A HREF = “action” > label </A> http://

Displays the Web page specified by the link example: “http://www.umt.edu.pk”

mailto: Sends an e-mail to the specified address example: “mailto:[email protected]

<A HREF = “action” > label </A>

label can be any text string

HTML Code

I am at the

<A HREF=“http://www.umt.edu.pk”>UMT</A>. You can send me an e-mail by clicking

<A HREF=“mailto:[email protected]”>here</A>.

Browser DisplayI am at the UMT. You can send me an e-mail by clicking here.

Useful URL’s

HTML for the Conceptually Challengedhttp://www.arachnoid.com/lutusp/html_tutor.html

NCSA’s Beginner's Guide to HTML http://archive.ncsa.uiuc.edu/General/Internet/WWW/HTMLPrimerAll.html

Homework Assignment

Develop your own home page.

Among other things, it should contain

At least one link to http://sst.imt.edu.pk/cources/cs101 Your (clickable) email address A paragraph (50-100 words) on what are your

ambitions in future?

Deadline: 12:00pm, 10th May, 2007


Recommended