TU 170 Learning Online Prepared By M Hussein

Aim of the session o Tow main subjects will be covered in this session: o o o Finding information on the web. Creating web pages using HTML language ( hyper text markup language). TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 3

Internet o What is Internet ? o it is a way of connecting a large multi-user computers, it includes the standards for routing info from one pc to the next which ensure that all computers connected to it can understand the info on it. such as TCP/IP. TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 4

world wide web (www) o its one of many services that run in the net. (What is the difference between Internet and web ? give examples. ) o Is the most on-line medium. The web displays a rich variety of text, graphics and increasingly interactive info. o The basic technology defining the web is the hypertext, that jumps you to another location within a document, graphics images can be used as links (hyperlink). TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 5

World wide web (www) benefits: 1. 2. 3. It hides the complexity of internet addresses and commands. It summarizes most of the different features of the interne into single interface used by web applications. It allows you to see pictures, hear sounds or watch movies while you are reading/writing text TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 6

What is the core of the internet? “Backbone of the internet”, which is the core of the net. It is a group of host pc’s linked by a dedicated high speed telecommunication connection. (ISP) get their high speed connection by connecting 2 the backbone group. TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 7

The Web first went public in January 1991. o It was meant to be an easy way for scientists to put up information and link to each other's documents. It too is defined by a set of standards. One standard, called http, or Hypertext Transfer Protocol specifies how information exchange between machines should be handled. Another, called our or Universal Resource Locator defines the location at which documents are stored. Finally, there is HTML or Hypertext Markup Language. Any document that conforms to the HTML standard can be put on the World Wide Web. Once there, it can be read by software that understands HTML. The software designed for this purpose was called a 'browser', but now much software designed for other purposes can also read HTML. TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 8

Finding information on the web o Using search engines ( give some examples by performing real search). o Storing site addresses ( bookmarks /favorites). o Storing website addresses in folders. o Adding viewed web page to list of favorites. TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 9

Search engines o As the number of sites on the Web has grown, so have the number of sites designed to help you find other sites. o Another way to find information is to use one of the search sites or 'search engines'. Some of the larger search sites are: alta. Vista Arab. Sites Aiwa. Gulf Arab World Search Engine (AWSE) Web. Crawler Yahoo o Mamma 'The Mother of All Search Engines' o NISS A UK information service for education BUBL A UK information service for higher education TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 10

- Finding free software o o Why is some software free? Shareware and freeware Download. COM. One common type of free software is 'plugins', which are extensions to other software such as browsers or graphics software. Music on the Web TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 11

HTML: the language of the Web o Early versions of HTML were very simple. They mostly included ways of formatting text: several levels of heading, and several types of list, character formats, and also ways of creating hyperlinks between documents. o HTML has been developing rapidly in the few years since it was invented. In its earlier versions. TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 12

Creating web pages using HTML language o What is HTML ? o is a way of describing using instructions embedded within the document, what the document text means? , or what it is supposed to look like? . o Explanation of the Content of HTML. o Define basic elements of HTML: o o Headings. Paragraphs. Lists. Links. TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 13

What does the html contains? ? o Commands (tags or elements) 2 mark text as headings paragraphs, lists, . . . etc o Tags for including images within the documents or for including fill-in forms that accept users input and including hypertext links connecting the document being read to other documents or internet resources TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 14

How tags work? ? o The tags do not appear in the browser, but if you open a web page in a simple text editor such as Notepad you will see them, Most browsers have a command. TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 15

Editors for HTML o HTML was originally designed to be very easy to use. o Basic editors and 'wysiwyg'editors? o Explain… o The HTML tags are not normally visible in these but can be shown if desired. o As the web has become more popular, other types of software have been adapted to create HTML. Word processors often have a 'Save as HTML'. Is there still a need to learn HTML? TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 16

HTML o Html is designed to be an “extensible” language, it means that new features, commands & functionality can be added to the language breaking other doc. o Html is structured language, it means that there r rules 4 where elements can and can not go. TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 17

Publishing your file on the Web There are two ways to achieve this process: 1. Through your ISP, ( if your contract includes web space ). 2. Through LMS. TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 18

Basic HTML elements o Find out from Basic Elements of HTML how to make a hyperlink to an image o Headings o <H 1>This is a first level heading. </H 1> o <H 2>This is a second level heading. </H 2> o <H 3>This is a third level heading. </H 3> o <H 4>This is a fourth level heading. </H 4> TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 19

o. Paragraphs: o o. Lists: paragraph . o. An ordered list o <OL> o <LI> the first item. </LI>. o <LI> the second </LI> o <LI> and so on. . </LI> o </OL> TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 20

Example of an ordered list 1. This is an ordered list. 2. Here is the first item. 3. Here is the second item. 4. . and so on. . . TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 21

HTML Source of unordered list • This is an unordered list: <UL> <LI>Here is the first item. </LI> <LI>Here is the second item. </LI> <LI>And so on. . . </LI> </UL> TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 22

Unordered list example o Here is the first item. o Here is the second

Links o To display a graphic on a web page: o < IMG SRC=”http: //our of graphic” > o To a document somewhere else on the web: o < A HREF=”http: // our of target site “ > text you wish to appear underlined </A>. TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 24

Links o If u use a full our in the link, as 4 example, http: //www. open. ac. uk (is called the ‘absolute address’) o If u use only 1 part of an address, 4 example, ”pictures / Our. Logo. gif”, o (it is called the ‘relative address’ & the browser assume that the rest of the address is the same as that of the page) TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 25

HTML source of internal link [other paragraphs in the document] Do u want 2 go 2 the beginning of the page? It will take u 2 a place where the anchor called ‘start’ has been placed. <A NAME=“start”></A> [other paragraph in the document] <A HREF=“#start”>Do u want to go to the beginning on the page? </A> It will take you to a place where the anchor called ‘start’ has been placed. TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 26

Example of links e-mail If u want people 2 send u an e-mail click here, u can setup a ‘mailto: ’ link 4 yoourself. <A REF=mailto: yoour. ID@yahoo, com>, if you want people to send you an e-mail click here</A> , you can setup a ‘mailto: ’ link for yourself. TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 27

Overview of current HTML editors : • What is the html editor ? -It is a software used to create HTML documents without entering the tags manually. - Some types of HTML editors ( give some practical examples on each ) are: Ø New word processor like MS-Word 2000. Ø MS Home Publishing Suite 2000. Ø Front Page. Ø Netscape Composer. TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 28

General issues on good web esign o Designing advanced web pages can’t be done using html tags. to solve this problem, the basic html should b extended. Some methods for extensions are: a. Adding plug-ins b. Use new programming web languages c. Extends the html structures to their limit. TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 29

Some tips for enhancing the design for the web: 1. 2. 3. 4. 5. Use Use Use of of of simple tables color typeface s and different font sizes illustrations templates TU 170 Learning Online( Prepared By: M. Hussein Y. Mansoour) Copyright 2005© ITC 30