Gebrauchsanweisung Template Lernumgebung Einführung Übersicht:

Transkript

1 Einführung Willkommen. Auf den nächsten Seiten erfahren Sie, wie Sie das Template Autodidaktische Lernumgebung benutzen, um Ihre eigene Lernumgebung zu erstellen. Sie werden Ihre Lernumgebung in Dreamweaver 4.0 anlegen, Ihr eigenes Logo einbinden, um dann die Startseite mit Ihren Rubriken zu füllen. Der Rubriktitel verlinkt auf eine html-seite, die im neuen Fenster öffnet und die Sie frei gestalten können. Sie können hier bei Bedarf wiederum einen Lernpfad oder ein Lernarrangement einbinden. Bitte lesen Sie dazu die Gebrauchsanweisung Template Lernpfad bzw. Gebrauchsanweisung Template Lernarrangement. Übersicht: Seite 2: Seite 3: Seite 4: Seite 5: Seite 6: Seite 7: Was Sie brauchen, bevor Sie anfangen Projekt in Dreamweaver anlegen Titel vergeben Austauschen der Logos Logo oben Kurstitel, Rubriken, Beschreibungen ändern Html-Seiten, Lernpfad oder Lernarrangement in Rubriken einbinden Hinweis: Dieses Template ist für Dreamweaver 4.0 optimiert. Rickert_

2 Was brauchen Sie, bevor Sie anfangen? 1. Das Logo Ihres Instituts als Gif-Datei (institutsname_logo.gif) Legen Sie diese Datei in den Ordner templates / images / eigene Bilder. 2. Den Titel Ihrer autodidaktischen Lernumgebung müssen Sie als geglättetes Gif-Bild erzeugen. Verwenden Sie dazu in Phototshop die Schrift Frutiger 65 Bold, Schriftgrad 24 Pixel, Zeilenabstand 24 Pixel, Laufweite 0, Schriftfarbe RGB(153,153,153) geglättet (Auflösung 72dpi). Legen Sie diese Datei in den Ordner templates / images / eigene Bilder. 3. Die Inhalte Ihrer Rubriken in Form einer html-seite, eines Lernpfades (vgl. Template Lernpfad) oder eines Lernarrangements (vgl. Template Lernarrangement). Rickert_

3 Projekt in Dreamweaver anlegen 1. Klicken Sie in der Menüleiste von Dreamweaver den Menüpunkt Site / Neue Site an. Es erscheint das Site-Definitions-Fenster. 2. Geben Sie in das Feld Site-Name den Namen Ihrer autodidaktischen Lernumgebung ein. 3. In dem Feld Lokaler Stammordner wird das Verzeichnis auf der Festplatte angegeben, in dem alle zu Ihrer autodidaktischen Lernumgebung gehörigen Dateien gespeichert werden. Benutzen Sie dazu den kleinen gelben Ordner (Durchsuchen), indem Sie darauf klicken. 4. Wählen Sie in dem erscheinenden Auswahlfenster Ihr lokales Verzeichnis aus, in dem sich der extrahierte Ordner Template Autodidaktische Lernumgebung befindet, und bestätigen Sie mit Auswählen. 5. Alle weiteren Einstellungen im Site-Definitions-Fenster können Sie auf ihren Standard-Werten belassen und Ihre Einstellungen mit OK bestätigen. 6. Nachdem Sie nun Ihre Site definiert haben, können Sie im aktualisierten Site-Fenster alle Dateien und Ordner sehen, die zu Ihrer autodidaktischen Lernumgebung gehören. Rickert_

4 Titel vergeben Damit in der Titelleiste des Browserfensters die korrekte Bezeichnung Ihrer autodidaktischen Lernumgebung erscheint und Suchmaschinen darauf zugreifen können, sollten Sie den Titel Ihrer Index-Seite umbenennen. Gehen Sie folgendermaßen vor: 1. Wählen Sie im Site-Fenster den Ordner autodidaktisch. Klicken Sie auf das +. Die einzelnen Seiten des Ordners werden angezeigt. 2. Öffnen Sie durch Doppelklick die index.html -Datei. 3. Wählen Sie aus dem Hauptmenü Fenster / Frames. 4. Das Frames-Fenster erscheint. Klicken Sie auf den äußersten Rand, der alle angezeigten Frames umgibt. Wenn dieser Rahmen schwarz wird und im Eigenschafts-Fenster links oben Frameset steht, haben Sie getroffen. 5. Ändern Sie nun in der Menüleiste des Hauptfensters im weißen Eingabefeld neben Titel den bestehenden Titel in einen aussagekräftigen für Ihre autodidaktische Lernumgebung. 6. Speichern Sie das Frameset ab (Datei / Frameset speichern) ohne der Datei einen neuen Namen zu geben, da es sonst zu Problemen bei der Verlinkung kommen kann. 7. Schließen Sie die Datei. Rickert_

