Aussehen, Code und Aufbau bewerten (WYSIWYG)

[MH223]

Hallo Freunde,

bitte guckt euch mal meine Ergüsse an und sagt mir, was euch nicht gefällt.
Lasst mich aber bitte am Leben :roll:

Falls es keiner sieht, unten lassen sich 4 Styles umschalten

Link

 

[vitus37]

bitte guckt euch mal meine Ergüsse an und sagt mir, was euch nicht gefällt.

OK

Lasst mich aber bitte am Leben :roll:

Was jetzt? Krisisieren oder nicht? ;)

... um Verzerrungen der Bilder zu vermeiden, sollte die Bildschirmauflösung optimalerweise auf 1440 x 900 eingestellt sein ( zumindest irgendwo bei 1,6:1 )

... um in den vollen Genuss meiner Bilder zu kommen, sollte auch die Browseransicht auf Vollbild geschaltet werden,
( an die weniger Versierten, das macht man mit der Taste F11 )

Soll ich mir jetzt einen neuen Bildschirm kaufen?
Eine Website muss von überall erreichbar sein und überall den selben Funktionsumfang bieten. Ausserdem kann man eine Website nicht auf die Bildschirmgröße anpassen, sondern wenn überhaupt auf den Viewport, also der Bereich, in dem beim Browser die Site angezeigt wird.
Der Viewport ist jedoch immer anders, je nach dem wie groß der Besucher sein Browserfenster hat, demzufolge fällt diese Möglichkeit der Anpassung einer Website an den Viewport auch weg.

Auch werde ich meinen Browser nicht in den Vollbildmodus versetzen um die Informationen besser einsehen zu können.

Diese vier verschiedenen Designs verwirren mich ein wenig, wenn sie doch wenigstens in irgend einer Weise den selben Aufbauhätte und sich vielleicht nur die Farben ändern...

Zum Code:
Häufig werden <div>-Elemente für das Design ausgenutzt, was aber inkorrekte Verwendung dieser ist. DIVs sind zur Gruppierung mehrerern Elemente, zB einer überschrift und eines Absatzes. Auch de3in DIV MENU und SWITCHER sind überflüssig, da sie nur ein einziges Element beinhalten.

Hier und da ist die Auszeichnung deines Inhaltes falsch, da besteht noch Nachholbedarf.
Am besten ist es immer noch HTML und CSS (korrekt) zu lernen und die Seite komplett selbst zu schreiben. WYSIWYG ist hier und da eine gute Unterstützung, aber von Semantik haben die meisten solcher Editoren wenig Ahnung.(meine Meinung)


LG

 

[Efchen]

Klar lassen wir Dich am Leben, denn sonst ist ja niemand mehr da, über den man herziehen könnte ;-)

Außerdem, wer verbessert denn sonst dieses grässliche...nein, Spaß, ich hab nur einen Blink drauf geworfen bisher :-)
Der erste Blick sgate mir "Passt zum Alter". Weil damals, als Websites so aussahen, warst Du auch noch so ungefähr in meinem Alter, in einem Alter, wo man sich noch gut mit sowas Neuem wie Websites beschäftigt. Aber es gibt auch viel Schlimmeres, also gucken wir mal...

Alles unsortiert:
- NEUSTART ist ein komischer Seitentitel. Wenn ich in meine History gucke, weiß ich nicht, welche Site das gewesen sein könnte.
- Dass Du Dich in Deinem Einführungstext so schlecht machst, ist blöd. Außerdem hat dann keiner mehr Lust, die Site anzusehen, weil sie alle das Schlimmste befürchten.
- Die Bildschirmauflösung ist für die Darstellung von Websites absolut irrelevant. Das merkst Du auch daran, dass CSS die Auflösung gar nicht kennt.
- Der Hinweis auf das Umschalten von Designs in der Fußleiste ist bei dem einen Design (ich glaube Airwolf) ja wohl ein Witz, da sitzt die Leiste rechts am Rand. :-)
- Du empfiehlst eine Breite von 1440px. Ich habe tatsächlich derzeit ca. 1400px, aber der Text ist für so eine Breite zu breit und anstrengend zu lesen.
- Ein Blick in den Quellcode lässt mich staunen. Es sieht erstaunlich gut aus.
- <div> dient zum Gruppieren mehrerer Elemente. Ich sehe gelegentlich divs, die nur ein Element enthalten. Die kannst Du entfernen, z.B. im Footer.
- Einen Footer als "Über"schrift auszuzeichnen, finde ich im ersten Moment komisch, aber da kann man wahrscheinlich drüber reden.
- Das Startbild der süßen M&Ms hast Du als Hintergrundbild ausgezeichnet. Hintergrundbilder sind aber die, die nur der Zierde dienen und keinen Content enthalten. Bilder, die Content enthalten - und das hier enthält ja Content! - werden per <img> eingebunden, mit einem entsprechenden Alternativtext, der den Content wiedergibt. Denn sonst hat die Seite ja keinen (Content).
- Bei Deinen Hobbies fehlen den Images die alt-Attribute.
- Deine div.hobby solltest Du besser in eine Liste zusammenfügen. Immerhin listest Du ja Deine Hobbies auf. Von der Semantik her handelt es sich also um eine Liste, nicht um eine Aneinanderreihung von Gruppen (div). Ob ungeordnete Liste oder sogar Definitionsliste, das ist Auslegungssache.
- Mit den verschiedenen Stil...Stil? Stilen? Huh? :-) hast Du Dir echt Mühe gegeben. Die Fliege sieht nett aus :-)
- Der verwendete font ist nicht unbedingt angenehm zu lesen.
- Die Schriftgröße ist mit 16px angegeben. Besser wäre 1em.

