neuling braucht starthilfe....

[pama]

Sooo ich bin neu hier und hab ein RIESEN problem !
und zwar:
Ich möchte mir gerne eine website coden mit html und css. Allerdings hab ich null Ahnung. Ich kann zwar ein paar sachen in HTML wie texte formatieren , Rahmen erstellen etc. aber ich möchte eine seite haben auf der ich die grafischen elemente selbst platziert kann (Also mit css)!

Anfangs möchte ich erstmal was simples machen aber ich hab eben kein plan wie ich anfangen soll meine grafiken zu platzieren.

Ich hab schon gefühlte 20 stunden gegooglet doch jedes Tutorial was ich finde kapier ich nicht (oder bin ich zu dooof?)

Kennt jmnd ein tut für doofe oder möchte mir jmnd helfen ? ^^
hoffe ihr könnt mir helfen ;)

lg

 

[Efchen]

Ich kann zwar ein paar sachen in HTML wie texte formatieren , Rahmen erstellen etc.

Damit gehts schon los. HTML ist nicht dafür da, Texte zu formatieren oder rahmen zu erstellen usw. HTML ist gar nicht dafür da, irgendwie das Aussehen zu modifizieren. Dafür gibts allein CSS.

HTML ist dafür da, die logische Struktur (= Semantik) für den Inhalt festzulegen. Bevor Du CSS lernst, musst Du HTML beherrschen, weil CSS auf HTML aufbaut.

aber ich möchte eine seite haben auf der ich die grafischen elemente selbst platziert kann (Also mit css)!

Nein, das möchtest Du nicht. Nicht, wenn das heißt, Du willst festlegen, an welcher Position die Elemente liegen. Das macht bei Websites keinen Sinn. Der Browser ist in der Lage, die Elemente selber so anzuordnen, wie es die Umgebung der Besucher vorgibt. Du kannst ihn dabei unterstützen, aber absolute Positionierung sollte Tabu sein. Denke daran, dass jeder Nutzer unterschiedlich viel Platz hat, um Deine Site darzustellen. Also klappt ein pixelgenaues Layout nicht bei jedem, bzw. bei der Mehrheit nicht so wie bei Dir!

Anfangs möchte ich erstmal was simples machen aber ich hab eben kein plan wie ich anfangen soll meine grafiken zu platzieren.

Für den Anfang solltest Du HTML lernen, wie das Grundgerüst aussieht, dann Deinen Inhalt schreiben und diesen semantisch sinnvoll mit HTML auszeichnen. Erst wenn das sitzt, macht es Sinn, mit dem Aussehen (CSS) zu beginnen.

Ein Tut für Doofe gibts nicht, weil Doofe sowas nicht machen können. Sonst wären sie ja nicht doof :-)
Versuchs mal hier, hier wird auch gut erklärt, was HTML eigentlich macht (Semantik): Einführung | Webdesign mit XHTML und CSS

P.S.: Erster! *grins*

 

[_Thor_]

Für den Anfang kannst du diese Seite (Einführung | Webdesign mit XHTML und CSS) lesen, dann sollten sich die meisten Fragen schon klären. Wichtig ist, dass du zuerst HTML verstehst, bevor du mit CSS anfängst, denn CSS benötigt eine solide HTML-Grundlage, damit es richtig effektiv funktioniert.

 

[pama]

okay also wenn ich das richtig verstanden hab muss ich mit HTML erstmal die texte und wörter schreiben und in einer logischen reihenfolge bringen.
Diese Texte (Textbausteine?) werden dan also später mit css angeordnet und "gestylt"?

Also sollte ich meine Homepage erstmal nur mit HTML schreiben? Praktisch erstmal den Inhalt festlegen und danach stylen?
Wenn das so is hab ich wennigstens schonmal einen Anfang ^^

lg

 

[_Thor_]

Ja das hört sich schon richtig an, denn mehr ist HTML auch nicht. Damit legst du nur die Bedeutung deines Inhaltes fest. Wie das dann im Browser aussieht ist erstmal egal. Das machst du dann später per CSS.

 

[Efchen]

okay also wenn ich das richtig verstanden hab muss ich mit HTML erstmal die texte und wörter schreiben und in einer logischen reihenfolge bringen.

Nicht wirklich Reihenfolge, mit HTML legst Du die Bedeutung fest, also was eine Überschrift ist, was als Textabsatz gilt, wo Listen sind, Adressen, Zitate, wichtige Textpassagen usw.

Diese Texte (Textbausteine?) werden dan also später mit css angeordnet und "gestylt"?

