zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > Site- und Layoutcheck
Seite neu laden Layoutcheck + Including

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 23.09.2008, 21:26
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 01.03.2008
Beiträge: 31
crimi befindet sich auf einem aufstrebenden Ast
Standard Layoutcheck + Including

Hey, würde euch bitten mal mein Layout zu begutachten und einfach den Seitenaufbau generell mal anzuschauen.

Gebe euch hier mal den Code für meine News-Seite, also die .html und die .css Datei.

Mich würde einfach mal interessieren, was ich aus professioneller Sicht bisher falsch gemacht habe. ASCII Problematiken und die Formatierung im News Text sind klar, geht mehr um den Aufbau und das Design.

Bin dankbar für jede Kritik!

news.html
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>

	<head>
		<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
		<title>TV Dudenhofen Handball</title>
		<link rel="stylesheet" type="text/css" href="./css/page.css">
		<script type="text/javascript" language="JavaScript1.2">
			function versteckt(objektID) 
			{ 
				
				ghost = "ghost" + objektID;
				StatusText = "StatusText" + objektID;
				if(document.getElementById(ghost).style.display=='none') {
					document.getElementById(ghost).style.display = 'block';
					window.document.getElementById(StatusText).innerHTML = 'schliessen';
			 		/*window.document.images['Icon'].src = 'minus.png';*/   	
				}
				else {
					document.getElementById(ghost).style.display = 'none';
					window.document.getElementById(StatusText).innerHTML = 'oeffnen';
					/*window.document.images['Icon'].src = 'plus.png';*/
				}
			} 
		</script> 
	</head>


	

	

	
	<body>
		<div id="Page">
		<div id="Top">
			<div id="TopBreadcrumbs">Home > Mannschaften > Herren I</div>
			<div id="TopShortinfo">Montag, 08.09.2008, 22:03</div>
		</div>	
		<div id="Banner"></div>
		<div id="Menu">            
			<ul>
                <li><a href="...">Home</a></li>
                <li><a href="...">News</a></li>
				<li><a href="...">Forum</a></li>
                <li><a href="...">Mannschaften</a></li>
				<li><a href="...">Statistiken</a></li>
                <li><a href="...">Downloads</a></li>
				<li><a href="...">Sponsoren</a></li>
            </ul>
		</div>
		<div id="Caption">
			Willkommen bei der Handballabteilung des TV Dudenhofen
		</div>
		<div id="Main">
			<div id="MainLeft">
				<div id="ContentNews">
					<table id="TabelleMain" width="100%">
						<caption>
							Newstitel
						</caption>
							<tr>
								<td>
									Hier steht dann der eigentlich Newstext, der ganz lang ist und unter Umstaenden auch über den entsprechenden Platzbedarf hinausgeht.
									Dennoch koennte man hier Formatierungen, Links und den ganzen Krams einbetten.
									<b>Fetter Test</b>
									<u>Unterstrichener Test</u>
									<a href="#">Link Test</a>
									Und dann ist der Newsshorttext auch schon vorbei
								</td>
							</tr>
							<tr>
								<td>
							    	<div style="display : none" id="ghost01">
							    		Hier steht dann der ultra lange Longtext. Dieser Langtext wird nur aufgeklappt, wenn man vorher auf den "oeffnen" Link gedrückt hat. Dabei sollte sich weder die Seite verschieben noch die vertikale Ausrichtung.
										Im Optimalfall funktionieren hier auch weiterhin alle Stilarten:
										<b>Fetter Test</b>
										<u>Unterstrichener Test</u>
										<a href="#">Link Test</a>	
										Optimalfall eingetreten :D	
							    	</div>
									<a href="#" onclick="versteckt('01'); return false;" id="StatusText01">oeffnen</a>
								</td>
							</tr>					
					</table>
					<table id="TabelleMain" width="100%">
						<caption>
							Newstitel
						</caption>
							<tr>
								<td>
									Hier steht dann der eigentlich Newstext, der ganz lang ist und unter Umstaenden auch über den entsprechenden Platzbedarf hinausgeht.
									Dennoch koennte man hier Formatierungen, Links und den ganzen Krams einbetten.
									<b>Fetter Test</b>
									<u>Unterstrichener Test</u>
									<a href="#">Link Test</a>
									Und dann ist der Newsshorttext auch schon vorbei
								</td>
							</tr>
							<tr>
								<td>
							    	<div style="display : none" id="ghost02">
							    		Hier steht dann der ultra lange Longtext. Dieser Langtext wird nur aufgeklappt, wenn man vorher auf den "oeffnen" Link gedrückt hat. Dabei sollte sich weder die Seite verschieben noch die vertikale Ausrichtung.
										Im Optimalfall funktionieren hier auch weiterhin alle Stilarten:
										<b>Fetter Test</b>
										<u>Unterstrichener Test</u>
										<a href="#">Link Test</a>	
										Optimalfall eingetreten :D								
							    	</div>
									<a href="#" onclick="versteckt('02'); return false;" id="StatusText02">oeffnen</a>
								</td>
							</tr>					
					</table>
					<table id="TabelleMain" width="100%">
						<caption>
							Newstitel
						</caption>
							<tr>
								<td>
									Hier steht dann der eigentlich Newstext, der ganz lang ist und unter Umstaenden auch über den entsprechenden Platzbedarf hinausgeht.
									Dennoch koennte man hier Formatierungen, Links und den ganzen Krams einbetten.
									<b>Fetter Test</b>
									<u>Unterstrichener Test</u>
									<a href="#">Link Test</a>
									Und dann ist der Newsshorttext auch schon vorbei
								</td>
							</tr>
							<tr>
								<td>
							    	<div style="display : none" id="ghost03">
							    		Hier steht dann der ultra lange Longtext. Dieser Langtext wird nur aufgeklappt, wenn man vorher auf den "oeffnen" Link gedrückt hat. Dabei sollte sich weder die Seite verschieben noch die vertikale Ausrichtung.
										Im Optimalfall funktionieren hier auch weiterhin alle Stilarten:
										<b>Fetter Test</b>
										<u>Unterstrichener Test</u>
										<a href="#">Link Test</a>	
										Optimalfall eingetreten :D	 
							    	</div>
									<a href="#" onclick="versteckt('03'); return false;" id="StatusText03">oeffnen</a>
								</td>
							</tr>						
					</table>
					<table id="TabelleMain" width="100%">
						<caption>
							Newstitel
						</caption>
							<tr>
								<td>
									Hier steht dann der eigentlich Newstext, der ganz lang ist und unter Umstaenden auch über den entsprechenden Platzbedarf hinausgeht.
									Dennoch koennte man hier Formatierungen, Links und den ganzen Krams einbetten.
									<b>Fetter Test</b>
									<u>Unterstrichener Test</u>
									<a href="#">Link Test</a>
									Und dann ist der Newsshorttext auch schon vorbei
								</td>
							</tr>
							<tr>
								<td>
							    	<div style="display : none" id="ghost04">
							    		Hier steht dann der ultra lange Longtext. Dieser Langtext wird nur aufgeklappt, wenn man vorher auf den "oeffnen" Link gedrückt hat. Dabei sollte sich weder die Seite verschieben noch die vertikale Ausrichtung.
										Im Optimalfall funktionieren hier auch weiterhin alle Stilarten:
										<b>Fetter Test</b>
										<u>Unterstrichener Test</u>
										<a href="#">Link Test</a>	
										Optimalfall eingetreten :D	
							    	</div>
									<a href="#" onclick="versteckt('04'); return false;" id="StatusText04">oeffnen</a>
								</td>
							</tr>					
					</table>
					<table id="TabelleMain" width="100%">
						<caption>
							Newstitel
						</caption>
							<tr>
								<td>
									Hier steht dann der eigentlich Newstext, der ganz lang ist und unter Umstaenden auch über den entsprechenden Platzbedarf hinausgeht.
									Dennoch koennte man hier Formatierungen, Links und den ganzen Krams einbetten.
									<b>Fetter Test</b>
									<u>Unterstrichener Test</u>
									<a href="#">Link Test</a>
									Und dann ist der Newsshorttext auch schon vorbei
								</td>
							</tr>
							<tr>
								<td>
							    	<div style="display : none" id="ghost05">
							    		Hier steht dann der ultra lange Longtext. Dieser Langtext wird nur aufgeklappt, wenn man vorher auf den "oeffnen" Link gedrückt hat. Dabei sollte sich weder die Seite verschieben noch die vertikale Ausrichtung.
										Im Optimalfall funktionieren hier auch weiterhin alle Stilarten:
										<b>Fetter Test</b>
										<u>Unterstrichener Test</u>
										<a href="#">Link Test</a>	
										Optimalfall eingetreten :D	
							    	</div>
									<a href="#" onclick="versteckt('05'); return false;" id="StatusText05">oeffnen</a>
								</td>
							</tr>					
					</table>
					<table id="TabelleMain" width="100%">
						<caption>
							Newstitel
						</caption>
							<tr>
								<td>
									Hier steht dann der eigentlich Newstext, der ganz lang ist und unter Umstaenden auch über den entsprechenden Platzbedarf hinausgeht.
									Dennoch koennte man hier Formatierungen, Links und den ganzen Krams einbetten.
									<b>Fetter Test</b>
									<u>Unterstrichener Test</u>
									<a href="#">Link Test</a>
									Und dann ist der Newsshorttext auch schon vorbei
								</td>
							</tr>
							<tr>
								<td>
							    	<div style="display : none" id="ghost06">
							    		Hier steht dann der ultra lange Longtext. Dieser Langtext wird nur aufgeklappt, wenn man vorher auf den "oeffnen" Link gedrückt hat. Dabei sollte sich weder die Seite verschieben noch die vertikale Ausrichtung.
										Im Optimalfall funktionieren hier auch weiterhin alle Stilarten:
										<b>Fetter Test</b>
										<u>Unterstrichener Test</u>
										<a href="#">Link Test</a>	
										Optimalfall eingetreten :D	
							    	</div>
									<a href="#" onclick="versteckt('06'); return false;" id="StatusText06">oeffnen</a>
								</td>
							</tr>					
					</table>
					<table id="TabelleMain" width="100%">
						<caption>
							Newstitel
						</caption>
							<tr>
								<td>
									Hier steht dann der eigentlich Newstext, der ganz lang ist und unter Umstaenden auch über den entsprechenden Platzbedarf hinausgeht.
									Dennoch koennte man hier Formatierungen, Links und den ganzen Krams einbetten.
									<b>Fetter Test</b>
									<u>Unterstrichener Test</u>
									<a href="#">Link Test</a>
									Und dann ist der Newsshorttext auch schon vorbei
								</td>
							</tr>
							<tr>
								<td>
							    	<div style="display : none" id="ghost07">
							    		Hier steht dann der ultra lange Longtext. Dieser Langtext wird nur aufgeklappt, wenn man vorher auf den "oeffnen" Link gedrückt hat. Dabei sollte sich weder die Seite verschieben noch die vertikale Ausrichtung.
										Im Optimalfall funktionieren hier auch weiterhin alle Stilarten:
										<b>Fetter Test</b>
										<u>Unterstrichener Test</u>
										<a href="#">Link Test</a>	
										Optimalfall eingetreten :D	
							    	</div>
									<a href="#" onclick="versteckt('07'); return false;" id="StatusText07">oeffnen</a>
								</td>
							</tr>					
					</table>										
				</div>
			</div>
			<div id="MainRight">
				<table id="TabelleMainRight" width="100%">
					<caption>
						Spieltermine
					</caption>
						<tr>
							<td>12.09.</td>
							<td>18:00</td>
							<td>H1</td>
							<td>TVD - Mannheim</td>
						</tr>
						<tr>
							<td>12.09.</td>
							<td>14:45</td>
							<td>D1</td>
							<td>Speyer - TVD</td>
						</tr>
						<tr>
							<td>13.09.</td>
							<td>19:00</td>
							<td>H1</td>
							<td>Hocken - TVD</td>
						</tr>
						<tr>
							<td>28.09.</td>
							<td>24:00</td>
							<td>D2</td>
							<td>TVD - Bellheim</td>
						</tr>
						<tr>
							<td>29.09.</td>
							<td>18:00</td>
							<td>H1</td>
							<td>Hocken - TVD</td>
						</tr>
						<tr>
							<td>30.09.</td>
							<td>13:00</td>
							<td>D2</td>
							<td>TVD - Bellheim</td>
						</tr>
				</table>
				<table id="TabelleMainRight" width="100%">
					<caption>
						Ergebnisse
					</caption>
						<tr>
							<td>12.09.</td>
							<td>H1</td>
							<td>TVD - München</td>
							<td>26:12</td>
						</tr>
						<tr>
							<td>12.09.</td>
							<td>D1</td>
							<td>Berlin - TVD</td>
							<td>20:20</td>
						</tr>
						<tr>
							<td>13.09.</td>
							<td>H2</td>
							<td>Hamburg - TVD</td>
							<td>29:18</td>
						</tr>
						<tr>
							<td>28.09.</td>
							<td>H1</td>
							<td>TVD - Barcelona</td>
							<td>35:39</td>
						</tr>
						<tr>
							<td>29.09.</td>
							<td>H2</td>
							<td>Hochdorf - TVD</td>
							<td>39:12</td>
						</tr>
						<tr>
							<td>30.09.</td>
							<td>H1</td>
							<td>TVD - Hassloch</td>
							<td>30:30</td>
						</tr>
				</table>
				<table id="TabelleMainRight" width="100%">
					<caption>
						Headlines
					</caption>
						<tr>
							<td>Auswaertsfahrt am 29.09.  ...</td>
						</tr>
						<tr>
							<td>Neuer Sponsor Hummel ...</td>
						</tr>
						<tr>
							<td>Spieler Hans verletzt ...</td>
						</tr>
						<tr>
							<td>Wechsel von Joerg zu TVD ...</td>
						</tr>
						<tr>
							<td>Aufstiegsfeier am 28.09. ...</td>
						</tr>
						<tr>
							<td>Jugendfest des TVD Handball ...</td>
						</tr>
				</table>
			</div>
		</div>
		<div id="Bottom">
			C2008 TV-Dudenhofen e.V. | <a href="...">Impressum</a> | <a href="...">Datenschutz</a> | 0.452sec 
		</div>
		</div>
		
	</body>
