Websiten Design

[ebisu]

Hallo versuche gerade eine Seite zu machen auf der ich meinen produzierten Skripts oder was auch immer bereitstellen kann.
Wollte mal in Erfahrung bringen was ihr den so davon haltet.
Und ich bin ein Anfänger wie man sicher deutlich sehen kann.
Ich habe es im Firefox und Konqueror getestet im IE funktioniert es vielleicht auch aber da konnte ich es nicht testen.
Und ich Programmiere noch nicht lange und habe vorher auch noch nicht programmiert also Python ist meine "erste" .
Deshalb werden meine Skripts euch höchstens entsetzen oder Lachkrämpfe bescheren schon mal zur Vorwarnung.
Ach ja der Hintergrund der Seite ist noch Temporär.
Noch zur Info ich benutze Xubuntu 7.04 Feisty Fawn werde aber wahrscheinlich auf 6.06.1 Dapper Drake wechseln.
Weil ich mit Feisty Probleme habe die auf der Dapper Live CD nicht habe und ja ich bin auch ein Linux Neuling habe erst vor kurzen
den kompletten Umstieg auf Linux vollzogen hatte aber früher mal ein klein bisschen Erfahrung mit Linux gesammelt.
Sorry das das hier so lang geworden ist aber ihr müsst es ja nicht ganz lesen jedenfalls hier der link.
Mein erster Post in diesem Forum und er betrifft Web Design
Und die Seite ist mithilfe von PHP geschrieben und ja mein PHP ist auch nicht sonderlich.

[EyDu]

Ich finde das Design der Seite eigentlich ganz hübsch, doch sieht es im IE doch ein wenig fehlerhaft aus. Einige Elemente sitzen wohl nicht an den Stellen an den sie sollten. Schau es dir einfach mal an.

Außerordentlich störend finde ich hingegen die Begrenzung der Darstellung auf so einen kleinen Bereich. Mit einer entsprechenden Monitor-Auflösung nimmt die Seite kaum ein Viertel des verfügbaren Platzes in Anspruch.

Im HTML-Code sind noch Umlaute enthalten, die codiert werden sollten. Auch die Menü-Buttons und Seiten-Überschriften benötigen noch einen Alternativ-Text um nicht einige Benutzer von deiner Seite auszuschließen.

Weiter solltest du noch ein wenig an deiner Rechtschreibung arbeiten. Sowohl im Deutschen als auch im Englischen.

[hector]

optisch betrachtet empfinde ich das Layout als sehr angenehm. Die Knöpfe wirken weich und die Farbzusammenstellung nervt nicht. Ok, meine Farben wären es nicht, aber das sind individuelle Farbvorlieben Sie passen jedenfalls zusammen. Ansonsten kann ich mich meinem Vorredner nur anschließen.

[Imperator]

Die Idee ist gut! So was hab ich auch mit nem Freund aus dem Boden gestampft. Aber er ist als Webmaster so faul das derzeit nur Programme aus unserer Anfangszeit online sind na ja, muss ihm mal feuer unterm Hintern machen.
Vielleicht könnte man ja auch eine kleine Partnerschaft zwischen den unseren Sites machen. Hier der Link [url]http:\\sdpf.funpic.de[/url]

[lunar]

Außerordentlich störend finde ich hingegen die Begrenzung der Darstellung auf so einen kleinen Bereich. Mit einer entsprechenden Monitor-Auflösung nimmt die Seite kaum ein Viertel des verfügbaren Platzes in Anspruch.

ack.

Im HTML-Code sind noch Umlaute enthalten, die codiert werden sollten. Auch die Menü-Buttons und Seiten-Überschriften benötigen noch einen Alternativ-Text um nicht einige Benutzer von deiner Seite auszuschließen.

Es sollte doch auch reichen, einen korrekten Content-Type Header mit Angabe des Charsets in den Code aufzunehmen, oder?

[BlackJack]

Die Umlaute sind im Grunde korrekt, den richtigen `Content-Type-Header` sendet der Webserver.

[lunar]

Naja, ich würde trotzdem noch ein:

Code: Alles auswählen

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

einfügen. So ist man nicht von der Webserver-Konfiguration abhängig.

[ebisu]

