• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Bitte Website bewerten [Editor]

P

pacmanfan

Guest
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!
 
Zuletzt bearbeitet von einem Moderator:
Werbung:
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.
 
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:
  1. Den Link beim aktiven Navigationspunkt entfernen.
  2. 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. :-)
 
Zuletzt bearbeitet von einem Moderator:
Werbung:
Am Code habe ich nichts zu bemängeln.

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

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. ;ugl
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...
 
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. ;)
 
Werbung:
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. :)
 
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;
 
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.
 
Werbung:
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!
 
@ccisco: Ich vermute mal stark, dass er das selber weiß und es nur ein Flüchtigkeitsfehler ist. Wenn nicht, dann fall ich hier vom Glauben ab. :mrgreen:
 
Ich bin etwas verwirrt.
Ich weiß nicht, ob Du die Seite wieder vom Netz genommen oder durch eine andere ersetzt hast. Aber was ist auf der Seite, was bewertet werden könnte???

Ich sehe nur eine weiße Seite mit einem Menü links und einem Text rechts. Keine Rahmen, keine Kästchen, keine Hintergrundbilder, keine Bilder überhaupt, nur Text.

Was soll man daran bewerten???

Außer, dass sich das Layout perfekt an Schriftgröße und Viewport anpasst und 100% barrierefrei ist!?
 
Werbung:
Ich finde die Seite gut ich Würde vieleicht über den Layout wo jetzt
Downloads steht ein Bild einfügen!
Aber sonst ist die Seite gut!
 
Genau das wollte ich z.B. hören.
Ich will ja auch, dass die Seite in allen aktuellen Browsern und unter allen Auflösungen korrekt angezeigt wird.
Naja, eine Seite ohne jegliche Grafiken und ohne jeglichen Schnickschnack barrierefrei zu machen, ist keine Kunst :-)

Aber mit der Auflösung hat das nichts zu tun, die ist irrelevant.



Daran arbeite ich ja.
Vllt. kannst du mir ja helfen und mir sagen, wo ich Grafiken sinnvoll einsetzen könnte.
Da fragst Du den falschen. :-)

aber mir fehlt einfach noch die Erfahrung um schnell einmal ein schönes Layout zu basteln. :-D
Du suchst ja ein Design, kein Layout...
 
Ja natürlich...
Du weißt schon, was ich meine.
Es ist irrelevant, dass ich das meine. Es lesen schließlich auch andere mit. Und alle müssen kapieren, dass die Auflösung nicht relevant ist. Dass das aber eben nicht alle kapieren, sieht man daran, dass es so unsinnige Dinge wie Auflösungsweichen gibt, die den Nutzer auf ein für eine Auflösung optimiertes Layout umleitet. Dass aber jemand mit ner Fenstergröße von 800x600 und einer Auflösung von 1400x1050 auf die große Variante verwiesen wird und nicht auf die 800x600, daran wird nicht gedacht. Aber trotzdem reden weiterhin alle von der Auflösung und denken, das ist ungefähr genauso wenig schlimm wie beim Abbiegen das Blinken zu vergessen.

Bitte sagt mir, welches der beiden Designs euch besser gefällt.
Rein gefühlsmäßig, ohne lange zu überlegen, das zweite, weil da weniger Platz verschwendet wird. Aber "Design" würde ich das immer noch nicht nennen...
 
Werbung:
Also, das zweite Design ist in meinen Augen durchaus ein Design. Ich weiß ja nicht, was Efchen noch alles sehen will, bevor er anfängt, von Design zu sprechen. ;ugl

Die ursprüngliche Seite hast du eher verschlechtert als verbessert. Du hast ihr mit dem ganzen Grau die Leichtigkeit genommen, die eigentlich das Einzige war, was an dem ersten "Design" bestechen konnte. :-|
Das zweite Design würde ich auf alle Fälle vorziehen. Damit würde ich an deiner Stelle weitermachen, daher beziehe ich mich jetzt auch nur auf dieses.
Was gar nicht geht, ist die Hintergrundgrafik der Navigation. Irgendwie bin ich mir noch nicht ganz sicher, dass es wirklich so gedacht ist, wie ich es sehe, aber eigentlich fällt mir auch nicht ein, wie es anders hätte gedacht sein können. Bei mir stellt sich die Navigation inklusive "Umgebung" so dar:
navigation_downloads2.jpg