Soweit erstmal.

Mein Fazit: Du lieferst als 64(?)-jähriger hier weitaus bessere Arbeit (für einen Anfänger) ab, als so mancher Jungspund, der von sich glaubt, er sei der Obermackerwebmaster. Es ist noch nicht alles perfekt, aber Du scheinst zumindest den Begriff "Semantik" schonmal gehört zu haben und kannst somit zumindest grundlegend den Sinn von HTML erfüllen.

Wenn Du das Thema weiter mit Spaß und Eigeninitiative angehst, wirst Du Dich sogar noch verbessern können. Gut gemacht bisher! Aber jetzt nicht aufhören!

 

[Loon3y]

Dann will ich noch ein bisschen ergänzen was mir so aufgefallen ist. :-)

Ersteinmal, wie im anderen Beitrag innerhalb des PHP-Forums: ich finde es schön das du dich damit so beschäftigst und begeisterst und in der Tat, du hast schon gute Grundkentnisse dir angeeignet. Das ist toll.

Nun aber zu meiner eigenen Meinung ersteinmal:

- Das Design ist zwar, wie oben schon erwähnt, dem Alter entsprechend (nicht negativ gemeint), aber ich finde das man eine Homepage nicht für sich, sondern für andere macht. Deshalb sollte man etwas die eigenen Wünsche und Vorlieben zurückstellen und eine Seite so machen, dass sie für jedermann von überall ansprechend und vor allem benutzbar ist.

- Es sind noch kleine HTML- sowie CSS-Fehler vorhanden. Ein Punkt, was mir sofort auffällt sind die groß geschriebenen Wörter in der Navigation. Ich denke das diese Großschreibung eher ein Styleelement ist und nichts mit der Auszeichnung zu tun hat (im WWW wird großgeschriebenes meist als "lautes" Reden oder "schreien" interpretiert und es gibt Vorlesebrowser die tatsächlich soetwas lauter Vorlesen, was meist provokant wirkt). Besser wäre, wenn du über CSS die Styleeigenschaft text-transform:uppercase; verwendest. So kannst du deine Wörter grammatikalisch korrekt schreiben und dennoch alles in Großbuchstaben darstellen.

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" />

Wenn man XHTML verwendet, dann basiert diese Auszeichnungssprache auf dem XML-Syntax. D.h. im kurzen, dass man inhaltsleere Tags wie z.B. <img src="#" alt="" width="" height="" /> am Ende mit /> schließt.
"Normale" Tags welche nicht Inhaltsleer sehen z.B. so aus:
<p>text</p>.

Nocheinmal gegenübergestellt wird klar, was "inhaltsleer" bedeutet:
<img src="#" width="" height="" alt="" />
<p>text</p>

<html> ist kein inhaltsleeres Tag, denn innerhalb des Tags befindet sich der <head>, der <body> und weitere Elemente eines Dokumentes. Kurzum gesagt, das /> muss an dieser stelle > sein :-) Würdest du es so lassen, dann heißt das, dass das <html> bereits geschlossen ist und kein <head> und <body> folgen.

- Dann fallen mir auf ersten Blick noch Kleinigkeiten wie z.B. das hier auf:

<ul class="navlist">
 <li><a class="selected" href="index.php?seite=max herla&stil=1" onFocus='if(this.blur)this.blur()'>STARTSEITE</a></li>
 <li><a class="selectable"  href="index.php?seite=hobbies&stil=1" onFocus='if(this.blur)this.blur()'>HOBBIES</a></li>
...

das class="selectable" kannst du eigentlich weglassen :) Ebenso ist target="_blank" nicht benutzerfreundlich.

- Kommentare in HTML in Form von <!-- ... --> sind überflüssiger Code der mitgeladen wird. Wenn du eh PHP verwendest, dann kommentier dir doch deine stellen mit <? /* text */ ?>.


Leider wurd ich jetzt grad unterbrochen und bin total raus..aber ich denke das ist schon etwas Arbeit :)

Aufjedenfall gefällts mir was du da für Arbeit reinsteckst und wie du dich engagierst. können sich einige eine Scheibe abschneiden.


Gruß
Loon3y

 

[MH223]

also jetzt bin ich erst mal verblüfft ...

1. Das mit der Aüflösung habe ich geschrieben, weil ich meine Seiten bei Freunden auf unterschiedlichen Systemen und auch Auflösungen getestet habe merkte, dass teilweise böse Verzerrungen zu sehen waren. Ein Bild mit z.B. 1440x900px hat auf einem Bildschirm mit einer Auflösung von 800x600px statt eines Seitenverhältnisses von 1,6:1 plötzlich 1,333:1 , also verzerrt, das ist ähnlich wie bei einem Fernsehbild, das 4:3 statt 16:9 dargestellt wird. Ich habe diese Auflösung an meinem Monitor bewusst so ausgesucht, weil dies die einzige Möglichkeit war, Kreise im CAD-Programm rund zu kriegen.