Hm das wegen der Größe ich wollte das es auch bei einer niedrigen Auflösung halbwegs "annehmbar" aussieht und mit einem liquid Design wollte ich mich
nicht herum schlagen. (Ja ich weiß das kein TFT mehr so eine Auflösung hat
aber es gibt immer noch Röhrenmonitor Benutzer)
Aber das werde ich höchst wahrscheinlich ändern.
Welche Auflösung kann man eigentlich mehr oder weniger als "Standard" nehmen?
@lunar danke ist eingefügt ja ich sollte mich wirklich mehr mit den meta tags beschäftigen oder besser gesagt darauf achten
Wegen der Rechtsschreibung werde ich mir gleich ansehen ja das ist bei mir wirklich immer ein Problem
Das mit der Farbzusammenstellung ist so eine Sache
Die einzige Farbe befindet sich auf dem Base2.png alle anderen bilder sind alle komplette transparent.
Ich wollte mir damit offen halten die Farbgebung leicht zu ändern und auch weil mein Geschmack für Farben nicht auf jeden zutrifft
Was für eine Farbrichtung würdet ihr den empfehlen?
Und sollte man es lieber halbwegs hell halten damit nicht so gute Bildschirme es trotzdem halbwegs gut ausgeben?

edit: wegen der Rechtsschreibung war das auf die News bezogen oder auf
die About Seite?
Könnte mir jemand eine Screenshot von IE geben ? hab hier wie im
ersten post geschrieben kein Windows mehr.

[BlackJack]

@lunar: Von der Webserverkonfiguration ist man ja leider trotzdem abhängig weil die Information dort Vorrang hat. Warum auch immer.

[apollo13]

Hm das wegen der Größe ich wollte das es auch bei einer niedrigen Auflösung halbwegs "annehmbar" aussieht und mit einem liquid Design wollte ich mich
nicht herum schlagen. (Ja ich weiß das kein TFT mehr so eine Auflösung hat
aber es gibt immer noch Röhrenmonitor Benutzer)
Aber das werde ich höchst wahrscheinlich ändern.
Welche Auflösung kann man eigentlich mehr oder weniger als "Standard" nehmen?

Fluid und sonst 1024x768

Könnte mir jemand eine Screenshot von IE geben ? hab hier wie im
ersten post geschrieben kein Windows mehr.

Dann installier ihn (ja geht auch im Linux oO) oder:
http://meineipadresse.de/netrenderer/index.php
http://browsershots.org/

[Leonidas]

Welche Auflösung kann man eigentlich mehr oder weniger als "Standard" nehmen?

Keine. Seiten sollten Auflösungsunabhängig sein. Warum? Weil ich 1280x800 auf dem Laptop habe, 1280x1024 auf dem CRT und wenn ich einen schwenkbares LCD hätte, dann würde ich es um 90° wenden, damit die Displayfläche lang und nicht breit ist. Sowas kannst du nicht vorraussehen, daher sollte das Layout von der Auflösung unabhängig sein.

[veers]

Außerordentlich störend finde ich hingegen die Begrenzung der Darstellung auf so einen kleinen Bereich. Mit einer entsprechenden Monitor-Auflösung nimmt die Seite kaum ein Viertel des verfügbaren Platzes in Anspruch.

Was ich noch viel mühsamer finde sind Seiten welche 100% der Breite für ihren Flattertext verwende. Von Dem her ist so eine Limitierung schon nicht ganz dumm. Wenn man das ganze auch etwas besser nutzen könnte.

Dann installier ihn (ja geht auch im Linux oO) oder:

Das ist wie wenn du einer wunderschönen Frau einen Penis direkt zwischen die Augen pflanzen würdest.

[lunar]

@lunar: Von der Webserverkonfiguration ist man ja leider trotzdem abhängig weil die Information dort Vorrang hat. Warum auch immer.

Echt? Das wusste ich nicht... naja, den Header würde ich trotzdem aufnehmen, selbst wenn er nur dazu dient, dem Editor zu sagen, welche Kodierung die Datei hat

@veers: Toller Vergleich

[apollo13]

Dann installier ihn (ja geht auch im Linux oO) oder:

Das ist wie wenn du einer wunderschönen Frau einen Penis direkt zwischen die Augen pflanzen würdest.