Wenn es in der Tat so gedacht war wie in dem Bild, dann solltest du es unbedingt noch einmal überdenken. Die Schrift sollte auf keinen Fall über beide Bereiche der Hintergrundgrafik hinweggehen. Die Idee an sich ist nämlich eigentlich ganz nett, nur sollte der obere Farbverlauf nicht von Schrift bedeckt sein. Wenn nur der untere graue Bereich bedeckt wäre und somit nach oben hin mehr Platz wäre, dann wäre die Navigation schon mal wirklich hübsch.
Auch würde ich mir an deiner Stelle noch einmal Gedanken über die Hintergrundwiederholung machen. Wenn man die Schrift vergrößert, sieht die nämlich nicht besonders gut aus. Besser wäre es, den Hintergrund nur in x-Richtung wiederholen zu lassen und die Hintergrundfarbe auf die jeweils sinnvolle Anschlussfarbe zu setzen (also den Grauton unten im Navigationshintergrund bzw. den untersten Blauton des Verlaufs bei den Links).

Jetzt fehlen dir natürlich noch ein paar kreative Ideen für den Hintergrund der Überschrift "Downloads" ganz oben. Du solltest dir am besten weniger Gedanken der Richtung "wie setze ich am besten gute Grafiken ein" machen, sondern eher überlegen "was würde jetzt gut ins Gesamtkonzept der Seite passen". Das klingt zwar jetzt erst mal recht ähnlich, es besteht aber ein ganz wesentlicher Unterschied:

Beim ersten überlegst du, was es an guten Grafik-Ideen gibt und versuchst dann, das in deine Seite einzubauen. Dabei nimmt dann aber möglicherweise das grafische Gesamtkonzept der Seite eine vollkommen andere Richtung, wie mit den Änderungen am ersten Design geschehen -- und es kann dadurch passieren, dass es dann schlechter aussieht als vorher.

Bei der anderen Variante machst du erst mal eine "Bestandsaufnahme". Deren Ergebnis wäre beim ursprünglichen Design (nur aus meiner Sicht, nicht rein objektiv) gewesen: "Schlicht, seriös, hell, leicht und 'luftig'". In "Downloads2" hast du diesen Eindruck mit der neuen Navigation gut bestätigt (sofern du noch die Schrift aus diesem oberen Verlauf rausholst). Zusätzlich ist das Ganze dadurch ein klein bisschen edel geworden -- finde ich zumindest. ;)
Wenn du dich jetzt also an eine Grafik für den Banner ganz oben begibst, dann denk dir etwas aus, das "schlicht, seriös, hell, leicht und 'luftig' und darüber hinaus ein wenig edel" wirkt.
Wenn du selber vom aktuellen "Downloads2" einen anderen Eindruck hast, dann ist es selbstverständlich 1000mal besser, diesen Eindruck als Grundlage für die restlichen Designelemente zu nehmen.

Das war jetzt logischerweise alles nur eine Beschreibung meiner persönlichen Vorstellungen von einem sinnvollen Vorgehen. Ich bin kein professioneller Gestalter (erst seit einem Semester auf dem Weg dahin), aber ich habe mich irgendwie überzeugt, dass eine solche Systematik sinnvoller ist als "möglichst beeindruckende Effekte an möglichst sinnvollen Stellen einbauen, unabhängig vom Konzept der Seite". Ich glaube, es war dieses Vorgehen, das z.B. dafür gesorgt hat, dass so viele Clanpages vollkommen gleich auszusehen scheinen. Dabei sehen die Effekte eigentlich teilweise ganz gravierend unterschiedlich aus (und sind es auch vom technischen Aufwand und Anspruch her), aber es wirkt wie Einheitsbrei, weil sie alle das gleiche gestalterische Konzept voneinander übernehmen.

Ich hoffe mal, das hat jetzt alles ein bisschen was gebracht. :mrgreen:
 
Also, das zweite Design ist in meinen Augen durchaus ein Design. Ich weiß ja nicht, was Efchen noch alles sehen will, bevor er anfängt, von Design zu sprechen.
MIR ist das so ziemlich Wurscht. Ich hab das so bezeichnet, weil ich diesen Kommentar von anderen für MEINE Seiten bekomme, die weit mehr Design zeigen als diese und regelmäßig in der Luft zerrissen werden, weil sie angeblich "nur Layout aber kein Design" haben.
Ich bin kein Designer, ich versteh von sowas nichts und meine Entwürfe sehen auch nicht viel anders aus und ich bin damit persönlich durchaus zufrieden.

Das nur mal als Erklärung :-)
 