2. Vollbild habe ich empfohlen, damit meine Bilder im 100%-Zoom möglichst gross sind, mehr ist da nicht gemeint.

3. DIVs habe ich genommen, da dies in allen mir bekannten Foren als der neueste Schrei gilt, meine früheren Aufbauten mit Frames oder Tabellen wurden als altmodisch verpönt. Ausserdem lassen sie sich wunderbar positionieren und ein- und ausschalten.

4. Die "Stile" oder Neudeutsch Styles sind im Moment nicht dazu da, um dem User zu nützen, sondern um darzustellen, was man mit CSS anstellen kann. Die Idee kam von ZenGarden.com, da wird das ja bis zum Exzess gemacht. Man kann, ohne am Quellcode was zu ändern, verschiedene Designs problemlos ausprobieren

5. Kommentare in HTML in Form von <!-- ... --> hab ich bewusst mit in den PHP-Code genommen um beim Ausprobieren und Überprüfen des gelieferten Quellcodes noch durchzublicken, wenns mal läuft, kann man die ja weglassen.

6. Der NEUSTART ist die Seite, die aufgerufen wird, wenn man nur www.max-herla.de aufruft, also ohne Variablen, wenn ich meine hier angeprangerten Vorschläge über Auflösung usw. weglasse, ist sie eh überflüssig.

Ich bin auch nicht beleidigt über Kritik, das ist vlt. falsch rübergekommen, ich weiss allerdings aus Erfahrung mit anderen Foren, dass bei solchen Gelegenheiten die "Obermackerwebmaster" alles besser wissen und teilweise bösartig schiessen. Ich hoffe, dass hier konstruktiv kritisiert wird, ausserdem wünsch ich mir evt. gleich einen Tip, wie mans besser machen kann.

Ach ja, in der Überschrift dieses WYSIWYG habe ich wohl falsch interpretiert, ich habe alles mit Dreamweaver selbst geschrieben.

So, und jetzt weiter, drei Antworten sind mir zu wenig :mrgreen:

 

[Loon3y]

In der Hoffnung das ich schneller als Efchen bin ;)
Edit: äääätsch

also jetzt bin ich erst mal verblüfft ...

Gut! Das zeigt, dass du dir schon zu sicher warst mit deiner Sache *grinz* Aber man lernt nie aus.

1. Das mit der Aüflösung habe ich geschrieben, weil ich meine Seiten bei Freunden auf unterschiedlichen Systemen und auch Auflösungen getestet habe merkte, dass teilweise böse Verzerrungen zu sehen waren. Ein Bild mit z.B. 1440x900px hat auf einem Bildschirm mit einer Auflösung von 800x600px statt eines Seitenverhältnisses von 1,6:1 plötzlich 1,333:1 , also verzerrt, das ist ähnlich wie bei einem Fernsehbild, das 4:3 statt 16:9 dargestellt wird. Ich habe diese Auflösung an meinem Monitor bewusst so ausgesucht, weil dies die einzige Möglichkeit war, Kreise im CAD-Programm rund zu kriegen.

Das ist die Kunst der Webentwicklung. Wie du gesagt hast, sah es bei Freunden verzerrt aus. Deswegen sollte es auf jedem System benutzbar sein, aber nicht gleich aussehen. Das ist ein manko des WWW was viele noch nicht so verstanden haben...es sieht nie überall gliech aus, allein schon deswegen weil wir unterschiedliche Browser mit unterschiedlichen Engines haben. Wir sind eben im non-print und nicht im print-Bereich.

2. Vollbild habe ich empfohlen, damit meine Bilder im 100%-Zoom möglichst gross sind, mehr ist da nicht gemeint.

Man muss immer mit Empfehlungen vorsichtig sein. Der User will endscheiden wie und wo und wann er die Seite anschaut. Und Sätze wie "optimiert für" sind immer sehr benutzerunfreundlich. So grenzt man Menschen aus.

3. DIVs habe ich genommen, da dies in allen mir bekannten Foren als der neueste Schrei gilt, meine früheren Aufbauten mit Frames oder Tabellen wurden als altmodisch verpönt. Ausserdem lassen sie sich wunderbar positionieren und ein- und ausschalten.

Dann darf ich dir den Rat geben, dich von diesen Foren etwas zu distanzieren. <div> der neueste Schrei. Das <div>-Tag gibt es schon Urzeiten. Und man kann jedes Element positionieren. Das <div>-Element hat keine semantische Bedeutung, es dient einzig und alleine um mehre Elemente zu gruppieren. Eine Homepage macht man mit HTML, man zeichnet sie sinnvoll und korrekt aus (Semantik = Bedeutungslehre) und versucht eine logische Struktur (Schematik) zu bilden.

4. Die "Stile" oder Neudeutsch Styles sind im Moment nicht dazu da, um dem User zu nützen, sondern um darzustellen, was man mit CSS anstellen kann. Die Idee kam von ZenGarden.com, da wird das ja bis zum Exzess gemacht. Man kann, ohne am Quellcode was zu ändern, verschiedene Designs problemlos ausprobieren

