Lose Design

[Korgal2k4]

Hey Leute,

für mein neues Projekt hab ich ein neues Design gestaltet, da ich der festen Überzeugung bin, das was draus werden kann.

https://img.ipmedien-online.net/design.jpg

Über Kritik/Verbesserungsvorschläge wäre ich Dankbar

Live Vorschau

lg

 

[Freddixx]

Wo ist der Unterschied zwischen Link 1 & Link 2?

Zum Design:

Sieht gut aus, nur den grauen Balken oben direkt unter den Statistiken mag ich nicht.

 

[Korgal2k4]

Danke für den Feed

Es gibt keinen Unterschied, nur sieht man eben bei der Live Vorschau, wie es tatsächlich auf dem Browser aussieht

lg

 

[theHacker]

Es gibt keinen Unterschied, nur sieht man eben bei der Live Vorschau, wie es tatsächlich auf dem Browser aussieht

Das kannst du wem erzählen, der keine Ahnung hat, ja
Wer aber einmal genau hinsieht, weiß, dass du dort auch einfach nur das Bild eingebunden hast und das also genau dasselbe is

 

[Korgal2k4]

Ähm? Ist auch so

Ich sag ja, wollte nur zeigen, wie es aussieht, als wäre das Design fertig gecodet? oO

lg

 

[Freddixx]

Ähm? Ist auch so

Ich sag ja, wollte nur zeigen, wie es aussieht, als wäre das Design fertig gecodet? oO

lg

Naja, ich wollt erstmal nachfragen, aber unser Hacker ist da etwas direkter und hat im Prinzip völlig Recht. Du kannst jetzt drumherum reden, wie du willst, es ist haargenau dasselbe

Und im Gegenteil .. es sieht nicht aus, wie fertig gecodet. Kein Hoverklassen, ungerenderte Fonts, alles, was "gecodet" anders aussieht.

 

[Korgal2k4]

Jetzt ist es aber fertig gecodet

lg

 

[topfkanne]

Schöne Farben, übersichtlich.

Die weiße Textzeile unter "Lose-Geschenkt.de" ist zu klein und sehr schwer lesbar.

Wofür ist der hervorgehobene Raum rechts im Header?

 

[Freddixx]

Das würde man sehen, wenn das Bild noch on wäre Ich wollte es dir grad verlinken, aber der Link ist tot.

 

[Korgal2k4]

Jap, hab vergessen die neue Datei Hochzuladen

https://ipmedien.deviantart.com/art/Lose-Geschenkt-net-v1-155155423

Bitte schön, Feed zum Code noch?

lg

 

[Killerbear]

echt schick.
Auch der Quelltext sieht gut aus.
N bissl komische Klassen, die in 3 css Dateien aufgeteilt sind.

Ansonsten top.

Was mich irritiert ist der grüne Streifen, der im Hintergrund lang läuft.
Der teilt optisch die gesamte Seite.
Aber Die Stelle an der, der Streifen die Seite teilt, ergibt keinen Sinn.
Einfach so Mitten drin.

In Gedanken Rück ich mir das Design immer n stück runter, damit das besser passt.

 

[Korgal2k4]

Joa Danke für dein Feed

Naja, meiner Meinung nach sieht der Grüne Balken ganz schick aus, was meinen andere dazu?

lg

 

[theHacker]

[...] Feed zum Code noch?

Sieht erstmal sehr ordentlich aus

Halt dir aber immer vor Augen, dass es mehr, als nur <p>, <ul>, <div> und <span> gibt: Das is jetzt nur ne Testseite, aber trotzdem sollte es eine Überschrift geben. Guck dir die Seite einfach mal ohne Design an:


Einheitssuppe

Jetzt stell dir die Frage: Wo ist die Überschrift? Gibt es mehrere Überschriften? Welche Überschrift ist wichtiger?
Und dann setzt du <h1> bis <h6> entsprechend ein.

So wie das für mich aussieht, sollten alle

<div class="top">

eigentlich Überschriften sein.

