• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Website Checken bitte

T

T!P-TOP

Mitglied
Nicolas Pecher

Bitte mal von oben bis unten durchchecken :D Am Desing hab ich, wie man sehen kann, noch überhaupt nicht gearbeitet. Mir gehts lediglich darum, erstmal den code richtig zustellen. Wenn ihr mir dann noch den einen oder andren Tip geben könntet, wie ich zB auf paar Sachen verzichten kann oder besser lösen kann, wäre ich euch sehr dankbar!

MfG
 
Hallo,
Design ist da wirklich noch nicht viel ;)
Einige Divs kannst du, so wie die Seite jetzt ist, ohne weiteres einsparen. Die Frage ist, was du mit den einzelnen Bereichen (auch vom Design her) vorhast.
Da im Header nur der Titel steht: Zeichne ihn doch auch als Titel (h1) aus und formatiere das h1. Der Zeilenumbruch macht da keinen Sinn.

HTML: 
<h1 id="header">Nicolas Pecher</h1>
Die Navigation ist so in Ordnung.
Der content-Div kann auch weg. Er erfüllt keine Funktion, die Hintergrundfarbe kannst du auch über den wrapper festlegen.
Für den Footer würde ich ein p-Tag nehmen, da hier auch nur der kurze Satz steht. Div ist da nicht nötig. Auch hier dient der Zeilenumbruch nur zu Designzwecken -> weg damit, CSS.

HTML: 
<p id="footer">powered by Nicolas Pecher</p>

Viel mehr lässt sich dazu nicht sagen ;)
 
Ich habe vor, sowohl in dem Header als auch in dem Footer Div ein Backgroundimage einzufügen.

Beim Cotent div soll eigentlich nichts mehr rein kommen.

Da ich "Nicolas Pecher" und "powerd by Nicolas Pecher" in die Grafiken reinschreiben werden, brauch ich den div footer und die überschrift muss im jetztigen div content bleiben.

Aber auf den div content kann ich also verzichten!? Das heißt sobald der div-tag für den header geschlossen wird kommt die <h1>, anschließend die <p> 's und danach der footer-div!?

Passt das CSS soweit?

lg
 
Richtig, so wie es jetzt ist, kannst du auf den Content-Div verzichten.
Du brauchst für header und footer trotzdem keine Divs verwenden. Du kannst dem h1 und dem p mit CSS einfach ein Hintergrundbild zuweisen. Schließlich kannst du p und h1 wie Div auch alle möglichen Formatierungen zuweisen. ;)
Wenn der Text in der Grafik drinsteht, solltest du dennoch den Text im HTML-Quelltext lassen, damit Suchmaschinen den Text einlesen können. Du schiebst ihn mit text-indent: -999em; einfach aus dem Bild, so ist er für den Besucher nicht mehr sichtbar.

lg
kruschimappel
 
Ich kann einem p tag ein backgroudimage geben??
Könnt ich dann nicht genau so gut auch ein p tag für den header div verwenden?

In hatte vor , in den Footer noch 2-3 Links reinzuschreiben, wäre es da nicht besser einen div zu verwenden?

Und wieso den div überhaupt gegen <p> eintauschen? Haben divs einen Nachteil ? :/
 
Du kannst nahezu jedes Element mit nahezu allen CSS-Eigenschaften stylen, das ist doch gerade das tolle :D
HTML dient dazu, Inhalte auszuzeichnen. Design kommt erst an zweiter Stelle.
Das heißt, Textabsätze bekommen ein p-Tag, Überschriften h1-h6, eine Linkliste wie die Navigation wird als <ul> gekennzeichnet (was du richtig gemacht hast) und so weiter. Es ist also semantisch korrekter, den Seitentitel auch als h1 auszuzeichnen. p macht hier weniger Sinn.
Div dient dazu, Elemente (meist zu Designzwecken) zu gruppieren und ist daher, semantisch betrachtet, ein allgemeines Tag. Da du aber Links einfügen möchtest, würde ich vielleicht eher eine Liste nehmen (ul).
 
Hm gut, aber den div-content kann ich ja dann noch gebrauchen, da ja divs mehrere Elemente gruppiert. Ich hatte vor in den div content auch Bilder einzufügen. Dann hät ich <h1>, <h2>, <p>, <img> - wäre es nicht gut, dann doch diese in einem div-cotent zu gruppieren?
 
