internetshop - was ist zu beachten?

[Big-Havanna]

Nein, das ist falsch.

Du musst aber den IE natürlich in den Standards Mode versetzen. Im Quirks Mode zeigt er das von Dir angesprochene, falsche Verhalten.

ok, super. das macht einiges einfacher. hab mal den pageentwurf on gestellt. müßte nun unter: shop1 sichtbar sein.
die boxen sind noch zur besseren übersicht eingefärbt. die page bleibt beim viewportänderung erhaalten (bis auf den fall, dass es so klein wird, dass die wörter rüberragen. da muss ich mir noch was einfallen lassen.) das ist soweit schon sehr schön. aber dadurch, dass ich nun mit % arbeite und nicht mehr mit fester px angabe, funktioniert eine kleine notlösung nichtmehr, die vorher super ging. die rede ist von einem 1px großem band, welches nach unten solange dupliziert wird, bis es unten angekommen ist, damit die menüleisten und dir textblock unten bündig abschließen. gibts da noch ne alternative?

achso und die page ist natürlich so noch nicht mal im ansatz fertig^^ es geht erstmal nur um das grundgerüst der boxen. 3d effekte und abgerundete kanten etc. was es da nicht noch alles zu tun gibt, wird gemacht, wenn das grundkonzept steht.

 

[Efchen]

Errr...der HTML-Code hat - freundlich ausgedrückt - noch immer Schwächen!

1. div#banner wird doch sicher mal ne Überschrift, oder? Wenn ja, sollte das auch als Überschrift ausgezeichnet sein. Insbesondere hast Du ja ein Image mit <img> eingestellt, d.h. auf dem Image ist Content. Dann muss ein <h1> her. Hat das Image kein Content, ist das <img> falsch, dann muss es als background-image rein.
2. Wieso ist das Menü div#kopf keine Liste?
3. Was ist div#puffer1?
4. Deine Menü-Liste ist falsch ausgezeichnet. Was Du mit den >> andeuten willst, ist doch, dass die Menüpunkte a1-a4 Unterpunkte des Menüpunkt a sind, warum zeichnest Du sie dann als gleichwertige Menüpunkte aus? Setze in das <li> des Menüpunkt a eine weitere, untergeordnete Liste (<ul>), um die Struktur Deines Menüs richtig wiederzugeben.
5. div#menu2 ist wieder mal überhaupt keine Liste.

Was ich immer jedem versuche zu sagen ist, man soll mit dem Inhalt anfangen, danach die Semantik machen und erst dann am Layout basteln. Vielleicht sieht man hier mal besonders deutlich, warum ich das sage:
Du bastelst jetzt am Layout, schwitzt Dir womöglich schon einiges zusammen um das so hinzukriegen, wie es jetzt ist, und jetzt komme ich und sage Dir, dass Deine Semantik Käse ist. Was ist die Folge? Du änderst die HTML-Tags und Dein Layout/Design ist wieder hin, weil Listen sich nunmal anders verhalten als undefinierte Inline-Elemente in einem allgemeinen Block-Element.
Also musst Du *wieder* ans CSS ran und *nochmal* daran arbeiten, was Du bisher schon als "fertig" empfunden hast.

Fazit: Man sollte erst den Inhalt und dann die Semantik (HTML) machen. Tut man das nicht, tut man das als unwichtig ab oder beachtet man es zu wenig, dann macht man sich mit CSS doppelte, dreifach und vielfache Arbeit, weil man einiges ständig wieder umschreiben muss. Das muss aber nicht sein!

Dein Problem mit der "Notlösung"...sind es Faux Columns, die Du suchst?

 

[Big-Havanna]

erstmal danke, dass du dir die mühe gemacht hast, meinen -bescheiden ausgedrückt- unprofessionellen Entwurf durchzusehen!

zunächst zu:

4. Deine Menü-Liste ist falsch ausgezeichnet. Was Du mit den >> andeuten willst, ist doch, dass die Menüpunkte a1-a4 Unterpunkte des Menüpunkt a sind, warum zeichnest Du sie dann als gleichwertige Menüpunkte aus? Setze in das <li> des Menüpunkt a eine weitere, untergeordnete Liste (<ul>), um die Struktur Deines Menüs richtig wiederzugeben.

Danke! super sache. genau was ich an dieser stelle gesucht habe! manchmal komt man nicht auf die einfachsten dinge^^.

3. Was ist div#puffer1?

den hab ich schon rausgenommen. war als abstandshalter gedacht. aber eigentlich sinnlos (nachdem ich mal drüber geschlafen habe).

-das banner hab ich nun mit h1 ausgewiesen, hoffe das ist richtig so.
-das mit den faux colums ist das was ich meinte. aber das ging nur, als ich das layout mit px gemacht hatte. nun mit % sind die spalten ja variabel. und somit funktioniert das nicht mehr.

Nun die aufgetauchten Fragen:
1.warum meinst du

5. div#menu2 ist wieder mal überhaupt keine Liste.

? das meine Koppfzeile keine ist sehe ich ein. aber in den menüboxen sind doch listen.
2.gibt es eine möglichkeit, dass sich die schriftgröße des inhaltes verkleinert, wenn die box in der er steht, zu klein wird?


