Published on

Bengkel Metadata, RDA & Hyperlink PUiTM 2010
Anjuran : BPBPT PTAR
Tarikh : 6 April 2010
Tempat : Pusat IT PTAR 1
Penceramah : En. Ahmad Faizar
Jawatan: Pustakawan

Published in: Education
  • Be the first to comment

  • Be the first to like this

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • 1957: The United States Department of Defense formed a small agency called ARPA (Advanced Research Projects Agency) to develop military science and technology. 1961-1965: The Massachusetts Institute of Technology (MIT) started to research sharing information in small, phone-linked networks. ARPA is one of their main sponsors. 1966: The first ARPANET plan is unveiled by Larry Roberts of MIT. Packet switching technology is getting off the ground, and small university networks are beginning to be developed. 1969: The Department of Defense commissions the fledgling ARPAnet for network research. The first official network nodes were UCLA, Standford Research Institute,UCSB, and the University of Utah. The first node to node message was sent from UCLA to SRI. 1971: more nodes join the network, bringing the total to 15. These new nodes include Harvard and NASA. 1973: ARPAnet goes global when the the University College of London and Norway's Royal Radar Establishment join up. 1974: Network intercommunication is becoming more sophisticated; data is now transmitted more quickly and efficiently with the design of TCP (Transmission Control Program). 1976: Unix is developed at AT and T; Queen Elizabeth sends out her first email message. 1979: USENET, the mother of all networked discussion groups, is developed. 1982: Internet technology protocols are developed, commonly known as TCP/IP (Transmission Control Protocol and Internet Protocol). This leads to one of the first definitions of an "internet" being a connected set of networks. 1984: Number of hosts is now up to 1000, with more being added every day. 1985: The first registered domain is Symbolics.com. 1987: Number of hosts breaks the 10,000 mark. 1988: First large-scale Internet worm affects thousands of Internet hosts. 1991: Tim Berners-Lee develops the World Wide Web.
  • Kimberly, the or has to be in the same build as “If no IP Address returned, and the second (bottom 2) has to come after the blue arrow pointing to it.
  • 1991: Tim Berners-Lee develops the World Wide Web. 1993: The World Wide Web's annual growth is now at a staggering 341,634%. 1994: ARPAnet celebrates 25th anniversary. 1995-1997: RealAudio introduces Internet streaming technology, dial-up systems emerge (America Online, Compuserve), the Internet backbone continues to be strengthened with the addition of MCI, Microsoft and Netscape fight for WWW browser supremacy, and there are now more than 70,000 mailing lists. 1998-present: The Internet continues to experience staggering growth. More people use the Internet to get connected to others, find information, conduct business, and share information than ever before in history.
  • http://old.no/icon/applications/
  • KEY OBJECTIVES: Establish a baseline of a simple HTML page that everyone can understand Show that just by looking at the tags, it’s possible to see what a page will look like Now the key to understanding how easy it is to use ColdFusion is to take a look at how the dynamic pages are created. To begin with here on the screen we have a very basic HTML page that is not being dynamically generated. Those of you familiar with HTML know what this page will display by just looking at the HTML code. [CLICK1] This page will simply place a heading of ‘Sales Report’ on our web page and a title “Q3 Sales by Region” Now let’s create a dynamic ColdFusion page using this HTML file as a foundation.
  • Hyperlink

    1. 1. Internet & Hyperlinks WEB Oleh Ahmad Faizar Jaafar Unit Web & Digital Komponen Jabatan Pengurusan Sistem & Teknologi Maklumat (JPSTM) PTAR http://faizar.onestop.net http://faizar.multiply.com http://faizar.ning.com http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    2. 2. What is Internet ? http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] The Internet (also known simply as the Net) is the worldwide, publicly accessible system of interconnected computer networks that transmit data by packet switching using the standard Internet Protocol (IP). It consists of millions of smaller domestic, academic, business, and government networks, which together carry various information and services, such as electronic mail , online chat , and the interlinked Web pages and other documents of the World Wide Web . Contrary to some common usage, the Internet and the World Wide Web (WWW) are not synonymous: the INTERNET is a collection of interconnected computer networks , linked by copper wires, fiber-optic cables, wireless connections etc.; the WEB(WWW) is a collection of interconnected documents , linked by hyperlinks and URLs , and is accessible using the Internet. The Internet also provides many other services including e-mail , file sharing
    3. 3. Internet History <ul><li>• 1957 - The USSR launches Sputnik, the first artificial earth satellite. In response,the United States forms the Advanced Research Projects Agency (ARPA) within the Department of Defense (DoD) to establish US lead in science and technology applicable to the military. </li></ul><ul><li>• ARPANET, used Network Control Protocol (NCP) as its transmission protocol from 1969 to 1982, when NCP was replaced with the now widespread TCP-IP (Transmission Control Protocol - Internet Protocol). </li></ul><ul><li>• 1982: Internet technology protocols are developed, commonly known as TCP/IP (Transmission Control Protocol and Internet Protocol). This leads to one of the first definitions of an &quot;internet&quot; being a connected set of networks. </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    4. 4. The rest is history <ul><li>http://www.internet-story.com http://ben.home.cern.ch/ben/TCPHIST.html http://www.computerhistory.org/exhibits/internet_history/ http://www.davesite.com/webstation/net-history.shtml http://www.pbs.org/opb/nerds2.0.1/timeline/index.html http://websearch.about.com/od/whatistheinternet/a/historyinternet.htm?terms=internet+history </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    5. 5. Overview Of Internet <ul><li>Classful IP Addressing </li></ul><ul><li>Subnetting a Network </li></ul><ul><li>Planning IP Addressing </li></ul><ul><li>Assigning TCP/IP Addresses </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    6. 6. Classful IP Addressing <ul><li>IP Addresses </li></ul><ul><li>IP Address Classes </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    7. 7. Network Connectivity http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] Bindings Bindings Network Adapter (0) Protocols Services Client for Microsoft Networks Gateway (and Client) Services for NetWare TCP/IP NWLink Windows Network Novell NetWare Network Windows client
    8. 8. IP Addresses http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] Host ID Network ID IP Address
    9. 9. IP Address Classes http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] w x y z Class A Network ID Host ID Class B Network ID Host ID Class C Network ID Host ID
    10. 10. <ul><li>Subnetting a Network </li></ul><ul><li>Subnets </li></ul><ul><li>Subnet Masks </li></ul><ul><li>Determining Local and Remote Hosts </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    11. 11. Subnets http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] Router Subnet 1 Subnet 2 1 2 Hub Hub
    12. 12. Subnet Masks http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] IP Address Host ID Network ID 192.168. 2.200 Subnet Mask 255.255. 0.0 192.168. IP Address 10. 50.100.200 Subnet Mask 255. 0.0.0 Network ID 10. 0.0.0 IP Address 10.50. 100.200 Subnet Mask 255.255. 0.0 Network ID 10.50. 0.0 IP Address 10.50.100. 200 Subnet Mask 255.255.255. 0 Network ID 10.50.100. 0
    13. 13. http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] Lab A: Determining Class Addresses and Subnet Masks
    14. 14. Planning IP Addressing <ul><li>Addressing Guidelines </li></ul><ul><li>Assigning Network IDs </li></ul><ul><li>Assigning Host IDs </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    15. 15. Addressing Guidelines http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] The Host ID Cannot Be All Zeros The Host ID Cannot Be All 255s The First Number in the Network ID Cannot Be 127 The Host ID Must Be Unique to the Local Network ID
    16. 16. Assigning Network IDs http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] 1 2 3 10. 0 . 0 . 0 192.168.2 . 0 172.16 . 0 . 0 Router
    17. 17. http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] 1 2 172.16. 0.12 172.16. 0.11 172.16. 0.10 10 .0.0.12 10 .0.0.11 10 .0.0.10 192.168.2 .11 192.168.2 .10 192.168.2. 1 10. 0.0.1 172.16. 0.1 3 10 . 0 . 0 . 0 192.168.2 . 0 172.16 . 0 . 0 Assigning Network IDs Router
    18. 18. http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] Lab B: Identifying Valid IP Addresses
    19. 19. Assigning TCP/IP Addresses <ul><li>Static IP Addressing </li></ul><ul><li>Automatic IP Addressing </li></ul><ul><li>Viewing TCP/IP Configuration </li></ul><ul><li>Viewing TCP/IP Configuration Using Ipconfig </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    20. 20. Viewing TCP/IP Configuration http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] Internet Protocol (TCP/IP) Properties General You can get IP settings assigned automatically if your network supports this capability. Otherwise, you need to ask your network administrator for the appropriate IP settings. O btain an IP address automatically U s e the following IP address: IP address: Us e the following DNS server addresses: P referred DNS server: Obtain DNS server address automatically Ad v anced... A lternate DNS server: 192 . 168 . 1 . 200 192. 168 . 1 . 1 255 . 255 . 255. 0 Subnet mask : Default gateway: OK Cancel
    21. 21. Static IP Addressing http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] Internet Protocol (TCP/IP) Properties General You can get IP settings assigned automatically if your network supports this capability. Otherwise, you need to ask your network administrator for the appropriate IP settings. O btain an IP address automatically U s e the following IP address : IP address: Us e the following DNS server addresses: P referred DNS server: Obtain DNS server address automatically Ad v anced... A lternate DNS server: 192 . 168 . 1 . 200 192. 168 . 1 . 1 255 . 255 . 255. 0 Subnet mask : Default gateway: OK Cancel
    22. 22. Automatic IP Addressing http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] Internet Protocol (TCP/IP) Properties General You can get IP settings assigned automatically if your network supports this capability. Otherwise, you need to ask your network administrator for the appropriate IP settings . O btain an IP address automatically U s e the following IP address: IP address: Us e the following DNS server addresses: P referred DNS server: Obtain DNS server address automatically Ad v anced... A lternate DNS server: Subnet mask : Default gateway : OK Cancel
    23. 23. Configuring TCP/IP to Obtain an IP Address Automatically http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] Assign IP address of DHCP Client DHCP Server Request for IP address <ul><li>DHCP Automatically Assigns IP Addresses and Other Configuration Information to DHCP Clients </li></ul><ul><li>Automatic Private IP Addressing Enables the Configuration of IP Addresses Without Using Static IP Addresses or Installing the DHCP Server Service. </li></ul>Automatic Private IP Addressing Generates IP Address OR If No IP Address Returned
    24. 24. Viewing TCP/IP Configuration Using c:>ipconfig http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] Command Prompt Microsoft Windows 2000 [version 5.00.2195] (C) Copyright 1985-1999 Microsoft Corp. C:>ipconfig Windows 2000 IP Configuration Ethernet adapter Local Area Connection: Connection-specific DNS Suffix . : IP Address. . . . . . . . . . . . : Subnet Mask . . . . . . . . . . . : Default Gateway . . . . . . . . . : C:>_
    25. 25. Viewing Trace Using c:>tracert (ip address) http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    26. 26. SPEEDTEST <ul><li>http://www.speedtest.net/ </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] http://speedtest.streamyx.com.my/
    27. 27. Viewing Trace Using http://geobytes.com/ http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    28. 28. Overview <ul><li>Identifying Internet Concepts </li></ul><ul><li>Using Client Technologies </li></ul><ul><li>Connecting to the Internet </li></ul><ul><li>Identifying Web Server Concepts </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] The Internet & Web
    29. 29. Identifying Internet Concepts <ul><li>The Internet </li></ul><ul><li>Internet Services </li></ul><ul><li>Intranets </li></ul><ul><li>Domain Naming </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    30. 30. Intranets http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] Intranet Extranet Internet
    31. 31. The Internet & Web http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] Client Connection Using TCP/IP Protocol Server Text, Audio, Video, and Graphics Data Internet
    32. 32. Uniform Resource Locator (URL) <ul><li>URL (http://example.microsoft.com/tutorial/default.html) </li></ul><ul><ul><li>Protocol used (http://) </li></ul></ul><ul><ul><li>DNS address (example.microsoft.com) </li></ul></ul><ul><ul><li>Path on the server (/tutorial/default.html) </li></ul></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] http:// example.microsoft.com / tutorial / default.html
    33. 33. Domain Naming <ul><li>Domain Name (istudent.uitm.edu.my) </li></ul><ul><ul><li>Top-level domain (edu) </li></ul></ul><ul><ul><li>Second-level domain (uitm.edu) </li></ul></ul><ul><ul><li>Subdomain (istudent.uitm.edu.my) </li></ul></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] http://www.checkdomain.com/list.html edu Library.uitm.edu.my uitm.edu istudent.uitm.edu.my
    34. 34. Static Static vs Dynamic Web Site <ul><li>Static Web Site </li></ul><ul><li>• HTML page content is same for each request </li></ul><ul><li>• Change to content requires HTML page edit </li></ul><ul><li>• No user interaction </li></ul><ul><li>• No access to live data </li></ul><ul><li>•“ Web Site” </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    35. 35. Static Static vs Dynamic Web Site http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] <ul><ul><ul><ul><ul><li>Dynamic Web Site </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><ul><li>• HTML pages dynamically enerated for each request </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><ul><li>• Content changes based on data, user login, etc. </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><ul><li>• Allows user interaction </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><ul><li>• Access to data real- time </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><ul><li>• “ Web Application” </li></ul></ul></ul></ul></ul>
    36. 36. Dynamic Web Sites <ul><li>• Web server </li></ul><ul><li>• responds to HTTP requests and retrieves resources </li></ul><ul><li>• Expand Web server capabilities by providing a gateway between it and external programs </li></ul><ul><li>• Common Gateway Interface (CGI) </li></ul><ul><li>• uses standard I/ O </li></ul><ul><li>• new process for each request </li></ul><ul><li>• slow and inefficient </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    37. 37. Dynamic Web Sites cont. <ul><li>• NSAPI, ISAPI </li></ul><ul><li>• Web Server API </li></ul><ul><li>• runs in- process, making it faster than CGI </li></ul><ul><li>• Java Servlets </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    38. 38. History of the Web <ul><li>• Tim Berners- Lee “invented” the Web in 1990 writing the first Web server and browser. </li></ul><ul><li>• Marc Andreesen exposed the Web to the masses with Mosaic the first GUI Web browser in 1993. </li></ul><ul><li>• The rest is history... </li></ul><ul><li>History WWW http://www.netvalley.com/intval1.html http://ben.home.cern.ch/ben/TCPHIST.html </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    39. 39. History Internet & WWW http://www.netvalley.com/intval1.html http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    40. 40. Web Browsers http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] Mainstream Browsers (free and not free) Commercial Browsers (not free) Shareware Browsers (not free) Freeware Browsers (free) Browsers for People with Disabilities (semi)Browsers that Require IE 4/5 to Run Other Accessibility Software for the Web Demo Programs/Non-fullfledged Browsers/Mini-Browsers Obsolete browsers ~ rarely used anymore, if at all (free and not free) Clearly Obsolete browsers (free and not free) Browsers under Development Mail Readers & News Clients that Understand HTML Other Programs that can Browse the Web Offline HTML browsers (no http support) Palm-top and Hand-held Browsers (free and not free) http://www.browserlist.fmajor.com/browser-list.shtml Browser Contoh: Internet Explorer
    41. 41. http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] <ul><li>Among Popular Browser </li></ul>Web Browsers
    42. 42. <ul><li>Mozilla dir.yahoo.com/.../Browsers/Mozilla </li></ul><ul><li>Netscape dir.yahoo.com/.../Browsers/Netscape </li></ul><ul><li>Opera dir.yahoo.com/.../Browsers/Opera </li></ul><ul><li>Safari dir.yahoo.com/.../Browsers/Safari </li></ul><ul><li>Microsoft Internet Explorer (IE) (29) dir.yahoo.com/.../Browsers/Microsoft_Internet_Explorer__IE </li></ul><ul><li>Lynx (13) dir.yahoo.com/.../Browsers/Lynx </li></ul><ul><li>Amaya W3C's testbed browser. www.w3.org/Amaya </li></ul><ul><li>Konqueror Unix-based Web browser, file manager, and universal viewer from KDE. www.konqueror.org </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] Web Browsers
    43. 43. http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] How World Wide Web works WWW Server Methods to Use to Connect: Home user – Direct Modem Organization - LAN PC Browser Contoh: Internet Explorer
    44. 44. <ul><li>EMAIL </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    45. 45. <ul><li>EMAIL </li></ul><ul><li>Among Popular email </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    46. 46. Multimedia http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    47. 47. Internet Protocols <ul><li>HTTP </li></ul><ul><li>HTTPS </li></ul><ul><li>FTP </li></ul><ul><li>SMTP </li></ul><ul><li>NNTP </li></ul><ul><li>HTML </li></ul><ul><li>DHTML </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] Server Data Client Connection Using an Internet Protocol Internet
    48. 48. Hypertext Markup Language http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] < HTML> <HEAD> <TITLE>Sales Report</TITLE> </HEAD> <BODY> <H2>Q3 Sales by Region</H2> </BODY> </HTML> Hypertext Markup Language ( HTML ) http://www.w3schools.com/html/tryit.asp?filename=tryhtml_intro
    49. 49. Hypertext Markup Language <ul><li>Generally text is unformatted in your Web documents. However, to emphasize specific letters, words, or phrases you can use some text formatting options including boldfacing and italicizing. Depending on your browser, you may also be able to add underlining to emphasize characters. The following examples show the code for boldfacing and italicizing. </li></ul><ul><li><B> This is bold. </B> <STRONG> This is also bold. </STRONG> </li></ul><ul><li><I> This is italics. </I> <EM> This is also italics. </EM> </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    50. 50. How To Make a Hyperlink http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] http://www.hyperlinkcode.com/make-hyperlink.php The following is the most basic hyperlink code. To make a hyperlink, add the href attribute to the Anchor (a) tag. The href attribute can have an absolute value (http://www.hyperlinkcode.com/make-hyperlink.php) or a relative value (make-hyperlink.php). HTML Hyperlink Code Code <a href=&quot;http://www.hyperlinkcode.com&quot;>Hyperlink Code</a> Output > Hyperlink Code Code In Context Make <a href=&quot;http://www.hyperlinkcode.com&quot;>Hyperlink Code</a> easily. Output> Make Hyperlink Code easily.
    51. 51. What is Hyperlink A  hyperlink , or simply a  link , is a reference in a  hypertext  document to another document or other resource. It is similar to a  citation  in literature. Combined with a data network and suitable access protocol, it can be used to fetch the resource referenced. This can then be saved, viewed, or displayed as part of the referencing document. The most common type of hyperlink is the  URL  used in the  World Wide Web . A  web browser  usually displays a hyperlink in some distinguishing way, e.g. in a different colour, font or style. http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    52. 52. <ul><li>A mouse pointer may also change into a hand motif to indicate a link. In most browsers, links are displayed in underlined blue text when not cached, but underlined purple text when cached. When the user activates the link (e.g. by clicking on it with the mouse) the browser will display the target of the link. If the target is not a html-file, depending on the file type and on the browser and its plug-ins, an other program may be activated to open the file. </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    53. 53. Hypertext <ul><li>In  computing , a  hypertext  system is one for displaying information that contains references (called  hyperlinks ) to other information on the system, and for easily publishing, updating and searching for the information. The most well-known hypertext system is the  World Wide Web . Timeline of hypertext technology  and human-computer interaction projects and developments.  This  timeline  of  hypertext  technology , including &quot;hypermedia&quot; and related human-computer interaction projects and developments from  1945  on. </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] <ul><ul><ul><li>1945 </li></ul></ul></ul><ul><ul><ul><ul><li>Memex   (concept) </li></ul></ul></ul></ul><ul><ul><ul><li>1967 </li></ul></ul></ul><ul><ul><ul><ul><li>Hypertext Editing System   (HES) </li></ul></ul></ul></ul><ul><ul><ul><li>1968 </li></ul></ul></ul><ul><ul><ul><ul><li>FRESS   (File Retrieval and Editing System) </li></ul></ul></ul></ul><ul><ul><ul><ul><li>NLS   (oN-Line System) </li></ul></ul></ul></ul><ul><ul><ul><li>1973 </li></ul></ul></ul><ul><ul><ul><ul><li>Xerox Alto desktop </li></ul></ul></ul></ul><ul><ul><ul><li>1975 </li></ul></ul></ul><ul><ul><ul><ul><li>ZOG </li></ul></ul></ul></ul><ul><ul><ul><li>1976 </li></ul></ul></ul><ul><ul><ul><ul><li>PROMIS </li></ul></ul></ul></ul><ul><ul><ul><li>1978 </li></ul></ul></ul><ul><ul><ul><ul><li>Aspen Movie Map </li></ul></ul></ul></ul><ul><ul><ul><li>1980 </li></ul></ul></ul><ul><ul><ul><ul><li>ENQUIRE   (not released) </li></ul></ul></ul></ul>
    54. 54. T imeline  of  hypertext  technology…. http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] <ul><ul><li>1981 </li></ul></ul><ul><ul><ul><li>Xerox Star desktop </li></ul></ul></ul><ul><ul><li>1983 </li></ul></ul><ul><ul><ul><li>Guide </li></ul></ul></ul><ul><ul><ul><li>Knowledge Management system (KMS) </li></ul></ul></ul><ul><ul><ul><li>TIES </li></ul></ul></ul><ul><ul><li>1984 </li></ul></ul><ul><ul><ul><li>Cyc </li></ul></ul></ul><ul><ul><ul><li>NoteCards </li></ul></ul></ul><ul><ul><li>1985 </li></ul></ul><ul><ul><ul><li>Intermedia </li></ul></ul></ul><ul><ul><ul><li>Symbolics Document Examiner   (Symbolics   workstations ) </li></ul></ul></ul><ul><ul><li>1987 </li></ul></ul><ul><ul><ul><li>Authorware </li></ul></ul></ul><ul><ul><ul><li>Canon Cat   (&quot;Leap&quot; function, interface) </li></ul></ul></ul><ul><ul><ul><li>HyperCard </li></ul></ul></ul><ul><ul><li>1989 </li></ul></ul><ul><ul><ul><li>Macromedia Director </li></ul></ul></ul><ul><ul><li>1990 </li></ul></ul><ul><ul><ul><li>World Wide Web </li></ul></ul></ul><ul><ul><li>1991 </li></ul></ul><ul><ul><ul><li>Gopher </li></ul></ul></ul><ul><ul><li>1995 </li></ul></ul><ul><ul><ul><li>WikiWiki </li></ul></ul></ul><ul><ul><li>1998 </li></ul></ul><ul><ul><ul><li>Everything2 </li></ul></ul></ul><ul><ul><ul><li>XML </li></ul></ul></ul><ul><ul><li>2001 </li></ul></ul><ul><ul><ul><li>Wikipedia </li></ul></ul></ul>
    55. 55. Types of links <ul><li>Inline link An  inline link  displays remote content without the need for embedding the content. The remote content may be accessed with or without the user selecting the link. For example, the image above is a document that can be viewed separately, but it is included into this page with an inline link. </li></ul><ul><li>A inline link may display a modified version of the content; for instance, instead of an image, a  thumbnail ,  low resolution   preview ,  cropped section, or  magnified  section. The full content will then usually be available on demand, as is the case with  print publishing  software – e.g. with an external link. This allows for smaller file sizes and quicker response to changes when the full linked content is not needed, as is the case when rearranging a  page layout . </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    56. 56. Types of links… <ul><li>Anchor </li></ul><ul><li>A hyperlink anchor is not necessarily a piece of text - for instance, it may also be a  hot area  in an image ( image map  in HTML), a designated, often irregular part of an image. One way to define it is by a list of coordinates that indicate its boundaries. For example, a  political map of Africa  may have each irregularly shaped country hyperlinked to further information about that country. A separate invisible hot area interface allows for swapping  skins  or labels within the linked hot areas without repetitive embedding of links in the various skin elements. </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    57. 57. How hyperlinks work in HTML <ul><li>A  web browser  usually displays a hyperlink in some distinguishing way, e.g. in a different  colour ,  font  or  style . The behaviour and style of links can be specified using the  Cascading Style Sheets  (CSS) language. </li></ul><ul><li>In a graphical user interface, the appearance of a  mouse   cursor  may change into a  hand  motif to indicate a link. In most graphical web browsers, links are displayed in underlined blue text when not  cached , but underlined purple text when cached. When the  user  activates the link (e.g. by clicking on it with the mouse) the browser will display the target of the link. If the target is not an HTML file, depending on the  file type and on the browser and its  plugins , another program may be activated to open the file. </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    58. 58.   <ul><li>The HTML code contains some or all of the five main characteristics of a link: </li></ul><ul><ul><li>link destination  (&quot;href&quot; pointing to a URL) </li></ul></ul><ul><ul><li>link label </li></ul></ul><ul><ul><li>link title </li></ul></ul><ul><ul><li>link target </li></ul></ul><ul><ul><li>link class  or  link id </li></ul></ul><ul><li>It uses the  HTML element &quot;a&quot;  with the attribute &quot;href&quot; (HREF is an abbreviation for &quot;Hypertext REFerence&quot; [3] ) and optionally also the attributes &quot;title&quot;, &quot;target&quot;, and &quot; class &quot; or &quot;id&quot;: </li></ul><ul><li><a href=&quot; URL &quot; title=&quot; link title &quot; target=&quot; link target &quot; class=&quot; link class &quot;> link label </a> </li></ul><ul><li>Example:  To embed a link into a Page, blogpost, or comment, it may take this form: </li></ul><ul><li><a href=&quot;http://example.com/&quot;>Example</a> </li></ul><ul><li>After publishing, the complex link string is reduced to the following for visualization in typical  Web browsers : </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    59. 59.   <ul><li>The  Google   search engine  uses  PageRank , a measure of  link popularity  to determine which page should be ranked first. The more pages that have a hyperlink pointing to a page, the higher rank that page gets. It is actually slightly more complicated than that, see  PageRank  for more information. </li></ul><ul><li>Some websites claim that linking to them is not allowed without permission, see e.g. [ 1 ] and [ 2 ] (in Dutch). See also  deep linking . </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    60. 60. PageRank <ul><li>PageRank  is a family of  algorithms  for assigning numerical weightings to hyperlinked documents (or  web pages) indexed by a  search engine . Its properties are much discussed by  search engine optimization (SEO) experts. The PageRank system is one of the methods that the most successful  search engine , Google , uses to determine a page's relevance or importance. It was developed by Google's founders Larry Page  and  Sergey Brin  while at  Stanford University  in 1998. As  Google puts it : </li></ul><ul><li>PageRank relies on the uniquely democratic nature of the web by using its vast link structure as an indicator of an individual page's value. Google interprets a link from page A to page B as a vote, by page A, for page B. But, Google looks at more than the sheer volume of votes, or links a page receives; it also analyzes the page that casts the vote. Votes cast by pages that are themselves &quot;important&quot; weigh more heavily and help to make other pages &quot;important.&quot;In other words, a page rank results from a &quot;ballot&quot; amongst all the other pages on the  World Wide Web about how important a page is. A  hyperlink  to a page counts as a vote of support. </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    61. 61. <ul><li>The PageRank of a page is defined  recursively  and depends on the number and PageRank metric of all pages that link to it (&quot; incoming links &quot;). A page that is linked by many pages with high rank receives a high rank itself. If there are no links to a web page there is no support of this specific page. The Google Toolbar PageRank goes from 0 to 10. It seems to be a logarithmic scale. The exact details of this scale are unknown. </li></ul><ul><li>The name  PageRank ™ is a trademark of Google. Whether or not the  pun  on the name Larry Page and the word &quot;page&quot; was intentional or accidental remains an open question. The PageRank process has been  patented  (US Patent number  6,285,999 ). [ more info on the patent ] </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] PageRank
    62. 62.   <ul><li>The formula uses a model of a  random surfer  who gets bored after several clicks and switches to a random page. The PageRank value of a page reflects the frequency of hits on that page by the random surfer. It can be understood as a  Markov process  in which the states are pages, and the transitions are all equally probable and are the links between pages. If a page has no links to another pages, it becames a sink and therefore makes this whole thing unusable, because the sink pages will trap the random visitors forever. However, the solution is quite simple. If the random surfer arrives to a sink page, it picks another  URL  at random and continues surfing again. </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] PageRank
    63. 63. <ul><li>To be fair with pages that are not sinks, these random transitions are added to all nodes in the Web, with a residual probability of usually q=0.15, estimated from the frequency that an average surfer uses his or her browser's bookmark feature. </li></ul><ul><li>So, the equation is as follows: </li></ul><ul><li>where  are the pages under consideration,  is the set of pages that link to , and  N  is the total number of pages. </li></ul><ul><li>http://www.knowledgerush.com/kr/encyclopedia/PageRank/ </li></ul>PageRank… http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    64. 64. <ul><li>The PageRank values are the entries of the dominant eigenvector of the modified adjacency matrix . This makes PageRank a particularly elegant metric: the eigenvector is </li></ul><ul><li>where R is the solution of the equation Where the adjacency function is 0 if page does not link to , and normalised such that, for each i </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    65. 65. <ul><li>The values of the PageRank eigenvector are fast to approximate (only a few iterations are needed) and in practice it gives good results. </li></ul><ul><li>As a result of Markov theory , it can be shown that the PageRank of a page is the probability of being at that page after lots of clicks. This happens to equal where is the expectation of the number of clicks (or random jumps) required to get from the page back to itself. </li></ul><ul><li>The main disadvantage is that it favors older pages, because a new page, even a very good one, will not have many links unless it is part of an existing site (a site being a densely connected set of pages). </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address] http://www.knowledgerush.com/kr/encyclopedia/PageRank/ http://www.webworkshop.net/pagerank.html
    66. 66. Conclusions <ul><li>Hyperlinks are the essence ( inti ) of the World Wide Web (WWW). They provide rapid access to segmented information chunks in non-sequential order, mimicking the associative non-linear process used by an individual looking for information (Conklin,1987). </li></ul><ul><li>The links between materials on one site and references provided by other sites on the WWW is regarded as a core characteristic of communication (Benkler, 2006). </li></ul><ul><li>Hyperlinks were a main design feature of the WWW and one of the objectives of the original scheme proposed by Berners-Lee, who wrote that “a ‘web’ of notes withlinks (like references) between them is far more useful than a fixed hierarchical system” (1989: 4). </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    67. 67. http://koleksi.uitm.edu.my/eqps/ http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    68. 68. <ul><li>Thank You </li></ul>http://faizar.onestop.net/ http://faizar.ning.com/ [email_address]
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.