</html>
page.css
Code:
/* CSS Formatierung für alle Pages */

* { /*wird auf alle Elemente angewendet*/
    padding: 0;
    margin: 0;
}

body { /*Bereich außerhalb der eigentlichen Seite*/
    /*Hintergrund festlegen*/
	background-image: url("../img/background.jpg");
	background-repeat:repeat-x;
	background-color: #D7D7D7; /*letztes grau aus dem Hintergrund als Uebergang*/
}

div#Page {
	margin: 0 auto; /*zentrieren der Page*/
	width: 950px; 
	/*Schriftart, Farbe, Typ festlegen*/
	color: #000000; /*schwarz*/
	font-family: Verdana;
	font-size: 14px;
	padding-bottom: 10px; /*Abstand zum Browserende*/
}

div#Top {
	background-color: #000000; /*schwarz*/
	float: left;
	clear: left;
	width: 930px; /*950px - 2*10px*/
	margin: 5px 0 5px 0; /*Abstand oberer Rand und unten zum Banner*/
	padding: 0 10px 0 10px; /*innerer Abstand seitlich zum Rand*/
	line-height: 25px; /*feste Höhe und Text vertikal zentrieren*/
	font-size: 11px;
	color: #FFFFFF; /*weiß*/
}
	div#TopBreadcrumbs {
		float: left;
		clear: left;
		width: 700px;
	}
	div#TopShortinfo {
		float: right;
		clear: right;
		width: 200px;
		text-align: right;
	}