nachtrag:mein problem mit den gleichlangen spalten grad mit "Equal Height Columns" gelöst.

 

[Efchen]

1.warum meinst du "5. div#menu2 ist wieder mal überhaupt keine Liste. "?

Weil da "Warenkorb" und "Suchen" steht, was nicht ausgezeichnet ist. Da fehlt die Bedeutung. Ist doch ein Menü. Du hast es ja sogar so genannt. Also eine Liste.

2.gibt es eine möglichkeit, dass sich die schriftgröße des inhaltes verkleinert, wenn die box in der er steht, zu klein wird?

Nicht dass ich wüsste. Der Inhalt wird dann halt anders umgebrochen.

 

[Big-Havanna]

http://bighavanna.bi.funpic.de/shop2/startseite2.htmlhttp://bighavanna.bi.funpic.de/shop2/startseite2.html
ok, hab alles nach besten gewissen umgearbeitet.
-alle listen müßten nun auch welche sein
-boxen schließen bündig ab
-seitenverhältnis bleibt auch bei viewportveränderung gleich (bis min 700px, dann seitenscroll

ich bin erstmal soweit zufrieden. gibts noch was grundlegendes zu ändern? kritik? verbässerungsvorschläge?

eine frage bleibt jedoch noch. im kopf hab ich die links nun auch als liste ausgewiesen. wie gebe ich ein, dass die liste aber nicht wie eine aussehen soll? sprich sie sollen neben einander und nicht unter einander stehen.


achso und

Du bastelst jetzt am Layout, schwitzt Dir womöglich schon einiges zusammen um das so hinzukriegen, wie es jetzt ist, und jetzt komme ich und sage Dir, dass Deine Semantik Käse ist. Was ist die Folge? Du änderst die HTML-Tags und Dein Layout/Design ist wieder hin, weil Listen sich nunmal anders verhalten als undefinierte Inline-Elemente in einem allgemeinen Block-Element.

ich gebe dir vollkommen recht. aber es ist nicht schlimm. durch das abschwitzen lernt man super ;-)

 

[Efchen]

Wozu ist div#banner innerhalb von h1?

Willst Du eigentlich wirklich logische Trennungen (<hr />) in Deinen Menüs? Ich muss gestehen, ich würde das eher über border lösen, als über <hr>, weil das ja eine logische Trennung darstellt und die Überschrift ja eigentlich zum Menü gehört und nicht davon getrennt zu verstehen ist.

Du hast in Deinen Listen weitere Listen. So ist das falsch. Die Listen tieferer Ebenen müssen in ein Listenelement rein:

<ul>
  <li>...
    <ul>
      <li>...</li>
    </ul>
  </li>
  <li>...</li>
</ul>

Das, was bei Dir jetzt "artikeltext" heißt, wird sicher später noch ersetzt. Aber so wie es jetzt ist, fehlt die Semantik. "artikeltext" hat keine Bedeutung. Auch in diesem Stadium solltest Du Dir angewöhnen, das auch als Text, also mit <p> auszuzeichnen.

So. Und nun zu Deiner Liste. Horizontal kriegst Du die entweder mit "float" oder "display:inline" für jedes Listenelement. Beides hat gewisse Vor- und Nachteile bzw. je nachdem, was man vorhat, ist die eine bzw. die andere Variante zu empfehlen. Machst Du aus Deinen Listenelementen Inline-Elemente, kannst Du ihnen z.B. keine Größe mehr zuweisen, weil das für Inline-Elemente nicht definiert ist.

 

[Big-Havanna]

wie sieht das eigentlich mit einer sprachauswahl aus?
beispiel: ich habe auf der seite die auswahl zwischen deutsch und englisch. mache ich sozusagen die page in doppelter ausführung (wäre bei änderungen in der page eher lästig, da alles dopplt und dreifach geendert werden müßte), oder kann ich sozusagen nen alternativtext mitangeben, der nur gezeigt wird, wenn sprachauswahl x erfolgt? ...die frage ist, ob dies sinn macht, da dann ja andauernd text mitgeladen werden würde, den eh keiner sieht...
wie ist das im algemeinen geregelt?

 

[Efchen]

Ich würd sagen, das kannst Du machen, wie Du willst.
Als Anwender fände ich es angenehmer, wenn ich auf jeder Seite auf die andere Sprache wechseln könnte. Die einfachere Alternative ist, das auf der Startseite auswählen zu lassen. Meist wird dann die Sprachwahl in einem Cookie gespeichert, so dass man nicht wieder wechseln kann, es sei denn, man löscht den Cookie.
Andere lesen die Sprache der verwendeten Software (Browser) aus, aber wenn dadurch automatisch auf diese Sprache verwiesen wird, finde ich das unfreundlich, denn wenn ich aus irgendeinem Grund nur einen englischen Browser zur Verfügung habe, will ich die Seite vielleicht doch deutsch lesen.

Was das technische angeht, ist eine Lösung sicher, die Seiten doppelt zu halten, aber dann hast Du ja auch die doppelte Arbeit, wenn Du was an der Struktur der Seiten ändern willst. Am elegantesten wäre sicherlich, die Texte auf die ein oder andere Weise in einer Datenbank abzulegen und dann nur eine Seite zu haben, die serverseitig die Texte in der gewünschten Sprache einsetzt.