experiment 3

CREATING FORKS WITH HYPERLINKS

Planning for the experiment

Coming across an illustration of the hypertext structure in David Flint’s Hypertext inspired this experiment. The diagram showed buttons serving as links between different chunks of information. This gave me the idea to employ hyperlinks and the ability of HTML to create a network of documents.

With reference to the narrative network exercise, I wanted to show the potential narrative sequences with hyperlinks. Every fragment would contain hyperlinks to the next possible fragment.

The eleven text fragments identified in my narrative network.

Each text fragment takes up one html file.

Connecting the fragments through linking

The links between HTML documents were created based on the possible sequences of text fragments that can be seen below. For instance, fragment A can lead to B or E.

The link from A to E is created on the word “Serpent” and the link from A to B is created on the words “the woman”.

Observations & Considerations

Although it’s a simple experiment, I think that the hyperlinks execute the concept of branching and forking really well. It rearranges the narrative based on which links the reader clicks on. There are a couple things, however, to consider:

There are times when a button links back to a fragment that already appeared before, so this could create a loop in the narrative.
When should a reader stop reading? Until there are no more links to click on?

The dynamic possibilities with JavaScript

Andreas made a suggestion to make this experiment a little more concise and efficient. With JavaScript, there would be no need to create 11 html files and the content of one html file can be changed dynamically.

The links here are not created using the typical <a> tags but with <span> tags that include a ${style} and ${link()}. Using arrays and their indexes, a function triggered by clicking the links is created to change the index of the text fragment array. There is only one <p> tag in the html which prints the fragments using document.getElementById(“result”).innerHTML.

In the snippet below, clicking on “the woman” changed the index from 0 to 1.

The words "the woman" links to the text fragment with the index of 1, which is "Woman fed the apple to Adam".

The content changing to the next fragment upon clicking.