<\/p>\n
André Minhorst, Duisburg<\/b><\/p>\n
Das Erstellen einer Online-Hilfe sollte eigentlich ein Klacks sein. Ein paar HTML-Seiten mit Word oder einem anderen Programm zusammenschreiben, in ein Verzeichnis speichern und fertig. Doch was, wenn die Hilfe so umfangreich wird, dass Sie dem Anwender vielleicht doch noch ein Inhaltsverzeichnis oder einen Index zur Verfügung stellen möchten Der HTML Help Workshop hilft Ihnen hier weiter, wie der vorliegende Beitrag zeigt.<\/b><\/p>\n
Einer der – vor allem von Anfängern – am meisten missverstandenen Begriffe der Computerwelt ist wohl Online-Hilfe. Das resultiert vermutlich vor allem aus dem in die Irre führenden Wort Online. Einige Anwendungen bieten echte Online-Hilfen an, die einen Abruf von Hilfestellungen zu verschiedenen Themen über das Internet ermöglichen.<\/p>\n
Der Begriff Online-Hilfe umfasst aber auch die allgegenwärtigen Anwendungen, die von den jeweiligen Programmen aus gestartet werden und Hilfe zu diesem Programm im HTML-Format anbieten.<\/p>\n
In den folgenden Kapiteln erfahren Sie, wie Sie mit dem HTML Help Workshop eine professionelle Online-Hilfe für Ihre eigenen Anwendungen erstellen können.<\/p>\n
Der HTML Help Workshop ist ein kostenloses Tool von Microsoft. Sie können es unter der folgenden Internetadresse herunterladen:<\/p>\n
Fehler! Hyperlink-Referenz ungültig.<\/p>\n
Dort finden Sie auch weitere Informationen zur Installation, zu den Systemanforderungen (Sie brauchen in jedem Fall den Internet Explorer, empfohlen ab Version 4) und zu eventuellen Sicherheitslücken.<\/p>\n
Nach der Installation können Sie sich allerdings noch nicht direkt an die Arbeit mit dem HTML Help Workshop begeben – erst einmal sind einige Vorarbeiten zu erledigen.<\/p>\n
Der HTML Help Workshop bietet unter anderem die nachfolgend aufgeführten Funktionen zur Erstellung einer professionellen Online-Hilfe an:<\/p>\n
![](\"..\/fileadmin\/_temp_\/{662EF6B8-0DD3-4AA2-84A7-5E4E385DB88C}\/pic001.png\")
<\/p>\n
<\/b><\/p>\n
Bild 1: Der HTML Help Workshop<\/span><\/b><\/p>\n Machen Sie sich zunächst ein paar Gedanken, wie Ihre Anwendung aufgebaut ist und wie dementsprechend die Online-Hilfe aussehen könnte. In der Regel können Sie die Online-Hilfe ähnlich wie die Struktur der eigentlichen Anwendung gestalten.<\/p>\n Nach der Theorie folgt die Praxis: Starten Sie nun den HTML Help Workshop und legen Sie mit dem Menübefehl File\/New und anschließender Auswahl des Eintrages Project ein neues Projekt an.<\/p>\n Die Anwendung startet automatisch den Assistenten zum Anlegen eines neuen Projektes und fragt in den folgenden Schritten einige Informationen ab – z. B. den Namen der zu erstellenden Projektdatei und deren Speicherort. Die Projektdatei wird anschließend unter dem angegebenen Namen mit der Endung .hhp gespeichert.<\/p>\n Der HTML Help Workshop sieht nun etwa wie in Bild 1 aus. Der linke Bereich des Fensters enthält unter [Options] die bisher festgelegten Eigenschaften.<\/p>\n Mit der Schaltfläche Change Project Options können Sie einige Eigenschaften des Projektes einstellen. Hier können Sie z. B. den Text der Titelzeile, die beim Start anzuzeigende HTML-Datei, den Speichernamen der .chm-Datei und einige weitere Informationen festlegen.<\/p>\n Einige davon werden Sie in den nachfolgenden Abschnitten noch näher kennen lernen.<\/p>\n Nun schaffen Sie die Voraussetzung, um die Online-Hilfe mit Inhalten zu füllen. Mit einem HTML-Editor Ihrer Wahl können Sie nun zwei oder mehr Beispielseiten erstellen, in denen Sie beliebige Texte usw. unterbringen.<\/p>\n Speichern Sie diese am besten in dem gleichen Verzeichnis, in dem Sie die Projektdatei gespeichert haben.<\/p>\n Das Hinzufügen der HTML-Dokumente erfolgt durch einen Mausklick auf die Schaltfläche Add\/Remove Topic Files im linken Bereich des HTML Help Workshops.<\/p>\n Sie sehen nun ein Fenster, das bisher noch keine Topic Files enthält. Nach einem Mausklick auf die Schaltfläche Add… erscheint ein Dialog zur Auswahl der gewünschten Datei. Wählen Sie hier die gewünschte(n) Datei(en) aus. Nach dem Schließen des Fensters mit dem Titel Topic Files erscheinen die eingebundenen Dateien namentlich im linken Teil des Anwendungsfensters unter [Files].<\/p>\n Wenn Sie auf diese Weise zwei oder mehr HTML-Dateien eingebunden haben, dürfen Sie einen Blick auf das Zwischenergebnis werfen. Dazu kompilieren Sie die Online-Hilfe zunächst mit der Schaltfläche Compile HTML File.<\/p>\n Nachdem Sie per Dialog die gewünschte Projektdatei ausgewählt haben, erscheint im rechten Bereich des Anwendungsfensters ein weiteres Fenster mit dem Inhalt der Log-Datei.<\/p>\n Hier finden Sie eine Auflistung der durchgeführten Aktionen sowie der dabei verwendeten Dateien.<\/p>\n Nach der Erstellung können Sie sich die Online-Hilfe nun mit einem Mausklick auf die Schaltfläche View Compiled File ansehen.<\/p>\n Das Ergebnis ist ernüchternd: kein Index, kein Inhaltsverzeichnis – das Fenster zeigt lediglich eine der HTML-Dateien an (in der Regel die erste in der Liste) und ein Wechsel zu der anderen Seite ist nicht möglich.<\/p>\n Zur ergonomischen Gestaltung der Online-Hilfe gibt es drei Möglichkeiten:<\/p>\n Selbstverständlich ist eine Kombination aller drei Möglichkeiten die beste Lösung, sofern die Komplexität der Hilfe das verlangt.<\/p>\n <\/b><\/p>\n Bild 2: Anlegen eines neuen Inhaltsverzeichnisses<\/span><\/b><\/p>\n Da Sie zur Erstellung der Online-Hilfe über rudimentäre HTML-Kenntnisse verfügen sollten, enthält der vorliegende Beitrag keine Informationen über das Erstellen von HTML-Dateien und die Verwendung von Hyperlinks zur Verknüpfung unterschiedlicher HTML-Seiten.<\/p>\n Eine Beschreibung der anderen beiden Möglichkeiten finden Sie in den folgenden Kapiteln.<\/p>\n Damit die Online-Hilfe benutzbar wird, legen Sie nun ein Inhaltsverzeichnis an. Neben der Registerseite Projects finden Sie in der Anwendung noch zwei weitere Registerseiten: Contents und Index. Wechseln Sie zunächst auf die Registerseite Contents.<\/p>\n <\/p>\n Da Sie noch kein Inhaltsverzeichnis angegeben haben, können Sie nun wählen, ob Sie eine neue Inhaltsverzeichnis-Datei erstellen oder eine vorhandene Datei verwenden möchten (siehe Bild 2). Wählen Sie hier die erste Option und geben Sie im folgenden Dialog den gewünschten Dateinamen und Speicherort an.<\/p>\n Anschließend erfolgt der Wechsel zum Registerblatt Contents. Hier finden Sie einige Schaltflächen, die dem Hinzufügen, Entfernen und Verschieben der einzelnen Einträge dienen.<\/p>\n Es gibt zwei unterschiedliche Eintragsarten: überschriften (Headings) und Seiten (Pages).<\/p>\n Durch einen Mausklick auf die Schaltfläche Insert a heading können Sie dem Inhaltsverzeichnis eine überschrift hinzufügen. Mit der Schaltfläche Insert a page erledigen Sie das Gleiche mit einer Seite.<\/p>\n Der Unterschied ist, dass Sie einer überschrift weitere überschriften und Seiten unterordnen können. Außerdem erfordern Seiten die Angabe einer HTML-Seite, die beim Mausklick des Anwenders auf den jeweiligen Eintrag angezeigt werden soll. Bei einer überschrift ist diese Möglichkeit optional.<\/p>\n <\/b><\/p>\n Bild 3: Eigenschaften eines neuen Eintrags<\/span><\/b><\/p>\n <\/b><\/p>\n Bild 4: überschriften und Themen des Inhaltsverzeichnisses<\/span><\/b><\/p>\n Sie können theoretisch einfach erst einmal alle HTML-Seiten, die Sie aufnehmen möchten, als Seite in das Inhaltsverzeichnis einstellen und die gewünschten überschriften hinzufügen.<\/p>\n Beim Klick auf eine der beiden Schaltflächen Insert a page und Insert a heading erscheint jeweils der Dialog aus Bild 3. Unter Entry title: geben Sie den anzuzeigenden Text an. Mit der Schaltfläche Add öffnen Sie einen Dialog, mit dem Sie eine der eingebundenen HTML-Dateien an den jeweiligen Eintrag binden.<\/p>\n Auf der Registerseite Advanced finden Sie noch drei interessante Optionen: Mit Mark as new entry können Sie den aktuellen Eintrag als neu deklarieren. Er erhält dann ein anderes Icon, z. B. eines mit einem Sternchen.<\/p>\n Mit der Option Change entry to a page können Sie bestehende überschriften in Seiten und Seiten in überschriften umwandeln, ohne die bereits eingegebenen Eigenschaften ändern zu müssen.<\/p>\n Die Option Image index bietet schließlich unterschiedliche Symbole zur Auswahl an. Falls Sie eine dieser Eigenschaften später ändern möchten, können Sie den Dialog mit der Schaltfläche Edit selection erneut öffnen.<\/p>\n Nach dem Anlegen der Einträge können Sie diese mit den Pfeil-Schaltflächen sortieren und deren Hierarchie festlegen.<\/p>\n Um beispielsweise eine überschrift einer anderen unterzuordnen, markieren Sie einfach die unterzuordnende überschrift und klicken auf die Schaltfläche mit dem Pfeil nach rechts.<\/p>\n Bild 4 zeigt, wie die Zusammenstellung und Konfiguration der gewünschten überschriften und Seiten aussehen könnte. Hier sehen Sie neben einigen überschriften und Seiten einen Eintrag, der mit einem roten Stern markiert ist. Dabei handelt es sich um einen als neu markierten Eintrag.<\/p>\n <\/b><\/p>\n Bild 5: Beispiel eines Inhaltsverzeichnisses<\/span><\/b><\/p>\n <\/b><\/p>\n Bild 6: Dialog zur Eingabe von Schlüsselwörtern<\/span><\/b><\/p>\n Wenn Sie die gewünschten Einträge für das Inhaltsverzeichnis vorgenommen haben, können Sie die Online-Hilfe noch einmal kompilieren und sich das Ergebnis ansehen (siehe Bild 5). Unter Umständen zeigt die Online-Hilfe nun willkürlich eine Seite an oder klappt nicht gewünschte Bereiche des Inhaltsverzeichnisses auf. Um festzulegen, welche Seite beim Starten der Online-Hilfe angezeigt wird, öffnen Sie auf der Registerseite Project den Dialog Options und wählen dort im Kombinationsfeld Default File die gewünschte Datei aus.<\/p>\n Um dem Anwender weiteren Komfort zu bieten, legen Sie nun einen Index an. Wie bereits bei der Erstellung des Inhaltsverzeichnisses wechseln Sie zunächst auf das entsprechende Registerblatt. Da Sie noch keine Indexdatei angelegt haben, wählen Sie im nun erscheinenden Dialog den Eintrag Create a new index file aus. Um alle Dateien des Projektes zusammenzuhalten, speichern Sie die Indexdatei im gleichen Verzeichnis wie die Projektdatei.<\/p>\n Das Hinzufügen der Stichwörter einer Seite zum Index kann auf zwei Arten erfolgen. Entweder Sie legen jedes Schlüsselwort einzeln an und wählen anschließend die HTML-Dateien aus, denen das Schlüsselwort zugewiesen werden soll, oder Sie gehen seitenweise vor und legen in jeder HTML-Datei die gewünschten Schlüsselwörter in einem bestimmten Verzeichnis an. Die Schlüsselwörter werden dann beim Kompilieren automatisch aus den Dateien ausgelesen.<\/p>\n Zum Eingeben einzelner Schlüsselwörter klicken Sie im Register Index auf die Schaltfläche Insert a keyword. Der nun erscheinende Dialog erinnert stark an den Dialog zum Festlegen der Einträge des Inhaltsverzeichnisses (siehe Bild 6).<\/p>\n Geben Sie im Textfeld Keyword das gewünschte Schlüsselwort ein und fügen Sie anschließend die Dateien hinzu, die das Schlüsselwort enthalten. Dazu klicken Sie auf die Schaltfläche Add und verwenden den anschließend erscheinenden Dialog.<\/p>\n Nach dem Schließen der beiden Dialoge erscheint das eingegebene Schlüsselwort in der Liste im linken Teil des Registers Index.<\/p>\n Nachdem Sie einige Schlüsselwörter eingegeben haben, können Sie das Zwischenergebnis durch erneutes Kompilieren und Anzeigen überprüfen.<\/p>\n Der Index funktioniert wie erwartet: Einträge, denen Sie nur eine Seite zugeordnet haben, zeigen diese nach einem Doppelklick an. Wenn ein Eintrag in mehr als einer Seite vorkommt, erscheint ein weiterer Dialog zur Auswahl der gewünschten Seite (siehe Bild 7).<\/p>\n <\/b><\/p>\n Bild 7: Dialog zur Auswahl von Themen<\/span><\/b><\/p>\n <\/b><\/p>\n Bild 8: Eingabe von Schlüsselwörtern<\/span><\/b><\/p>\n Wie die Abbildung zeigt, ist die Vergabe eines Titels für die einzelnen Seiten sehr wichtig. Wenn Sie keinen Titel vergeben, erscheint einfach das Wort Untitled gefolgt vom Dateinamen des gefundenen Dokuments.<\/p>\n Den Titel können Sie entweder direkt im HTML-Dokument zwischen die beiden Tags <title> und <\/title> setzen oder vom HTML Help Workshop aus eingeben.<\/p>\n Dazu wählen Sie das gewünschte Schlüsselwort und klicken auf die Schaltfläche Edit Selection.<\/p>\n Im nun erscheinenden Dialog wählen Sie den gewünschten Eintrag aus und klicken auf die Schaltfläche Edit. Im folgenden Dialog finden Sie die Eigenschaft Title zur Eingabe des gewünschten Titels.<\/p>\n Alternativ zur ersten Möglichkeit können Sie die Schlüsselwörter auch für jede HTML-Seite einzeln eingeben.<\/p>\n Wechseln Sie zunächst zurück zur Registerseite Project und klicken Sie doppelt auf die HTML-Datei, zu der Sie Schlüsselwörter festlegen möchten.<\/p>\n Sie finden den Quellcode der Datei nun im rechten Teil des Registerblatts. Positionieren Sie die Einfügemarke nun direkt vor den schließenden Body-Tag <\/body>.<\/p>\n Sie können auch jede andere Position in der HTML-Datei verwenden. Sie sollten dies aber einheitlich durchführen, um später leicht änderungen vornehmen zu können. <\/p>\n Anschließend wählen Sie aus der Menüleiste den Befehl Edit\/Compiler information aus. Im nun erscheinenden Dialog können Sie über die Schaltfläche Add beliebig viele Schlüsselwörter auswählen (siehe Bild 8).<\/p>\n Nach dem Schließen des Dialogs finden Sie im HTML-Quellcode der Datei einige neue Zeilen, die z. B. wie in Quellcode 1 aussehen.<\/p>\n Quellcode 1<\/b><\/p>\n <\/b><\/p>\n Bild 9: Onlinehilfe mit Volltextsuche<\/span><\/b><\/p>\n Diese Informationen werden im Browser nicht angezeigt, können aber beim Kompilieren der Online-Hilfe ausgewertet und in den Index aufgenommen werden.<\/p>\n Dazu müssen Sie vor dem Kompilieren noch eine Option einstellen. Dazu klicken Sie auf der Registerseite Project auf die Schaltfläche Change project options und wechseln im nun erscheinenden Dialog auf die Registerseite Files. Hier aktivieren Sie die Option Include keywords from HTML files. Nach dem nächsten Kompiliervorgang finden Sie alle auf diese Weise eingetragenen Schlüsselwörter im Index. Schlüsselwörter, die in mehreren Seiten vorkommen, bewirken – wie bereits oben beschrieben – die Anzeige eines Dialogs mit der Auflistung aller Vorkommnisse.<\/p>\n Mit den hier dargestellten Verfahren können Sie eine Online-Hilfe für normale Ansprüche erstellen. Es gibt noch einige Feinheiten und Verbesserungsmöglichkeiten, die im Rahmen des vorliegenden Beitrags allerdings nicht eingehend behandelt werden können.<\/p>\n Falls die Anwendung und damit auch die Online-Hilfe sehr komplex sind, können Sie dem Anwender zusätzlich noch eine Volltextsuche anbieten. Dazu gehen Sie folgendermaßen vor:<\/p>\n <\/b><\/p>\n Bild 10: Erweiterte Volltextsuche<\/span><\/b><\/p>\n <\/b><\/p>\n Bild 11: Online-Hilfe mit Favoritenverwaltung<\/span><\/b><\/p>\n Als Resultat der beschriebenen Schritte erhalten Sie ein Register mit der Bezeichnung Suchen, das zu beliebigen Schlüsselwörtern die entsprechenden Seiten anzeigt (siehe Bild 9).<\/p>\n Wenn Sie im letzten Schritt zusätzlich die Option Advanced aktivieren, bieten Sie dem Anwender weitere Möglichkeiten zur Volltextsuche an (siehe Bild 10), z. B. durch das Kombinieren mehrerer Begriffe mit logischen Operatoren wie Und, Oder usw.<\/p>\n Eine weitere sinnvolle Erweiterung umfangreicher Online-Hilfen ist die Verwaltung oft benötigter Seiten – so genannter Favoriten.<\/p>\n Um eine entsprechende Registerseite anzulegen, gehen Sie folgendermaßen vor:<\/p>\n Die kompilierte Online-Hilfe enthält nun zusätzlich eine Registerseite namens Favoriten. Hier können Sie die jeweils aktive Seite in die angezeigte Liste speichern und die gespeicherten Seiten schnell wiederfinden (siehe Bild 11).<\/p>\n Der HTML Help Workshop erfüllt alle Wünsche, die der Anwender von herkömmlichen Online-Hilfen kennt.<\/p>\n Ein interessantes Thema sind die unterschiedlichen Möglichkeiten, die andere Programme, die eine Online-Hilfe benötigen, anbieten. Im Beitrag Online-Hilfe mit Access, den Sie ebenfalls im vorliegenden Heft finden, erfahren Sie, wie Sie die Online-Hilfe von Access aus aufrufen können und welche Hindernisse es dabei gibt.<\/p>\n","protected":false},"excerpt":{"rendered":" Das Erstellen einer Online-Hilfe sollte eigentlich ein Klacks sein. Ein paar HTML-Seiten mit Word oder einem anderen Programm zusammenschreiben, in ein Verzeichnis speichern und fertig. Doch was, wenn die Hilfe so umfangreich wird, dass Sie dem Anwender vielleicht doch noch ein Inhaltsverzeichnis oder einen Index zur Verfügung stellen möchten Der HTML Help Workshop hilft Ihnen hier weiter, wie der vorliegende Beitrag zeigt.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_uf_show_specific_survey":0,"_uf_disable_surveys":false,"footnotes":""},"categories":[662002,66062002,44000028,44000026],"tags":[],"class_list":["post-55000086","post","type-post","status-publish","format-standard","hentry","category-662002","category-66062002","category-Ergonomie_und_Benutzeroberflaeche","category-Interaktiv"],"yoast_head":"\nStrukturierung der Online-Hilfe<\/h2>\n
Erstellen eines neuen Projektes<\/h2>\n
Einstellen der Optionen<\/h2>\n
Erstellen der Texte<\/h2>\n
Einbinden von HTML-Dokumenten in die Online-Hilfe<\/h2>\n
Kompilieren derOnline-Hilfe<\/h2>\n
Ansehen der Online-Hilfe<\/h2>\n
Inhaltsverzeichnis und Index<\/h2>\n
![](\"..\/fileadmin\/_temp_\/{662EF6B8-0DD3-4AA2-84A7-5E4E385DB88C}\/pic002.png\")
<\/p>\n![](\"..\/fileadmin\/_temp_\/{662EF6B8-0DD3-4AA2-84A7-5E4E385DB88C}\/pic003.png\")
<\/p>\n![](\"..\/fileadmin\/_temp_\/{662EF6B8-0DD3-4AA2-84A7-5E4E385DB88C}\/pic004.png\")
<\/p>\n![](\"..\/fileadmin\/_temp_\/{662EF6B8-0DD3-4AA2-84A7-5E4E385DB88C}\/pic005.png\")
<\/p>\n![](\"..\/fileadmin\/_temp_\/{662EF6B8-0DD3-4AA2-84A7-5E4E385DB88C}\/pic006.png\")
<\/p>\nSchlüsselwörter einzeln eingeben<\/h3>\n
![](\"..\/fileadmin\/_temp_\/{662EF6B8-0DD3-4AA2-84A7-5E4E385DB88C}\/pic007.png\")
<\/p>\n![](\"..\/fileadmin\/_temp_\/{662EF6B8-0DD3-4AA2-84A7-5E4E385DB88C}\/pic008.png\")
<\/p>\nSchlüsselwörter je HTML-Seite eingeben<\/h3>\n
Praxis-Tipp<\/h3>\n
<Object type=\"application\/x-oleobject\" \r\nclassid=\"clsid:1e2a7bd0-dab9-11d0-b93a-00c04fc99f9e\">\r\n<param name=\"Keyword\" value=\"Beispielschlüsselwort\">\r\n<param name=\"Keyword\" value=\"Beispielschlüsselwort2\">\r\n<param name=\"Keyword\" value=\"Beispielschlüsselwort3\">\r\n<\/OBJECT><\/pre>\n
![](\"..\/fileadmin\/_temp_\/{662EF6B8-0DD3-4AA2-84A7-5E4E385DB88C}\/pic009.png\")
<\/p>\n![](\"..\/fileadmin\/_temp_\/{662EF6B8-0DD3-4AA2-84A7-5E4E385DB88C}\/pic010.png\")
<\/p>\n![](\"..\/fileadmin\/_temp_\/{662EF6B8-0DD3-4AA2-84A7-5E4E385DB88C}\/pic011.png\")
<\/p>\n