Nicht die Texte, sondern die Elemente (in HTML: "Tags"), in denen der Text abgelegt wird. Aber vom Prinzip her: Ja.

Also sollte ich meine Homepage erstmal nur mit HTML schreiben? Praktisch erstmal den Inhalt festlegen und danach stylen?

Genau. Auf diese Weise lernst Du HTML richtig. Viele fangen von hinten an, machen sich dadurch aber doppelt und dreifach Arbeit und verwenden semantisch falsche Tags.

Wenn Du d was hast, kannst Du das hier gerne wieder vorzeigen, dann werden wir uns das gerne ansehen und Dir erzählen, was daran in Ordnung oder verbesserungswürdig ist.

 

[pama]

okay jetzt noch eine Frage. So spielereien wie hintergrundfarbe brauch ich ja nicht genauso wie rahmen etc. richtig?

Hat vll jmnd eine beispiel-seite wie sie mit html erstellt werden sollte?

lg

 

[Efchen]

Solltest Du auch erstmal weglassen. Alles, was mit dem Aussehen zu tun hat, wird nicht mit HTML gemacht.

Auf der von uns verlinkten Site ganz oben steht viel zu dem Thema und auch Codebeispiele, das Grundgerüst einer Seite usw. Lies Dir das erst mal aufmerksam durch.

 

[pama]

kk vielen dank
wenn ich fertig bin werde ich es euch wissen lassen
lg

 

[pama]

So ich hab noch ne Frage!
ist dieser Tag --> <div>....</div> zwingend notwendig? Ich hab den heut zum erstenmal gesehn und weiß nich so recht was dieser mir bringt.
Was habe ich den dan von den Blöcken? Brauch ich das später für css?

lg

 

[_Thor_]

Mit einem div kannst du mehrere Elemente gruppieren, z.B. wenn du sie gemeinsam formatieren möchtest. Normalerweise braucht man nicht sonderlich viel divs und sie sind auch nicht für das CSS zwingend notwendig. Jedes andere Element kann man genauso formatieren.

 

[Efchen]

ist dieser Tag --> <div>....</div> zwingend notwendig?

Kein Tag ist zwingend notwendig (außer, dass die Wahrscheinlichkeit extrem hoch ist, dass jede Site wenigstens eine Überschrift und einen Textabsatz besitzt). <div> ist ein Tag wie jedes andere auch, es hat eine semantisch Bedeutung (hat _Thor_ schon gesagt). Man setzt es da ein, wo man den Inhalt als logische Gruppe definieren will.

Ich hab den heut zum erstenmal gesehn und weiß nich so recht was dieser mir bringt.

Ich vermute, da gibts noch ein paar andere, die Du bisher selten oder gar nicht genutzt hast, z.B. <em> oder <address>?

Was habe ich den dan von den Blöcken?

Was für Blöcke? Die Tags? Jedes Tag hat eine Bedeutung. Man wählt das Tag, das den Inhalt am besten beschreibt.

Der Begriff "Block" kommt eigentlich bei CSS ins Spiel, weil es HTML-Tags gibt, die Block-Elemente sind und welche, die Inline-Elemente sind. Beide verhalten sich leicht unterschiedlich, das muss man wissen, wenn man CSS verwenden will.

Brauch ich das später für css?

Im HTML-Code brauchst Du in der Regel nichts für später. Es ist umgekehrt, CSS nimmt das, was es vorgegeben bekommt. Man muss keine besonderen Elemente definieren, um damit später visuelle Effekte zu erzeugen. Ausnahmen bestätigen natürlich die Regel, aber das muss einen Anfänger noch nicht interessieren :-)

 

[pama]

<html>
<head>
<title>PM Design</title>
</head>
<body>

<div>
<h1>PM Design</h1>
</div>

<div>
<ul>
<li><a href="#">Home</a>
<li><a href="#">&Uuml;ber mich</a>
<li><a href="#">Galerie</a>
<li><a href="#">Links</a>
<li><a href="#">Kontakt</a>
</ul>
</div>

<div>
<h2>Willkommen!</h2>
<p>
Auf dieser Seite k&ouml;nnt ihr euch &uuml;ber mich und mein Hobby informieren.
</p>
<p>
Unter der Rubrik "&Uuml;ber mich" k&ouml;nnt ihr einige Daten zu meiner Person finden wie alter, Name etc.
Unter Galerie sind einige meiner Bilder zu bestaunen. Au&szlig;erdem habe ich f&uuml;r euch ein paar n&uuml;tzliche Links gesammelt, die euch unter Umst&auml;nden bei Problemen mit Photoshop helfen k&ouml;nnten.
Habt ihr Fragen oder Anregungen so k&ouml;nnt ihr mir unter "Kontakt" auch gerne eine E-mail schreiben!
</p>
<p><h3>Und nun viel Spa&szlig; auf meiner Homepage!</h3></p>
</div>


