Selbst wartbare Homepage. Wozu kann eine Internetpräsenz dienen? Reine Informationsangebote +...

Selbst wartbare Homepage

Wozu kann eine Internetpräsenz dienen?• Reine Informationsangebote• + Downloadmöglichkeiten, z.B. für

Unterrichtsmaterial• + "manuelle" Kontaktmöglichkeit zum Verkauf

von Produkten/Dienstleistungen• + Automatisierte Kontaktmöglichkeit zum

Verkauf von Produkten/Dienstleistungen, Warenkorb mit Zahlungsmöglichkeiten

• + Onlinekurse• + Online-Community, z.B. Forum• …

Was brauche ich mindestens?

• Einen Domainnamen (z.B. MeinName.de)• Einen sog. Webhosting-Provider

– stellt Speicherplatz zur Verfügung und mindestens die Mechanismen zum Abrufen von Webseiten mit einem Webbrowser

– Die meisten Provider ermöglichen auch das unkomplizierte Registrieren eines Domainnamens

Was muss ich investieren?• Einmalig:

– Konzeption, Layoutentwurf, ggf. Erst-Erstellung der Inhalte

– Ggf. Einrichtungsgebühr beim Webhoster• Laufend:

– Serverkosten– Domainkosten (z.B. ca. 0,50€/Monat für de-Domains)

• Angebotsvergleiche für Webhoster:– u.a. mit Tipps zur Providerwahl:

http://www.webhostlist.de/ – Im konkreten Bedarfsfall helfe ich gerne (Kontakt s.

letzte Folie)

Wartungsaspekte

• … ein kleiner Zeitsprung:– Die Internetpräsenz steht, die wichtigsten oder alle

aktuell vorhandenen Inhalte sind eingefügt• Das eigentliche Leben der Internetpräsenz

beginnt, und das heißt insbesondere Wartung, z.B.:– Aktualisieren vorhandener Inhalte– Hinzufügen neuer Inhalte/Seiten– Entfernen nicht mehr benötigter Inhalte/Seiten– …

Wartungsaspekte

• Ich habe dafür folgende Möglichkeiten– Wartungsvertrag (kommunikationsaufwändig)– Ich mache es selbst, und das kann ohne die richtige

Methode und die richtigen Hilfsmittel recht kompliziert sein, wie die folgenden Folien zeigen werden

– Dazu schauen wir uns erstmal eine übliche Webseite an …

Navigation,ggf. hierarchisch, aktuellenMenüpunkt möglichsthervorheben.

Seitenkopf, z.B. mit Logo,Impressum, ggf. Navigation, …

Seitenfuß, z.B. mit copyright,Datum, …

Ggf. seitenrelevante oder aktuelle Zusatzinfos. Muss nicht auf jeder Seite vorhanden sein. Auf mehreren Seiten kann der Inhalt identisch sein.

Layout einer Webseite (verbreitete Variante, kein Dogma)

Die grau hinterlegten Bereiche ändern sich beim Umschalten von Seite zu Seite auf alle Fälle.

INHALT

Wartung ohne weitere Hilfsmittel• Die eben gezeigte Darstellung hat 9

Menüpunkte• Das weist auf 9 sog. HTML-Seiten hin

(HyperTextMarkupLanguage – Seitenbeschreibungssprache für Webseiten)

• Soll z.B. der Text des ersten Menüpunktes geändert werden muss das auf allen 9 Seiten erfolgen (bei Verwendung von sog. statischem HTML)

• Die einzig sinnvolle Alternative und Voraussetzung für eine ohne Fachkenntnisse SELBST WARTBARE INTERNETPRÄSENZ sind sogenannte ContentManagementSysteme (CMS)

NavigationHinzufügen, Ändern, Umsortieren und Löschen von Menüpunkten an nur einer Stelle.

Grundprinzip eines ContentManagementSystems

Grundprinzip: Trennung von Layout, Navigation und Inhalt.Auf dem Webserver wird bei jedem Seitenaufruf alles mittels einer geeigneten

Programmiersprache seitenspezifisch zusammengebaut und an den aufrufenden Webbrowser ausgeliefert.

INHALTWird abhängig vom ausgewählten Menüpunkt an dieser Stelle eingefügt.

LayoutBei Bedarf Änderungen an nur einer Stelle.Es können unkompliziertverschiedene Layoutversionen/-varianten aktiviert werden.

… durch Speicherung in nur einer einzigen Datei (oder in einer Datenbank)

Generelle Möglichkeiten

• 1.) Freie oder kommerzielle CMS, die ausdrücklich auch unter dem Begriff CMS angeboten werden(im Folgenden einfach als CMS benannt)– z.B. Typo3, WordPress, Papaja, …