div#Banner {
	background-image: url("../img/banner.jpg");
	float: left;
	clear: left;
	width: 100%; /*950px*/
	height: 150px;
}            

div#Menu {
    background-image: url("../img/menubuttons.jpg");
	background-repeat:repeat-x;
	float: left;
	clear: left;
	width: 100%; /*950px*/
	line-height: 30px; /*feste Höhe und Text vertikal zentrieren*/
	border-bottom: 3px solid #990000; /*dunkelrote unterer Rand*/
	font-weight: bolder;
	font-size: 13px;
	color: #F0FFFF; /*schwächeres weiß*/
}
	div#Menu ul {
	    list-style-type: none;
	}
	div#Menu ul li {
		float: left;
		border-right: 1px solid #A9A9A9; /*silberer rechter Rand der Buttons*/
	}
	div#Menu ul li a {
		padding: 0 10px 0 10px; /*innerer Abstand links/rechts*/
	    display: block;
	    text-decoration: none;
		color: #F0FFFF; /*schwächeres weiß, nochmal angeben um Link-Default zu ueberschreiben*/
	}
	div#Menu ul li a:hover {
	    background-color: #696969; /*hellgrauer Mouse-Over Hintergrund*/
	}
	
div#Caption {
	background-color: #640000; /*dunkles rot*/
	float: left;
	clear: left;
	width: 939px; /*950px - 8px - 3px*/
	margin: 5px 0 0 0; /*oberer Abstand zum Menu*/
	padding: 3px 0 6px 8px; /*innerer Abstand, text visuell zentrieren*/
	/*Schrift*/
	font-weight: bold;
	font-size: 12px;
	color: #FFFFFF; /*weiß*/
	/*Rahmen*/
	border-style: solid none none solid; /*Rahmen links und oben*/
	border-width: 3px;
	border-color: #990000; /*gleiches rot wie unten im menu*/
}
	
