43
Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Embed Size (px)

Citation preview

Page 1: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Hypertext

Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Page 2: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

HypertextstrukturenEinfache Textnavigation

Das LeseradAgostino Ramelli (1588)

Page 3: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

HypertextstrukturenEinfache Textnavigation

Das eBookDiverse Anbieter (2000)

Page 4: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

HypertextstrukturenEinfache Textnavigation

Page 5: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

HypertextstrukturenTextnavigation mit Navigationsrahmen links

Page 6: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

HypertextstrukturenTextnavigation mit Navigationsrahmen links

Page 7: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

HypertextstrukturenTextnavigation mit Navigationsrahmen links

Page 8: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

HypertextstrukturenTextnavigation mit mehreren Navigationsebenen

Page 9: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

HypertextstrukturenTextnavigation mit mehreren Navigationsebenen

Page 10: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

HypertextstrukturenTextnavigation mit mehreren Navigationsebenen

Page 11: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

HypertextstrukturenGrafiknavigation mit mehreren Navigationsebenen

Page 12: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

HypertextstrukturenGrafiknavigation mit mehreren Navigationsebenen

Page 13: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

HypertextstrukturenDynamische Navigation mit mehreren Navigationsebenen

Page 14: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Weitere Beispiele

http://www.bitburger.de/http://www.holsten-pilsener.dehttp://www.radeberger.de

http://www.schwaebisch-hall.de

http://thesaurus.plumbdesign.com/online/>>> wissen.de

http://www.businex.de/leistungen/panorama/beispiele.htm

Page 15: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

HypertextstrukturenMöglicher Aufbau Navigationsebenen

Page 16: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Navigation

Hirarchischer Aufbau einer Internetseite

Einfache Navigation+ Linearität- Vernetzung

Page 17: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Navigation

Hirarchischer Aufbau einer Internetseite

Einfache Navigation+/- Linearität+/- Vernetzung

Page 18: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Navigation

Hirarchischer Aufbau eines Hypertextes

CD – Thomas Mann‚Rollende Spären‘

CD – Goethe in Weimar

Page 19: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Navigation

Hirarchischer Aufbau eines Hypertextes

Page 20: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Navigation

Rhizomatischer Aufbau einer Internetseite

komplexe Navigation- Linearität+ Vernetzung

Page 21: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Hypertext - Beschreibungsversuch

Hypertext

Versuch, eine neue Organisation von Informationen zu entwickeln, die zwar immer noch einer Ordnung unterworfen ist, nicht aber einer linearen Struktur

Page 22: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Hypertext - Beschreibungsversuch

Hypertext

Nichtsequenzieller Text, der sich verzweigt, dem Leser Wahlmöglichkeiten eröffnet und am besten an einem interaktiven Bildschirm gelesen wird

Page 23: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Hypertext - Beschreibungsversuch

Hypertext

Eine Serie von Textstücken, die durch Links verknüpft sind und dem Leser verschiedene Lesepfade eröffnen

Page 24: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Hypertext - Beschreibungsversuch

Zwei konstituierende Komponenten der Netzstruktur

Inhalt = Knoten (nodes)Struktur = Links (links)

KNOTENText TextLink Text Text Text

KNOTENText TextText Link Text Text

KNOTENText TextLink Text Text Text

Page 25: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Hypermedia - Beschreibungsversuch

‘Hypertext’ bezieht sich auf die methodischen Probleme bei der Entlinearisierung von Text bzw. der entlinearisierten Darstellung von Wissen

‘Hypermedia’ bezieht sich auf die technische Bandbreite der zum Einsatz kommenden Medien

KNOTENText TextLink Text Text Text

KNOTEN Bild

Text Link Sound Sound

KNOTENVideo Video

Link Text Text

Hypermedia = Hypertext – multimedial

Page 26: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Eigenschaften von Texten

Papiergebundene Texte

Die Eigenschaften von Romanen, Briefen, Gebrauchsanweisungen und vielen anderen Texten könnte man so beschreiben:

Sie sind an einem Stück (kontinuierlich)Sie haben einen Anfang und ein Ende (linear)Es findet i.d.R. ein linearer Informationsaufbau statt

Page 27: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Eigenschaften von Texten

Hypertexte

Hypertexte unterscheiden sich von den meisten bekannten Textsorten in einem nicht unerheblichen Umfang:

Sie sind aus vielen Stücken (diskontinuierlich)Sie haben keinen Anfang und kein Ende (nonlinear)Es existiert eine modulare (zerstückelte) Informationsdarstellung

Page 28: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Status von Hypertext

Inkunabelstatus (incunabula = Wiege)

Medienhistorisch und textgeschichtlich befinden sich Hypertexte in einem Inkunabelstatus (incunabula = Wiege), da sie die ersten Produkte einer neuen mediengeschichtlichen Phase sind

Sehr oft unterscheiden sie sich nur ganz marginal von gedruckten Büchern und Dokumentationen

Page 29: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Status von Hypertext

Inkunabelstatus

