Hypertext/ hypermedia

CORE 2: Information systems and Databases

HYPERTEXT/ HYPERMEDIA

Hypertext is a body of text that is linked to something in a non-sequential manner. Each block of text contains links to other blocks of text. For example click HERE

Hypermedia is an extension of hypertext. A collection of non-sequential links that may be linked to any other media type. For example click on the image…

In everyday usage these words have become interchangeable on the WWW but you should be aware of the diff erence.We will use the term hypertext to mean both, despite that the links will not alwaysbe text.

HYPERTEXT / HYPERMEDIA

http://www.oprah.com/index.html

https://www.kickstarter.com/

Despite the unstructured nature of hypertext (of HM), it actually reflects the operation of the human brain more closely than other methods of data organisation eg. A database.

Humans operate largely on associations eg. What do you think about when I say ‘BTAC’? Our thoughts move from one thing to another much like working your way through a series of hypertext links.

HYPERTEXT / HYPERMEDIA

The organisation of Hypertext is based on LINKS and NODES. A set of l inks and nodes form a web – the WWW being the most obvious.

In general terms A NODE refers to a point where links are connected. In a network a node is any device connected to the network. What nodes exist in room 32?

In Hyper text a node is part of a hypertext network, connected by links. Eg. A web page, a text block, an image etc. A user follows a link embedded into the node and is taken to another node.

Taking the WWW as an example there are an infi nite number of pathways between nodes but we do try and structure individual websites so that there is a common path. To do this we might employ a storyboard.

LOGICAL ORGANIZATION OF HT/HM

Storyboards are a technique originating with TV, fi lm and animation. These storyboards included a series of hand drawn sketches to represent each scene in a linear fashion.

Hypertext typically offer users multiple pathways through content.

Typically storyboards created for screen displays have two parts – the screen layouts with descriptions and a navigation map outlining the links between screens

STORYBOARDS

There are four common navigation structures.

Linear navigation – A simple step by step navigational system.

Hierarchical navigation - A flow chart-esque layout. Think: Family tree.

Non-linear navigation – Maximum flexibility, hard to visualise. Eg. A video game.

Composite navigation – A combination of the above.

STORYBOARDS

Documents accessed via the WWW make extensive use of Hyperlinks. These documents are based on HTML. Hypertext Markup Language (HTML) is the primary way for organising hyperlinks within a document to be accessed on the ‘Internet’.

Structurally each page on the WWW is an HTML fi le interpreted and displayed by the web browser. This fi le is stored on a computer somewhere in the world. As far as the user is concerned the webpage is retrieved and displayed in their browser, the physical location of the page is irrelevant.

HYPERTEXT MARKUP LANGUAGE (HTML)

HTML uses tags to specify formatting, hyperlinks and other functions. These tags are stored inside angled brackets…

<>… representing the start and end of a tag. OR open tag & close tag. Pairs of tags are

typically required – a start tag and an end tag signalled with

</> eg.

<title> Welcome </title>



The function specifi ed by the start tag is applied to the text or image contained with the tags.

Anchor Tags

Anchor tags are used to specify all the links within and between web pages. It is this tag that single handedly connects all webpages together to form the WWW. Every time you click on a link you are activating an anchor tag.


Anchor Tags contd…

These tags are held inside angled brackets, <>, like normal tags but also use the prefix <a href> and ending </a>. Href refers to Hypertext reference. An example for a link in HTML might be:

<A HREF="htp://www.pedc.com.au/">PEC Website</A>

What this means is that when the user clicks on ‘PEC Website’ they will be directed to the associated URL.


META Data and META Tags

Metadata is data that defi nes or describes other data. Some examples may be data dictionaries and schematics for databases, or HTML tags and storyboards for websites. META tags are special HTML tags used to describe a web page. These may be key words to the page or software associated with the page.

<HEAD><TITLE> The world according to Zorp </TITLE><META name = “description” content=“Zorp describes his view on the world. A fascinating insight into the world of Zorp”><META name=“keywords” content=“zorp, world view, insightful, britney spears”.</HEAD>


Uniform Resource Locators (URL’s) Contd…

Uniform Resource Locators or URL’s are used to identify individual fi les and resources on the Internet, including the WWW. URL’s are not only used to access HTML fi les within web browsers, they are used to identify and retrieve all types of resources present on the Internet.

http://www.w3.org/Protocols/Overview.html Protocol Domain Name subdirectory path Fi le name



Protocol – This is the format and method of transmission to be used. Most commonly this is http or hypertext transfer protocol. Others include SSL, FTP, or SMTP.

http://www.w3.org/Protocols/Overview.html

Domain Name – This is the name for the website on the Internet, often called the host name. Every domain must be unique and is always associated with an IP address (Internet Protocol address).IP addresses are composed of a set of 4 numbers, each within a range of 0-255. Browsers communicate with a Domain Name Server (DNS) used to resolve each domain name with its IP address.



Domain Names Contd… Domain names also include elements included for human readers. In general website domains include www followed by the company or organization that owns the domain. This is followed by two types of top level domain names.

1. Generic top level domains - .net, .com, .org, .biz, .info2. Country Code top level domains - .au, .uk, .nz etc




Subdirectory path and fi lename

Following the domain name is the directory structure to the individual fi le.

