bulletproof webdesign - wer klärt mich auf?

maccaroni · 01.08.2006, 08:55

hallo zusammen

eigentlich ist xhtml und css nichts neues für mich. trotzdem lese ich gerne fachbücher und sehe auch neue lösungswege. aus diesem grund habe ich mir das buch «bulletproof webdesign» gekauft.

eines will mir da einfach nicht in den kopf gehen. von anfang an ist die ganze zeit von gif-bildern mit transparenz die rede, welche den hintergrund des css durchschimmern lassen. ganz besonders aufgefallen ist mir dies bei kapitel 3 im «weblog-kopf». dort wird eine linie mit bottom left platziert. die datei ist riesengross, oben ein transparenter bereich und unten eine linie. Für was ist der riesige, transparente bereich oberhalb der linie überhaupt gut, wenn sie sowieso bottom platziert wird?

hoffe einigermassen verständlich :-)

gruss maccaroni

Deacon Frost · 01.08.2006, 09:51

weiss nicht, ob ich Dich verstehe, aber oftmals benutzt man solche transparente GIFs oder GIFs die teilweise transparent sind als Layouthilfe. Wenn Du z.B. einen bestimmten Abstand in Deinem Tabellengeruest haben moechtest, kannst Du sowas verwenden.

glowy · 01.08.2006, 10:16

Aber geht das durch den Einsatz von CSS nicht viel effektiver und besser?

Boris · 01.08.2006, 10:27

Deine Beschreibung ist irgendwie nicht ausreichend, um sich den Sinn vorzustellen. Im Buch sind doch garantiert auch Bilder dazu?

01.08.2006, 11:49

hm, ich könnte mir den zusätzlichen freiraum nur damit erklären, dass browser, die die wiederholregeln (z.b. background-repeat: repeat-x; ) nicht, aber die positionierung des hintergrundbildes doch schon verstehen, das mit dem hintergrundbild ausgestattete element in jedem fall richtig darstellen und auch bei grössenveränderungen, z.b. verstellen der schriftgrösse, die linie nur an der vorgesehenen position anzeigen.

allerdings kenn ich das buch auch nicht.

maccaroni · 01.08.2006, 12:09

ich dachte, evtl hat jemand das buch und sieht den sinn hinter der ganzen sache. klar gibt es bilder, aber ich kann den ausschnitt hier sicherlich nicht veröffentlichen.

nochmals zur verständigung:

es geht um einen header. 1024 pixel breit, keine höhe definiert. der aufbau des headers ist folgendermassen:

Code:

<div id="header">
<h1>Titel</h1>
</div>

dem div wird ein grosser background mitgegeben, damit bei skalierung das hintergrundbild in der höhe nicht plötzlich abgeschnitten wird.
h1 bekommt ebenfalls ein hintergrundbild mit ausrichtung bottom left (als abschluss des headers). dieses hintergrundbild ist sagen wir 200px hoch und hat die untersten 20px einen rahmen, die restlichen 180pixel sind transparent. im buch wird dies begründet, dass durch den transparenten teil das hintergrundbild von div="header" scheinen soll.

da das hintergrundbild für h1 jedoch mit bottom left deklariert wird, so könnte man das bild doch genauso nur 20px hoch machen..schliesslich ist es doch nach unten ausgerichtet?!

gruss maccaroni

webcreate · 01.08.2006, 16:36

ich versteh den Sinn nicht, wenn ich die Größe mit CSS festlege, kann der User resizen, wie er will. IMHO nur eines: Traffikverschwendung.

AnnaStesia · 01.08.2006, 17:27

Ich kenn das Buch auch nicht, und so wie Du es beschreibst, scheint Deine Denkweise auch richtig; andererseits würde ich Mr. Cederholm durchaus unterstellen, dass er Ahnung hat, wovon er schreibt, also fehlt uns hier vielleicht wirklich ein wichtiges Detail für den Gesamtkontext. Ich hab mir mal den Sample Code für Kapitel 3 angeschaut und da sind zumindest keine übergroße transparente Bereiche in den Gifs zu finden.

maccaroni · 01.08.2006, 19:44

Zitat:

Zitat von AnnaStesia

Ich kenn das Buch auch nicht, und so wie Du es beschreibst, scheint Deine Denkweise auch richtig; andererseits würde ich Mr. Cederholm durchaus unterstellen, dass er Ahnung hat, wovon er schreibt, also fehlt uns hier vielleicht wirklich ein wichtiges Detail für den Gesamtkontext. Ich hab mir mal den Sample Code für Kapitel 3 angeschaut und da sind zumindest keine übergroße transparente Bereiche in den Gifs zu finden.

genau das ist es. ich kann mir nicht vorstellen, das das ganze wirklich keinen sinn hat. nur leider finde ich diesen nicht...
bei dem von mir geschilderten sachverhalt geht es eben nicht um den sample von kapitel 3 selber sondern um ein erweitertes beispiel. aus diesem grund findest du im sample-code auch nicht die von mir angesprochene datei.

vielleicht findet sich ja jemand, der im besitz dieses buches ist.

gruss maccaroni