Das ist gut, aber du bietest die Styles wie wenn du dem User etwas bieten möchtest, oder dem User die Chance gibst etwas zu personalisieren. Dann mach es doch auch so wie du es meinst, mache einen Navigationspunkt, indem du genau das erklärst und dem Besucher deiner Seite das vermittelst. Zen-Garden ist auch nur eine Seite auf der der User testen und anschauen kann. Aber nichts mit personalisieren oder dann letzenendes dauerhaft Benutzen. Zumindest seh ich das nicht so.

Ich bin auch nicht beleidigt über Kritik, das ist vlt. falsch rübergekommen, ich weiss allerdings aus Erfahrung mit anderen Foren, dass bei solchen Gelegenheiten die "Obermackerwebmaster" alles besser wissen und teilweise bösartig schiessen. Ich hoffe, dass hier konstruktiv kritisiert wird, ausserdem wünsch ich mir evt. gleich einen Tip, wie mans besser machen kann.

Es gibt immer schwarze Schafe im Forum. Manchmal mehr, manchmal weniger. Ich denke hier bist du gut aufgehoben und bei professionellen Menschen die dir kostenlos Hilfe bereitstellen. Nimm nicht alles gleich auf, was man dir vermittelt, bzw wenn dir etwas unschlüssig ist, dann frage nach, wenn dir das korrekt und sinnvoll erklärt wird, dann behalte es. Nur so kommt man gut voran. Sollte jemand nonsense reden, dann wird sich dies auch durch das Nachfragen herausstellen.

Sei nicht betrübt über 3 Antworten. Wenn ich Seiten poste kommen meist auch nicht mehr zusammen. ich denke das ist hier ein gutes Zeichen, dass die Homepage nicht viele Fehler aufweist.

EDIT: Wichtig sind mir hier zum Teil nur die Aussagen von einigen Usern. Die anderen User sind meist die, die Standardantworten haben.


Gruß
Loon3y

 

[Efchen]

also jetzt bin ich erst mal verblüfft ...

Negativ oder positiv? :-)

Ein Bild mit z.B. 1440x900px hat auf einem Bildschirm mit einer Auflösung von 800x600px statt eines Seitenverhältnisses von 1,6:1 plötzlich 1,333:1 , also verzerrt

Ja, ich denke, das bringt das mit sich.
Ich wüsste nicht, wie das zu beheben ist.

Ansonsten ist aber die Auflösung irrelevant, weil die Website ja nicht im Bildschirm, sondern im Viewport des Browserfensters dargestellt wird, das nicht maximiert sein muss und in der Regel immer kleiner ist als das, was die Auflösung hergibt, selbst wenn es maximiert ist.

Ich habe diese Auflösung an meinem Monitor bewusst so ausgesucht

Na, letztendlich interessiert das aber niemanden, weil keiner für Dich seine Auflösung umstellt oder irgendwelche anderen Einstellungen macht. Entweder Deine Site funktioniert mit den Einstellungen des Benutzers, oder er geht wieder.

Vollbild habe ich empfohlen, damit meine Bilder im 100%-Zoom möglichst gross sind, mehr ist da nicht gemeint.

Da gilt das gleiche wie oben. Entweder es funktioniert mit mienen Einstellungen oder Deine Site interessiert mich nicht. Es klingt eher bevormundend oder inkompetent, sowas zu schreiben.

DIVs habe ich genommen, da dies in allen mir bekannten Foren als der neueste Schrei gilt

Dieser "neuste Schrei" ist aber schlichtweg falsch. Genauso falsch wie Tabellenlayouts.
Jedes Tag in HTML hat eine semantische Bedeutung, <div> zeichnet eine Gruppe von mindestens zwei Elementen aus. Nicht mehr und nicht weniger. Ausnahmen bestätigen die Regel.

meine früheren Aufbauten mit Frames oder Tabellen wurden als altmodisch verpönt.

Richtig, wobei Tabellenlayouts nicht einfach altmodisch sondern auch semantisch falsch sind.

Ausserdem lassen sie sich wunderbar positionieren und ein- und ausschalten.

Wer, divs? Nicht nur divs, das gilt ja wohl für jedes einzelne HTML-Tag. Das ist ja auch der Sinn der Sache, weil HTML nicht für die Gestaltung und das Aussehen da ist. Deswegen kann man natürlich jedes Element mit jeder CSS-Eigenschaft formatieren (wobei es natürlich auch hier Ausnahmen gibt).

Der NEUSTART ist die Seite, die aufgerufen wird, wenn man nur NEUSTART aufruft, also ohne Variablen, wenn ich meine hier angeprangerten Vorschläge über Auflösung usw. weglasse, ist sie eh überflüssig.

Aber es ist ein unpassender Seitentitel. Die anderen sind ja auch nicht besser. "HOBBIES" - was sagt mir das, wenn ich in die History gucke? Da weiß ich auch nicht, welche Site gemeint ist.

Ich bin auch nicht beleidigt über Kritik, das ist vlt. falsch rübergekommen, ich weiss allerdings aus Erfahrung mit anderen Foren, dass bei solchen Gelegenheiten die "Obermackerwebmaster" alles besser wissen und teilweise bösartig schiessen.

Das wird in den allermeisten Fällen nur falsch interpretiert. Die meisten Antworten sind einfach nur ehrlich und direkt. Es hilft Dir ja nichts, wenn man Dir Honig ums Maul schmiert. Du willst ja aus Deinen Fehlern lernen.

Ich hoffe, dass hier konstruktiv kritisiert wird, ausserdem wünsch ich mir evt. gleich einen Tip, wie mans besser machen kann.

