Design - wie aufbauen?

Beitrag von **Berbatov** » 28.04.2006, 16:40

Hi Leute, hab mir mal wegen meinem neuen Projekt eine Designvorlage erstellt. Nun die Frage wie Code ich das am besten? Es soll so sein wie auf dem Bild, also mit den "runden Ecken", sowie mit den strichen um den Header, die bis zur Umgrenzung gehen.

Die bunten Flächen werden naher logischerweise ersetzt.

Soll man das alles mit Grafiken machen, oder kann man das mit befehlen erzeugen?

https://img122.imageshack.us/img122/544/aja2gm.jpg

von **Anzeige von ABAKUS** »

Content Erstellung von ABAKUS Internet Marketing
Ihre Vorteile:

einzigartige Texte
suchmaschinenoptimierte Inhalte
eine sinnvolle Content-Strategie
Beratung und Umsetzung

Jetzt anfragen: 0511 / 300325-0

Beitrag von **shapeshifter** » 28.04.2006, 17:01

Am besten erzeugst du mit ImageMagick die "runden ecken" per Kreisformel 4 mal und schneidest automatisiert für jede Ecke den entsprechenden Bereich aus.......

Oder du schaust dir einfach nochmal paar Seiten an und überlegst dir ein nettes Design per CSS !

Auch möglich......

Beitrag von **ole1210** » 28.04.2006, 18:45

Das kannst du doch problemlos komplet in CSS realisieren.

Noch viel simpler kann ein Design ja kaum sein.

Informier dich am besten bei den einschlägigien Quellen wie www.css4you.de. da findest du sicher hilfe.

Ich denke, das Template kannst du in etwa 1er Stunde inkl. Grafiken erstellen.

Viele Grüße

Ole

von **Anzeige von ABAKUS** »

Beitrag von **Anonymous** » 28.04.2006, 18:49

ich finde, das mit der werbung neben der eigentlichen Seite sollteste dir nochmal überlegen... so etwas wirkt immer irgendwie improvisiert... besser das komplette design ein wenig breiter und die Werbeflächen richtig integrieren.... dürfte sich auch auf die Klickrate auswirken...

Beitrag von **rechtlegal** » 28.04.2006, 18:51

Hübsch! Ich liebe websites, wo die Planung der Werbung erheblich weiter fortgeschritten ist als die Planung des contents.

Beitrag von **Ice Man** » 29.04.2006, 12:41

jo, hauptsache erstmal Adsense (3x) und einmal Ebay Relevance Ads eingebaut.

Also ob man 4x so viel verdient, nur weil man 4x Werbung einbaut.
Warum dann nicht gleich 20 x einbauen, dann ist das Eigenheim schnell abbezahlt

Beitrag von **Berbatov** » 29.04.2006, 17:19

rechtlegal hat geschrieben:Hübsch! Ich liebe websites, wo die Planung der Werbung erheblich weiter fortgeschritten ist als die Planung des contents.

ja am besten veröffentliche ich gleich meine ganzen pläne un den content, damit jeder die idee sieht und die vor mir verwirklicht. ich glaube nicht

_________________

Hab ein Porblem beim coden.

https://img503.imageshack.us/img503/9244/miese2gf.jpg

So siehts immoment bei mir aus. Habs mit ner Tablle gemacht und diesen Kasten in drei Spalten und 4 Reihen zerlegt. der Code sieht bei mir so aus:

Code: Alles auswählen

<TABLE WIDTH="740" BORDER="0" CELLPADDING="0" CELLSPACING="0">
  <TR>
    <TD width="8" height="9"><img src="xy1.jpg" WIDTH=8 HEIGHT=9 ALT=""></TD>
    <td width="724" height="9"><img src="xy2.jpg" WIDTH=724 HEIGHT=9 ALT=""></TD>
    <td width="8" height="9"><img src="xy3.jpg" WIDTH=8 HEIGHT=9 ALT=""></TD>
  </TR><TR>
    <TD width="8" height="133"><img src="xy4.jpg" WIDTH=8 HEIGHT=133 ALT=""></TD>
    <TD width="724" height="133"><img src="xy5.jpg" WIDTH=724 HEIGHT=133 ALT=""></TD>
    <TD width="8" height="133"><img src="xy6.jpg" WIDTH=8 HEIGHT=133 ALT=""></TD>
...