div#Main {
	background-color: #FFFFFF; /*weißer Hintergrund für den ganzen Main-Bereich (Banner bis Footer)*/
	float: left;
	clear: left;
	width: 100%; /*950px - links 680 rechts 270*/
	padding: 0 0 10px 0; /*unten im Main Bereich immer weißer Abstand Richtung footer*/
	/*Rahmen unter der Seite, über dem Footer*/
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #696969; /*dunkelgrau*/
}
	div#MainLeft {
		float: left;
		clear: left;
		width: 640px; /*680px - 20px - 20px*/
		margin: 20px 20px 0 20px; /*Abstand oben/rechts/links um Content Bereich rauszuheben*/
	}
	div#MainRight {
		background-color: #C0C0C0; /*mitteldunkles grau*/
		float: right;
		clear: right;
		width: 229px; /*270px - 20 - 20 - 1*/
		padding: 20px; /*innerer Abstand überall 10px*/
		/*linker/unterer Rahmen zum Abheben des rechten Infoparts*/
		border-style: none none solid solid;
		border-color: #696969; /*dunkelgrau*/
		border-width: 1px;

	}	
		
div#Bottom {
	float: left;
	clear: left;
	width: 930px; /*950px - 10 - 10*/
	margin: 10px 0 10px 0; /*Abstand zu Main und zum Browserende*/
	padding: 0 10px 0 10px;
	text-align: center;
	font-size: 12px;
	line-height: 20px; /*feste Höhe und Text vertikal zentrieren*/
}
	div#Bottom a {
		color: #000000; /*schwarz*/
		text-decoration: none;
		font-weight: bold;
	}
	


 /*Standard Tabellen Design; Breite und Ausrichtung in HTML*/
	table#TabelleMain {
		background-color: #EBEBEB; /*zartes hellgrau*/
		margin: 0 0 10px 0; /*unter der Tabelle kleiner Abstand*/
		/*Rahmen rechts,links,unten; oben ist die Caption*/
		border-style: none solid solid solid;
		border-width: 0px;
		border-color: #808080; /*dunkelgrau*/
		/*Schriftsettings*/
		font-size: 12px;
	}
		table#TabelleMain td {
			padding: 0 2px 0 2px; /*innerer Zellabstand*/
		}
		table#TabelleMain caption{
			background-color: #DCDCDC; /*hellgrau*/
			/*Schriftsetup*/
			color: #000000; /*schwarz*/
			font-weight: bold;
			text-align: left;
			/*Rahmen und Abstand*/
			padding: 2px;
			border-style: solid none none solid; /*oben und links Rahmen absetzen*/
			border-width: 0px;
			border-color: #808080; /*dunkelgrau*/
			border-bottom-style: dotted;
			border-bottom-width: 1px;
			border-bottom-color: #808080; /*dunkelgrau*/
		}

 /*MainRight Infobox Tabellen Design; Breite und Ausrichtung in HTML*/
	table#TabelleMainRight {
		background-color: #DCDCDC; /*hellgrau*/
		margin: 0 0 10px 0; /*unter der Tabelle kleiner Abstand*/
		/*Rahmen rechts,links,unten; oben ist die Caption*/
		border-style: none solid solid solid;
		border-width: 1px;
		border-color: #808080; /*dunkelgrau*/
		/*Schriftsettings*/
		font-size: 12px;
	}
		table#TabelleMainRight td {
			padding: 0 2px 0 2px; /*innerer Zellabstand*/
		}
		table#TabelleMainRight caption{
			background-color: #8C0000; /*mitteldunkles rot*/
			/*Schriftsetup*/
			color: #FFFFFF; /*weiss*/
			font-weight: bold;
			text-align: left;
			/*Rahmen und Abstand*/
			padding: 2px;
			border-style: solid none none solid; /*oben und links Rahmen absetzen*/
			border-width: 3px;
			border-color: #BE0000; /*helleres rot*/
		}
		
		
		