Um für alles, was ich persönlich als negativ angekreidet habe, immer gleich eine Lösung zu schreiben, reicht meine Zeit und der Plattenplatz des Forums nicht :-) Es ist auch in den meisten Fällen nicht nötig, ich für mienen Teil schreibe immer viele Fachbegriffe hin, die man ergooglen kann, um mit Eigeninitiative Licht ins Dunkel zu bringen. Wenn dann noch Fragen offen sind, kannst Du selbstverständlich gerne wieder nachrfragen.
Und nicht für alle Dinge habe ich Lösungen, insbesondere was Design angeht.

So, und jetzt weiter, drei Antworten sind mir zu wenig :mrgreen:

Du bist hart im Nehmen, das ist gut ;-)

 

[MH223]

Wer, divs? Nicht nur divs, das gilt ja wohl für jedes einzelne HTML-Tag. Das ist ja auch der Sinn der Sache, weil HTML nicht für die Gestaltung und das Aussehen da ist. Deswegen kann man natürlich jedes Element mit jeder CSS-Eigenschaft formatieren (wobei es natürlich auch hier Ausnahmen gibt).

Soll das heissen, dass ich auch z.B. einen h1-Tag oder einen img-Tag wie einen DIV positionieren kann ?????

Auweia, da is was total an mir vorbeigegangen,
es geht, ich habs grad ausprobiert ;heart

OK, genehmigt

 

[Efchen]

Soll das heissen, dass ich auch z.B. einen h1-Tag oder einen img-Tag wie einen DIV positionieren kann ?????

Natürlich. Wie alle Elemente. Nur Block- und Inline-Elemente unterscheiden sich geringfügig.
Warum sollte es auch anders sein? Das ist ja der Witz an allem. HTML nur für die logische Inhaltsauszeichnung und allein CSS für das Aussehen. Niemals setzt Du ein HTML-Tag, weil Du damit ein bestimmtes Aussehen erreichen willst.

Auweia, da is was total an mir vorbeigegangen,

Das alles Entscheidende :-)

OK, genehmigt

Danke untertänigst! ;-)

 

[Shrax]

Da Efchen und die anderen schon fast alles gesagt haben, hier noch ein paar kleine Dinge die ich bisjetzt noch ungeändert vorfinde.

<META http-equiv="X-UA-Compatible" content="IE=8"/>
<META NAME="Title" CONTENT="Hobbies von Max Herla"/>
<META http-equiv="Language" content="de"/>
<META NAME="Author" CONTENT="Max Herla"/>
<META NAME="Description" CONTENT="private Webseite"/>
<META NAME="Robots" CONTENT="all, index, follow"/>

In allen neueren HTML versionen werden die Tags klein geschrieben. Ersetze also die Metas alle mit
<meta name=" und auch CONTENT sollte lieber klein geschrieben werden. Sowie alle anderen Tags. Bei /> macht man normal vorher ein leerzeichen. Also "Max Herla" />

<ul class="navlist">

<li><a class="selectable" href="index.php?seite=max herla&stil=1" onFocus='if(this.blur)this.blur()'>STARTSEITE</a></li>
<li><a class="selectable" href="index.php?seite=hobbies&stil=1" onFocus='if(this.blur)this.blur()'>HOBBIES</a></li>
<li><a class="selectable" href="index.php?seite=blog&stil=1" onFocus='if(this.blur)this.blur()'>BLOG</a></li>
<li><a class="selectable" href="index.php?seite=chronik max&stil=1" onFocus='if(this.blur)this.blur()'>MAX</a></li>
<li><a class="selectable" href="index.php?seite=chronik mary&stil=1" onFocus='if(this.blur)this.blur()'>MARY</a></li>
<li><a class="selectable" href="index.php?seite=linkseite&stil=1" onFocus='if(this.blur)this.blur()'>LINKS</a></li>
<li><a class="selectable" href="index.php?seite=impressum&stil=1" onFocus='if(this.blur)this.blur()'>IMPRESSUM</a></li>
<li><a class="selectable" href="index.php?seite=privat&stil=1" onFocus='if(this.blur)this.blur()'>PRIVAT</a></li>
<li><a class="selectable" href="phpbook" target="_blank" onFocus='if(this.blur)this.blur()'>G&Auml;STEBUCH</a></li>
</ul></div>

Versuch doch am besten noch einrückungen an deinem Quellcode vorzunehmen.
Die li's einfach etwas weiter mit der Tab taste einrücken, das macht das ganze Ordentlicher.

Außerdem:
Hier ein gutes Beispiel bei der liste.
Dein Aufbau ist so:

