Docstoc

3. Hypertext and Hypermedia

Document Sample
3. Hypertext and Hypermedia Powered By Docstoc
					Hypertext and Hypermedia
Hypertext and Hypermedia

       Andri Pranolo
               Minggu ke‐4
            (15 Oktober 2011)
            (    k b        )
  Hypertext dan
• Hypertext dan Hypermadia
• Fitur‐fitur dan alat bantu pembuatan web
               Acuan Pustaka
            yp            yp
• What is Hypertext and Hypermedia?. 
  http://www.rc.au.net/papers/www‐
  0595/wwwhype2.html. tanggal akses 15 Oktober 2011 
  Jam 10.00 WIB
  Jam 10 00 WIB
• Hypertext and Hypermedia. 
     p         y       g
  http://faculty.washington.edu/farkas/TC510/Farkas‐
  HypertextHypermedia‐WGraphics.pdf. tanggal akses 15 
  Oktober 2011 Jam 10.10 WIB
  Site Structure. 
• Site Structure
  http://www.utexas.edu/learn/designprocess/structure.
  html. tanggal akses 15 Oktober 2011 Jam 11.05 WIB
     Hypertext and Hypermedia
     Hypertext and Hypermedia
  Hypertext and hypermedia refer to Web pages 
• Hypertext and hypermedia refer to Web pages
  and other kinds of on‐screen content that 
  employ hyperlinks
• Hyperlinks give us choices when we look for 
  information, listen to music, purchase 
  products, and engage in similar activities. They 
  take the form of buttons, underlined words 
     d h           d h “h ”                h
  and phrases, and other “hot” areas on the 
  screen
                   Hypertext
     yo e us g a y so t o o       e e p syste ( e
• Anyone using any sort of online help system (like 
  Macintosh HyperCard or Microsoft Windows 
  Help) will already be familiar with a fundamental 
                 f h
  component of the Web    b
• The idea here is that instead of following text in a 
  li    f hi (lik b k)                  t         i t
  liner fashion (like a book), you can at many points 
  skip from one place to another, go forward or 
  back, get much more detail on the current topic, 
  back, get much more detail on the current topic,
  change direction and navigate in any way that 
  you desire
  Hypertext is basically the same as regular text 
• Hypertext is basically the same as regular text
  – it can be stored, read, searched, or edited 
    with an important exception: hypertext is text 
  – with an important exception: hypertext is text
    with pointers to other text
  Hypertext refers to the use of hyperlinks (or 
• Hypertext refers to the use of hyperlinks (or
  simply “links”) to present text and static 
  graphics.
  graphics
                Hypermedia
  Hypermedia is a superset of hypertext
• Hypermedia is a superset of hypertext
• Hypermedia documents contain links not only 
  to other pieces of text, but also to other forms 
  to other pieces of text, but also to other forms
  of media ‐ sounds, images, and movies
  Images themselves can be selected to link to 
• Images themselves can be selected to link to
  sounds or documents.
  This means that browsers might not display a 
• This means that browsers might not display a
  text file, but might display images or sound or 
  animations.
  Hypermedia simply combines hypertext and 
• Hypermedia simply combines hypertext and
  multimedia.
  Hypermedia refers to the presentation of 
• Hypermedia refers to the presentation of
  video, animation, and audio, which are often 
  referred to as  dynamic or time based
  referred to as “dynamic” or “time based” 
  content or as “multimedia.
    Some examples of Hypermedia 
                h b
             might be:
  You are reading a text on the Japanese 
• You are reading a text on the Japanese
  language. You select a Japanese phrase, then 
  hear the phrase as spoken in the native
  hear the phrase as spoken in the native 
  tongue.
  You are viewing a company s floor plan, you 
• You are viewing a company's floor plan you
  select an office by clicking on a room. The 
  employee s name and picture appears with a 
  employee's name and picture appears with a
  list of their current projects.
    Linear and Non linear Media
    Linear and Non‐linear Media
  A  linear communication medium is one we
• A “linear” communication medium is one we 
  typically experience straight through from 
  beginning to end. There is little or no choosing 
  beginning to end There is little or no choosing
  as we go. (ex. The Cinema, Novel, etc.)
  Non‐ Linear (ex. Newspapaer, magazines, and 
• Non Linear (ex Newspapaer magazines and
  encyclopedia)
  The Web and other hypertextual media are 
• Th W b d h h                      l    di
  strongly non‐linear.
    Nodes, Links, and Navigation
    Nodes, Links, and Navigation
   Node is simply a Web page
• “Node” is simply a Web page.
• Links (or hyperlinks) are the pathways 
  between nodes.
  between nodes
• When we click links and thereby display a 
          i    fW b          ( d )         i
  succession of Web pages (nodes), we are in a 
  sense “navigating” the website.
        Information Structures
        Information Structures
  Designers of websites and other hypertexts 
• Designers of websites and other hypertexts
  must work hard to decide which nodes will be 
  linked to which other nodes
  linked to which other nodes
any node can be linked to any other
any node can be linked to any other
Fitur‐fitur          bantu 
Fitur fitur dan alat bantu
    p
    pembuatan web
                      Software
• There are lots of options, both free and paid.
• You may prefer to use separate tools for code editing 
  and FTP or you may prefer an integrated 
  development environment.
  You ll also need an image editor.
• You'll also need an image editor.
• You'll need lots of browsers, not just IE.
            Code editing and FTP
            Code editing and FTP




Editor: Notepad or Notepad++
FTP: SmartFTP or FileZilla
   Integrated development tools
   Integrated development tools




Dreamweaver or Aptana Studio
           Software applications
• Notepad or Notepad++
• SmartFTP or FileZilla
• Adobe Dreamweaver or Aptana Studio
• Adobe Photoshop
                p
• Browsers: IE, FF, Opera, Safari, Chrome...
• Any other software you find useful

				
DOCUMENT INFO
Shared By:
Categories:
Tags:
Stats:
views:3
posted:2/29/2012
language:
pages:21