/*Teamvorstellung.html spezielle Formatierung*/
	div#ContentTeamvorstellungTopLeft {	
		float: left;
		clear: left;
		width: 310px;
	}
	div#ContentTeamvorstellungTopRight {
		float: right;
		clear: right;
		width: 310px;
	}
	div#ContentTeamvorstellungMain {
		float: left;
		clear: left;
		width: 100%; /*640px*/
	}


/*Home.html spezielle Formatierung*/
	div#ContentIndexTopRight {	
		float: right;
		clear: right;
		width: 340px;
	}
		div#ContentIndexTopRightPic {	
			float: left;
			clear: left;
			width: 100%;
			text-align: center;
		}
		div#ContentIndexTopRightLinks {	
			float: left;
			clear: left;
			width: 280px; /*340px - 60*/
			font-size: 14px;
			padding: 30px 0 0 60px;
		}
			div#ContentIndexTopRightLinks ul {
				list-style-type: disc;
				margin: 20px 0 0 25px;
			}		
			div#ContentIndexTopRightLinks ul li a {
				text-decoration: none;
				color: #000000; /*schwarz*/
			}	
		
	div#ContentIndexEvent {
		float: left;
		clear: left;
		width: 300px;
	}
	div#ContentIndexNews {
		float: left;
		clear: left;
		width: 100%; /*640px*/
	}
	
	
