Bitte Website bewerten [Editor]

pacmanfan · 15.03.2009 17:46

Ich arbeite derzeit an einer privaten Homepage.
Folgender Link führt zu einer Unterseite meines derzeitigen Projekts:
EDIT: Link nicht mehr verfügbar.

Der Code ist komplett handgeschrieben und auch das Layout habe ich gestaltet.

Bitte sagt mir eure Meinung dazu!

**Asipak4You** · 15.03.2009 18:31

Hallo,

deine Seite gefällt mir sehr gut:

- sehr übersichtlich gestaltet
- Breiten- und Schriftgrößen angaben sind in % und em

zum Inhalt kann ich nichts sagen, da ja noch nicht viel online ist!

Wenn die Überschriften nicht zu breit werden, könntest du diese - wie die Navigation - auch mitscrollen lassen.

**francesco** · 15.03.2009 18:41

Wenn schon HTML 5, dann auch richtig. Statt

Code:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-Type" content="text/html; charset=utf-8">

Code:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">

Ich würde noch zwei Sachen anders machen:

Den Link beim aktiven Navigationspunkt entfernen.

Anstatt

Code:

<style type="text/css">
@import url("../Design/Design.css");
@import url("../Design/Design_Druck.css") print, embossed, braille;
@import url("../Design/Design_Handheld.css") handheld, speech;
</style>

Code:

<link rel="stylesheet" href="../Design/Default.css">

und dann steht in der Default.css

Code:

@import url("../Design/Design.css");
@import url("../Design/Design_Druck.css") print, embossed, braille;
@import url("../Design/Design_Handheld.css") handeheld, speech;

Ansonsten gibt's nicht viel zu Meckern, der Code hat Semantik, das Design ist schlicht, HTML und CSS getrennt...gefällt mir.

**xXxPeterPanxXx** · 15.03.2009 19:54

ich finde das design fast perfekt, aber es ist etwas zu schlicht. vllt noch eine schöne headergrafik?

**ingoS** · 15.03.2009 20:09

Am Code habe ich nichts zu bemängeln.

Zum Design kann ich nicht allzu viel sagen, weil es ja quasi nicht vorhanden ist.

Folgendes ist mir aber dennoch aufgefallen:

Es wäre besser, wenn du Haupt-Überschrift, wie Asipak4You schon schrieb, ebenfalls fixieren würdest. Ich glaube, damit habe ich dann auch gesagt, ob ich die Fixierung der Navigationsleiste gut finde.

Die a:visited-Schrift ausgerechnet rot zu machen, ist eher nicht so günstig. Erstens ist das die Voreinstellung der meisten Browser für :active (ich hatte einen Link besucht, dann den Zurück-Knopf gedrückt und gleich erst mal wie blöd versucht, das Rot "wegzuklicken") und zweitens stechen die besuchten Links so mehr ins Auge als die nicht besuchten und das sollte ja nicht so gedacht sein, oder?

Am kritischsten finde ich es, dass du keine Maximalbreite für den Text vorsiehst. Es ist ja schön und gut, wenn alles variabel ist, aber leider kann keiner seine Augen mit der Textbreite auf dem Bildschirm mitwachsen lassen.

Was ich damit sagen möchte: So ab im Schnitt zwölf Wörtern pro Zeile ist wirklich endgültig Schluss mit komfortabler Lesbarkeit. Bei deiner Seite ist das mit meinen aktuellen Einstellungen leider schon überschritten.

Zu Opera 7 kann ich dir jetzt nicht helfen, aber im IE6 ist die komplette Navigation einfach nicht vorhanden...

**ingoS** · 15.03.2009 21:25

Zitat von pacmanfan

Okay, das lässt sich machen, müsste dann halt auch in allen Browsern funktionieren.

Die Aussage verwirrt mich jetzt etwas. Warum sollte das nicht funktionieren, wenn die Fixierung der Navigation funktioniert? Und der IE6 kann position: fixed; ja sowieso nicht...

Aber max-width wird vom IE 6 ja noch gar nicht unterstützt, soweit ich weiß.

Dafür gibt es ein (etwas krudes) Workaround unter Zuhilfenahme von expressions. Eine Google-Suche nach max-width ie6 bringt da einige recht hilfreiche Seiten hervor. Wichtig ist, dass das Versetzen in den Quirskmode, welches z.B. im ersten Treffer von April Design empfohlen wird, nicht notwendig sein muss (andererseits kann es in manchen Fällen den IE zum Abstürzen bringen, wenn es nicht gemacht wird). Svend Tofte lässt sich etwas ausführlicher aus und hat das Ganze auch noch einmal rückblickend kommentiert.
Eine Möglichkeit, das Ganze ohne JavaScript hinzubekommen, hat anscheinend noch keiner gefunden.

