Kritik zu meiner Webpage

[theton]

Ja, meine Seite. Waere ohne Tabellen nicht denkbar, da diese der Seite ihre Struktur geben und bei dem derzeit verwendeten Layout haette ich unter Verwendung eines Framesets eh nochmal Tabellen in den Frames nutzen oder mit zig div's arbeiten muessen. So gibt es ein sauberes Template, mit dem ich die Seite jederzeit umstrukturieren kann (selbiges enthaelt das Tabellen-Layout), die Funktionalitaeten (RSS-Feeds anzeigen usw.) und natuerlich auch ein CSS, der fuer die Farbgebung, Schriftgroesse u.ae. zustaendig ist. So brauche ich einfach nur noch die Tabellenfelder mit Daten fuellen und wenn ich etwas an der Seite umstrukturieren will, stelle ich einfach die Tabelle um. Menue am oberen Rand? Kein Problem. Einfach das Tabellenfeld innerhalb der Tabelle verschieben und fertig.
Ich wollte auch primaer darauf aufmerksam machen, dass Tabellen durchaus Aenderungen an einer Seite nicht erschweren muessen, wenn die Seite einigermassen durchdacht ist.

 

[lordlamer]

Hi,

du magst recht haben das du mit Tabellen einen einfachereren Aufbau deiner Seite hinbekommst. Wenn du dich aber richtig hinsetzt und divs mit CSS richtg einsetzt kommst du zu dem gleichen ergebnis. Das Ergebnis wird vom Quellcode auch viel einfacher zu lesen sein und zu Pflegen sein. Kannst du mir glauben. Einfach mal ausprobieren. Im ersten Moment hast du vielleicht mehr aufwand bei CSS. Aber der lohnt sich.

Mfg Frank

 

[StyleWarZ]

@StyleWarZ: Hast ne tolle Seite.

Welche Site? Wo her willst du wissen welches meine Site ist? Du meinst sicher mein Opera Blog. Das ist momentan das einzige was ich Betreibe.

 

[CEROG]

Hallo theton,

Ja, meine Seite. Waere ohne Tabellen nicht denkbar, da diese der Seite ihre Struktur geben und bei dem derzeit verwendeten Layout haette ich unter Verwendung eines Framesets eh nochmal Tabellen in den Frames nutzen oder mit zig div's arbeiten muessen. [/QOUTE]

Ich hatte ein komplexeres Beispiel erwartet - und vor allem eines, bei dem deine Aussage auch stimmt. Ich sehe in der Seite im Augenblick nur ein Beispiel dafür, wie mit unnötigen Bildern (die transparenten GIFs) die Ladezeiten deiner Seite vergößert werden.

Ohne daß ich es jetzt ausprobiert habe, denke ich, daß du nur drei DIV-Container für deine Seite brauchst - für jede Spalte eines. Das Menü laßt sich einfach über eine Liste machen. Beispiele dafür findest du bei List-a-matic.
Die anderen Felder sollten mit einfachen <p>-Tags machbar sein.
Beispiele für Grundstrukturen für Seiten in CSS findest du bei Little Boxes

... und natuerlich auch ein CSS, der fuer die Farbgebung, Schriftgroesse u.ae. zustaendig ist. So brauche ich einfach nur noch die Tabellenfelder mit Daten fuellen und wenn ich etwas an der Seite umstrukturieren will, stelle ich einfach die Tabelle um.

Du tust dich mit Änderungen einfacher, wenn du deine Stilangaben nicht bei die einzelnen Tags angibst, sondern zentral. Mit deinen Templates geht es zwar auch schon einfacher als bei einer statischen Seite, aber es geht noch einfacher...

Ich hoffe, du (und sim4000) hast Anregungen bekommen, die sich auf die Qualität der Seite positiv auswirken.

Viele Grüße,

CEROG

 

[theton]