<div id="menue">
<ul class="navlist">
[... Hier deine ganze Listenpunkte li's ...]
</ul>
</div>

Doch das ist falsch, und unnötig. Wieso nutzt du <div> um <ul>? Du kannst auch <ul id="menue" class="navlist"> schreiben. Das Div würde dann ganz wegfallen!

<div id="headline">
<h1>Nur eine Empfehlung</h1>
</div>

Nein nein nein. Das div fällt weg, und h1 bekommt die id "headline".
Außer, außer dem h1 kommt noch anderer text zwischen das div.

<div id="footline"><h2>W e b d e s i g n&nbsp;&nbsp;&nbsp; v o n&nbsp;&nbsp;&nbsp; M a x &nbsp;H e r l a</h2>

Das h2 kann die id "footline" bekommen. Div fällt weg.

<h1>
<br /><br />
Herzlich Willkommen auf meiner Webseite.<br /><br />
Sie ist im Eigenbau entstanden und somit nicht auf alle Eventualit&auml;ten vorbereitet.<br />
Getestet habe ich sie mit IE8 , Firefox 3.6 , SeaMonkey 2.0.2 , Opera 10.01 , Safari 3.1 und Google Chrome 4.1 .<br />
Da ich mich aber mit den Ungereimtheiten der einzelnen Browser (noch) nicht so auskenne, sollten meine Besucher einiges beachten:<br /><br />
... um Verzerrungen der Bilder zu vermeiden, sollte die Bildschirmaufl&ouml;sung optimalerweise auf 1440 x 900 eingestellt sein ( zumindest irgendwo bei 1,6:1 )<br /><br />... um in den vollen Genuss meiner Bilder zu kommen, sollte auch die Browseransicht auf Vollbild geschaltet werden, <br />
( an die weniger Versierten, das macht man mit der Taste F11 )<br /><br />
... auf verschiedene Designs kann man in der Fussleiste umschalten.<br />
<br /></h1>

Du zeichnest einen so lange Text als eine der allerwichtigsten überschriften der Seite aus? (h1)?
Falsch. Einen Text zeichnet man mit <p> aus. Genauer gesagt Absätze zeichnet man mit <p> aus.

Und die <br />'s sind schlecht. Willst du auf die nächste Zeile umspringen okay.
Aber fürwas 2 <br />'s?

<br /><br />

Falsch. Lieber den Zeilenabstand des Absatzes (das ein p werden soll) erhöhen.
Und soll nur eine einzige Zeile mehr abstand haben, machst du 2 absätze.
<p class="mabstand">Dein Text</p>
<p>Zeile unter dem Text</p>

Und der klasse mabstand gibst du nun ein padding nach unten.

HTML wird NIE für das Design verwendet. Wenn du die HTML schreibst, achtest du nur darauf
den Text deiner Seite, den KOMPLETTEN INHALT so auszuzeichnen, das er die
Tags bekommt, die dafür gedacht sind.
Und das DESIGN spielt KEINE ROLLE! Erst danach setzt du dich an die CSS dateien
und änderst dort, mithilfe von IDs und Klassen im HTML code das Design.

Und zum Design gehören auch abstände von absätzen oder Listen.

 

[MH223]

Danke an alle, die mir so geholfen haben,
Shrax, vlt. hast du ja mein Erstaunen registriert, dass man auch ein <h1> positionieren kann, meine Art und Weise, HTML zu lernen hat dieses Wissen bisher verhindert :mrgreen:, aber man lernt ja...

Das mit dem <h1 id="headline"> hab ich mittlerweile schon begriffen und ausprobiert, ich werde das auch umsetzen, ich muss bloss vorsichtig zu Werke gehn, sonst versau ich mir meinen ganzen Code.

Das mit der Semantik hab mir auch schon mal verinnerlicht, bin dabei zu der Erkenntnis gelangt, dass eine darauf getrimmte Seite auch absolut ohne CSS verständlich funktionieren muss.

Das Formatieren des Quellcodes sehe ich als Problem, weil ich den über PHP erzeuge und da tu ich mir schwer, mit den vielen echos das Ganze in den Griff zu bekommen. Aber das sind glaub ich erst mal Nebensächlichkeiten.

Jetzt werd ich erst mal versuchen, Semantik rein- und DIV's rauszubekommen, da hab ich genug zu tun.

Hab mir sogar heute noch (endlich mal) ein Buch über Webprogrammierung gekauft und mich gewundert, was es so alles gibt :mrgreen:

Ach ja, noch eine ganz andere Frage,
wenn ich das nun alles geändert habe, was ja bestimmt eine Weile dauert, muss ich dann einen neuen Thread hier einstellen oder kann ich diesen hier nur nochmal beantworten um ihn wieder aktuell zu machen. In den Vorschriften hier hab das nicht ganz begriffen.

 

[Shrax]

Shrax, vlt. hast du ja mein Erstaunen registriert, dass man auch ein <h1> positionieren kann, meine Art und Weise, HTML zu lernen hat dieses Wissen bisher verhindert :mrgreen:, aber man lernt ja...

Ja habe ich. Ich wollte dir, da ich vom Lernen für die Schule eh gerade Pause gemacht habe, nur noch ein paar direkte Beispiele geben was du ändern solltest/kannst. So hast du schonmal ein paar direkte Punkte, was du alles machen kannst. :)

Das Formatieren des Quellcodes sehe ich als Problem, weil ich den über PHP erzeuge und da tu ich mir schwer, mit den vielen echos das Ganze in den Griff zu bekommen. Aber das sind glaub ich erst mal Nebensächlichkeiten.

Da kann ich leider auch nicht helfen. Php kann ich (noch) nicht. :)

Ach ja, noch eine ganz andere Frage,
wenn ich das nun alles geändert habe, was ja bestimmt eine Weile dauert, muss ich dann einen neuen Thread hier einstellen oder kann ich diesen hier nur nochmal beantworten um ihn wieder aktuell zu machen. In den Vorschriften hier hab das nicht ganz begriffen.

