Anfänger, wo anfangen?

p_o_d · 08.02.2012

Hallo Zusammen!

Ich beschäftige mich seit einiger zeit mit Webdesign bzw. mit HTML & CSS
hab das prinzip eigentlich verstanden,

HTML = Inhalt und
CSS = Darstellung
(so grob gesagt)

Jetzt hab ich eine Vorstellung wie ich eine Webseite gestalten will,
mache dann eine index.html mit den inhalten (divs etc...) in DW und dannach direkt im Kopfbereich die CSS die dann auch miteinander funktionieren.

aber ich verstehe nicht wann ich welche CSS - Eigenschaften + Werte um mein Ziel zu erreichen. Deswegen wollte ich fragen wie ich am besten anfangen sollte`?

ich meine so fragen, wieso sollte ich position, fixed, absolute oder relative benutzen und welches ist jetz für meine vorstellung die richtige?

oder wie habts ihr gemacht am anfang ?

Refus · 09.02.2012

AW: Anfänger, wo anfangen?

Die Richtige ist doch nicht entscheidend, den richtig ist sie dann wenn es korrekt (in allen Browsern) dargestellt wird.

Du solltest langsam anfangen und nicht gleich an hoch komplizierte Layouts gehen. Am Anfang reicht es zu meist position nicht weiter zu spezifizieren und den Standardwert static damit zu nutzen. Was welche Eigenschaft bewirkt kannst du unter http://www.css4you.de/position.html nachlesen. Außerdem findest du dort noch eine "Workshop"-Section http://www.css4you.de/workshops.html
Der Stand der Seite ist nicht der neueste, CSS 3 wirst du dort bsp. nicht finden, aber sie hilft dir einen Überblick in die Funktionsweise von CSS zu verschaffen.

Alles weitere ist Trial & Error, einfach machen und spezifisch nach einer Lösung suchen oder eben solange probieren bis man es gelöst hat. Erst dann kommst du rein und eigentlich dauert es gar nicht lange, dann fragst du dich schon warum das früher alles mal so unglaublich kompliziert geklungen hat

dnai85 · 09.02.2012

es gibt viele HTML + CSS Kurse hier, im Internet oder auch gute Bücher darüber.

bei selfhtml kannst du dir alle möglichen Sachen über HTML und teilweise auch CSS anschauen

des weiteren gibt es noch css4you, das die CSS-Eigenschaften ein wenig beschreibt.

hier ein kostenloses Online Buch über HMTL5 und ein bisschen CSS
HMTL5-Handbuch
hier findest du auch eine dazugehörige CSS-Referenz.

ich hoffe ich konnte dir helfen.

P.S. die Stylesheet werden heutzutage in einer extra Datei eingebunden (meistens style.css) und dann mit einer Zeile Code eingebunden:

<head>

<link rel="stylesheet" type="text/css" href="style.css" media="all">
</head>

jetzt hab ich doch glatt und sauber den wichtigsten Satz vergessen:

Einfach ausprobieren und dann wirst du die jeweiligen Eigenschaften schon von selbst herausfinden und die richtige Lösung finden!

Beim vergessen eines Satzes bitte den "Bearbeiten-Button" nutzen. Vermeidet Doppelpost´s. Besten Dank

patrick_l · 09.02.2012

AW: Anfänger, wo anfangen?

dnai85 schrieb:
bei selfhtml kannst du dir alle möglichen Sachen über HTML und teilweise auch CSS anschauen

SelfHTML sollte wenn nur noch als Quickreferenz verwendet werden. Auch nur dann wenn man die Basics drauf hat. Die richtige Adresse wäre das HTML5 Handbuch. Geschrieben von Stefan Münz, der Gründer von selfhtml. Das Buch kostet ca. 35 Euro. Kann aber komplett kostenlos im Internet als Online-Version gelesen werden. Ist quasi das neue selfhtml.

Das A und O ist immer noch, wie sonst auch bei anderen Dingen das lernen / aneignen der Grundlagen. Zum aneignen der Basics (xHTML/HTML5 CSS2/CSS3) hier einige nützliche Links zu guten Lernressourcen.

- HTML5/CSS3 Handbuch - Webkompetenz
- Einführung in XHTML, CSS und Webdesign - Michael Jendryschik
- Little Boxes | Webseiten gestalten - HTML & CSS (Peter Müller)
- CSS | Grundlagen
- CSS 4 You | The Finest in Stylesheets
- CSS Mania · Since 2004

Grüße Patrick

LaFaSiLuc · 09.02.2012

AW: Anfänger, wo anfangen?

Zum Verständnis von Gründgerüsten und deren Aufbau schau mal bei intensivstation.ch.
Das finde ich persönlich sehr verständlich und hilfreich. Little Boxes ist natürlich auch ne Bibel für CSS

der_fou · 09.02.2012

AW: Anfänger, wo anfangen?

Auch wenn ich als outdatet gelte, www.selfhtml.org könnte Dir da weiterhelfen.
Da steht jeder Schritt beschrieben und wieso, als Quelltext und auche in link,ums gleich anzusehen.
Denn richtig wirds erst, wenn Du´s richtig einsetzt!

Viel Erfolg beim Basteln!

LG und allzeit "gut Licht"!

der fou

owieortho · 09.02.2012

AW: Anfänger, wo anfangen?

Schau Dir die Quelltexte von Webseiten an (Firebug hilft dabei auch ungemein), baue einzelne Komponenten nach. Auf www.w3schools.com (tryit editor) oder jsfiddle.net/ kannst Du auch online testen.

Anne2009 · 09.02.2012

AW: Anfänger, wo anfangen?

Und von mir auch noch eine hilfreiche Seite:
http://www.ohne-css.gehts-gar.net/ und hier:
http://www.friedels-home.de/

simonpicos · 09.02.2012

AW: Anfänger, wo anfangen?

Anne2009 schrieb:
und hier:
http://www.friedels-home.de/

Den Link sollte man fast löschen! Ich habe mir die Seite nur angeschaut und sehe: Frames !?! 1999??
In der Navigation sehe ich so sachen wie: Mausverfolger, Regenbogentexte..

Die erklärten Techniken sind warscheinlich auch veraltet!

Also besser die Links z.B. von DerOtto anschauen

Gelöschtes Mitglied 133165 · 09.02.2012

AW: Anfänger, wo anfangen?

http://little-boxes.de/
ist für eien "Neueinsteiger" eine wirkliche Empfehlung. Das Thema HTML/CSS wird unkompliziert aber fachkundig angegangen. Auch dei Links auf der Seite sind gut zum "Einsteigen" geeignet ohne abzuschrecken. Ich hätte mir sowas gewünscht zum "Abschied" von meinen seinerzeit geliebten Tabellen-Layouts....

.

marcmaroc · 09.02.2012

AW: Anfänger, wo anfangen?

Ich habe auch mit DW angefangen, jedoch bin ich nun umgestiegen Webocton - Scriptly.
Manchmal schreibe ich das Grundgerüst einer neuen Seite erst auf ein Blatt, ist umständlich aber ein gutes Training. Wie schon erwähnt wurde die css immer extern, für kleine seiten geht es noch, wenn Du aber mehr als 20 Seiten hast und musst später mal etwas ändern... und deshalb auch ruhig einige Komentare schreiben, es hilft dir später deine alten arbeiten zu verstehen.
Die meisten (besten) Seiten wurden schon genannt, ich habe da noch eine die recht interessant ist:http://www.html-seminar.de/
Und nicht den Mut verlieren wenn mal etwas nicht so will wie es soll

p_o_d · 10.02.2012

AW: Anfänger, wo anfangen?

Danke viel mal, ich beschäftige mich mal mit der intensivstation weiter.

Das problem ist dass ich eine Idee habe, und nicht weiss welche CSS Eigenschaften, bzw werte dann die richtigen sind. ich will zum Beispiel so was machen, rein html und css das ist anderst erstellt worden.

meein index.html würde so aussehen

...
<body>
<div id="header">Das logo</div>
<div id="contentwrapper">
<div id="content">
Hier würde ich zum beispiel ein Youtubebideo einfügen.
</div>
</div>

<div id="footer"> eine kleine navigation die wahrscheinlich dann mit <ul> gmacht ist </div>

</body>
...

und jetz weiss ich zwar wie ich mit den selektoren referenziere aber welche werte ich eingeben muss damit das ungefähr so zu stande kommt ist noch ein rätsel.

Versteht ihr vor welchem problem ich stehe? Wie löse ich das am besten?

Gelöschtes Mitglied 133165 · 10.02.2012

AW: Anfänger, wo anfangen?

Alleine DIV´s zu erzeugen bringt Dich nicht viel weiter. Du musst den Tags, Klassen und ID´s die Du verwendest entsprechende Eigenschaften zuweisen per CSS. Das ist ein weites Thema (inline, block, float, padding, margin usw.) Mit "Try&Error" wirst Du leider keinen Erfolg haben. Wenn Du dann noch das Ergebnis in verschiedenen Browsern betrachtest, wird es noch verwirrender.... Investier einfach ein wenig Zeit (und eventuell Geld) in die Grundlagen, es lohnt sich und macht Deine Software, die ja auch nicht eben billig ist, erst richtig wertvoll für Dich.

p_o_d · 10.02.2012

AW: Anfänger, wo anfangen?

behemoth65 schrieb:
Alleine DIV´s zu erzeugen bringt Dich nicht viel weiter. Du musst den Tags, Klassen und ID´s die Du verwendest entsprechende Eigenschaften zuweisen per CSS. Das ist ein weites Thema (inline, block, float, padding, margin usw.) Mit "Try&Error" wirst Du leider keinen Erfolg haben. Wenn Du dann noch das Ergebnis in verschiedenen Browsern betrachtest, wird es noch verwirrender.... Investier einfach ein wenig Zeit (und eventuell Geld) in die Grundlagen, es lohnt sich und macht Deine Software, die ja auch nicht eben billig ist, erst richtig wertvoll für Dich.

Ja genau, ich hab die CSS im Head bereich festgelegt. die ist nicht sichtbar,
aber du hast recht, ich hab immer mit dem "jetzigen wissen" probiert aber nie das gewünschte Resultat erhalten. vielleicht sollte ich noch einwenig zeit investieren CSS for Dumies oder so besorgen.

Davi2000 · 12.02.2012

AW: Anfänger, wo anfangen?

In der CSS beginnst du am besten die einzelne Divs zu stylen.

Bsp:

#header{background: green; width: 960px; height: 700px;}

Aber wenn man nicht weiß wie es aussehen soll, kann man da schlecht anfangen.

patrick_l · 13.02.2012

AW: Anfänger, wo anfangen?

p_o_d schrieb:
Das problem ist dass ich eine Idee habe, und nicht weiss welche CSS Eigenschaften, bzw werte dann die richtigen sind.

Darum sollte man es auch lernen und nicht nur die "Rosinen" herauspicken. Lerne die Grundlagen dann wirst du auch wissen welche Tags, welche Attribute nötig sind.

p_o_d schrieb:
welche werte ich eingeben muss damit das ungefähr so zu stande kommt ist noch ein rätsel.
ersteht ihr vor welchem problem ich stehe? Wie löse ich das am besten?

Entweder deine Website bei einem Mediengestalter in Auftrag geben und dafür bezahlen oder wie schon oben beschrieben dir selber die nötigen Dinge beibringen. Dafür habe ich dir schon die wichtigsten Links gegeben. Durch lesen, lernen, verstehen und dann selber einsetzen.

Anne2009 schrieb:
Und von mir auch noch eine hilfreiche Seite:
http://www.friedels-home.de/

Das einzige was daran hilfreich ist zu sehen wie es nicht gemacht wird. Also ganz schnell vergessen und direkt ab in die Tonne.

p_o_d schrieb:
Ja genau, ich hab die CSS im Head bereich festgelegt. die ist nicht sichtbar,

Das CSS als eigene Datei auslagern und entsprechend im Head einbinden.

HTML:

<link rel="stylesheet" type="text/css" href="css/screen.css" media="screen,projection" charset="utf-8" />

Eine saubere Trennung von den Inhalten, Gestaltung und hilfreich zur besseren Übersicht.

p_o_d schrieb:
aber du hast recht, ich hab immer mit dem "jetzigen wissen" probiert aber nie das gewünschte Resultat erhalten.

Es kann nur besser werden.

Setze dich mit der Thematik richtig auseinander und auch wenn ich mich jetzt wiederhole - lerne die Basics. Wenn die erst einmal sitzen findest du selber die Antwort zu deiner Fragen. Wenn es dann doch mal Probleme gibt kannst du dich mit deinem Quellcode hier jederzeit melden bzw. es wird dir dann hier gerne geholfen.

Grüße Patrick

Davi2000 · 13.02.2012

AW: Anfänger, wo anfangen?

Anne2009 schrieb:
Und von mir auch noch eine hilfreiche Seite:

http://www.friedels-home.de/

Das ist ja fast grob fahrlässig sowas anzubieten. So hat die erste Seite vom HTML Entwickler ausgesehen. Und dann auch noch diese Frames. Schrecklich wirklich schrecklich.

chrissaso780 · 26.02.2012

AW: Anfänger, wo anfangen?

Ich würde HTML und CSS in zwei verschiedene Dateien unterbringen. Falls man dann mal was im CSS verändert werden muss muss man das nicht in jeder Seite das ändern.