MIR ist das so ziemlich Wurscht. Ich hab das so bezeichnet, weil ich diesen Kommentar von anderen für MEINE Seiten bekomme, die weit mehr Design zeigen als diese und regelmäßig in der Luft zerrissen werden, weil sie angeblich "nur Layout aber kein Design" haben.
Ich glaube, die meinen, dass du nur auf das Layout Wert legst, aber nicht auf das Design (oder dass nur das Layout gut ist, das Design aber nicht) und nicht, dass die Seiten kein Design besitzen. Wenn man diesen gesichtslosen Kritikern weniger wohlgesonnen sein will, kann man auch einfach sagen, dass sie höchstwahrscheinlich keine Ahnung haben und es würde ebensohäufig zutreffen. Die Aussage "nur Layout aber kein Design" ist nämlich sowieso schon unsinnig, weil ein Layout ja erst mal gestaltet werden muss und dieser Vorgang somit auch Bestandteil des Designprozesses im nicht-umgangssprachlichen Sinne ist.
Von meinem Verständnis her ist zumindest die von der Navigation her umfangreichere derjenigen beiden Seiten, die ich von dir kenne, auf alle Fälle mit einem Design ausgestattet. Ob nun das gesamte Design gut ist oder nur das Layout, das diskutiere ich jetzt nicht, weil du ja schon mal explizit geschrieben hast, dass du solche Diskussionen Leid bist.

Ich bin kein Designer, ich versteh von sowas nichts und meine Entwürfe sehen auch nicht viel anders aus und ich bin damit persönlich durchaus zufrieden.
Ich kenne nicht besonders viele Entwürfe von dir. Der eine, auf den ich mich bisher bezogen habe, ist durchaus anders als "Downloads2" -- nicht von der Grundstruktur her, aber eben in fürs Gesamtbild wichtigen Details -- und zwar überall dort, wo anscheinend der Ansatz "ich setze in meinen Augen gefällige grafische Elemente ein, um die Seite aufzubessern", den ich in meinem letzten Post kommentiert habe, zur Anwendung kam.
Gut, jetzt habe ich doch noch das Design kommentiert. Ich hoffe, du kannst mir verzeihen. ;)

Ich wollte nur unterstreichen, was ich die ganze Zeit in diesem Thread schon zu verteidigen versuche: Es gibt objektiv gutes Design. Dieses zu erzeugen kann man auch lernen. Es gibt auch objektiv großartiges, herausragendes Design. Für dieses wiederum muss man dann wohl doch wieder Talent mitbringen und viel Erfahrung besitzen. Dafür ist solches Design aber auch eher selten.

Das Problem sind, glaube ich, viele Designer selbst, die sich lieber wie entrückte Künstler darstellen, wobei sie ihre Werke in für den Laien niemals nachvollziehbaren kreativen Prozessen aus ihrem genialen Geist heraus auf das Darstellungsmedium materialisieren. Ich zerstöre mal eine Illusion: Das ist in 90% der Fälle Schwachsinn. :mrgreen:
Ebenso, wie man als Coder hingehen und sagen kann: "An dieser Stelle hast du eine riesige Reihe von Links, die wären in einer ungeordneten Liste besser aufgehoben", könnte man als Designer auch sagen: "Deine Seite würde sicherlich frischer wirken, wenn du die Farben mal triadisch auswählen würdest."
Das würde zwar erst mal keiner verstehen, aber einer, der seine Seite bisher mit Tabellen und IFrames aufgebaut hat, würde sicherlich auch den Sinn und Einsatz der ungeordneten Liste nicht verstehen.
Design ist keine schwarze Magie. 8)
 
Werbung:
Davon, dass es einfach ist, diese Grafiken zu erstellen, war keine Rede. Ich wollte nur was zur Methodik sagen. ;)
Die schrägen Nadelstreifen sollten nun wirklich entweder nur oben (wäre, glaube ich, am besten) oder nur unten vorkommen.
 
Und das mit den Nadelstreifen hab ich schon behoben, gefällt mir aber nicht mehr so, werd ich vermutlich bald wieder weggeben.
Also, schlicht, seriös, hell und ein bisschen edel sind die ja eigentlich schon mal. Zu den Stichworten "schlicht, hell, leicht und luftig" sind mir ehrlich gesagt sofort Wolken eingefallen. Nur sind die nicht gerade seriös und auch nicht unbedingt edel. Du könntest vielleicht die Nadelstreifen (etwas blasser) über ein Wolkenmuster legen. Dann hättest du alle Faktoren erfüllt. GIMP bietet doch diese automatisch aneinanderpassenden Muster an, wenn ich mich recht erinnere...

Bei dir wird alles richtig angezeigt, daraus schließe ich, dass du kein IE-Benutzer bist. :mrgreen:
IE-Benutzer werden hier gar nicht erst Moderator. ;ugl ;)
 
Zurück
Oben