Musterseiten KAMI PRINT VERLAG. Peter Schießl

Transkript

1 KAMI PRINT VERLAG Peter Schießl Musterseiten Diese Musterseiten sind zur Ansicht im Internet bestimmt. Geringfügige Abweichungen zum Original, Änderungen der Formatierung, Fehler durch fehlende Verweise sind darum nicht auszuschließen. Schulungsbuch FrontPage Microsoft 2000

2 Kami Print Verlag PETER SCHIEßL Schulungsbuch Microsoft FrontPage 2000 Musterseiten Kami Print Verlag ISBN Dipl.-Ing. (FH) Peter Schießl Ravensburger Ring München Alle Rechte vorbehalten. Sowohl die Vervielfältigung einzelner Seiten, die Speicherung auf Datenträgern als auch jede andere Nutzung, z.b. die Verwendung des Buches oder der Übungen bei einem Computerkurs, sofern nicht jeder Teilnehmer das Buch erworben hat, bedürfen der schriftlichen Genehmigung durch den Autor. Gerichtsstand ist München. Dieses Buch wurde mit größter Sorgfalt erstellt. Dennoch kann weder Verlag noch Autor aufgrund der Vielfalt an Soft- und Hardware irgendeine Haftung für Schäden durch Fehler des Buches oder der beschriebenen Programme übernehmen. Produkt- und Preisänderungen vorbehalten. Alle Produktnamen sind eingetragene Markenzeichen der jeweiligen Hersteller, die nur zum Zwecke der Identifikation genannt werden.

3 Inhaltsverzeichnis GRUNDLAGEN 8 Internet-Grundlagen, FrontPage, HTML, Hyperlinks, Aufbau einer Webseite ERSTE Schritte IM INTERNET Was ist Internet? Geschichte und Begriffe Was kann Internet? Voraussetzungen Server und Client Internet-Namen Länderkennung Der Microsoft Internet Explorer DIE SUCHMASCHINEN Suche eingrenzen Nach Ausdrücken suchen Suchwörter kombinieren Wichtige Internet-Begriffe FRONTPAGE UND HTML Über FrontPage Die Vorteile einer Homepage Erforderliche Hardware Homepage-Speicherplatz DER AUFBAU EINER INTERNET-SEITE Die Wahl der Sprache Die Sprache des Internet HTML Hyperlinks Startseite Das Prinzip der Verknüpfung Schema einer Webseite Beispiel einer Seite mit Hyperlinks Die Gestaltung Über Bilder 27

4 ERSTE HOMEPAGE 28 Erstellen und gestalten ERSTELLEN UND SPEICHERN Einzelne Seite oder Web-Projekt? Der FrontPage-Bildschirm Text eintragen Seite speichern Unterordner erstellen Formatvorlagen zuweisen Design zuweisen TEXT UND TABELLE Die Symbolleiste Text Format übertragen Tabelle für die Adresse Spalten oder Zeilen Die Rahmenlinien Das Ergebnis Vorschau 39 HOMEPAGE AUSBAUEN 41 Design ändern, Linie, Zugriffszähler, Datum und Laufschrift DESIGN ANPASSEN Neue Übung Weitere Designs Design anpassen WEITERE FUNKTIONEN Datei öffnen Horizontale Linie Rückgängig Datum einfügen Ein Zugriffszähler Laufschrift 47

5 HYPERLINKS 49 einbauen und anpassen HYPERLINKS INTERN Über Hyperlinks Hyperlinks setzen Hyperlinks ändern Nächste Seite HYPERLINKS EXTERN Ein Web Die Startseite Startseite öffnen Startseite einrichten Neue Seite Neues Design Ordner Hyperlinks einrichten Hyperlinks testen Web vervollständigen Seiten aktualisieren 60 GRAFIKEN 61 als Aufzählungszeichen, ClipArts, Hintergrundbilder AUFZÄHLUNGSZEICHEN Über ClipArts und Photos Die Dateigröße bei Bildern Aufzählungszeichen Grafiken suchen Aufzählungszeichen für Design Aufzählungszeichen für Seite ClipArt erneut wählen CLIPARTS UND HINTERGRUND Grafik einfügen Der MS ClipArt-Katalog Bild übernehmen Bild anordnen 70