Ich denke solange du die Website allgemein verbesserst kannst du jederzeit hier weiterschreiben. Denn nach deiner verbesserung, können wir dir hier natürlich auch gleich sagen, was danach noch verbessert werden kann.


Nur für sehr Spezielle fragen (Als beispiel würde mir einfallen, du möchtest jetzt ein LoginSystem in php einbauen und fragst wie man das realisiert) solltest du der Übersichtlichkeit halber ein neues Thema aufmachen.

Das mit dem <h1 id="headline"> hab ich mittlerweile schon begriffen und ausprobiert, ich werde das auch umsetzen, ich muss bloss vorsichtig zu Werke gehn, sonst versau ich mir meinen ganzen Code.

Da kann ich dir aus eigener Erfahung einen Tipp geben. :)
Wenn die Website nicht unbedingt sehr viel Speicherplatz auf dem PC braucht, mach ich immer ein Backup (Ordner mit heutigen Datum im namen) der ganzen Website, oder des Ordners in dem ich Dateien bearbeite.

Wenn dann was nichtmehr geht kann man mit den Backups vergleichen und dinge rückgängig machen.

 

[Efchen]

Shrax, vlt. hast du ja mein Erstaunen registriert, dass man auch ein <h1> positionieren kann

Es verwundert mich nur immer wieder, wieso jemand - und das machen ja viele - so lernt, wo geschrieben steht, dass das nicht geht. Es wäre doch bodenlos unlogisch, könnte man nur bestimmte Tags formatieren und würde dem Sinn von HTML widersprechen.

Das mit der Semantik hab mir auch schon mal verinnerlicht, bin dabei zu der Erkenntnis gelangt, dass eine darauf getrimmte Seite auch absolut ohne CSS verständlich funktionieren muss.

Richtig. Wobei das "darauf getrimmte Seite" sich so anhört, als wär das ein Bonbon, ein optionales Extra - aber das ist es ja nicht, es ist Pflicht. Das ist der Sinn von HTML!

wenn ich das nun alles geändert habe, was ja bestimmt eine Weile dauert, muss ich dann einen neuen Thread hier einstellen oder kann ich diesen hier nur nochmal beantworten um ihn wieder aktuell zu machen. In den Vorschriften hier hab das nicht ganz begriffen.

Keine Ahnung, was in den Vorschriften steht, aber ein Thread ist ja eine Diskussion zu einem bestimmten Thema. Allein die Logik dazu sagt, dass Du Bewertungen zur selöben Site problemlos hier einstellen kannst.

 

[MH223]

Es verwundert mich nur immer wieder, wieso jemand - und das machen ja viele - so lernt, wo geschrieben steht, dass das nicht geht. Es wäre doch bodenlos unlogisch, könnte man nur bestimmte Tags formatieren und würde dem Sinn von HTML widersprechen.

Moin,
wenn man, so wie ich, aus dem Nichts anfängt, Webseiten zu schreiben, dann guckt er, wie's die andern machen. Man lässt sich also den Quelltext irgendwelcher Seiten anzeigen und verwendet Teile davon, die verständlich aussehen zum Probieren und freut sich wenn was angezeigt wird.
Auf diese Art lernt man (bzw. ich) eine Programmiertechnik, die zugegebenermassen nicht unbedingt optimal sein muss, aber zu diesem Zeitpunkt kann man das absolut nicht einschätzen.

Erstaunlicherweise (oder ist das normal?) habe ich festgestellt, dass sich anscheinend die wenigsten einen hier angesprochenen Stil angewöhnt haben und die wildesten Techniken entwickelt haben um irgendwas am Bildschirm anzuzeigen. Es wimmelt nur so von <table> oder <div>, ein <h1 class="irgendwas"> hab ich zumindest bewusst noch nie gesehen.

So also gewöhnt man sich auch so einen Stil an, von dem man meint, er sei gut und ist verwundert, plötzlich was von z.B. Semantik zu hören.

Auch das Design der Webseiten folgt keiner Richtlinie, jeder macht's anders. Das ist auch gut so, sonst wär's ja langweilig. Was mir aber immer wieder stinkt, ist, wenn ich auf einer Seite nur noch per Zufall an die von mir gewünschte Stelle vortasten kann und in der Navigation keine Logik entdecken kann. Ein typisches Beispiel ist die Telekom-seite, ein Kraut- und Rübenacker an Links, die aber nie dahinführen, wo man denkt zu landen. Ich habe auf meiner Seite versucht, eine klare, reproduzierbare Logik einzuhalten, da hat man mir gesagt, man merkt mein Alter (heul).

NEIN, ich bin nicht beleidigt.

Ich weiss nicht, welche Typen von Programmierern hier im Forum vertreten sind, dazu bin ich zu kurz dabei, aber ich hab hier in der kurzen Zeit schon mehr gelernt, als ich erwartet habe. (das war ein Lob !!!)

 

[Efchen]

wenn man, so wie ich, aus dem Nichts anfängt, Webseiten zu schreiben, dann guckt er, wie's die andern machen.

Und wie bei so vielen Quellen im WWW sind die Quellen halt nicht verlässlich.
Ja, aber das ist natürlich verständlich.

Auf diese Art lernt man (bzw. ich) eine Programmiertechnik

Aber natürlich nicht HTML/CSS, denn das sind ja beides keine Programmiersprachen :-)