Ich persönliche würde "Herzlich Willkommen auf www.Lose-Geschenkt.net" Überschrift 1 zuordnen, "Neuigkeiten auf www.Lose-Geschenkt.net" und weitere Content-Boxen links Überschrift 2 und die kleinen Boxen rechts Überschrift 3.

"www.Lose-Geschenkt.net" ist per <span> gelöst, ok. Für mich sieht es so aus, als ob das was Wichtiges is. Is schließlich der Seitenname, oder? Wäre also eventuell ein Kandidat für <em>.

Logische Textauszeichnung liegt im Auge des Betrachters, also in deinen. Du musst dir überlegen, welche Teile wichtig sind und dem Besucher besonders deutlich gemacht werden sollen.

Lektüre:

• https://de.selfhtml.org/html/text/index.htm, besonders
  • https://de.selfhtml.org/html/text/logisch.htm

 

[Korgal2k4]

Danke für dein Feed.

Das mit dem h1 ist ne gute Überlegung, da Google sowas gerne liest.

Werd ich aufjedenfall mal Local Anpassen, Vielen Dank

lg

 

[muenchner1989]

Hi,

sehr schönes und übersichtliches Design - der graue Balken oben könnte allerdings noch die Fliege machen.
War der Background dein Einfall, denn der taugt mir määchtig!

 

[Korgal2k4]

Hallo,

Danke für dein Feed, ja der Balken gefällt mir auch irgentwie nicht, ich hab schon bisschen die grauen Balken angeändert und so.

Zum Background: Hab den noch nie zuvor gesehen, keine ahnung

lg

 

[gadon]

Komplette Seite wird in "schönen" Farben gehalten, das wichtigste, der Content, in grau schwarz....

 

[Korgal2k4]

Komplette Seite wird in "schönen" Farben gehalten, das wichtigste, der Content, in grau schwarz....

Hmmm ja kann schon sein, aber der Inhalt ist so ja noch nicht fertig, wird sicherlich noch schöner aussehen, wenn es gefüllt ist

lg

 

[topfkanne]

Danke für dein Feed.

Das mit dem h1 ist ne gute Überlegung, da Google sowas gerne liest.

Werd ich aufjedenfall mal Local Anpassen, Vielen Dank

lg

[Klugscheißer-Senf]
Da der <h1>-Tag oft zur Auszeichnung des Seitennamen verwendet wird (oder für's Logo), legt Google heute mehr Priorität auf den <h2>-Tag.
[/Klugscheißer-Senf]

<h1 id="logo"><a href="#"><span class="hide">Lose-Geschenke.de</span></a></h1>

#logo a = Hintergrundbild mit Höhe und Breite + display: block
.hide = der berühmte text-indent -9999px Trick zum verbergen des Textes.

Der Quellcode ist mir noch etwas unschlüssig. Wieso nutzt du für den Content nicht einfach nen 2-Spalten-Layout? Sieht bisschen konfus aus. #Box1 und #Box2 haben die selben Werte, wieso also keine Klasse?



Dadurch läuft der Text auch über, falls er mal länger werden (sollte). Außerdem scheint was mit der Hintergrundgrafik der Content-Boxen nicht zu stimmen, weil sie bei längerem Text rechts nen komischen grauen Rand haben, der oben auf der gesamtne Höhe der rechts stehenden Boxen nicht zu sehen ist.

<div class="wrapper">

    <div id="content">

        <h2>Willkommen</h2>
        <div class="contentbox-middle">
            text
        </div>
        <div class="contentbox-bottom">
        </div>

        <h2>Willkommen</h2>
        <div class="contentbox-middle">
            text
        </div>
        <div class="contentbox-bottom">
        </div>

    </div>

    <div id="aside">

        <h2>Partner</h2>
        <div class="asidebox-middle">
            text
        </div>

        <h2>Partner</h2>
        <div class="asidebox-middle">
            text
        </div>

    </div>

</div>

So würde ich's lösen (abgesehen von der Benennung).
Wobei ich aus SEO-Sicht die Headlines rechts nicht als Headline auszeichnen würde, weil sie total unrelevant sind (Partner, Werbung, ...).