6 Clips importieren Ein Hintergrundbild Bild nach Zeitplan Ein Banner Eine Aufgabe BILDBEARBEITUNG Die Bildgröße Bilder komprimieren Tips für Bilder Bildbearbeitungsprogramme Bilder scannen Dateigröße reduzieren Komprimiert speichern Ränder abschneiden Weitere Bild-Optionen Schaltfläche erstellen Bilder per Hyperlink 84 KOMPLEXE PROJEKTE 86 Navigationsleiste, Webs verwalten, Seiten mit Frames EINE NAVIGATIONSLEISTE Über eine Navigationsleiste Navigationsstruktur einrichten Navigationsleiste setzen Weitere Navigationsleisten Schaltflächen einstellen Schaltfläche zu einer externen Seite Antwortadresse Externe Internet-Seite Gemeinsame Randbereiche KATEGORIEN UND BERICHTE Ansicht Hyperlinks Kategorien Wofür Kategorien? In Kategorien suchen Berichte 98

7 16. FRAMES Übung mit Frames Seiten zusammenstellen Seite speichern Hyperlinks einrichten Ohne Frames Startseite ändern SPEZIELLE SEITEN Gästebuch Feedbackformular Schaltfläche einstellen Neue Schaltflächen Formularseite Suchseite Hintergrundsound Anzeigenwechsler Seitenübergang Dynamische HTML-Effekte Office Spreadsheet Zum Web umwandeln WEB VERÖFFENTLICHEN Allgemeines FrontPage-Servererweiterungen Seiten auswählen Web kopieren Die Webadresse Seiten testen Änderungen Seiten ändern oder löschen Bei Suchmaschinen anmelden Suchwörter für Suchmaschinen INDEX ÜBERSICHT 120

8 Dritter Teil HomePage ausbauen Design ändern, Linie, Zugriffszä riffszäh- ler, Datum und Laufschrift

9 Kapitel 7 7. Design anpassen Bevor es zu Projekten mit mehreren Seiten geht, wollen wir die Grundlagen in FrontPage noch etwas festigen und dabei ein paar neue Funktionen kennenlernen. Wenn Sie eine Seite erstellen und gestalten können, ist ein großes Projekt (Web) später gar kein Problem mehr. 7.1 Neue Übung Da Sie die ersten Schritte schon kennen, nur eine kurze Anleitung:! Schreiben Sie den Beispieltext (oder einen eigenen Vorschlag).! Mit Formatvorlagen vorläufig formatieren (Überschrift 1 und 2, Aufzählung),! Speichern Sie die Seite schon einmal im Ordner Eigene Dateien\- Eigene Webs\Übungen FrontPage.

10 MS FRONTPAGE Weitere Designs! Mit Format-Design können Sie ein Design auswählen. Mehr Auswahl finden Sie mit Weitere Designs D installieren! Anschließend die FrontPage- oder MS Office CD einlegen.! Jetzt ist die Liste der Designs viel länger.! Sobald Sie ein neues Design zuweisen, wird dieses dauerhaft installiert. 7.3 Design anpassen Es stehen nicht nur zahlreiche Design zur Verfügung, sondern jedes Design kann noch individuell angepaßt werden. So kann auch vermieden werden, daß ein Betrachter der Seiten allzu schnell errät, daß es sich um ein fertiges FrontPage-Design handelt. Wenn ein Hintergrundbild verwendet wird, läßt sich natürlich keine andere Hintergrundfarbe wählen. Mit der Schaltfläche Ändern Ändern werden die Optionen ein- oder ausgeblendet.

11 MS FRONTPAGE 2000 Zu den Einstellungen! Anschließend können Sie z.b. bei Farben andere Farben für den Hintergrund oder bei Text eine Farbe für den Text sowie eine andere Schriftart usw. wählen. # Bei Farben entweder eine Farbskala (=Farbzusammenstellung) # oder auf der Karteikarte Hintergrund Hintergrund das gewünschte Element, z.b. den Hintergrund wählen und dann nur dessen Farbe ändern. # Die Farbskala kann auf der mittleren Karteikarte Farbenrand Farbenrand bestimmt werden, indem für den Text die Helligkeit mit dem Schieber und die Farbe durch Verschieben des Farbpunktes in dem Farbenkreis gewählt werden kann.! Oder bei Grafiken Grafiken andere ClipArts (hier Geschwindigkeitsmesser). # Andere Grafiken können mit der Schaltfläche Durchsuchen gefunden werden. Dazu später mehr. Vor OK das geänderte Schema unbedingt mit Speichern unter neu speichern, damit das Original-Design nicht verlorengeht! Zwischenstand der Seite: Die horizontalen Linien folgen im nächsten Kapitel.

