anver.ch - Webtechnik mit (X)HTML & CSS

Dann fang ich mal an

Erstmal zum Aussehen:
Hat eine sehr schöne Optik, lässt sich gut navigieren.
Einziger kleiner Kritikpunkt: Die Navigation ist für mich ein bisschen zu verschachtelt (drei Ebenen), aber das ist ja Ansichtssache.
Vielleicht die erste Unterebene beim Überfahren der ersten Ebene nach rechts anzeigen lassen - so muss ich nicht immer erst auf die Hauptseite, bis ich die Unterpunkte sehen kann.

Zum Code:
Relativ sauberer Code - über den Sinn des Frameworks lässt sich streiten, aber da werde ich mich jetzt nicht drüber auslassen
Ein paar kleine "Schönheitsfehler habe ich aber dennoch gefunden:
1.

<h1>anver.ch</h1>
				<span>Webtechnik mit (X)HTML &amp; CSS</span>

Ist für mich nicht ganz logisch aufgeteilt. Ich würde beides in h1 setzen, weil eigentlich gehört ja beides dazu. Hat auch Suchmaschinen-technische Gründe. Wer sucht denn speziell nach "anver.ch", wenn er etwas über HTML und CSS erfahren möchte - ich kenne niemanden.
Theoretisch kannst du dann mit span immer noch die Formatierung beeinflussen.

2.

<li><a href="html.php"><strong>(X)HTML</strong></a></li>

Das strong brauchst du eigentlich nicht, denn das kannst du genauso gut dem Link zuordnen per ul li a.

3.

<ul>
				<li class="top_list"><a href="index.php"><strong>Startseite</strong></a></li>
				<li><a href="html.php"><strong>(X)HTML</strong></a></li>
				<li><a id="here"><strong>Stylesheets (CSS)</strong></a></li>
				<li><a class="list_html" href="css_layout.php">Layout</a></li>




				<li><a class="list_html" href="#">Verweise</a></li>
				<li><a class="list_html" href="#">Navigationsleisten</a></li>
				<li><a class="list_html" href="#">Formulare</a></li>
				<li><a href="framework.php"><strong>Framework</strong></a></li>
				<li><a href="projekte.php"><strong>Projekte</strong></a></li>
			</ul>

Ist auch semantisch nicht ganz korrekt. Die Unterebene sollte eigentlich in den Listenpunkt CSS integriert sein, denn da gehört sie ja eigentlich zu. Ist besonders wichtig, wenn du das ganze barrierefrei haben willst (das sprichst du ja auch an), damit z.B. Screenreader auch die logische Struktur einer Liste aufnehmen und vorlesen können.

4.
Auf h3 folgt h5 - h4 fehlt. Besser h4 verwenden und gleich formatieren wie h5.

5.

#head h1 a:link {
		color: #fff;
		font-size: 100.1%;
		font-weight: normal;
		padding: 10px 5px 5px 0px;
		text-decoration: none;
	}

	#head h1 a:visited {
		color: #fff;
		font-size: 100.1%;
		font-weight: normal;
		padding: 10px 5px 5px 0px;
		text-decoration: none;
	}

	#head h1 a:hover {
		color: #fff;
		font-size: 100.1%;
		font-weight: normal;
		padding: 10px 5px 5px 0px;
		text-decoration: none;
	}




	#head h1 a:active {
		color: #fff;
		font-size: 100.1%;
		font-weight: normal;
		padding: 10px 5px 5px 0px;
		text-decoration: none;
	}

	#head h1 a:focus {
		color: #fff;
		font-size: 100.1%;
		font-weight: normal;
		padding: 10px 5px 5px 0px;
		text-decoration: none;

Wofür brauchst du das? Es gibt bei dir kein Element, das dadurch angesprochen wird..

6.
Vielleicht für die Zukunft noch eine eigene Fehlerseite - die jetzige passt nciht ganz ins Konzept

Ich hoffe du kannst damit was anfangen
Liebe Grüße
Laura

Zitat