Erstaunlicherweise (oder ist das normal?) habe ich festgestellt, dass sich anscheinend die wenigsten einen hier angesprochenen Stil angewöhnt haben und die wildesten Techniken entwickelt haben um irgendwas am Bildschirm anzuzeigen.

Da fängt es ja schon an. Die meisten glauben schon, dass sie HTML brauchen, um etwas am Bildschirm anzuzeigen. Damit gehen sie gleich am Anfang ihres Weges auf einen falschen Weg und rennen dann nach einiger Zeit in die völlige Irre.

So also gewöhnt man sich auch so einen Stil an, von dem man meint, er sei gut und ist verwundert, plötzlich was von z.B. Semantik zu hören.

Es ist traurig, dass immer noch so viele HTML-Tutorials existieren, die anscheinend in den frühen 1990er Jahren geschrieben wurden.
Kennst Du das schon? Einf

Ich habe auf meiner Seite versucht, eine klare, reproduzierbare Logik einzuhalten, da hat man mir gesagt, man merkt mein Alter (heul).

Das hast Du missverstanden. Ich meine, dass die Site so aussieht, wie viele Seiten in den 1990er Jahren und dass sich viele Menschen, die damals Webentwicklung gelernt haben, sich seitdem nicht verändert haben und ihre Seiten heute noch so aussehen. Aber zumindest die Technik dahinter - deas habe ich ja auch gesagt - ist für den ersten Eindruck viel zu modern.

NEIN, ich bin nicht beleidigt.

Da hast Du auch keinen grund zu :-)

Ich weiss nicht, welche Typen von Programmierern hier im Forum vertreten sind, dazu bin ich zu kurz dabei, aber ich hab hier in der kurzen Zeit schon mehr gelernt, als ich erwartet habe. (das war ein Lob !!!)

Für HTML/CSS braucht man keine Programmierer ;-) Aber ich bin tatsächlich beruflich Programmierer.
Das Lob kann ich nur zurück geben, denn Du hast IMHO mehr Potenzial als so manch junger Hüpfer, der auf seine Layouttabellen besteht.

 

[MH223]

Danke für die Blumen ;heart;heart

unter Programmierer versteh ich übrigens erst mal nur diejenigen, die einem Computer sagen, was er wie machen soll, insofern ist HTML für mich auch eine Programmiersprache, weil ich dadurch mit dem Kasten spreche, die richtige Berufsbezeichnung ist mir hierbei schnuppe :mrgreen:.

 

[Loon3y]

DAs ermütigt einen, sich wieder mehr mit dem Forum zu beschäftigen. Dachte es sind nurnoch Menschen hier unterwegs die alles persönlich nehmen und dann unfairerweise mit persönlicher Kritik kontern.

unter Programmierer versteh ich übrigens erst mal nur diejenigen, die einem Computer sagen, was er wie machen soll, insofern ist HTML für mich auch eine Programmiersprache, weil ich dadurch mit dem Kasten spreche, die richtige Berufsbezeichnung ist mir hierbei schnuppe :mrgreen:.

Hm...HTML ist aber eine Auszeichnungssprache, im Prinzip sagst du ja nur, was dein Inhalt bedeutet (Überschrift, Liste, Textabsatz, Formularfeld...).
Ich glaube es ist dann wohl eher angebracht, wenn überhaupt, HTML und CSS als "internetfähige Sprachen" zu bezeichnen. :) Viele, unter anderen auch auch, reagieren immer sehr mürrisch auf das Wort "Programmiersprache" in zusammenhang mit HTML / CSS. Bei einer Programmiersprache sagt man tatsächlich einer Maschine was sie tun soll, bei HTML nicht. :)

Weiter so, cih bin schon gespannt auf die Ergebnisse!

Gruß
Loon3y

 

[MH223]

So Leute,
ich hab meinen Code so gut wie möglich nach euren Vorschlägen geändert, könnt ihr mal drüberschaun ?
Was mich irritiert ist, dass der validator.w3.org 27 Errors und 21 warnings meldet, die ich aber nicht nachvollziehen kann. Es wäre schön, wenn mir einer das erklären könnte.
Den DOCTYPE hab hier bei euch geklaut, davon hab ich nämlich NULL Ahnung.

 

[Efchen]

"NULL Ahnung" ist nur eine faule Ausrede. Wenn Du in der Lage bist, Websites zu erstellen, dann bist Du auch in der Lage, eine Suchmaschine zu benutzen, oder? :-)

Infos zum Doctype: DTD – Document Type Declaration – Das richtige Doctype

Zu Deinen Fehlern:
- "Byte-Order-Mark" ist ein Code, den manche Editor bei Dokumenten in utf-8 an den Anfang der Datei setzen. Das musst Du unterdrücken, weil alte IEs dann in den Quirks Mode schalten.
- "cannot generate system identifier for general entity "stil"" Mit einem Ampersand (&) leitest Du eine HTML-Entity ein. Es gibt aber keine Entity &stil; wie Du es geschrieben hast. Maskiere daher das Ampersand mit &amp;
- Es gibt in XHTML kein Attribut "onFocus", in XHTML wird alles klein geschrieben.

Der Rest sind wahrscheinlich Folgefehler durch das falsche Entity.

 

[MH223]

WOW
1 Fehler