12 10. Hyperlinks extern Kapitel 10 Jetzt folgt eine neue Übung, die aus mehreren Seiten besteht, so daß wir nun Hyperlinks zu anderen Seiten verwenden werden. Das heißt, daß beim Anklicken des Hyperlinks eine ganz andere Webseite geöffnet wird. Ob diese Seite zu unserem Projekt gehört oder auf einem ganz anderen Internet-Server irgendwo auf der Welt liegt, spielt dabei keine Rolle, wenn die richtige URL (Uniform Resource Locator = Adresse dieser Seite) eingegeben ist Ein Web Damit wir die MS FrontPage-Funktionen voll nutzen können (automatische Aktualisierung der Hyperlinks, Übersicht Hyperlinks oder verknüpfte Seiten usw.), sind mehrere, verknüpfte Seiten in einem Web Web zusammenzufassen.! Wählen Sie Datei-Neu Neu-Web oder drücken Sie den Pfeil bei dem Symbol Neue Datei. Für diese Vorlagen finden Sie hier eine treffende Beschreibung. Ohne Änderung würde der Name EigenesWeb1 verwendet werden. Wenn Sie später mehrere Webs erstellt haben, ist es schwierig, diese zu unterscheiden. Darum sollten wir einen passenden Namen vergeben. Verwenden Sie die Vorlage Standardweb Standardweb. Wir wollen eine private Home- Page eines Sportstudenten namens Albert Sturm erstellen, also bietet sich als Name für das Web folgendes an: C:\Eigene Dateien\Eigene Webs\Albert Sturm Web

13 MS FRONTPAGE Die Startseite Wir erhalten eine leere Seite in unserem Web. Wir beginnen absichtlich ohne Vorlage mit vorgefertigten Elementen, da es leichter zu erlernen ist, wenn wir zunächst alles selbst einrichten. Bei umfangreichen Seiten, vor allem, wenn die Seiten thematisch klar abzugrenzen sind, ist es sinnvoll, ein Projekt auf mehrere kleine Seiten aufzuteilen. Zunächst wird eine Startseite geöffnet, die das Inhaltsverzeichnis aus Hyperlinks enthält, so daß der Betrachter wählen kann, welche Seiten geöffnet werden sollen Startseite öffnen Index.htm Diese Startseite erhält gemäß dem im Internet üblichen Standard den Namen index.html (oder index.htm für DOS-Kompatibilität mit nur drei Buchstaben für die Dateiendung). Solch eine Startseite ist in unserem Projekt bereits angelegt. Bei Ordner werden die im Web enthaltenen Seiten angezeigt, im Moment noch nur index.htm: Wechseln Sie bei Ordner Ordner zur Startseite index.htm. Mit Doppelklicken können Sie eine Seite zum Bearbeiten in der Ansicht Seite öffnen. Sie sehen jetzt im Balken, daß Sie die Startseite bearbeiten: Auch wenn Sie das Web neu öffnen, können Sie in der Ordneransicht die Seite durch Doppelklicken öffnen, die Sie bearbeiten wollen. Doppelklicken öffnet die Seite in der Seitenansicht. Nach der Voreinstellung wird nämlich beim Öffnen eines Webs eine neue, leere Seite angezeigt.