Durchs Zimmer rofl.

Echt? Das wusste ich nicht... naja, den Header würde ich trotzdem aufnehmen, selbst wenn er nur dazu dient, dem Editor zu sagen, welche Kodierung die Datei hat

Komisch, die Metaangaben waren meinen Editoren bis jetzt immer egal

[birkenfeld]

Echt? Das wusste ich nicht... naja, den Header würde ich trotzdem aufnehmen, selbst wenn er nur dazu dient, dem Editor zu sagen, welche Kodierung die Datei hat

Komisch, die Metaangaben waren meinen Editoren bis jetzt immer egal

Das kommt davon, wenn man unintelligente Editoren verwendet.

[apollo13]

Echt? Das wusste ich nicht... naja, den Header würde ich trotzdem aufnehmen, selbst wenn er nur dazu dient, dem Editor zu sagen, welche Kodierung die Datei hat

Komisch, die Metaangaben waren meinen Editoren bis jetzt immer egal

Das kommt davon, wenn man unintelligente Editoren verwendet.

Ich würde vim nicht unitelligent bezeichnen, naja um ehrlich zu sein hab ich aber auch nie so drauf geschaut denk ich. Html-Metas verwende ich ja aus dem Grund schon ungern weil der Server sie eh "überschreibt".

Achja: http://www.smashingmagazine.com/2007/10 ... st-suites/

[Dwayne]

@ebisu

Mit dem richtigen Editor brauchst du Umlaute nicht maskieren und kannst trotzdem das UTF Charset verwenden...

Die Seite an sich ist ganz hübsch, aber an Auszeichnung und Struktur der Elemente könntest du noch arbeiten:

Du verwendest z.B. definitiv zu viele <div>-Elemente. Die Navigation brauchst du nicht in ein extra Div packen. Mit entsprechenden Änderungen in der CSS geht das auch ohne (natürlich in Kombination mit der id="navi" der <ul>). Die Texte, ich habe mir jetzt mal die About-Seite angeguckt, sind mit <p> auszuzeichnen - nicht mit einem div. Außerdem sollte jedes Überschriften-Element möglichst nur einmal verwendet werden (also h1, h2, h3, h4 usw.). Mit den entsprechenden Styles kannst du ihnen ja dennoch die gleiche Schriftgröße geben.

[gerold]

Außerdem sollte jedes Überschriften-Element möglichst nur einmal verwendet werden (also h1, h2, h3, h4 usw.). Mit den entsprechenden Styles kannst du ihnen ja dennoch die gleiche Schriftgröße geben.

Hallo Dwayne!

Das habe ich noch nie gehört. Wie kommst du darauf? Wo kann man den Sinn dahinter nachlesen?

mfg
Gerold

[mitsuhiko]

Ich würde vim nicht unitelligent bezeichnen, naja um ehrlich zu sein hab ich aber auch nie so drauf geschaut denk ich. Html-Metas verwende ich ja aus dem Grund schon ungern weil der Server sie eh "überschreibt".

Mein Vim kann das.

@Topic:

XML Parsing Error: mismatched tag. Expected: </meta>.
Location: http://cellcycle.ce.funpic.de/index.php?site=about
Line Number 8, Column 3:</head>
--^

Mein Browser will das nicht darstellen. Kein gültiges XHTML.

[Dwayne]

Hallo Dwayne!

Das habe ich noch nie gehört. Wie kommst du darauf? Wo kann man den Sinn dahinter nachlesen?

mfg
Gerold

Sorry, die Aussage war so falsch - Ich nehme sie zurück.

Sie müsste sich ausschließlich auf das h1-Element beziehen. ebisu hat es in diesem Fall ja mehrfach das h1-Element verwendet, um News, Media usw. auszuzeichnen. Semantisch sinnvoller wäre es wohl, wenn man das "About" (hier als Grafik, aber mit Image Reaplacement ist er ja offensichtlich vertraut -> siehe Navigation) mit h1 auszeichnet und den Rest in einer oder mehrer hx-Hierarchien - je nach Gewichtung...

Wie es sein sollte, oder aussehen könnte, dafür ein Beispiel hier (unter Allgemeines) und hier (1.Frage - siehe auch Quellcode der Seite)