5 Austauschen der Logos Logo oben Das Logo am Bildschirmkopf tauschen Sie in der Datei Logo.html aus. 1. Öffnen Sie die Datei Logo.html im Ordner autodidaktisch durch Doppelklick im Site-Fenster. 2. Klicken Sie im oberen Bereich auf das rechte Logo (../images / logos / fhg_logo.gif ). 3. Öffnen Sie, falls noch nicht geöffnet, das Eigenschaften-Fenster 4. In der Mitte oben im Eigenschaften-Fenster finden Sie das Eingabefeld Qu." 5. Klicken Sie auf das gelbe Ordnersymbol rechts neben dem Eingabefeld. 6. Wählen Sie den Ordner templates / images / eigene Bilder" und klicken Sie Ihr Logo (institutsname_logo.gif) an. 7. Klicken Sie auf Auswählen". Das Logo ist ausgetauscht. 8. Speichern Sie die veränderte Seite ab (Strg + S), ohne den Namen der Datei zu ändern. Rickert_

6 Kurstitel, Rubriken-Titel und Rubriken-Beschreibungen ändern In dem Template autodidaktische Lernumgebung sind der Kurstitel, die Rubriken-Titel und Rubriken-Beschreibungen neutral benannt. Wenn Sie diese ändern wollen, gehen Sie folgendermaßen vor: Kurstitel: 1. Öffnen Sie die Datei Start.html im Ordner autodidaktisch durch Doppelklick im Site-Fenster. 2. Klicken Sie im mittleren Bereich auf Hier steht der Kurstitel. 3. Öffnen Sie, falls noch nicht geöffnet, das Eigenschaften-Fenster 4. In der Mitte oben im Eigenschaften-Fenster finden Sie das Eingabefeld Qu." 5. Klicken Sie auf das gelbe Ordnersymbol rechts neben dem Eingabefeld. 6. Wählen Sie den Ordner templates / images / eigene Bilder" und klicken Sie Ihren Titel, den Sie als Gif-Bild erzeugt und hier abgelegt haben (vgl. S.2.2), an. 7. Klicken Sie auf Auswählen". Der Kurstitel ist ausgetauscht. Rubriken-Titel: 1. Klicken Sie auf den Rubriken-Titel, den Sie ändern wollen und markieren Sie ihn. 2. Überschreiben Sie den Rubriken-Titel mit Ihrem Rubriken-Titel. Die Formatierung und die Verlinkung bleibt erhalten. 3. Verfahren Sie genauso mit den anderen Rubriken-Titeln, die Sie verändern wollen. Rubriken-Beschreibungen: 1. Um die Rubriken-Beschreibungen zu ändern, verfahren Sie wie oben. 2. Wenn Sie einen roten Pfeil benutzen wollen, klicken Sie auf einen beliebigen roten Pfeil in der Vorlage, kopieren Sie diesen (Strg + C) und fügen Sie ihn an der von Ihnen gewünschten Stelle ein (Strg + V). 3. Wollen Sie Text entfernen, können Sie ihn einfach löschen. 4. Wollen Sie neugeschriebenen Text formatieren, öffnen Sie über das Menü Fenster / CSS-Stile das CSS-Stile-Fenster. Markieren Sie den Text, den Sie formatieren wollen und klicken Sie im CSS-Stile-Fenster auf den Stil, den Sie anwenden wollen. Das Ergebnis können Sie gleich im Hauptfenster sehen. 5. Speichern Sie die veränderte Seite ab (Strg + S), ohne den Namen der Datei zu ändern. Rickert_

7 Html-Seiten, Lernpfad oder Lernarrangement in Rubriken einbinden Wenn Sie im Site-Fenster den Ordner autodidaktisch geöffnet haben, sehen Sie hier den Ordner Rubriken. Öffnen Sie diesen Ordner, sehen Sie 8 Unterordner, die gemäß der neutralen Beschriftung der Rubriken benannt sind. Grundsätzlich sind die Rubriken-Titel auf der Startseite jeweils mit der index.html - Datei in den Rubriken-Ordner / Rubrik_Seiten verlinkt. Html-Seite einbinden: 1. Öffnen Sie im gewünschten Rubriken-Ordner den Ordner Rubrik_Seiten. 2. Speichern Sie Ihre Datei in diesem Ordner unter index.html ab. Bestätigen Sie die Wollen Sie die bestehende Datei ersetzen? Meldung mit OK. 3. Markieren Sie Dateien, die Sie nicht benötigen und löschen Sie diese. Bestätigen Sie die Dreamweaver Meldung mit OK. Lernpfad / Lernarrangement einbinden: 1. Löschen Sie alle Dateien und Ordner aus dem gewählten Rubriken-Ordner. 2. Kopieren Sie den Inhalt (alle Ordner und Dateien) Ihres erstellten Lernpfades / Lernarrangement in die Zwischenablage und fügen Sie diesen dann in den gewünschten Rubriken-Ordner ein. 3. Benennen Sie Ihre Start-Datei in index.html um und überprüfen Sie im in der Start- Datei die Verlinkung. Rickert_