14 MS FRONTPAGE Startseite einrichten Um die Startseite mit Inhalt auszufüllen, gehen Sie wie üblich vor.! Text schreiben, im Schnellverfahren mit Formatvorlagen vorformatieren, abschließend ein Design auswählen, vielleicht mit einer horizontalen Linie abgrenzen oder ein Datum oder Seitenzähler einfügen. Ein Vorschlag für die Startseite: Das werden die Hyperlinks zu den anderen Seiten. Den senkrechten Strich können Sie mit [Alt Gr]-< erzeugen Neue Seite Jetzt wollen wir die nächste Seite unseres Webs erstellen, die später durch Klicken auf den Hyperlink Wassersport geöffnet werden soll.! Wählen Sie Neue Seite (Symbol oder Befehl). Da wir in dem gleichen Web sind, erhält die neue Seite das gleiche Design. Es kann nie schaden, wenn wir die Seite sofort speichern.! Speichern drücken und als Dateiname Wassersport eintragen. Die Dateiendung wird übrigens automatisch ergänzt.

15 MS FRONTPAGE 2000 Füllen Sie die Seite z.b. mit folgendem Beispieltext: 10.4 Neues Design Wenn Sie ein neues Design zuweisen, wird auch die Startseite geändert. Das können Sie prüfen, indem Sie bei Fenster zur Startseite index.htm wechseln. Normalerweise ist das auch erwünscht, da in einem Web nur ein Design verwendet werden sollte, damit es nicht zu bunt wird. Von Ausnahmen abgesehen, und solch eine Ausnahme ist natürlich diese Wassersportseite, die in blau formatiert werden sollte.! Bei Format-Design können Sie links oben auf Ausgewählte Seiten umschalten, damit das Design nur der aktuellen Seite zugewiesen wird. Hier mit dem Design Fantasie in Blau. Warum Ausgewählte Seiten? Bei Ordner könnten Sie mehrere Seiten auswählen, denen dieses Design zugewiesen werden soll.

16 MS FRONTPAGE Weitere Navigationsleisten Wenn Sie auf jeder Seite die Navigationsleiste einzeln einfügen, können Sie die Navigationsleiste auf jeder Seite individuell einstellen.! Wechseln Sie zu einer untergeordneten Seite, z.b. Wassersport. Oben durch einige Returns gleich Platz schaffen.! Wählen Sie auch hier Einfügen-Navigationsleiste Navigationsleiste. Bei dieser untergeordneten Seite sollten auch die Hyperlinks zu der Startseite erscheinen sowie zu den anderen Seiten auf der gleichen Ebene: Auf jeder Seite können Sie auch eine andere Anordnung wählen. Das Ergebnis:

17 MS FRONTPAGE Schaltflächen einstellen Die Funktion Navigationsleiste erstellt folglich automatisch Hyperlinks zu anderen Seiten, genau wie wir es anfangs von Hand eingerichtet haben. Wir haben die Hyperlinks nur zuerst in Handarbeit erstellt, um den Umgang mit den Hyperlinks besser zu erlernen. Die Anordnung und welche Hyperlinks angezeigt werden, können Sie bei jeder Seite individuell bestimmen. # Nachträglich können Sie die Schaltflächen ändern, indem Sie auf der Navigationsleiste die rechte Maustaste drücken und Navigatii- onsleisteneigenschaften wählen. Automatische Texteinträge wie z.b. Nach oben können Sie auf diese Art ändern: # Im Navigationsbereich die rechte Maustaste drücken und Webei ein- stellungen wählen (oder Extras-Webeinstellungen Webeinstellungen), # dort zur Karteikarte Navigation Navigation umschalten. Ändern Sie Nach oben zu Zur Startseite und begutachten Sie das Ergebnis. Die Grafik der Schaltflächen können Sie über das zugewiesene Design ändern: # Format-Design Design, mit Ändern Ändern erweitern, # Schaltfläche Grafiken Grafiken und in diesem Fall die horizontale Navigationsleiste auswählen, dann ein anderes Bild suchen.! Ergänzen Sie die Navigationsleisten auf den anderen beiden untergeordneten Seiten.