So hab die Kästchen also immer so groß gemacht wie die Grafik. Aber irgendwie (trotz Cellpading und Cellspacing sind unter jeder Tabellenreihe noch so ein Streifen vom Hintergrund.
Komisch, denn wenn ich mit Photoshop code, macht der mir genau denselben Code (Also mit denselben Attributen wie ich jetzt hab) und es sind alle Grafiken geschlossen aneinander...?!?

Beitrag von **ole1210** » 29.04.2006, 21:15

Mach das doch ohne Tabelle! Schön mit DIVs.
Da hast du wesentlich mehr Freude drann. Tabellen sind als Layoutmittel doch echt überholt.

Beitrag von **Hasenhuf** » 29.04.2006, 22:19

Berbatov hat geschrieben:Aber irgendwie (trotz Cellpading und Cellspacing sind unter jeder Tabellenreihe noch so ein Streifen vom Hintergrund.

Tritt das Problem auf dem Webspace, lokal oder bei beidem auf? Und was passiert, wenn Du die Größenangeben für die Zellen wegläßt (die Bilder machen das auch so).

Beitrag von **Berbatov** » 29.04.2006, 22:51

ole1210 hat geschrieben:Mach das doch ohne Tabelle! Schön mit DIVs.
Da hast du wesentlich mehr Freude drann. Tabellen sind als Layoutmittel doch echt überholt.

ich kanns halt nur mit Tabelle

is doch locker flockig einfach (also eigentlich

)

Ich müsst bei selfhtml mal gucken was DIVs sind und wies damit geht. Was ist denn an Tabellen so schlecht?

Hasenhuf hat geschrieben:
Berbatov hat geschrieben:Aber irgendwie (trotz Cellpading und Cellspacing sind unter jeder Tabellenreihe noch so ein Streifen vom Hintergrund.
Tritt das Problem auf dem Webspace, lokal oder bei beidem auf? Und was passiert, wenn Du die Größenangeben für die Zellen wegläßt (die Bilder machen das auch so).

Lokal und im Web. Ne auch beim Weglassen der GRößen gehts net

EDIT: lol jez gehts. das

Code: Alles auswählen

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http&#58;//www.w3.org/TR/html4/strict.dtd">

war die ursache ?!? Naja egal, jetz gehts, is zwar jez weg das zeug da, aber es geht ja^^

Beitrag von **13pixelchen** » 30.04.2006, 00:01

Beitrag von **hobbyweb** » 30.04.2006, 01:35

Das sind soweit ich weiss Whitespaces die der IE falsch anzeigt, im FF müsste es gehen.

Beitrag von **MonikaTS** » 30.04.2006, 07:45

Berbatov hat geschrieben:...

EDIT: lol jez gehts. das
Code: Alles auswählen
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http&#58;//www.w3.org/TR/html4/strict.dtd">
war die ursache ?!? Naja egal, jetz gehts, is zwar jez weg das zeug da, aber es geht ja^^

lol

das was Du da weggemacht hast, sind wichtige Angaben für den Browser,

wenn Du so ein Design haben willst,

einfach zu wenig Zeit hast Dich mit dem HTML des Jahres 2006 auseinanderzusetzen,
leiste Dir einen WebDesigner.

in dem Fall reicht sogar 'dem Nachbar sein Bub';);)

https://blog.html.it/layoutgala/

die schenken HTML für das Jahr 2006 und die folgenden Jahre sogar her.

@13pixelchen

Hier ist ein virtueller Kaffee, der hilft Dir wieder auf den Damm

Beitrag von **Anonymous** » 30.04.2006, 12:36

ist ein bekanntes problem im IE....

https://www.heise.de/ix/artikel/2004/03/136/

https://www.carsten-protsch.de/zwischen ... ecken.html

https://de.selfhtml.org/css/formate/box_modell.htm

Code: Alles auswählen

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

so sollte auch der IE das Dokument wie gewünscht anzeigen, da dann hier auch der Quirks-Mode verwendet wird...

aber dann ggf. auch nochmal mit anderen Browsern testen...

Beitrag von **ole1210** » 30.04.2006, 14:15

Ich hab mal eben was mit CSS gebastelt. Im IE, FF und Opera läuft es problemlos. Müsste mit allen Browsern kompatibel sein. ist aber nicht getestet:

CSS-Code:

Code: Alles auswählen

<style type="text/css">
<!--
.oben &#123; background&#58; url&#40;1.gif&#41; no-repeat top left;&#125;
.oben div &#123; background&#58; url&#40;2.gif&#41; no-repeat top right; &#125;
.unten &#123; background&#58; url&#40;3.gif&#41; no-repeat bottom left; &#125;
.unten div &#123; background&#58; url&#40;4.gif&#41; no-repeat bottom right; &#125;

.oben div, .oben, .unten div, .unten &#123; width&#58; 100%; height&#58; 30px; &#125;

.inhalt &#123; border&#58; 2px solid black; border-top&#58; 0px; border-bottom&#58; 0px; &#125;

h1 &#123; margin-top&#58;0px; &#125;

p &#123; margin-bottom&#58;0px;&#125;
-->
</style>

HTML-Code:

Code: Alles auswählen

<div class="oben"><div></div></div>
<div class="inhalt">
bla blubb</div>
<div class="unten"><div></div></div>

Die Box kann in diesem Fall beliebig hoch und maximal 1630Px breit sein. Passt sich dynamisch an. Ist bestimmt die elegantere Lösung als mit Tabellen...

Das Endresultat sieht dann so aus:
Bild

Für Fragen stehe ich jederzeit zur Verfügung.

Vuiele Grüße

Ole