Was das Design angeht, liegt wohl mal wieder der klassische Fall vor, dass viele, die besonders gut XHTML, CSS, syntaktisch und semantisch korrekten und am besten noch barrierefreien Code etc. können, eher nicht so gut in Sachen Design sind (oder ihnen das Design eher unwichtig ist) und der typische Designer wiederum das andere nicht so gut kann (oder sich gar nicht darum kümmern will).
Das beruht vielleicht auch auf dem Missverständnis, dass man gut Designen schlechter lernen kann, dass man dafür eher Talent als Lernwille braucht. Häufig hört man auch, Design sei immer eher Geschmackssache. Das stimmt zwar schon, aber nur begrenzt. Es gibt Gestaltgesetze, die man lernen kann. Es gibt Gesetze zur Farbgebung, zu Größen- und Abstandsverhältnissen, zur Positionierung usw.
Klar: Natürlich beruht richtig gutes Design auch darauf, dass diese Gesetze an der richtigen, entscheidenden Stelle gebrochen werden, während dieses Vorgehen beim Coden nun wirklich ziemlich unsinnig wäre. Trotzdem kann man Designen auch lernen, das wollte ich nur einwerfen.

**ingoS** · 15.03.2009 23:06

Zitat von pacmanfan

Stimmt, hab nur daran gedacht, dass dann der Container für den Inhalt eigentlich eigene Scrollleisten bräuchte, da die meisten Überschriften länger sein werden.

Wenn du deiner Überschrift einfach einen weißen Hintergrund gibst (und sie nach oben und zur Seite keine Abstände zum Seitenrand hat), dann verschwindet doch der Inhalt beim Scrollen darunter.

Okay, das wird vermutlich stimmen, aber ich bin eher ein Fan von schlichterem Design, daher auch keine aufwändigen Grafiken und dergleichen.

Auf aufwändige Grafiken und dergleichen wollte ich damit auch überhaupt nicht anspielen. Eigentlich geht der Trend schon seit einiger Zeit eher weg von Photoshop-Effektorgien. Wenn du mal Apple besuchst, dann ist das Design ja auch eher schlicht -- und die grafischen Mittel sind bestimmt nicht aufwändig.

Damit will ich nicht ausdrücken, dass ich die Seite für das perfekte Beispiel von schlichtem Design halte; eigentlich finde ich das Grau-in-Grau eher ein bisschen öde, aber es fiel mir halt gerade als erstes ein.
Außerdem musst du ja an deiner Seite nicht unbedingt irgendetwas umbauen, aber vielleicht eben ein bisschen was "hinzubauen". Mein geschätzter Mod-Kollege und Design-Minimalismus-Spezialist Maxi zum Beispiel setzt auf seiner Seite ganze drei (oder vier, wenn man die Such-Lupe mitzählt) Design-relevante Grafiken ein, wobei eine dem Faux-Columns-Effekt dient und eigentlich nicht als Grafik erkannt wird. Aufwändig sind diese Grafiken auf alle Fälle auch nicht.

Das ist jetzt alles nicht gedacht, um dich oder deine Seite irgendwie schlecht zu machen, sondern um einfach ein paar Anregungen zu bieten.

**francesco** · 16.03.2009 18:13

Noch was zum Code. Das hier löschen

Code:

<meta name="language" content="de">

und

Code:

<html lang="de">

schreiben. Und wenn das Default.css in der selben Ebene liegt wie die anderen Stylesheets anstatt

Code:

@import url("../Design/Design.css");
@import url("../Design/Design_Druck.css") print, embossed, braille;
@import url("../Design/Design_Handheld.css") handeheld, speech;

das hier schreiben

Code:

@import url("Design.css");
@import url("Design_Druck.css") print, embossed, braille;
@import url("Design_Handheld.css") handeheld, speech;

**ingoS** · 17.03.2009 17:36

Ich fürchte, wenn du das beheben willst, wirst du wohl um das hier

Code:

* {
margin: 0px;
padding: 0px;
}

nicht herumkommen. Ich kann das jetzt nicht ganz sicher sagen, aber wenn ich mich richtig erinnere, sind manche IE-Abstände (besonders die zu den Seitenrändern) nicht anders wegzubekommen.

**francesco** · 17.03.2009 17:40

Urgs, was seh ich denn da!?

Code:

<!DOCTYPE HTML>

<html>
<head>

<meta charset="utf-8">
<html lang="de">

Es gibt nur ein html-Element pro Dokument.Das

Code:

  lang="de"

muss in das obere html und das untere löschen!

Thema: Bitte Website bewerten [Editor]

LinkBack

Themen-Optionen

Bitte Website bewerten [Editor]

Aktive Benutzer

Aktive Benutzer

Ähnliche Themen

Design, Code und Inhalt bewerten [EDITOR]

Website Bewrten [EDITOR] und Design

Umbau meiner website - Design und Code bewerten (Editor)

[Editor] Design, Code und Aufbau bewerten

[EDITOR] Bitte Design und Aufbau (und evtl Sicherheit) bewerten

Stichworte

Lesezeichen

Lesezeichen

Berechtigungen