• Apfeltalk ändert einen Teil seiner Allgemeinen Geschäftsbedingungen (AGB), das Löschen von Useraccounts betreffend.
    Näheres könnt Ihr hier nachlesen: AGB-Änderung
  • Wir haben den Frühjahrsputz beendet, Ihr auch? Welches Foto zu dem Thema hat Euch dann am Besten gefallen? Hier geht es lang zur Abstimmung --> Klick

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? :)
 

Hilarious

Gelbe Schleswiger Reinette
Registriert
10.08.05
Beiträge
1.759
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>