<div>
Copyright &copy; by PM Design 2010
</div>



</body>
</html>

Was meint ihr reicht das erstmal ?
Mehr möchte ich erstmal gar nicht machen ;)
Ist das soweit richtig?

Wenn ja wie sieht der nächste schritt aus? (CSS)

lg

EDIT: Wie kann ich hier den code vernünftig hochladen??

 

[Efchen]

Wozu ist das <div> um die <ul>? <div> zeichnet eine Gruppe aus, eine Gruppe besteht immer aus mindestens 2 Elementen. Das kann weg. Ebenso um das <h1>. Woher hast Du das? Das muss ja irgendwo stehen, von selbst kann man ja gar nicht auf die Idee kommen!?

Wenn Du das richtige charset angibst, dann musst Du Umlaute nicht als Entities schreiben.

Es fehlt ein Doctype und das meta-Tag fürs charset.

<p><h3> macht keinen Sinn. Wieso zeichnest Du den Inhalt sowohl als Textabsatz als auch als Überschrift aus? Entweder es ist ein Absatz oder eine Überschrift.

Wieso hingegen zeichnest Du Dein Copyright (sowas gibts nicht in Deutschland) auch als Gruppe und nicht als Textabsatz aus?

6 Fehler. Für den Anfang okay, aber das Ergebnis ist noch nicht ausreichend.

 

[pama]

Wenn Du das richtige charset angibst, dann musst Du Umlaute nicht als Entities schreiben.

????? Sry das sagt mir gerade nix.....

Es fehlt ein Doctype und das meta-Tag fürs charset.

Wöfür braucht man das? Es geht doch auch so???

<p><h3> macht keinen Sinn. Wieso zeichnest Du den Inhalt sowohl als Textabsatz als auch als Überschrift aus? Entweder es ist ein Absatz oder eine Überschrift.

Na weil das was im Absatz stehen soll groß geschriben sein soll. Ich habs mit <FONT SIZE "x">...</FONT> verwechselt ^^

warum hingegen zeichnest Du Dein Copyright (sowas gibts nicht in Deutschland) auch als Gruppe und nicht als Textabsatz aus?

Ja gute Frage....

Ich werds berichtigen und nochmal hier posten ;)

lg

 

[_Thor_]

????? Sry das sagt mir gerade nix.....

charset - Google-Suche

Wöfür braucht man das? Es geht doch auch so???

SELFHTML: HTML/XHTML / Allgemeine Regeln für HTML / Grundgerüst einer HTML-Datei

Na weil das was im Absatz stehen soll groß geschriben sein soll. Ich habs mit <FONT SIZE "x">...</FONT> verwechselt ^^

Wie war das mit HTML und CSS? Richtig, HMTL ist für die Semantik zuständig und CSS für das Aussehen. Also formatiert man einen Absatz mit CSS und nicht mit einem HTML-Tag.

 

[Efchen]

????? Sry das sagt mir gerade nix.....

Zum Glück gibts Google, wo man mal schnell nachsehen kann. Wenn dann noch Unklarheiten sind, dann kann man ja nachfragen. Wer nur sagt "Sagt mir nix" wird blöd sterben.

Wöfür braucht man das? Es geht doch auch so???

Woher weißt Du das? Nur weil es bei Dir zu gehen scheint, muss das ja nicht für die hunderte Millionen anderer WWW-Nutzer gelten.
DTD – Document Type Declaration – Das richtige Doctype LANtastic's Artikel

Na weil das was im Absatz stehen soll groß geschriben sein soll.

Was hat das Aussehen mit der Semantik zu tun? <p> bzw. <h3> schreiben nicht irgendwas groß, das erste definiert einen Textabsatz, das zweite eine Überschrift dritten Grades. Das Aussehen kann von Browser zu Browser variieren und muss mit CSS festgelegt werden.

Ich habs mit <FONT SIZE "x">...</FONT> verwechselt

Das ist ein Tag für physische Inhaltsauszeichnung und wird daher seit 10 Jahren nicht mehr verwendet. Das Aussehen macht man allein mit CSS.

Ich werds berichtigen und nochmal hier posten ;)

Gerne :-)