• 2.) Sogenannte Homepage-Baukästen oder Branchen-Homepages– z.B. von 1&1, …

• 3.) EdLOn (EditorLightOnline - Arbeitsname)(Eine Eigenentwicklung im Zusammenhang mit meinem Informatikunterricht)

CMS – allgemeine Merkmale (1)• Komplexe Benutzeroberfläche mit vielfältigen

Möglichkeiten, dadurch aber relativ hoher Einarbeitungsaufwand

• Meistens Datenbank-basiert • Benutzerverwaltung (Redakteure, Admins, …)• Workflow (bearbeiten, freigeben, veröffentlichen)• Arbeiten mit Vorlagen • Zum Bearbeiten / Erstellen / Ändern der Seiten sind

keine HTMLKenntnisse notwendig • WYSIWYG-Editor (What You See Is What You Get)• Maskenorientierte Eingabe von Texten und Bildern • Komplett über den Browser bedienbar • Navigation beliebig steuerbar

CMS – allgemeine Merkmale (2)

• Unterstützt die Erstellung barrierefreier Websites • Linklisten und Übersichtsseiten lassen sich ohne

Programmierkenntnisse erstellen • Bild- und Datei-Upload über Browser • Backup-Funktion • Meist ausführliches Hilfesystem, Handbuch,

Service und Support • Getrenntes Speichern und Veröffentlichen • Mit Zusatzmodulen erweiterbar

CMS – Angebote und Info-Quellen

• Online-Demo für das CMS Papaya (hier kann so gut wie alles ausprobiert werden): http://www.papaya-cms.com/demo-zugang.35.html

• Nach vielen Kriterien durchsuchbare Angebotsdatenbank: http://www.cms-vergleich.de/cms/?s=cmsauswahl

• Im konkreten Bedarfsfall helfe ich gerne (Kontakt s. letzte Folie)

CMS – Beispiel Papaya (1)

CMS – Beispiel Papaya (2)

Generelle Möglichkeiten

• 1.) Freie oder kommerzielle CMS, die ausdrücklich auch unter dem Begriff CMS angeboten werden(im Folgenden einfach als CMS benannt)– z.B. Typo3, WordPress, Papaja, …

• 2.) Sogenannte Homepage-Baukästen oder Branchen-Homepages– z.B. von 1&1, …

• 3.) EdLOn (EditorLightOnline - Arbeitsname)(Eine Eigenentwicklung im Zusammenhang mit meinem Informatikunterricht)

Homepagebaukasten

• Ist in vielen Hosting-Provider-Angeboten verfügbar, z.B.

Homepagebaukasten

• Grundablauf:– Wahl eines Themas– Wahl eines Layouts, ggf. in verschiedenen

Farbvariationen– Verfeinern des Layouts mit selbst gewählten Bildern– Aufbau der Navigation, dabei stehen zum gewählten

Thema passende Inhaltsseiten als Vorschlag bereits zur Verfügung

– Bearbeiten der Inhaltsseiten direkt im Webbrowser– Veröffentlichen

Generelle Möglichkeiten

• 1.) Freie oder kommerzielle CMS, die ausdrücklich auch unter dem Begriff CMS angeboten werden(im Folgenden einfach als CMS benannt)– z.B. Typo3, WordPress, Papaja, …

• 2.) Sogenannte Homepage-Baukästen oder Branchen-Homepages– z.B. von 1&1, …

• 3.) EdLOn (EditorLightOnline - Arbeitsname)(Eine Eigenentwicklung im Zusammenhang mit meinem Informatikunterricht)

EdLOn• Demo-Zugang:

editordemo.rp-keil.de• Das kann es:

• Seiteninhalte direkt im Webbrowser bearbeiten (Text, Tabellen, Bilder, Links)

• Inhalte formatieren (Überschriften, Formatvorlagen zuweisen (CSS-Styles), Listen usw.)

• Seiten anlegen (hierarchische Navigationsstruktur, Seitenanzahl ist nicht limitiert)

• Suchen und Ersetzen (seitenbezogen) • Übertragen von Bild- und anderen Dateien zum Server • Umstrukturierung der Navigation • Für Fortgeschrittene: bei Bedarf Editieren des HTML-

Quelltextes der Inhaltsseiten

EdLOn

• Das kann es (noch) nicht:– Benutzerverwaltung– Workflow (es gibt aber sog. Vorschauseiten)– Inhaltsobjekte (Gästebuch, Forum u.ä.) komfortabel

einfügen– ...

Vielen Dank!

• Bei Fragen:– Jetzt– Email: keil@rp-keil.de– Tel: 030 / 29 23 083

• Diese Präsentation steht zur Verfügung unter:cms.rp-keil.de