nicht angemeldet
Liebes Girlfrommars13,
Das Ergebnis meiner Bemühungen! ;)
prima! Das passt jetzt auch auf meinem Firefox unter Linux.
Gibt es da noch was dran zu verbessern?
Klar! Beispielsweise könnte der gesamte HTML-Teil semantischer sein. Dazu eignet es sich, gleich auf HTML5 umzusteigen:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="description" content="Riekmund - Fashion & Style aus Hamburg" />
<meta name="author" content="Henrike Thiele" />
<title>riekmund.com - fashiondesign, art and poetry</title>
<link href="./styles.css" rel="stylesheet" type="text/css" />
<!-- noch JS-Gedöns... -->
</head>
<body>
<header><a href="/"></a></header>
<main role="main">
<article>
<h1>project "wedding dress"<br />AW 2010/2011</h1>
<p>after finishing my studies i was asked by a friend of mine to design
and manufacture her wedding dress. this was a quite new experience for
me because i've never worked with fabrics like silk and lace.
besides i've never sewn a classical dress, not to mention a corsage.
it was fun to meet a completely new challenge.
</p>
<p>photography by
<a href="http://www.carlosfernandez.de" target="carlos website">carlos fernandez laser</a>
</p>
</article>
<article>
<ul id="picturegallery">
<li><a href="projectweddingdress/_MG_2311.jpg" rel="lightbox[group]"><img src="projectweddingdress/_MG_2311_thumb.jpg" alt=""></a></li>
<li><a href="projectweddingdress/_MG_2337.jpg" rel="lightbox[group]"><img src="projectweddingdress/_MG_2337_thumb.jpg" alt=""></a></li>
...
</ul>
</article>
</main>
<nav>
<ul>
<li><a href="http://www.riekmund.com/about.html"><img src="about.gif" alt="about"></a></li>
<li><a href=""><img src="collections_shop.png" alt="collections and shop"></a>
<ul>
<li><a href="http://www.riekmund.com/collectionsandshop.html" class="class2" >new collection</a></li>
<li>dog coat - comes soon</li>
...
</ul>
</li>
<li><a href="http://www.riekmund.com/CV.html"><img src="CV.gif" alt="CV"></a></li>
...
</ul>
</nav>
<footer></footer>
</body>
</html>
Um nun Deine vorher mit ID bestückten Elemente wieder mit CSS anzusprechen, kannst Du jetzt den Nachfahren-Selektor benutzen. Aus #menue wird nav > ul, aus #submenue wird nav li ul und aus #text wird main > article:first-child.
Auch die Klasse "headline" ist nun überflüssig: main > article:first-child > h1. Sollten einmal mehrere <h1> im ersten <article> enthalten sein, kann man noch first-of-type benutzen, um die erste Überschrift von den anderen abzugrenzen: main > article:first-child > h1:first-of-type.
Würdet ihr das CSS noch auslagern?
Unbedingt! Dann muss es nicht jedesmal beim Seitenaufruf übertragen werden, sondern kann vom Browser-Cache übernommen werden. Das spart Bandbreite und beschleunigt weitere Seitenaufrufe.
Liebe Grüße,
Felix Riesterer.
"Wäre die EU ein Staat, der die Aufnahme in die EU beantragen würde, müsste der Antrag zurückgewiesen werden - aus Mangel an demokratischer Substanz." (Martin Schulz, Präsident des EU-Parlamentes)
Gunnar Bittersmann
Matthias Apsel
Der Martin