/*Teams.html spezielle Formatierung*/
	div#ContentTeams {	
		float: left;
		clear: left;
		width: 640px;
	}
		div#ContentTeams table td {
			padding: 0 20px 10px 0; /*Zellabstand unten 10 rechts 20px*/
			vertical-align: middle;
		}		
		div#ContentTeams a {	
			text-decoration: none;
			font-weight: bold;
			color: #000000; /*schwarz*/
			
		}
		
		
		
/*news.html spezielle Formatierung*/
	div#ContentNews {	
		float: left;
		clear: left;
		width: 640px;
	}
Im Anhang hab ich noch nen Screen davon, musste leider paar Sachen schwärzen.
Angehängte Grafiken
Dateityp: jpg page.jpg (99,4 KB, 40x aufgerufen)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 23.09.2008, 22:57
Benutzerbild von izak.stern
Benutzer
neuer user
 
Registriert seit: 19.08.2008
Ort: Salzburg
Beiträge: 39
izak.stern befindet sich auf einem aufstrebenden Ast
Standard

wie wärs wenn du einfach den link zu der seite posten wuerdest, ohne meinen firebug ist es mir nämlich mittlerweile zu mühsam mich durch codezeilen zu wuseln.
__________________
http://emenda.net
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 23.09.2008, 23:12
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 01.03.2008
Beiträge: 31
crimi befindet sich auf einem aufstrebenden Ast
Standard

TV Dudenhofen Handball

naja mir gehts aber gerade auch um den code.
bestimmt habe ich da ungeschickt programmiert, irgendwelche defizite oder sogar dinge die einem webstandard widersprechen.

wäre halt schön wenn da mal einer so grundlegend draufschaut
Mit Zitat antworten
  #4 (permalink)  
Alt 24.09.2008, 23:20
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 01.03.2008
Beiträge: 31
crimi befindet sich auf einem aufstrebenden Ast
Standard

keiner ne meinung? :\
Mit Zitat antworten
  #5 (permalink)  
Alt 25.09.2008, 11:46
Benutzerbild von LineMan
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 09.08.2006
Ort: Mülheim an der Ruhr
Beiträge: 211
LineMan befindet sich auf einem aufstrebenden Ast
Standard