Nun, mir ist zwar immer noch nicht klar, was an einem div so vorteilhaft gegenueber einer Tabelle ist (was soll ich mit 3 div's, wenn eine einzige Tabelle es auch tut?), aber so hat halt jeder seine eigenen Vorlieben. Die Anordnung der Bilder fuer die Rahmen der einzelnen Bloecke waere in mit div eine absolute Qual, dessen bin ich mir fast sicher.

Ich bin mit meiner Seite sonst recht zufrieden und werde da sicherlich hoechstens noch weitere Inhalte einfuegen als dort jetzt noch grossartig was am Design zu aendern (dazu fehlt mir momentan auch die Zeit) und ganz gewiss werde ich mich beim Anordnen der Bilder fuer die Rahmen nicht mit divs rumaergern. Aus meiner Sicht wuerde das weder der Lesbarkeit des Quelltextes zutraeglich sein (Spalten im Source mit divs abzubilden geht naemlich nur untereinander, selbst wenn diese nebeneinander sind) noch sonst irgendwas vereinfachen. Die Beispiele von Little Boxes sind fuer mich total unbrauchbar, weil ich auch dort wieder vor dem Problem der Anordnung der Rahmenelemente stehe. Von daher war dies sicher eine interessante Diskussion, aber Anregungen habe ich nicht wirklich mitgenommen. Fuer mich bleibt eine Tabelle, deren Reihen und Spalten ich im Source so anordnen kann, wie sie auch spaeter auf der Seite angeordnet sind, immer noch uebersichtlicher als lauter div's, die ich im Source nur untereinander setzen kann.

Du bist uebrigens bisher der erste, der mir bei der Site was von hohen Ladezeiten erzaehlt hat. Ein 1 Pixel grosses Bild ist so winzig und wird vom Browser normalerweise auch nur einmal geladen, dass das garnicht wirklich spuerbar ist. (Und ohne Browser wie Konqueror oder IE in dieser Welt, waeren diese auch garnicht noetig.) Ausserdem sind die grundlegenden Stilangaben im Template und werden nur fuer einzelne Tags von der Funktionsschicht aufgrund bestimmter Bedingungen hinzugefuegt. Mir ist daher nicht ganz klar, was an der Qualitaet der Seite schlecht sein sollte. Nur weil ich die von dir bevorzugten "Methoden" nicht nutze/nutzen will? Sorry, aber deine divs waeren mir einfach zu unuebersichtlich und umstaendlich zu handhaben.

 

[sim4000]

Nabend.

He, immer ruhig bleiben. Wie man nun seine seite codet, ist doch letz endlich jedem das seine. Mein Rezept:

Man nehme ein CMS (Joomla), ändere die tempale mit Tablellen und Divs, baue Inhate über CMS und iframes ein, fertig. Das CMS benutze ich nur für Sitezugriff und Dateiverwaltung.

Ich wollte hier keine Diskussion darüber endfachen, wie man seine seite nun am besten codet. Ich jedenfalls bleibe bei meinem Code. Ich wollte doch nur wissen, ob ich noch was ab Aufbau ändern sollte. Habt euch alle wieder lieb. *smile*

Nochmals Danke für eure Hilfe wenn die änderungen fertig sind, seht ihr es ja.

Schönen Abend noch, sim4000.

PS: Wens interessiert: Mein Source

<?php
defined( '_VALID_MOS' ) or die( 'Restricted access' );
// needed to seperate the ISO number from the language file constant _ISO
$iso = explode( '=', _ISO );
// xml prolog
echo '<?xml version="1.0" encoding="'. $iso[1] .'"?' .'>';
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<?php mosShowHead(); ?>
<?php
if ( $my->id ) {
	initEditor();
}
$collspan_offset = ( mosCountModules( 'right' ) + mosCountModules( 'user2' ) ) ? 2 : 1;
//script to determine which div setup for layout to use based on module configuration
$user1 = 0;
$user2 = 0;
$colspan = 0;
$right = 0;
// banner combos

//user1 combos
if ( mosCountModules( 'user1' ) + mosCountModules( 'user2' ) == 2) {
	$user1 = 2;
	$user2 = 2;
	$colspan = 3;
} elseif ( mosCountModules( 'user1' ) == 1 ) {
	$user1 = 1;
	$colspan = 1;
} elseif ( mosCountModules( 'user2' ) == 1 ) {
	$user2 = 1;
	$colspan = 1;
}

//right based combos
if ( mosCountModules( 'right' ) and ( empty( $_REQUEST['task'] ) || $_REQUEST['task'] != 'edit' ) ) {
	$right = 1;
}
?>
<meta http-equiv="Content-Type" content="text/html; <?php echo _ISO; ?>" />
<link href="<?php echo $mosConfig_live_site;?>/templates/rhuk_solarflare_ii/css/template_css.css" rel="stylesheet" type="text/css"/>

<style type="text/css">
<!--

body { margin-left: 0px;
       margin-right: 0px;
       margin-top: 0px;
       margin-bottom: 0px;}

-->
</style>


	<script language="JavaScript" type="text/javascript" src="<?php echo $mosConfig_live_site;?>/homepage/js/counter_wz_dragdrop.js"></script> 
   <script language="JavaScript" type="text/javascript" src="<?php echo $mosConfig_live_site;?>/homepage/js/counter_rollover.js"></script>
   <script language="JavaScript" type="text/javascript" src="<?php echo $mosConfig_live_site;?>/homepage/js/counterbar.js"></script>



</head>
<body style="background-color: #0096FF;" onload="showOrHideMamboBar();">

<table border="0" width="100%">
<tr>
   <td width="40%"><!-- topmenu -->	<?php mosLoadModules ( 'user3', -1); ?></td>
   <td><div align="center"><!-- suche -->	<?php mosLoadModules ( 'user1', -1); ?></div></td>
   <td width="30%"><div align="right"><a href="#" onclick="showOrHideStartMenu()"><img src="/images/menu.gif" border="0" alt=""></a>
                                      <a href="#" onclick="showOrHideMamboBar()"><img src="/images/login.gif" border="0" alt=""></a></div></td>
</tr><tr>
   <td colspan="3"><div align="center"><table border="0" width="100%">
                                       <tr>
                                          <td><hr class="line" noshade></td>
                                          <td width="30%"><table border="0" align="center">
                                               <tr>
                                                  <td><font color="#0000ff"><b>Du bist hier:</b></font></td>
                                                  <td><!-- Wo bin ich? --> <?php mosPathWay(); ?></td>
                                               </tr></table></td>
                                          <td><hr class="line" noshade></td>
                                        </tr></table></div>
</tr>
</table>
   
   



<div name="uhr" style="position: absolute; visibility: visible; right: 20px; top: 60px; z-index: 1; cursor: auto; width: 150px; height: 500;">
   <!-- flashclock admin --><?php mosLoadModules ( 'banner', -2 ); ?>
</div>

<div name="inhalt" style="position: absolute; visibility: visible; left: 180px; top: 60px; z-index: 1; cursor: auto; height: 400px; width: 800px;">
   <!-- inhalt --><?php mosMainBody(); ?>
</div>

<div name="bimage" class="bimage" style="position: absolute; visibility: visible; left: 20px; top: 60px; z-index: 1; cursor: auto; width: 120px; height: 80%;">
</div>

<div name="StartMenu" class="StartMenu" align="StartMenu" id="StartMenu" style="position: absolute; visibility: visible; left: 20px; top: 80px; z-index: 1; cursor: auto; width: 100px;">
   <!-- hmenu -->	<?php mosLoadModules ( 'left', -1); ?>
</div>

<div name="MamboBar" class="mambobar" align="center" id="MamboBar" style="background-color: #0096FF; position: absolute; visibility: visible; right: 200px; top: 100px; z-index: 1; cursor: auto; width: 150px; height: 200px;">
   <!-- Loginfrom --> <?php mosLoadModules ( 'right', -2 ); ?>
</div>


</body>
</html>

 

[theton]

Kannst ja dann nochmal hier reinschreiben, wuerde gern auf die neue Version auch mal 'nen Blick werfen und vergesse das sicherlich, wenn ich nicht durch's Board drauf aufmerksam gemacht werde.

 

[sim4000]

Die temp wird sich so schnell nicht mehr ändern, da Farben und schrift mit na CSS gesteuert werden.

Mal was anderes: Gibts noch jemanden der sich noch nicht ins Gästebuch eingetragen hat?
http://sim4000.myflathost.com/index.php?option=com_wrapper&Itemid=46

Wer lust und Zeit hat, kann auch mit an den Inhalten Basteln. (Pn)

 

[sono]

Sorry, aber deine Hp ist irgendwie schrill.

Lass dich doch mal ein wenig inspirieren : http://www.csszengarden.com/

Ps. Die Farben passen einfach nicht, wenn du css hast dann sollte das ja kein Problem sein.

 

[lordlamer]

schonmal sorry vorweg

aber mit Seitengestalltung und auch den Aufbau solltest du dich nochmal genauer befassen. Wenn ich das Wort Iframes da schon wieder lese

Man sollte Content von Design und Struktur trennen. Dafür bietet es sich grade nur an Inhalte in Divs und nicht unbedingt Tabellen zu setzen(Ja sicherlich braucht man auch Tabellen. Man sollte aber bei Zukünftigen Sachen weitestgehend drauf verzichten). Diese lassen sich dann alle Wunderbar mit CSS anpassen und steuern. Das CMS muss dann "nur" noch die Inhalte pflegen.

Und viele Leute wollen keine vorgefertigten Templates benutzen und die noch anpassen. Da bastelt man selber was und man muss dann Sein eigens erstelltes Template ins CMS einbauen.

Ich bin auch mal gespannt was du jetzt verändern willst. Eigentlich solltest du dich lieber nochmal hinsetzen und die nen Konzept überlegen. So wie es im moment ist, wirkt es "zusammengeklascht" Und wenn du nur kleinigkeiten änderst dann wird sich an dieser Wirkung auch nicht soviel ändern.

Frank

 

[sim4000]

@sono: Tolle Seite, schau ich mir mal genauer an.


Kein so großer andrang. ich kann mich garnicht endscheiden
Nein, das war ja nur nebenbei. Hat sich denn jemand noch nicht in das Gästebuch eingetragen? http://sim4000.myflathost.com/index....pper&Itemid=46

 

[theton]

Was habt ihr nur alle gegen Tabellen? Was ist so toll an div? Tabellen kann ich doch auch mit CSS anpassen, nur halt nicht anordnen, was aber auch nicht notwendig ist, da ne uebersichtliche Tabelle schnell mal umgestellt ist ohne dass ich mich erst durch nen riesiges CSS-File durcharbeiten muss. *find*

 

[sim4000]

theton voooor!

 

[CEROG]

Hallo zusammen,

hier prallen gerade die zwei Strömungen des Websdesigns aufeinander. Dabei tun einige so, als ob die Verwendung von Templates nur mit Tabellen ginge. Das ist ja wohl nicht richtig. Das Template läßt sich natürlich auch mit DIV-Containern und CSS machen.

@sim4000:
Wenn du dir die CSSZengarden-Seite anschaust, so wirf doch auch mal einen Blick auf den Quelltext. Dürfte interessant sein...

@theton:
Dein Code sieht ziemlich sauber aus. Ich habe schon Seiten gesehen, die ziemlich wüst aussahen - vor allem, wenn jemand versuchte, WORD zur Erstellung von Websites zu verwenden - mit verschachtelten Tabellen...

Viele Grüße,

CEROG

 

[theton]

Keine Sorge, ich hab garkein Word. Die Zend-IDE ist noch immer mein bevorzugter PHP-Editor (auch wenn meine Version ziemlich alt ist), oder fuer kleinere Aenderungen halt Emacs. Dass es sogar zwischen Webdesignern solche "Kriege" wie zwischen ViM- und Emacs-Usern gibt, hoere ich gerade das erste Mal.
Ich dachte nur, es gaebe wirklich einen Vorteil von div's. Aber wenn es genauso ist, wie mit ViM und Emacs, Gnome und KDE usw. benutze ich wohl doch lieber Tabellen. Die liegen mir mehr.

 

[sim4000]

Zu divs und tables:

Ich benutze beides. (siehe Source)
also ist das doch eine gute mischung zwischen den beiden "Fronten"

 

[sono]

Was habt ihr nur alle gegen Tabellen? Was ist so toll an div? Tabellen kann ich doch auch mit CSS anpassen, nur halt nicht anordnen, was aber auch nicht notwendig ist, da ne uebersichtliche Tabelle schnell mal umgestellt ist ohne dass ich mich erst durch nen riesiges CSS-File durcharbeiten muss.

Für jeden Zeck gibt es bestimmte Tags.

Tabellen sind nicht Grundsätzlich böse. Man sollte sie eben nur für den Richtigen Zweck verwenden, welcher jedoch nicht das layouten einer Seite ist.

Da gibts so Schlagwörter wie Trennung von Design und Daten, BarriereFreiheit , Suchmaschinen optimierung, leichtere Wartbarkeit usw.

Aber man muss ja nicht jeden Scheiß mittmachen , nicht?

 

[theton]

Nun, ich nutze die Tabellen normalerweise um die Anordnung der Seite und der Elemente festzulegen und die Groesse der einzelnen Bereiche. Sagt ja keiner, dass div's schlecht sind, nur empfinde ich die Strukturierung einer Seite mit div's alles andere als leicht wartbar oder uebersichtlich. Die Daten liegen bei mir trotzdem alle sauber in einer Datenbank und ich stelle nicht den Anspruch an meine Seite, dass sie barrierefrei sein soll (ganz einfach, weil ich mich damit nicht auskenne und mir die Zeit fehlt mich damit auseinanderzusetzen). Und auch auf Suchmaschinen-Optimierung lege ich nicht wirklich wert. Wobei mir da auch nicht bekannt ist, dass die irgendwelche Probleme mit Tabellen haetten, wohl eher mit Frames.

 

[CEROG]

Hallo zusammen,

es gibt einen Bereich, in dem Tabellen Probleme bereiten (sollen). Stichwort dazu ist "Barrierefreiheit".
Es gibt auch Leute, die mit Screenreadern im Internet unterwegs sind. Hier soll es Probleme mit Tabellen geben. Leider konnte ich das noch nicht ausprobieren.
ZUm Thema BArrierefreiheit gibt es im Knowware-Verlag ein Heft, das für den Einstieg nicht schlecht ist. Und vor allem - es kostet nicht viel, nur 3 oder 4 Euro.

@Theton: Hast du dir schon mal eine der inzwischen geposteten Seiten angeschaut und gesehen, was ohne Tabellen für das Layout alles möglich ist?

Viele Grüße,

CEROG

 

[sim4000]

Zum Thema Barrierefreiheit:

Das sieht man ja an meinem Layout.
Der Inhalt kann ja nich in einer Tabelle sein, sonst zerstört das mein ganzes Layout. Deshalb hab ich suche, topmenu, und die links oben rechts in einer Tabelle, und Uhr, Adminmenu, H-menu und Inhalt hab ich mit dev gemacht.

Wie gesagt, eine gute mischung zwischen den "Fronten"