• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

HTML Design Element

Gilles

Gilles

Blogger
Hallo Leute,
Bin Zur Zeit an einer Seite dran, die natürlich vom HTML her korrekt sein soll.
Nun hab ich eine Seite, die aussieht wie auf dem screenshot den ich angehangen habe.
Das Problem ist, das ich nicht genau weiss was für ein HTML Element die grün gekennzeichneten Fächen sein sollen, Diese Umrahmen nur das komplette Design, sind ohne Inhalt und dienen somit nur als Design Element.
Welchen tag sollte ich hier anwenden? Wenn ich zuhause bin kann ich gerne mal das HTML Grundgerüst posten. Hoffe meine Angabe und der Screenshot reichen aber dafür erst mal :) Bzw hier noch ein Beispiel wie sowas aussehen könnte von HTML Aufbau. Habe als Design Element ein span Element benutzt, das ich als Block-Element darstellen lasse.
Deswegen bitte ein mal melden ob, man das so machen sollte oder eher ein anderes Element dafür nehmen sollte :)
Danke schonmal

Vielelicht sind ein paar Leute nur Lesefaul: Ich schreibs mal in der Kurzversion ihn. :D
Welchen Tag sollten die grünen Elemente in der Skizze haben?
oder
In dem HTML Gerüst, sollte ich etwas anderes als wrapper nehmen als span?
:)

HTML: 
<html>
  <head></head>
  <body>
    <span class="designwrapper"></span>
    <div id="main">
      <div id="header"></div>
      <div id="navi"></div>
      <div id="content"></div>
      <div id="footer"></div>
    </div>
    <span class="designwrapper"></span>
  </body>
</html>
 

Anhänge

  • skizze.JPG
    skizze.JPG
    7,5 KB · Aufrufe: 10
Zuletzt bearbeitet:
Gib dem body einfach die Hintergrundfarbe und height 100%.

Dein Gerüst sieht sehr nach divitis aus, es gibt auch noch andere Tags, die deinem Inhalt dann sogar eine Bedeutung geben würden, was ja eigentlich die einzige Aufgabe von HTML ist.
 
Hallo Gilles.

"Design" macht man mit Photoshop - oder einem anderen Grafikprogramm - und setzt es mit CSS um. HTML dient nur zur Auszeichnung des Inhaltes.

Code: 
[B]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
[/B]
<head>

<title>Dein Titel</title>

<!-- META-Angaben -->
<!-- Styles einbinden -->
<!-- ggf.[B][1][/B] JS einbinden -->

</head><body>

<h1>
   <!-- HEADER -->
</h1>

<ul id="nav">
   <li>Punkt 1</li>
    ....
</ul>

<div id="content">
   <!-- CONTENT -->
</div>

<p id="footer">
   <!-- FOOTER -->
</p>


</body></html>

Html-Grundgerüst fertig.

Der rest wird mit CSS gemacht :-)
Ganz wichtig: Vergiss nicht den Doctype!

Gruß
Loon3y

P.S.: ggf.[1] wenn der Footer nichtnur aus einem &copy; / typischen Einzeiler besteht, kannst du auch ein <div> nehmen, da es ja dann wahrscheinlich mehrere Element werden die du gruppieren kannst.


[1] = ggf. (abkürzung) = gegebenenfalls
 
Zuletzt bearbeitet:
_Thor_ schrieb:
Gib dem body einfach die Hintergrundfarbe und height 100%.

Dein Gerüst sieht sehr nach divitis aus, es gibt auch noch andere Tags, die deinem Inhalt dann sogar eine Bedeutung geben würden, was ja eigentlich die einzige Aufgabe von HTML ist.
Zum Vergrößern anklicken....

Also zu dem body. Der hat einen eigenen Hintergrund. Die Spans sollen nur als Wrapper dienen und sollen einen Hintergrund haben, der wie ein Breiter Border-top und -bottom ergeben mit einem Hintergrund. Der Beispiel Code beinhaltet natürlich nicht meinen kompletten Code. Sondern innerhalb der ganzen Divs befinden sich auch Listen, images, usw. Denke nicht das es divitis ist :D (Zum Beispiel besteht meine Navigation aus 2 verschiedenen Menu-Listen)
Ich poste aber gerne mal den Code wenn ich zu Hause bin :)
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben