nicht angemeldet
Bewertung: Schulhomepage
Also,
ich fang mal so an: Vor einem Jahr kam man auf die geniale Idee die giftgrüne Schulhomepage unserer giftgrünen Schule umzubauen und sie ansehnlicher zu machen. Es fanden sich dann anfangs 6 jetzt nur noch 4 Recken zusammen und machten das zu dieser Zeit unmögliche möglich. Sprich: Sie machten aus nichts etwas!!!
Nun ich bin einer dieser 4 Recken(+ Lehrer aber wer zählt die schon mit :P ). Nun probieren wir um an Geldquellen zu kommen unsere Homepage "Wettbewerbs-tüchtig" zu machen. Sprich: Wir haben "nur" ein Budget von 200 € und alle Arbeiten werden zwar auf dem Zeugnis angemerkt, alle Arbeiten sind aber auf privater Basis....
Nun zum Hauptthema, es geht um die Seite: <a href="http://www.gil-marl.de" target="new">www.gil-marl.de</a>
Mich würde gerne daran interessieren, ob es Leute gibt die etwas auszusetzen haben oder eine Idee haben was noch fehlt. Wir verstehen uns als Schulzeitung, nicht Schülerzeitung! Das heißt wir schreiben nicht für Schüler sondern für die Schule was im Bereich der Formalität uns etwas sagen wir "einschränkt".
Bitte um rege Teilnahme am Denkprozess
Thorsten Beuth, Redaktion und Programmierung
-
Hi Thorsten,
Nun zum Hauptthema, es geht um die Seite: <a href="http://www.gil-marl.de" target="new">www.gil-marl.de</a>
zunächst der obligatorische Verweis auf </faq/#Q-19>, damit du weißt, wie man hier Links setzen kann ;)
Mich würde gerne daran interessieren, ob es Leute gibt die etwas auszusetzen haben oder eine Idee haben was noch fehlt.
Zunächst stößt mir "Optimiert für IE 5.5, 800x600" extrem sauer auf. Ich verwende einen wesentlich besseren Browser und eine höhere Auflösung und habe gute Gründe dafür. Außerdem kann man nicht für eine Auflösung optimieren, da ein Browserfenster niemals (ausgenommen Fullscreen-Fenster, die keiner verwendet) so groß wie die Auflösung ist. Diesbezüglich empfehle ich die intensive Lektüre von
http://selfhtml.teamone.de/html/allgemein/stil.htm
Die Schrift ist viel zu klein und somit furchtbar schlecht zu lesen. Auch der rote Hintergrund stört ein bisschen, speziell ganz oben bei der weißen Schrift. Ein etwas dezenterer Hintergrund ist anzuraten. Der Ticker lenkt auch etwas vom Inhalt ab, Bewegung tut einer Site selten gut.
Die Navigation ist gut gelöst, sie funktioniert auch ohne Javascript. Allerdings lässt sich der Navigations-Frame in Opera horizontal scrollen. body { overflow-x:hidden; } löst dieses Problem.
http://selfhtml.teamone.de/css/eigenschaften/positionierung.htm#overflow
Wenn ich über eine Suchmaschine beispielsweise auf http://www.gil-marl.de/terminkalender/index.html gelange, bin ich verloren - es gibt keinen Weg zurück zur Navigation. Da fehlt ein einfacher Link ;) Zusätzlich empfehle ich dringend den Einsatz von
http://aktuell.de.selfhtml.org/artikel/javascript/dyn-frames/
Ihr verwendet ein Frameset. Das heißt, man kann man nicht bookmarken. Weiters fehlen die Links im <noframes>-Bereich. So finden weder Sehbehinderte noch Textbrowser noch Suchmaschinen den Inhalt.
Der Einsatz von Kommentaren wie "---------Infos" ist bedenklich, denn "--" beendet genaugenommen einen Kommentar. Was der Browser daraus macht, ist also reines Glücksspiel. Die Seiten sind allesamt nicht valide, es gibt viele Fehler im Code. Beim Ausmisten hilft
In Summe ist es trotzdem eine recht gute Homepage für eine Schule, ihr habt euch beim Inhalt viel Mühe gegeben. Kompliment :)
LG Orlando
-
Hallo, Thorsten,
Arg, ja, Herr molily hat gedankenverloren Strg+W gedrückt und schwupps war das Posting weg, deswegen hier noch einmal knapp meine Kritikpunkt.
Nun probieren wir um an Geldquellen zu kommen unsere Homepage "Wettbewerbs-tüchtig" zu machen. Sprich: Wir haben "nur" ein Budget von 200 € und alle Arbeiten werden zwar auf dem Zeugnis angemerkt, alle Arbeiten sind aber auf privater Basis....
Wozu braucht ihr Geld?
Netzspeicherplatz scheint ihr zu haben, ansonsten gibt es einen kostenlosen Virtual Server für Schulen bei Domainfactory.
Mit einer monetärer Entlohnung bei so einem Projekt könnt ihr natürlich nicht rechnen...Nun zum Hauptthema, es geht um die Seite: <a href="http://www.gil-marl.de" target="new">www.gil-marl.de</a>
Du meintest anscheinend target="_blank"... :)
Wir verstehen uns als Schulzeitung, nicht Schülerzeitung! Das heißt wir schreiben nicht für Schüler sondern für die Schule was im Bereich der Formalität uns etwas sagen wir "einschränkt".
Das kenne ich, ich betreue selbst seit Jahren eine Schulhomepage.
Mich würde gerne daran interessieren, ob es Leute gibt die etwas auszusetzen haben oder eine Idee haben was noch fehlt.
Eigentlich hat Orlando alles gesagt, hier noch einige weitere Punkte.
1. Die Navigation desorientiert den Besucher, das Problem ist, dass auf den Unternavigationen kein Hinweis darauf gegeben wird, wo sich der Besucher momemtan findet.
Beispiel: Projekte -> Exkursionen enthält die Links "Home" [menu.html] und den Inhaltslink "Haus Ruhrnatur". Hier wäre erst einmal eine Orientierung bzw. ein sog. breadcrumb trail nötig, d.h. es müssten links zu allen Oberrubriken vorhanden sein und die momentan ausgewählte Rubrik müsste angezeigt werden, bspw. könnte [projekte/exkursionen/menu.html] so aussehen:<a href="menu.html">Hauptmenü</a>
<a href="projekte/menu.html">Projekte</a>
<strong>Exkursionen:</strong>* <a href="projekte/exkursionen/ruhrnatur/index.html">Haus Ruhrnatur</a>
* ...weitere Unterseiten...Ich persönliche rate euch das gesamte Navigationskonzept noch einmal zu überarbeiten.
Achja, das Logo oben links würde ich mit der Startseite verlinken. Das hat sich mittlerweile eingebürgert und wird von vielen Benutzern so erwartet.2. Der einleitende Strich ("- Gymnasium...") im title-Element ist überflüssig.
3. Das Framelayout wird im Opera nicht wie gewünscht angezeigt, da müsst ihr ggf. per Stylesheets und/oder im Frameset alle Ränder des linken und des oberen Frames auf Null setzen.
Orlando schrieb:
Allerdings lässt sich der Navigations-Frame in Opera horizontal scrollen. body { overflow-x:hidden; } löst dieses Problem.
Das ist falsch, denn im Mozilla und IE werden die Ränder richtig angezeigt (=keine, demnach keine Scrollbar), da müsst ihr eher was an den margins drehen, irgendwo habt ihr einen Fehler gemacht. Angesichts des grausamen Codes ist es klar, dass Anzeigefehler auftreten (wer valides HTML schreibt verhindert dies).
menu.html:
<STYLE type="text/css">
</head><body>
<p>BODY {MARGIN: 0px} </STYLE> </p>
Dort ist bspw. ein Fehler. Wenn auch im Stylesheet margin auf 0 gesetzt wird, im Opera bekomme ich Ränder angezeigt, genauso bei titel.html. Vielleicht ist es auch eine Schwäche des Tabellenlayouts - wozu braucht man für eine simple Linkliste drei (!) verschachtelte Tabellen?
4.
<noframes>
<body>
<p align="center"><b><font face="Tahoma" size="2">Die Web Welt des GiL verwendet Frames.</font></b></p>
<p align="center"><font face="Tahoma" size="1">Sie benötigen daher einen Browser, der die Anzeige von Frames unterstützt. Bitte kontaktieren sie uns für weitere Hinweise.</font></p>
<p align="center"><font face="Tahoma" size="1">
<a href="mailto:info@gil-marl.de">info@gil-marl.de</a> ]</font></p>
</body>
</noframes>Also bitte, ihr seid sicher nicht erst seit gestern im Geschäft. Wenn ihr schon Frames benutzt, dann macht das Frameset zugänglich, auch wie Orlando sagte die Unterseiten mit Navigationen in noframes-Bereichen.
Außerdem würde ich kein body-Element verwenden. Soweit ich DTDs lesen kann ist dies zwar erlaubt http://www.w3.org/TR/html401/present/frames.html#h-16.4.1, aber Selfhtml http://selfhtml.teamone.de/html/frames/definieren.htm#noframes schlägt kein body-Element vor.
5. Die Foootos! Manche Seiten mit vielen Bildern umfassen bis zu 1,5 MB (Obertauern 2002 AFAIR). Dort müsst ihr höhere JPEG-Kompressionen verwenden oder die Seiten aufteilen und stattdessen anwählbare Thumbnails einbinden. 30-40 KB für ein 200x150px-Bild oder 40-50 KB für ein 320x200px-Bild sind auf jeden Fall zuviel. Zwischendrin sind auch per HTML skalierte Grafiken.
Manche Fotos sind außerdem nach meinem Geschmack zu dunkel.6. Ein Kontaktformular kommt immer gut. Unter "Kontakt" würde ich auch zusätzlich ein Impressum unterbringen (auch wenn's redundant ist).
7. Das mit 800*600 stimmt einfach nicht. Ich weiß nicht wie ihr das hinbekommt, aber einige Seiten wie der Terminkalender werden erst ab einer Auflösung von >=1024 passend angezeigt.
8. Schriftgrößenangaben in der Einheit pt sind zu vermeiden, bitte lesen:
http://www.netandmore.de/faq/fom-serve/cache/1153.html
http://www.netandmore.de/faq/fom-serve/cache/414.html9. Der Stylesheet verschwendet Bandbreite:
P {FONT-FAMILY: tahoma,verdana,helvetica,courier,arial,sans-serif; FONT-SIZE: 8pt}
TD {FONT-FAMILY: tahoma,verdana,helvetica,courier,arial,sans-serif; FONT-SIZE: 8pt}
TH {FONT-FAMILY: tahoma,verdana,helvetica,courier,arial,sans-serif; FONT-SIZE: 8pt}
DL {FONT-FAMILY: tahoma,verdana,helvetica,courier,arial,sans-serif; FONT-SIZE: 8pt}
LI {FONT-FAMILY: tahoma,verdana,helvetica,courier,arial,sans-serif; FONT-SIZE: 8pt}
UL {FONT-FAMILY: tahoma,verdana,helvetica,courier,arial,sans-serif; FONT-SIZE: 8pt}
Irgendwie redundant, nicht?
P, td, th, dl, li, ul {font-family:tahoma,verdana,helvetica,courier,arial,sans-serif; font-size:1em;} reicht aus.
Im Übrigen hat es einen Sinn, dass th-Elemente anders angezeigt werden als td-Elemente.10. Über die Zugänglichkeit der Seite kann man nur traurig seufzen. Siehe http://www.barrierefreies-webdesign.de/wcag1/gebote.htm und http://www.w3.org/Consortium/Offices/Germany/Trans/WAI/webinhalt.html
Hm, das war es erst einmal, wenn ich einiges nicht ausführlich genug erklärt habe, bitte ich um Nachfrage, war nur etwas entzürnt darüber, dass ich alles neuschreiben müsste, deswegen im zweiten Anlauf kompakter.
Grüße,
Mathias