Zu Punkt 1
Ja da hatte ich wohl einen kleinen Überlegungsfehler, da hast du recht. Aber zwei h1 Tags sind jedoch wieder nicht semantisch?

Aber beides in einem h1 Tag? Bzw. eher nur das letztere, das andere nur ein Link. Wie mans will

Zitat

Zu Punkt 2
Da sollte ich zusätzlich noch eine weitere Klasse vergeben. Falsch ist jedoch nicht, aber eben wieder eine Frage der Semantik.

Bräuchtest du nicht mal, wenn du deine Listen korrekt verschachtelt hättest
Falsch ist es zwar nicht, aber man sagt ja immer man soll Inhalt und Design trennen - ich weiß nicht ob es bei dir noch der logischen Funktion von strong entspricht, wenn es in der NAvigation gebraucht wird.

Zitat

Zu Punkt 3
Ja die Navigation müsste ich überarbeiten. Also was du meinst sind verschachtelte Listen? Listen waren noch nie meine Stärke und auch die Faulheit macht sich bei grösseren Projekten schnell breit.

Beispiel aus einem meiner Codes:

<ul id="main_menu">
    <li class="main_menu_item"><a id="" href="#" title="Link 1">Link 1</a></li>
    <li class="main_menu_item"><a id="" href="#" title="Link 2">Link 2</a>
        <ul id="sub_menu">
            <li class="sub_menu_item"><a id="" href="#" title="Link 2.1">Link 2.1</a></li>
            <li class="sub_menu_item"><a id="" href="#" title="Link 2.2">Link 2.2</a></li>
            <li class="sub_menu_item"><a id="" href="#" title="Link 2.3">Link 2.3</a></li>
        </ul>
    </li>
    <li class="main_menu_item"><a id="" href="#" title="Link 3">Link 3</a></li>
    <li class="main_menu_item"><a id="" href="#" title="Link 4">Link 4</a></li>
</ul>

Die Unternavigation befindet sich innerhalb des zugehörigen Listenpunktes. Damit kannst du die Listenpunkte/Links auch differenziert ansprechen, wenn du nach den Ebenen gehst.

Zitat

Zu Punkt 6
Verstehe ich nicht ganz? Meinst du die Fehlerseiten im Sinne von <!-- m --><a class="postlink" href="http://de.wikipedia.org/wiki/Fehlerseite">http://de.wikipedia.org/wiki/Fehlerseite</a><!-- m --> ?

Jep.
Sind ein paar Zeilen in der .htaccess,also kein großer Aufwand.

Gruß
Laura

EDIT:

PS: Wenn du Hilfe bei der Navigation brauchst, kannst du dich gerne an mich wenden. Ich experimentiere im Moment ein bisschen mit rein CSS basierten Navigationen - da würden wir bestimmt das passende fü dich finden

Öhm... ne, mir ist nichts aufgefallen ^__^

Soviel neues gibts ja jetzt noch nicht, aber die neue Domain finde ich gut.

Kleiner Kritikpunkt: Der Link oben im header sieht ein bissl komisch aus

[Blockierte Grafik: http://img190.imageshack.us/img190/9743/webtechnikorg.jpg]

Die Farbe passt nicht. Ich würde es weiß machen, wie den Rest.

Ich bekomme nichtmal einen Link angezeigt =D

Edith:
Ein Beweisfoto!
[Blockierte Grafik: http://i271.photobucket.com/albums/jj147/Masterfox93/link.jpg]

Vielleicht liegt es am Browser, ich benutze Chrome, Sarkkan Firefox.

Nur ne Vermutung, aber kann bei solchen Problemen ja immer mal sein...

Hallo,

von welchem Links sprecht ihr eigentlich?

<div id="head">
  <h1>Webtechnik mit (X)HTML &amp; CSS</h1>
  <span>www.web-technik.org</span>
</div>

Also wenn ich nicht komplett blind bin hat er den <a> tag vergessen.

Mfg

Starhunter

Zitat

Es sollte eben kein Link sein, nur die Domain als Info.

Alle sprechen hier von Links. :roll:

Ich habe davon angefangen, weil es bei mir eben als Link dargestellt wird^^