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 HEREHERE  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 difference. We will use the term hypertext to mean both, despite that the links will not always be text. HYPERTEXT / HYPERMEDIA

 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 links 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 infinite 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, film 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 file interpreted and displayed by the web browser. This file 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. Welcome HYPERTEXT MARKUP LANGUAGE (HTML)

The function specified 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. HYPERTEXT MARKUP LANGUAGE (HTML)

Anchor Tags contd…  These tags are held inside angled brackets, <>, like normal tags but also use the prefix and ending. Href refers to Hypertext reference. An example for a link in HTML might be: PEC Website  What this means is that when the user clicks on ‘PEC Website’ they will be directed to the associated URL. HYPERTEXT MARKUP LANGUAGE (HTML)

META Data and META Tags  Metadata is data that defines 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. The world according to Zorp <META name=“keywords” content=“zorp, world view, insightful, britney spears”. HYPERTEXT MARKUP LANGUAGE (HTML)

Uniform Resource Locators (URL’s) Contd…  Uniform Resource Locators or URL’s are used to identify individual files and resources on the Internet, including the WWW. URL’s are not only used to access HTML files within web browsers, they are used to identify and retrieve all types of resources present on the Internet. Protocol Domain Name subdirectory path File name HYPERTEXT MARKUP LANGUAGE (HTML)

Uniform Resource Locators (URL’s) Contd…  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.  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 Browsers communicate with a Domain Name Server (DNS) used to resolve each domain name with its IP address. HYPERTEXT MARKUP LANGUAGE (HTML)

Uniform Resource Locators (URL’s) Contd…  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,.info 2.Country Code top level domains -.au,.uk,.nz etc HYPERTEXT MARKUP LANGUAGE (HTML)

Uniform Resource Locators (URL’s) Contd…  Subdirectory path and filename Following the domain name is the directory structure to the individual file. HYPERTEXT MARKUP LANGUAGE (HTML)