Du hast keinerlei Semantik in Deinem Dokument, es gibt nicht eine Überschrift (h-tag), Du benutzt massig Layouttabellen (!), die Seite ist nicht valide (ständig wiederholende id´s - ok ist ein Template)
__________________
Mein Bug, Dein Bug, Bugs sind für uns alle da...
Mit Zitat antworten
  #6 (permalink)  
Alt 25.09.2008, 17:48
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 01.03.2008
Beiträge: 31
crimi befindet sich auf einem aufstrebenden Ast
Standard

ist es nicht egal ob ich die überschrift in einem div formatiere oder als <h> tag definiere und dann das überschrift-element formatiere? was ist hier wieso bevorzugt?

was wäre denn die alternative zu massig layout-tabellen? wenn ich rechts zum bsp 3 infoboxen darstellen will, muss ich doch auch 3 tabellen oder ich sags mal allgemein "konstrukte" erstellen. die sind ja dann über CSS alle gleich formatiert. wie könnte man das besser lösen?

ständig wiederholende IDs, naja aber dafür sind doch CSS formatierungen da oder? dass man eben elemente die häufig auftauchen nur einmal formatieren muss und diese dann immer wieder aufruft?
Mit Zitat antworten
  #7 (permalink)  
Alt 25.09.2008, 17:55
Benutzerbild von izak.stern
Benutzer
neuer user
 
Registriert seit: 19.08.2008
Ort: Salzburg
Beiträge: 39
izak.stern befindet sich auf einem aufstrebenden Ast
Standard

Semantisches Web - Webmasterpro.de

Vorsprung durch Webstandards | Retro-Coding: Semantischer Code ist der Anfang von gutem Design
__________________
http://emenda.net
Mit Zitat antworten
  #8 (permalink)  
Alt 26.09.2008, 18:47
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 01.03.2008
Beiträge: 31
crimi befindet sich auf einem aufstrebenden Ast
Standard

okay das erklärt warum man überschrift elemente auch als solche nutzen sollte etc

aber der zweite teil ist mir noch etwas schleierhaft

Zitat:
was wäre denn die alternative zu massig layout-tabellen? wenn ich rechts zum bsp 3 infoboxen darstellen will, muss ich doch auch 3 tabellen oder ich sags mal allgemein "konstrukte" erstellen. die sind ja dann über CSS alle gleich formatiert. wie könnte man das besser lösen?

ständig wiederholende IDs, naja aber dafür sind doch CSS formatierungen da oder? dass man eben elemente die häufig auftauchen nur einmal formatieren muss und diese dann immer wieder aufruft?
Mit Zitat antworten
  #9 (permalink)  
Alt 27.09.2008, 22:08
Benutzerbild von Praktikant
Semantikbremse.
XHTMLforum-Kenner
 
Registriert seit: 22.04.2008
Beiträge: 4.985
Praktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz sein
Standard

1. Eine Tabelle benutzt man schon lange nicht mehr zu Layout aufbauen.... Dazu nutzt man div's (kann dich leider nur auf die Suchseite von selfhtml.org leiten, ber da kannste ja mal nach div's suchen

2. Eine ID darf nach Deklaration nur einmal pro Seite vorkommen! Eine ID kann Beispielsweise als Ankerpunkt oder für JavaScript gebraucht werden und das funktioniert nicht mehr, wenn man IDs mehrfach auf Seiten angibt.
Nutze stattdessen Classes wenn es ersichtilich ist, dass ein Element mehrfach auf einer Seite vorkommen könnte

Google einfach mal danach
__________________
Rettet die Erde.... sie ist der einzige Planet mit Schokolade!
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Layoutcheck claude Site- und Layoutcheck 13 29.05.2011 18:24
site- und layoutcheck alejandro Site- und Layoutcheck 10 06.02.2008 19:18
Code- und Layoutcheck für erste XHTML/CSS Seite erbeten bitalias Site- und Layoutcheck 11 10.05.2006 14:35
Script - und Layoutcheck claude Site- und Layoutcheck 19 05.12.2005 23:28
Site -und Layoutcheck claude Site- und Layoutcheck 7 05.07.2005 23:47


Alle Zeitangaben in WEZ +2. Es ist jetzt 14:03 Uhr.