Die Homepageregeln und Arbeitsmittel für www.fischelner-clemenspfarre.de
A) Werkzeuge zur Arbeit an HTML-Seiten;
B) Gliederung und Strukturierung;
C) Corporate Design;
D) 10 Web-Design-Sünden;
E) Lange Ladezeiten sind out;
F) Urheberrechte: Vorsicht beim Bilder-Klau
A) Werkzeuge zur Arbeit an HTML-Seiten
Werkzeuge die zur Arbeit an HTML-Seiten vom Internetteam empfohlen wurden!
1. Selfhtml ist ein "Lehrbuch", in dem alles nachgelesen werden kann was ein Einsteiger über HTML sucht. Hier die Internetseite von der man sich selfhtml herunterladen kann.
http://www.teamone.de/selfaktuell/
2. Der HTMLEDITOR Phase5 ist ein Editor mit wenig Ballast behaftet, da er den MS Internet- Browser und den MS- Explorer als Grundlage verwendet. Zum Pflegen und Erstellen von Internetseiten ist dieser besonders geeignet. Hier die Internetseite von der man sich den HTMLEDITOR Phase 5 herunterladen kann.
http://www.meybohm.de
B) Gliederung und Strukturierung
Siehe: selfhtml.htm bei http://www.teamone.de/selfaktuell/
Ein WWW-Projekt besteht aus wenigstens einigen, oft aus vielen, manchmal aus unzähligen HTML-Dateien. Je mehr Dateien das Projekt enthält, desto wichtiger wird eine schriftliche Fixierung der Datei- bzw. Verweisstruktur. Aber auch bei kleinen Projekten, die nur aus wenigen Dateien bestehen, sollten Sie sich vorher überlegen, was in welche Datei gehört, und wie die Dateien vernetzt werden sollen.
Hypertext zwingt Sie nicht zu bestimmten Formen. Hypertext ist ein nicht-lineares Medium. Der Anwender soll nicht der Reihe nach lesen, sondern auswählen, was ihn interessiert. Das ist eine große Freiheit, birgt jedoch zugleich die Gefahr des "lost in hyperspace" - Gefühls.
Die meisten Anwender im WWW sind keine erfahrenen Hypertext-Piloten. Bei Projekten, die aus mehr als einer Handvoll Seiten bestehen, sollten Sie deshalb versuchen, dem Anwender eine "Metapher" zu bieten, an die er sich halten kann. Mögliche Metaphern:
Buchmetapher: das Projekt hat Dokumentcharakter, besitzt ein Inhaltsverzeichnis und evtl. ein Stichwortverzeichnis, Dateien entsprechen Kapiteln usw. Diese Metapher eignet sich besonders für begrenzte Information zu bestimmten Themen, wobei die Daten selten upgedatet werden.
Verzeichnis- oder Baummetapher: das Projekt wirkt auf den Anwender wie ein Dateimanager. Es gibt Dateien mit Verweislisten, die durch ein Ordnersymbol gekennzeichnet werden, und Dateien mit Information, die durch Dokumentsymbole gekennzeichnet werden. Diese Metapher eignet sich besonders für große Datenbestände mit häufigen Neuzugängen, wobei jedoch der Informationsbereich, der abgedeckt wird, von vorneherein bekannt ist.
Die Indexmetapher: ein großes, alphabetisch oder nach anderen Kriterien (z.B. Datum, Zeit) sortiertes Verweisverzeichnis bildet den Zugang zur Information. Diese Metapher eignet sich besonders für Projekte, deren Informationsbereich nicht genau eingrenzbar ist, und bei denen häufig neue Daten hinzukommen.
Sobald der Anwender Ihre beabsichtigte Metapher erkennt, kann er sich
eine "räumliche Vorstellung" Ihres Projekts machen. Das ist eine ganz
wichtige Sache, die Sympathie des Anwenders gegenüber dem Projekt
hängt tatsächlich zum großen Teil davon ab, ob er diesen
Aha-Effekt hat oder nicht.
Siehe: selfhtml.htm bei http://www.teamone.de/selfaktuell/
Genauso wichtig wie ein Gliederungskonzept ist ein Corporate-Design-Konzept.
Das bedeutet, daß alle Dateien, die zu einem Projekt gehören,
ein optisch einheitliches Bild bieten, damit der Anwender intuitiv erkennt,
daß er sich noch im gleichen Projekt befindet. Corporate Design stellen
Sie her, indem Sie bestimmte Gestaltungselemente bei jeder Datei des Projekts
wiederverwenden. Das können sein:
Ein Logo. Es sollte an immer gleicher Stelle auf der Seite stehen, zum
Beispiel immer links oben am Seitenanfang. Wenn Sie mit der Frame-Technik
arbeiten, können Sie das Logo auch in einem fixen Bildschirmbereich
plazieren.
Grafische Symbole. Das sind kleine GIF- oder JPEG-Grafiken, die an
bestimmten Stellen stehen und eine für den Anwender sofort erkennbare
bzw. nachvollziehbare Bedeutung haben. Symbole können z.B. bedeuten:
"dies ist ein Beispiel", oder "dies ist eines unserer Produkte" oder "dies
ist ein Verweis, mit dem der Anwender das Projekt verläßt".
Textformate. Dazu gehört z.B., Beispiele
immer in diktengleicher Schrift darzustellen.
Corporate Design suggeriert Geschlossenheit. Besonders bei kommerziellen
Projekten, also bei Firmen, die sich vorstellen oder direkt etwas anbieten,
vermittelt Corporate Identity dem Anwender das Gefühl, es mit erfahrenen
Profis zu tun zu haben.
Siehe: http://www.t-online.de/computer/index/intcox65.htm Schlechte Web-Präsenz
Manche Internet-Seiten verlangen vom Betrachter einiges ab. Lange Wartezeiten, zu buntes Layout und nicht installierte Plugins lassen den User genervt weiterklicken. Damit es der eigenen Site nicht ebenso ergeht, hier eine Aufzählung der schlimmsten Sünden:
1. Sünde: Keine Alternativ-Version
Beim Einsatz von Java und Shockwave/Flash-Animationen zur Menüsteuerung
gilt es zu bedenken: Nicht jeder Surfer hat alle notwendigen Erweiterungen
installiert bzw. aktiviert. Durch eine alternative Version erhalten dennoch
alle Besucher Zugang zur Site. ...Fortsetzung
2. Sünde: Einsatz von Musik
Die musikalische Untermalung der Web-Seite nervt nicht nur die meisten
Besucher, sie kann auch teuer werden. Denn bei vielen "frei" im Netz erhältlichen
Songs fallen Gema-Gebühren an. Wer auf Sound dennoch nicht verzichten
will, sollte den Besucher entscheiden lassen, ob er den Sound hören
will oder nicht. ...Fortsetzung
3. Sünde: Falsch eingesetzte Schriften
Texte müssen lesbar sein. Daher gilt: mindestens 10pt große
Schriften verwenden. Da nicht auf jedem PC die komplette Schriften-Palette
installiert ist, bietet es sich an zusätzliche Alternativ-Schriften
einzusetzen (z.B. <font face="Arial, Verdana, MS Sand Serif">). ...Fortsetzung
4. Sünde: Falsch verwendete Grafikformate
Optimale Nutzung unterschiedlicher Grafik-Formate hilft unnötiges
Speichervolumen zu vermeiden. Das JPG-Format mit seiner hohen Kompressionsfähigkeit
eignet sich vor allem für Fotos. Das GIF-Format (max. 256 Farben)
sollte hingegen nur verwendet werden, wenn auch grafische Details sichtbar
bleiben sollen. ...Fortsetzung
5. Sünde: Wartende Betrachter
Lediglich acht Sekunden wartet der durchschnittliche Surfer bis eine
Seite geladen ist, sonst klickt er weiter. Daher gilt: Ladezeiten der eigenen
Homepage minimieren (kleine Bilder, keine riesigen Flash-Intros und kurze
Texte). ...Fortsetzung
6. Sünde: Farbenkoller
Farben prägen den Charakter einer Site. Ihr ungeschickter und
maßloser Einsatz macht sich daher negativ bemerkbar. Gutes Web-Design
verbietet das Mischen von Pastelltönen und Knallfarben ebenso wie
eine schlechte Lesbarkeit durch mangelnden Kontrast (z.B.: rote Schrift
auf blauem Grund). ...Fortsetzung
7. Sünde: zuviel Bewegung
Der Einsatz von animierten GIF's bringt nicht nur mögliche rechtliche
Probleme mit sich: Während sparsam eingesetzte Animationen noch auflockernd
wirken, erwecken übermäßig verwendete oft einen hektischen
Eindruck. Auch Laufschriften werden am Besten nur bei wichtigen Inhalten
(z.B. Newsticker) verwendet. ...Fortsetzung
8. Sünde: Frame-Chaos
Auch wenn sich die Netzgemeinde über den Einsatz von Frames streitet:
sinnvoll eingesetzt (z.B. für feststehende Navigationsleisten) haben
sie durchaus ihre Berechtigung. Allgemein gilt: auch bei einer Auflösung
von 640x480 Bildpunkten müssen alle Informationen innerhalb eines
Frames sichtbar werden können (z.B.: scrollen im Frame zulassen).
...Fortsetzung
9. Sünde: Schlechte Navigation
Eine durchdachte Navigationsstruktur ist das A und O jeder guten Web-Site.
Der Nutzer sollte auf jeder besuchten Seite erkennen, wo er sich gerade
befindet. Unterschiedliche Farben für Links (besucht / nicht besucht)
helfen dem User nachzuvollziehen, wo er bereits war. Navigationsmenüs
am oberen oder linken Bildschirmrand sorgen für einen aufgeräumten
Bildschirm. ...Fortsetzung
10. Sünde: Meta-Tags und die Suchmaschinen
Meta-Tags (z.B. title, description und keywords) sollten gepflegt werden.
Sonst kann es passieren, dass die eigenen Seiten in Suchmaschinen nicht
entsprechend gelistet werden oder dass der erläuternde Text zur Seite
nur Hieroglyphen enthält. ...Fortsetzung
Siehe: http://www.t-online.de/computer/index/intcox80.htm Homepage optimieren
Nichts ist ärgerlicher als Webseiten, deren Aufbau ewig dauert.
Damit alles etwas schneller geht, gibt es einige Tricks.
1. Grafiken auf ihren Informationswert prüfen
Grafiken beanspruchen den größten Speicherplatz. Also genau
überlegen, ob und welche Bilder auf die Homepage sollen...
2. Größe der Grafiken reduzieren
Egal wie schön oder informativ, Grafiken sollten nie den ganzen
Bildschirm ausfüllen. Die kleinste noch vertretbare Größe
reicht völlig...
3. Thumbnails verwenden
Stark verkleinerte Ansichten der Bilder, sogenannte Thumbnails, geben
dem Surfer einen ersten Eindruck. Sie werden schnell geladen und können
mit einem Link zur Großansicht versehen werden. Der Surfer kann so
selbst entscheiden, ob er die zeitintensive Version sehen will...
4. Das richtige Grafikformat
Je nach Art der Grafik ist es günstiger, das ein oder andere Grafikformat
zu wählen. Ein GIF ist auf 256 Farben beschränkt. Es eignet sich
daher für einfache Schaubilder mit vielen einfarbigen Flächen.
Bei Fotos oder Grafiken mit Farbverläufen ist die Verwendung von JPEG
ratsam. Hierbei werden jedoch nicht sichtbare Details herausgerechnet.
Eine spätere Bildbearbeitung ist nur noch eingeschränkt möglich...
5. JPEG-Kompressionen gezielt einsetzen
Beim Speichern als JPEG kann die Stärke des Kompressionsverfahrens
selbst bestimmt werden. Je komprimierter die Bilder, desto geringer der
Speicherbedarf, Nachteil: Informations- und Qualitätsverlust. Das
ideale Verhältnis zwischen Größe und Qualität läßt
sich ermitteln...
6. Überflüssige Titelseiten vermeiden
Eingangsseiten sind zwar meist nett anzusehen, enthalten oft aber keinerlei
Information. Der Surfer muß unnötig warten oder klicken. Daher
lieber darauf verzichten...
7. Tabellen aufteilen
Der Browser baut erst dann eine Tabelle auf, wenn er sämtliche
Daten im Speicher hat. Das kann dauern! Geschickter ist es, Tabellen in
mehrere Abschnitte zu teilen...
8. Vorsicht bei Bildern in Tabellen
Beinhaltet die Tabelle Bilder, dauerts noch mal länger. Wer Tabellen
für das Layout seiner Webseiten verwendet, sollte dies bedenken...
9. Keine externen Bilder oder Grafiken einbinden
Alles was auf fremden Servern liegt, kann lange Ladezeiten verursachen.
Ist der externe Server überlastet, geht oft nichts mehr. Eingebundene
Bilder und Grafiken sollten möglichst auf lokalen Rechnern liegen.
Wenn doch ein Zugriff nach extern nötig ist, ganz unten auf der Webseite
plazieren...
10. Kommentare aus dem Quelltext entfernen
Webeditoren bringen unzählige Kommentare im Quelltext unter. Bevor
die Seite ins Netz gestellt wird, sollten diese Kommentare gelöscht
werden. Aber Achtung: keine Scripts entfernen, auch sie sind in Kommentarmarken
gebettet...
F) Urheberrechte: Vorsicht beim Bilder-Klau
Siehe:http://www.com-online.de/computer/hpw-ol/urheberrechte/index.html Urheberecht
Wer sich mit fremden Federn schmückt, kann sehr leicht Ärger bekommen. com! sagt Ihnen, worauf Sie beim Thema Urheberrechte achten sollten.
Wenn Sie fremde Bilder, Texte, Sounds oder auch Animationen, Java-Applets oder Active-X-Controls in Ihre private Homepage einbauen und im Internet veröffentlichen, dann dürfen Sie das nur, wenn Sie die Zustimmung des Urhebers haben.
Verwenden Sie Bilder, die Sie zum Beispiel aus einem Buch heraus scannen oder sich irgendwo im Internet herunterladen, dann müssen Sie erst um Erlaubnis fragen. Im Internet schicken Sie dem Betreiber der Seite einfach eine E-Mail. Meistens hat niemand etwas dagegen, wenn Sie Grafiken für Ihre private Homepage nutzen wollen.
Drucken Sie aber sicherheitshalber die Antwort des Urhebers aus, damit Sie später seine Zustimmung beweisen können.
Wenn Sie auf Ihrer Homepage Personen abbilden, sollten Sie auch deren „Recht am eigenen Bild" beachten. Jeder kann selbst zu bestimmen, ob sein Bild irgendwo veröffentlicht werden darf. Außer dem Urheber des Bildes muß hier also auch die abgebildete Person zustimmen. Das gilt allerdings nicht für Personen der Zeitgeschichte, also bekannte und berühmte Persönlichkeiten, solange es sich nicht gerade um ein Nacktbild handelt.
Auch längere Texte wie E-Mails oder Newsgroup-Beiträge sind in der Regel urheberrechtlich geschützt. Selbst wenn Sie einen englischen Text ins Deutsche übersetzen, ändert sich daran nichts.
Genau so sind auch Sound-Dateien, Musikstücke, Animationen, Filme und Computer-Programme wie Java-Scripts, Java-Applets und Active-X-Controls geschützt. Auf ihrer Homepage dürfen Sie all das nur mit entsprechender Zustimmung einsetzen.
Hyperlinks zu anderen Seiten dürfen Sie dagegen einsetzen, so viel Sie wollen. Sie sollten nur keine fremden Seiten per Link in ein Frame (Rahmen) Ihrer Homepage übernehmen. Denn für den Nutzer würde das dann so aussehen, als sei die fremde Seite Ihre eigene Leistung.
Am einfachsten vermeiden Sie Probleme, wenn Sie sich Ihre Homepage selbst
gestalten. Lassen Sie Ihrer Kreativität freien Lauf. Schöner
wird Ihre Homepage ohnehin, wenn Sie nicht alles bei anderen einsammeln.
Ihre eigenen Rechte: Schutz vor Dieben
Was tun, wenn jemand sich auf Ihren Seiten bedient hat, ohne zu fragen?
>Schreiben Sie dem Bilder-Dieb eine E-Mail und fordern
Sie ihn auf, die geklauten Elemente von seiner Seite zu
entfernen.
>Weisen Sie den Provider des Diebes auf den Rechtsverstoß
hin.
>Lassen Sie sich von einem Anwalt beraten, wenn
Ihnen die Sache wirklich wichtig ist.
>Schützen Sie Ihre Seiten vorsorglich mit dem
„Copyright"-Zeichen. Dann kann sich niemand herausreden, nicht von Ihrer
Urheberschaft an den geklauten Bildern nichts gewußt zu haben.
Stand: 23.04.2001 |