18 MS FRONTPAGE Schaltfläche zu einer externen Seite Auch ein Hyperlink zu einer externen Seite, die nicht unserem Web angehört, kann in die Navigationsleiste integriert werden.! Hierfür ist die Navigationsansicht Navigationsansicht auszuwählen. Navigation! Dort dürfte die Symbolleiste Navigation sichtbar sein. Wenn diese wirklich nicht am Bildschirm erkennbar sein sollte, ggf. mit Ansicht- Symbolleisten-Navigation aktivieren (Häkchen beachten). Dann können Sie hiermit eine externe Seite in die Navigationsstruktur aufnehmen. Zuerst die Seite anklicken, auf der die externe Seite erscheinen soll. Mit der Schaltfläche externer Link können Sie folgendes auswählen: Eine -adresse angeben, zu der beim Anklicken ein geschickt werden kann. Eine andere Webseite auf Ihrem Rechner oder in Ihrem Intranet auswählen. Hiermit im Internet die Seite suchen (Verbindung muß hergestellt sein). Wenn Sie die Internet-Adresse (URL= Uniform Resource Locator = Adresse dieser Seite) kennen, können Sie diese direkt eintragen, z.b.

19 Übersicht Grundlagen: $ HTML: die Sprache im Internet. FrontPage speichert die Seiten automatisch in HTML, $ Java: Programmiersprache, oft als Erweiterung für Internet-Seiten eingesetzt, $ XML: Erweiterung der HTML-Sprache, $ http: Übertragungsprotokoll für HTML-Seiten, $ ftp: Übertragungsprotokoll zum Übertragen von Dateien, $ www: Internet mit Multimedia-Elementen (Bilder, Sound), $ Länderkennung am Ende der Adresse. FrontPage: $ Neue Seite oder Neues Web, $ Text mit Formatvorlagen einstellen, $ wenn Text nebeneinander angeordnet werden soll, eine Tabelle verwenden, $ Design zuweisen, $ Design ggf. anpassen, $ Speichern im Ordner Eigene Dateien en\eigene Webs. Ansichten wählen: $ Ansicht Seite zum Bearbeiten, $ Ordner zum Organisieren (öffnen, umbenennen ), $ Berichte: wählen über Ansicht-Berichte-, Web auswerten, z.b.:!"veröffentlichungsstatus,!"langsame Seiten,!"Dateigröße, $ Navigation: wenn eine Navigationleiste eingerichtet ist, kann hier die Navigationsstruktur kontrolliert werden, $ Hyperlinks: die Verknüpfung der Seiten über die Hyperlinks wird angezeigt.!"hyperlinks können überprüft werden, z.b. ob alle Seiten erreichbar sind oder ob es zur Startseite zurück geht. $ Aufgaben: hier können noch zu erledigende Aufgaben oder andere Notizen festgehalten werden. Spezielle Formatierungen (Einfügen infügen-): $ Wechsel: Zeilenwechsel erzwingen, $ horizontale Linie, $ Datum und Uhrzeit, $ Kommentare sind nur in der Normalansicht beim Bearbeiten der Seiten sichtbar, $ Navigationsleiste (Hyperlinks automatisch einfügen), $ Seitenbanner: Überschrift grafisch gestalten. Einfügen-Komponente: $ Z.B. Office Spreadsheet, Zugriffszähler, Laufschrift, Inhaltsverzeichnis (Startseite angeben) usw. Einfügen-Bild: $ Photos im jpg-dateiformat, $ Grafiken im gif- oder jpg-format, $ Einfügen-Bild-ClipArt: MS ClipArt Katalog starten oder beliebiges Bild auswählen mit Einfügen-Bild-Aus Datei,!"oder Video einfügen. Web veröffentlichen: $ URL angeben, online gehen und Web übertragen, $ anschließend alles testen, $ nach Änderungen der Seiten nur die geänderten übertragen (Menü erweitern), $ bei Suchmaschinen anmelden, Suchwörter vorgeben. Abkürzungen: Dateien: [Strg]-n, o, s. Datei-neu, öffnen, speichern. [Strg]-[F4] [F4] [Strg]-p Rückgängig, Kopieren: [Strg]-z [Strg]- x, c, v FrontPage: [Strg]-[k] [k] [Strg]- [Umschalt]-z [Strg]- [Umschalt]-b [Alt]-[Return] [Return] Seite schließen. Drucken (aus einem Programm). Rückgängig Weitere Abkürzungen: [F5] Ausschneiden, Kopieren, Einfügen. Hyperlinks einfügen. Formatierung entfernen. Vorschau im Browser. Eigenschaftsmenü öffnen. Ansicht aktualisieren.