Die Druckerzeugnisse aus der Zeit von 1450-1500 werden in der Buchwissenschaft als 'Inkunabeln' bezeichnet:

von zeitgenössischen handgeschriebenen Büchern oft nicht zu unterscheidenexperimenteller typographischer und drucktechnischer Zustand noch nicht vollwertige Druckerzeugnisse eine Kommunikations- und Produktionsform, die eben noch in der Wiege liegt

Page 30: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Status von Hypertext

Inkunabelstatus

Page 31: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Status von Hypertext

Inkunabelstatus

Das eBook

Page 32: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Status von Hypertext

Die für das elektronische Medium spezifischen Eigenschaften

flexible interaktive Textstrukturen ästhetisch attraktiver Medieneinsatz Einsatz von Programmiersprachen eventuell 'künstliche Intelligenz

werden aus technischen und vor allem aus textrhetorischen Gründen (noch) nicht hinreichend genutzt

Page 33: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Zusammenhalt von Hypertext

Bei Hypertexten geht es um Fragen, die sich mit dem 'Auseinanderfallen' eines Textes beschäftigen

EntlinearisierungModularisierungFragmentarisierung

Zusammengehalten wird ein Text durch

Kohäsion Kohärenz Konzeptaufbau Themenprogression

Page 34: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Zusammenhalt von Hypertext

Grammatische Verflechtung – Kohäsion

Textbildender Zusammenhang von Sätzen, insofern er sich vorwiegend auf alle satzübergreifenden grammatischen Zusammenhänge im Text bezieht.

Beispiele für kohäsive Mittel

‚Im folgenden‘ verweist auf den nachfolgenden Text (Katapher)‚Dieser Bildschirm‘ ‚zeigt‘ auf das aktuell sichtbare Fenster (Deixis)‚Solches Hilfethema‘ verweist zurück auf 'Hilfethemen' (Anapher)

Page 35: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Navigation

Rhizomatischer Aufbau einer Internetseite

Wo ist ‚im folgenden...‘ ???

Page 36: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Zusammenhalt von Hypertext

Grammatische Verflechtung – Kohäsion

Zeigt sich immer direkt an der Oberflächenstruktur von Texten

Wort oder eine Wortgruppe, die sagt: • X bezieht sich auf Y• X wiederholt Y• X ersetzt Y usw.

Kohäsion ist zunächst eine Eigenschaft von Texten

muss von jemandem geschaffen worden sein (Textautor)jemand muss es bemerken (Textleser)

Page 37: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Zusammenhalt von Hypertext

Grammatische Verflechtung – Kohäsion

Beim Schreiben von Hypertexten keine kohäsiv sinnlosen Textverflechtungsmittel benutzen

Informationelle Texteinheiten müssen, wenn sie nicht für eine ganz bestimmte Stelle in einer Lesesequenz vorgesehen sind, unbedingt kohäsiv geschlossen sein

Autoren müssen erst lernen, ganz bewusst zwischen verschiedenen Schreibstilen hin- und herzuschalten

Page 38: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Zusammenhalt von Hypertext

Semantische Verflechtung – Kohärenz

textbildender Zusammenhang von Sätzen satzübergreifende semantische Zusammenhänge im Text

keine Eigenschaft des Textes, sondern das Ergebnis kognitiv-konstruktiver Prozesse im Kopf des Lesers

muss im Text nicht unbedingt formal sichtbar seinKohärenz herzustellen, ist Fähigkeit von Lesern, nicht eine Eigenschaft von Texten

Texteinheiten für hypertextartige Texte sollten semantisch abgeschlossen sein

Page 39: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Konzeptaufbau und Themenprogression

Anreicherung durch semantische Merkmale, die ein Begriff - im Laufe seiner Verwendung im Text - erfährt

geordnet-sinnvolle (lineare) Sequenz von thematisch geschlossenen Teiltexten je größer der Grad der Entlinearisierung bzw. Modularisierung, desto größer die Anzahl der unkohäsiven Teiltextverknüpfungen

Zusammenhalt von Hypertext

Page 40: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Navigation

Aufbau einer Internetsite gut planen und dabei unbedingt achten auf

Kohäsion Kohärenz Konzeptaufbau Themenprogression

Page 41: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Eigene Praxis

Webseitenerstellung mit einem HTML-Editor

‚Zu Fuß‘ – im QuellcodeMit einem WYSIWYG-Editor(What You See Is What You Get)

Page 42: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Multimediaressourcen

Einbindbare MedienBild Euro Geld

http://www.geschichte.nrw.de/chronik/media/2002_1010652601.jpghttp://www.geschichte.nrw.de/chronik/grossansicht.php3?id=270

Soundhttp://www.premiumerlebnis.de/Sounds/lr.mp2

Videoclip Warsteiner Brauereihttp://www.ftp-warsteiner.com/movies/warsteiner_grusel.mov

Page 43: Hypertext Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

Hypertext

Einführung Hypertext und Webseitengestaltung mit Hyper-Text Markup Language (HTML)

ENDE