Ich korrigiere meine vorherige Aussage - Div-Container werden fast nur zur Gruppierung von Inhalten für Designzwecke verwendet. Du verwendest einen, um deine Seite zu zentrieren - hier ist er für das Design notwendig. Des weiteren sind Div-Container noch bei durch AJAX austauschbare Inhalte zu finden. Ansonsten hat der Div-Container eigentlich keine Funktion, die mir spontan einfallen würde. Suchmaschinen ignorieren ihn, Inhalte zeichnet er so direkt auch nicht aus. Daher solltest du ihn weglassen, da er hier keine direkte Funktion hat, das hält den Code schlank.
Wenn du dich streng nach der Semantik richtest, müsstest du alle Divs weglassen, da sie für die Inhaltsauszeichnung nicht von Bedeutung sind. Dann könntest du aber keine komplexeren Layouts umsetzen.
Ich hoffe, das verwirrt nicht zu sehr, ich schweife ab. :D In einem Satz: Wenn nicht nötig, weglassen.
 
Hm, aber wenn ich keinen div container hab, muss ich alle Elemente extra positionieren. So muss ich nur einen div zentrieren und nicht alle elemente wie p's, h's, ul, etc!?

Da wird doch die Css Datei riesig!!?

Ich versteh nicht wozu divs da sind, wenn sie ja semantisch gesehen Fehler(!?) sind?
 
Hm, aber wenn ich keinen div container hab, muss ich alle Elemente extra positionieren. So muss ich nur einen div zentrieren und nicht alle elemente wie p's, h's, ul, etc!?
Zum Vergrößern anklicken....
Genau dafür sind Divs da! ;) Divs werden von Webdesignern genutzt, um eben die Inhalte "in einer Gruppe" besser stylen zu können. Dabei soll man sich aber an dem Ideal des semantischen Codes orientieren und zu viele divs vermeiden. Das ist sozusagen der Mittelweg zwischen semantischem Code und optimalem Design.

In deinem Fall brauchst du aber nur den äußersten Div zur Zentrierung der Seite. Die Inhalte im content-Div sind schließlich im äußeren Div enthalten und somit auch zentriert.
 
Hallo,

vielleicht als kleine Anregung:
Du könntest auf HTML 5 umsteigen, um deinem Code noch mehr Semantik zu verleihen. Er scheint dir ja recht wichtig zu sein. ;)

Gruß
 
kruschimappel schrieb:
Aber bald schon. Wenn du einen Doctype hinzufügst, interpretiert auch der Internet Explorer HTML5-Seiten halbwegs richtig und geht nicht in den Quirks-Modus.
Noch eine interessante Seite zu Semantik:
Vorsprung durch Webstandards | Semantischer Code - Definitionen, Methoden, Zweifel
Zum Vergrößern anklicken....

Das gilt vielleicht für den kommenden IE9, der IE8 kann mit HTML5 nicht viel anfangen ganz egal ob mit oder ohne Doctype.
Auch beim Firefox muss man wohl auf die Version 4 warten.

Die einzigen die einigermassen mit HTML5 umgehen können sind Chrome und natürlich Safari der das schon fast perfekt drauf hat.

Gruss
Elroy
 
Elroy schrieb:
Die einzigen die einigermassen mit HTML5 umgehen können sind Chrome und natürlich Safari der das schon fast perfekt drauf hat.
Zum Vergrößern anklicken....

Wie kann man mit etwas umgehen, bzw es perfekt können, wenn noch garnicht festgelegt wurde was das "etwas" sein darf / kann / soll? Kurzum: HTML 5 ist noch kein Standard, also kann man auch nicht sagen, dass der Browser X schon HTML 5 kann.


Gruß
Loon3y
 
Naja es ist halt so das der Safari die meisten HTML5 Tags und CSS3 Eigenschaften beherrscht, ob das jetzt Standard ist oder nicht.

Auch der neue IE und Firefox die beide im Herbst kommen werden diese Tags beherrschen ob Standard oder nicht ist egal.
Es wird einfach von dem Ausgegangen was im Moment bekannt ist, kleiner Änderungen kann man dann mit einem Update machen falls das sein muss.

Ich finde das auf jeden Fall besser als ewig auf das endgültige o.k. vom W3C zu warten und sich erst dann mit der Materie zu beschäftigen.

Gruss
Elroy
 
kruschimappel schrieb:
Noch eine interessante Seite zu Semantik:
Vorsprung durch Webstandards | Semantischer Code - Definitionen, Methoden, Zweifel
Zum Vergrößern anklicken....

Hey Prima - danke dir!

Hm Gibt es da nicht schon die Beta von FF 4!? Ich denk der kann html 5 eh schon lesen..!?

Jedenfalls, kennst ihr vielleicht eine gute Seite zu html5? Hab mir bisjetzt ein paar Videos dazu angesehen, bisher is mir nur aufgefallen, dass html teilweise Flash ersetzen kann, aber kommt sonst noch was dazu?

Grüße
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben