Abstände, trotz border, padding und spacing=0

Skibbie · 14 März 2009

Hallo,

ich habe ziemlich große Abstände zwischen meinen Tabellen und/bzw. Bildern.
Hier ist mal der Code:

<html>
<body>
<head>
<style type="text/css">
* {
margin:0px;
padding:0px;
}
</style>
</head>
<table border=0 cellspacing=0 cellpadding=0 width=1000 height=1500>
<tr>
<td>
<table border=0 cellspacing=0 cellpadding=0 width=1000 height=1500>
<tr>
<td><img border=0 src="head.jpg" height=197 width=1000></td>
</tr>
<tr>
<td>
<table border=0 cellspacing=0 cellpadding=0 width=1000 height=429>
<tr>
<td><img border=0 src="Artikel1.jpg" height=429 width=192></td>
<td><img border=0 src="Orchidee.jpg" height=429 width=626></td>
<td><img border=0 src="Artikel2.jpg" height=429 width=182></td>
</tr>
</table>
</td></tr>
<tr>
<td>
<table border=0 cellspacing=0 cellpadding=0 width=1000 height=469>
<tr>
<td><img border=0 src="Beschreibung1.jpg" height=469 width=505></td>
<td>
<table border=0 cellspacing=0 cellpadding=0 width=505 height=469>
<tr>
<td><img border=0 src="Beschreibung2.jpg" height=81 width=497></td>
</tr>
<tr>
<td>

<table border=0 cellspacing=0 cellpadding=0 width=505 height=386>
<tr>
<td><img border=0 src="Beschreibung3.jpg" height=386 width=232></td>
<td>

<table border=0 cellspacing=0 cellpadding=0 width=265 height=16>
<tr>
<td><img border=0 src="Beschreibung4.jpg" height=16 width=49></td>
<td><img border=0 src="Beschreibung5.jpg" height=16 width=216></td>
</tr></table>
<table border=0 cellspacing=0 cellpadding=0 width=265 height=251>
<tr>
<td><img border=0 src="Beschreibung6.jpg" height=251 width=265></td>
</tr></table>
<table border=0 cellspacing=0 cellpadding=0 width=265 height=17>
<tr>
<td><img border=0 src="Beschreibung7.jpg" height=17 width=72></td>
<td><img border=0 src="Beschreibung8.jpg" height=17 width=30></td>
<td><img border=0 src="Beschreibung9.jpg" height=17 width=163></td>
</tr></table>
<table border=0 cellspacing=0 cellpadding=0 width=265 height=102>
<tr>
<td><img border=0 src="Beschreibung10.jpg" height=102 width=265></td>
</tr></table>
</td>
</tr></table>
</td>
</tr></table>
</td>
</tr></table>
</td>
</tr></table>
</td>
</tr>
<tr>
<td><img border=0 src="Kaufabwicklung.jpg" height=402 width=1000></td>
</tr>
</table>

</td>
</tr>
</table>
</body>
</html>

Kann man das überhaupt so bauen ? Oder sollte man da lieber etwas anderes nehmen? Ich brauch das allerdings in HTML.

Ausgangslage ist eben ein großes Bild, dass ich aus dem Grund so zersplittert habe, weil ich auf zwei kleinen bildern(Beschreibung 4 & 8 ) Links setzen will. Außerdem lädt eine Seite ja bekanntlich auch schneller, wenn man Sie aus mehreren Grafiken zusammensetzt.

Da ImageSplitter Programme immer in komplette Spalten und Zeilen teilen, ich aber nicht so viele Teilbilderchen haben wollte, habe ich das ganze selbst in die Hand genommen, und eben einen sehr verschachtelten, aber zunächst Anordnungstechnisch fuktionierenden Code programmiert. Allerdings habe ich diese Abstände dazwischen, obwohl ich schon alles auf 0 gesetzt habe.

Wo liegt mein Denkfehler?

Gruß Skibbie

threadi · 14 März 2009

Skibbie schrieb:
Kann man das überhaupt so bauen ?

...

Wo liegt mein Denkfehler?

Du verwendest eine Tabelle als Design der Webseite. Das ist der falsche Weg.

Das was du willst kannst Du auf 2 verschiedenen Wegen machen:
a) ein komplettes Bild über den ein ImageMap liegt mit dem Du einzelne Teile des Bildes verlinken kannst.
b) mehrere kleine Bilder die per CSS-Eigenschaft float nebeneinander stehen.

Ich würde dir zu a) raten, weil

Außerdem lädt eine Seite ja bekanntlich auch schneller, wenn man Sie aus mehreren Grafiken zusammensetzt.

das ein Irrglaube ist. Mehrere Bilder statt einem haben (je nach Grafikformat) eine höhere Datenmenge und der Besucher muss folglich mehr laden. Überdenke vielleicht auch mal wieso Du ein scheinbar so großes Bild brauchst.

Efchen · 16 März 2009

Skibbie schrieb:
Außerdem lädt eine Seite ja bekanntlich auch schneller, wenn man Sie aus mehreren Grafiken zusammensetzt.

Mit ein bisschen Nachdenken, fällt schnell auf, dass das gar nicht sein kann. Statt eines Bildes, müssen nun mehrere Bilder abgerufen werden. Wieso sollte das schneller gehen?
Wenn Du statt eines Sixpacks sechs Einzelflaschen in Deinen Einkaufswagen legst, brauchst Du doch auch länger und bist nicht schneller. Für ein Bild brauchst Du einen HTTP-Request. Für 10 Bilder schon 10 Requests, selbst wenn die Bilder zusammengenommen die selbe Größe haben, wie das Gesamtbild. Splittet man ein Bild in mehrere auf, wird die Gesamtgröße aller Bilder sicher auch höchstens größer, aber nicht kleiner.

Aber es gibt ja auch Leute, die glauben, Tabellen sind fürs Layout da :-)

Allerdings habe ich diese Abstände dazwischen, obwohl ich schon alles auf 0 gesetzt habe.

Sowas macht man mit CSS. Ich kann Dir also auch nur empfehlen, auf CSS umzusteigen. Dann wirds auch viel einfacher, übersichtlicher, und wenn Du keine Tabelle fürs Layout missbrauchst und ein externes Stylesheet benutzt, dann hast Du wirklich kürzere Ladezeiten, weil Du das Layout dann im Stylesheet hast, das einmal geladen und dann gecached wird, und nicht mit jeder Seite neu geladen werden muss.

Wo liegt mein Denkfehler?

In der Arbeitsweise aus den frühen 1990er Jahren.

Abstände, trotz border, padding und spacing=0

Skibbie

Neues Mitglied

threadi

Moderator

Efchen

Guest

Neueste Beiträge