• Es ist bereits Apfeltalk-Tradition und wir möchten sie auch in diesem Jahr fortsetzen: Unser Apfeltalk-Weihnachtslogo-Wettbewerb hat begonnen! Gestaltet für uns das Weihnachtsbanner, das im Monat Dezember bis zum Weihnachtsfest unsere Webseite schmücken soll. Lasst Eurer Kreativität freien Lauf! Hier geht es zum Wettbewerb --> Klick
  • November - das bedeutet oftmals Herbstblues, grauer Himmel, Tristesse und Wetter, bei dem man gern im Warmen bleibt. Aber nur oftmals! Wir fordern Euch gern auf, gegen den Herbstblues anzukämpfen und hoffen, dabei hilft Euch unser aktuelles Monatsthema. Neugierig geworden? --> Zum Mitmachen bitte hier klicken

Shop - sinnvoller Code für die Artikelbeschreibung

MrNase

Champagner Reinette
Registriert
11.01.05
Beiträge
2.656
Tach die Herren, die Damen nicht zu vergessen ;)

Ich mühe mich z.Zt. mit dem Frontend eines Shops ab, da ich aber eine sinnlose Aneinanderreihungn von Layern verabscheue möchte ich mein momentanes Konzept nochmal überdenken.
So sieht es aus:
Code:
    <div id="showcase">
        <h4>Produkt der Woche:</h4>
        <div class="artikelbild">
            <img src="http://www.apfeltalk.de/forum/images/produkt_1.jpg" width="200px" />
            <br />
            <img src="http://www.apfeltalk.de/forum/images/produkt_1.jpg" width="60px" class="thumbnail" /><img src="http://www.apfeltalk.de/forum/images/produkt_1.jpg" width="60px" class="thumbnail" /><img src="http://www.apfeltalk.de/forum/images/produkt_1.jpg" width="60px" class="thumbnail" />
        </div>
        <div class="artikelbeschreibung">
        <h3>Testartikel</h3>    
            <div class="text">
                <p>Hier kommt Platz für de Beschreibung hin. Sonst steht hier nur blanker Unsinn!</p>
                <p>Oder kommt hier doch noch was gutes? Ich glaub nich...</p>
            </div>
            <div class="lieferzeit">Lieferzeit: 1 bis 2 Jahre</div>
            <div class="preis">Preis: 230,32 EUR <span>zzgl. Versandkosten</span></div>
            <div class="warenkorb"><a href="#">In den Warenkorb legen.</a></div>
        </div>
        <br style="clear: both" /> <!-- ugly -->    
    </div>
Es generiert ein 'großes' Bild auf der linken Seiten, unten drunter 3 kleine Bilder und rechts daneben die Artikelbeschreibung.

Ich hatte mir nun überlegt unten die Layer (.lieferzeit, .preis, .warenkorb) mit <span>s zu ersetzen. Allerdings werden diese ja standardmäßig inline dargestellt. Ohne CSS hätte man dann also alle Informationen in einer Zeile. :/
Das ganze mit <p> zu lösen würde ja auch gehen allerdings finde ich nicht, dass dies gleich einen ganzen Textabsatz darstellt und das <p> dafür das richtige wäre.

Schwierig schwierig... :(

Welche HTML-Tags würdet ihr wo benutzen? :)
 
Ungefähr so:

Code:
<div id="showcase">
  <h1>Ich bin dann mal weg von Hape Kerkeling</h1>
  <h2>Aus der Reihe: Sandalenromane</h2>
  <!-- Bilder/ -->
  <!-- Produkt-Eigenschaften -->
  <dl>
	<dt>Einband, Ausgabe:</dt>
	<dd>Gebunden</dd>	
	<dt>Erschienen:</dt>
	<dd>05.2006</dd>
	<dd>Versandfertig ab sofort</dd>
	<dt>ISBN-10:</dt>
	<dd>3-89029-312-3</dd>
	<dt>ISBN-13:</dt>
	<dd>9783890293127</dd>
   </dl>
   <h3>Aus dem Inhalt</h3>
   <p>Lorem ipsum dolor ...</p>
   <!-- Actions: Kaufen und so/ -->
</div>