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

Ich hab´s geschnallt.... !!!

C

conTux

Guest
Hallo liebe Forengemeinde ;Jump

Ich glaube, ich hab´s geschnallt... !!!

Es ist doch richtig, dass man das Design und Inhalt trennen soll (HTML / CSS)

Da ich ja nun schon leider großen Mist mit meiner jetzigen Website erstellt habe und es verstanden habe, dass man CSS erst nach der durchdachten Struktur mit HTML einsetzt... möchte ich nun gerne wissen, wie ich das ganze bei meiner jetztigen Website machen soll!!!???

Wie bekomme ich das CSS jetzt in eine externe Datei und wie verlinke ich das genau???

Auf Deutsch: Wie bekomme ich mein Code sauber ???

Besten Dank.

Viele liebe Gruesse

conTux


EDIT: Upss.... hab n Link vergessen zum nachschauen!!! KLICK MICH
 
- tabelle weg, wo keine tabellarischen daten sind (also nahezu überall)
- CSS-daten auslagern
- tags schließen
- überlegen, ob es nicht sinnvoll wäre, etwas anderes als HTML 4.01 Trans zu verwenden

Nils aka XraYSoLo
 
Wie?
Am besten: Abreißen, neu machen.

Dann den Inhalt in die HTML-Datei schreiben.
Dann den Inhalt mit HTML auszeichnen.
Dann das externe Stylesheet schreiben.

Das ist bei jeder Seite das selbe. Wenn mans einmal (wirklich) verstanden hat, kann man das auf jede Seite neu anwenden.

Und wenn man es dann Intus hat, kann man auch das Layout vor dem Inhalt machen.
 
Wie?
Am besten: Abreißen, neu machen.

Dann den Inhalt in die HTML-Datei schreiben.
Dann den Inhalt mit HTML auszeichnen.
Dann das externe Stylesheet schreiben.

Das ist bei jeder Seite das selbe. Wenn mans einmal (wirklich) verstanden hat, kann man das auf jede Seite neu anwenden.

Und wenn man es dann Intus hat, kann man auch das Layout vor dem Inhalt machen.

Hmm, ok ich werd es mal probieren! Erst Inhalt mit HTML schreiben, dann auszeichnen und dann CSS ... nagut, so schwer hört sich das ja net an! Ich melde mich wieder wenn ich ein Problem mit der neuen Website habe....

Trotzdem vielen Dank für die netten Antworten!

conTux

EDIT: mit <link rel="stylesheet" type="text/css" href="style.css"> binde ich also eine externe CSS-Datei ein.... ok, dann kanns ja ans werk gehen! :-)
 
conTux:
Wenn du nicht unbedingt zuerst den Inhalt schreiben möchtest, und zum Üben von HTML mehr dein Augenmerk auf das Design richten möchtest, kannst du auch Lorem-Ipsum-Platzhalter in die HTML-Datei einfügen, und dann mit dem Design loslegen. Bist du dann mit dem Design fertig, kannst du den Platzhalter-Text entfernen, und deinen richtigen Text einfügen.

Hier ist der Generator: Lorem ipsum - Generator and Information
 
@Silar: Ich benutze Dreamweaver CS 3 und habe dort die Erweiterung (Lorem ipsum) installiert - trotzdem danke für Dein Tipp!

Ich habe mal mit der index.html angefangen.....

Ist der Anfang so in Ordnung?

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Wayside Beach Apartment Hotel</title>

</head>

    <body>
    
        <h1>Wayside Beach Apartment Hotel</h1>
        
        <h2>Herzlich Willkommen</h2>
        
            <p>Wir begrüßen Sie herzlichst auf unserer Internetseite.<br />
            <br />
            Entspannen, wo Tradition und Moderne, Genuss und   Wohlbefinden,    Herzlichkeit und Gastfreundschaft in <br />
            schlichter Perfektion zusammen kommen.<br />
            <br />
            Ob Businessreise oder Kurzurlaub, bei uns fühlen Sie <br />
            sich wie zu Hause. Schon seit über 8 Jahren beweisen <br />
            wir täglich unsere Berufung, Sie als Gast bei uns zu verwöhnen.</p>
        
        <h3>Herzlich Willkommen im Wayside Beach Apartment Hotel</h3>
        
    </body>

</html>

Ist nur eine Frage !!! Nicht wenn ich schon am Anfang Fehler mache!

Wie zu sehen ist, möchte ich auch alles in XHTML machen !!!

Danke, Gruß conTux
 
xXxPeterPanxXx:
Naja, immernoch einfacher und schneller als mit margin. Besser wäre es vielleicht statt die <br/>'s lieber jeden kleinen Abschnitt davon seperat in <p> einzufassen. Aber ihm ging es ja sowieso erstmal nur um die Validität denke ich mal. :)
 
Wenn du nicht unbedingt zuerst den Inhalt schreiben möchtest, und zum Üben von HTML mehr dein Augenmerk auf das Design richten möchtest, kannst du auch Lorem-Ipsum-Platzhalter in die HTML-Datei einfügen, und dann mit dem Design loslegen.
Und "Lorem ipsum" ist wohl kein Inhalt?

Ist der Anfang so in Ordnung?
Hey, das sieht klasse aus! Nur die wenigsten schaffen es auf Anhieb, das so vereinfacht und vor allem richtig zu erstellen!

Eine Sache habe ich allerdings auch zu bemängeln. Du setzt <br> für Abstände ein. Dafür ist es nicht da. Packe jeden Satz in einen eigenen Textabsatz. Wenn Du variable Abstände brauchst, kannst Du das später im Stylesheet mit margin machen.

Sieht alles richtig aus. Ansonsten kannst du die Datei ja durch den W3C-Validator jagen. :)
Wobei man nur immer darauf hinweisen muss, dass der Validator natürlich nur syntaktische Fehler finden kann, semantische kann nur ein Mensch finden.

xXxPeterPanxXx:
Naja, immernoch einfacher und schneller als mit margin.
Aber eben falsch! Und darum geht es ja! Darum, HTML richtig zu lernen.
<b> ist auch schneller und einfacher als <span style="font-weight:bold;">, aber es wäre auch falsch.

Aber ihm ging es ja sowieso erstmal nur um die Validität denke ich mal. :)
Nein, es ging ihm darum, alles richtig zu machen. Und bei HTML geht es in erster Linie um die Semantik.

Da muss ich sagen, hat es conTux tatsächlich besser verstanden als Du.

Also nochmal, bin begeistert conTux, dass es auch Leute gibt, die das - eigentlich auch ziemlich lechte Thema - auf Anhieb so richtig umsetzen können! Und das auch ohne "Lorem ipsum".

Liebe Grüße,
-Efchen
 
Und "Lorem ipsum" ist wohl kein Inhalt?
Doch natürlich, aber kein Inhalt, woran man erstmal eine lange Zeit dran schreiben muss, damit man endlich loslegen kann.

Aber eben falsch! Und darum geht es ja! Darum, HTML richtig zu lernen.
Mir ging es da wie gesagt nur um die Schnelligkeit. ;)

<b> ist auch schneller und einfacher als <span style="font-weight:bold;">, aber es wäre auch falsch.
Ich wüsste da den Sinn nicht, es noch extra im CSS zu definieren. <b> ist dafür da etwas fett dazustellen, <strong> um etwas zu bewichtigen in fett. Wäre nett, wenn das nochmal erklärt sein würde. ;)

Und bei HTML geht es in erster Linie um die Semantik.
Naja, das sieht jeder anders. Manche stellen die anfängliche Funktionalität zuerst im Vordergrund.

Da muss ich sagen, hat es conTux tatsächlich besser verstanden als Du.
Mag sein, aber wie gesagt bin ich von einem anderen Standpunkt ausgegangen(Mit dem Glauben, dass er die Funktionalität gesichert haben wollte, und nicht zuerst die Semantik) :)
 
Doch natürlich, aber kein Inhalt, woran man erstmal eine lange Zeit dran schreiben muss, damit man endlich loslegen kann.
Und den Inhalt zu schreiben und ihn mit HTML auszuzeichnen ist wohl nicht "loslegen"?

Mir ging es da wie gesagt nur um die Schnelligkeit.
Aber das ist Unfug.

Ich wüsste da den Sinn nicht, es noch extra im CSS zu definieren.
Wo denn sonst, wenn nicht im CSS? Nur CSS ist für die Darstellung da!

<b> ist dafür da etwas fett dazustellen
Falsch. <b> wird nicht verwendet, weil es physische Inhaltsauszeichnung ist, und man das nicht mit HTML macht.

<strong> um etwas zu bewichtigen in fett.
Auch falsch.
<strong> zeichnet etwas aus, was besonders wichtig ist, und ist damit noch stärker als <em>. Über die Anzeige im Browser sagt das Tag nichts aus, die wird allein durch CSS gemacht.
Und zu sagen, CSS würde das immer fett darstellen ist auch falsch, denn es gibt keine Vorgaben, wie ein Tag darzustellen ist. Nur Empfehlungen. Aber wenn man will, dass <strong> fett dargestellt wird, dann muss man es mit font-weight:bold angeben. Gibt man nichts an, sagt man damit, dass es einem egal ist.
Das ist so ähnlich wie mit der Hintergrundfarbe.

Wäre nett, wenn das nochmal erklärt sein würde.
Ich hoffe, ich konnte Dir nahelegen, wie HTML & CSS funktionieren.

Naja, das sieht jeder anders.
Bei HTML geht es definitiv nur um die Semantik. Das kann man anders sehen, das ist dann aber falsch.

Manche stellen die anfängliche Funktionalität zuerst im Vordergrund.
Bei HTML ist die Semantik die Funktionalität.

Mag sein, aber wie gesagt bin ich von einem anderen Standpunkt ausgegangen
Dann kannst Du kein HTML.
 
Und den Inhalt zu schreiben und ihn mit HTML auszuzeichnen ist wohl nicht "loslegen"?
Doch ist es, habe ich nie bestritten.

Auch falsch.
<strong> zeichnet etwas aus, was besonders wichtig ist
Sagte ich ja, du hast es nur wiederholt und in andere Worte gepackt.

Aber das ist Unfug.
Nur weil andere es anders machen als du, ist es noch lange nicht Unfug. Stimmt die Semantik am Schluss, ist ja alles okay.

Falsch. <b> wird nicht verwendet, weil es physische Inhaltsauszeichnung ist, und man das nicht mit HTML macht.
Wenn <b> nicht verwendet wird, warum existiert es dann? Genau wie mit <strong>. :neutral:
Und zu sagen, CSS würde das immer fett darstellen ist auch falsch
Habe ich das? :(

Bei HTML geht es definitiv nur um die Semantik. Das kann man anders sehen, das ist dann aber falsch.
Naja, da kann aber etwas nicht stimmen, ich denke die Autoren, die die HTML-Bücher schreiben, kennen sich ganz gut damit aus. Und bis jetzt habe ich es immer so gelesen. Auch dass man mit <strong> und <em> die Wichtigkeit von Text erhöht. Hast du ein Buchtipp, wo die perfekteste tollste 1337-Semantik ist? :I

Ich hoffe, ich konnte Dir nahelegen, wie HTML & CSS funktionieren.
Das schwierige bei mir ist ja, worauf ich mehr vertrauen soll, die 4-5 Bücher oder dir?

Dann kannst Du kein HTML.
Die Buchautoren wohl auch nicht, schade. Buch fail. oO. Mal ehrlich, ich denke es gibt verschiedene Wege HTML zu schreiben, es gibt nicht nur einen Weg, den man unbedingt einschlagen sollte.
 
Sagte ich ja, du hast es nur wiederholt und in andere Worte gepackt.
Nein, Du sagtest "<strong> um etwas zu bewichtigen in fett."
HTML hat aber nichts mit dem Aussehen zu tun, das "fett" ist also irrelevant (und zudem noch nicht sicher, wie ich ausgeführt habe), außerdem ist <strong> noch eine Steigerung von <em>, so wie Du es beschrieben hast, wäre das auf <em> zutreffender.

Nur weil andere es anders machen als du, ist es noch lange nicht Unfug. Stimmt die Semantik am Schluss, ist ja alles okay.
Okay, Unfug ist vielleicht etwas bewertend. Sinnfrei hört sich vielleicht besser an. Welchen Sinn macht es, falsche Tags zu verwenden, wenn man weiß, dass man sie hinterher doch wieder ändern muss? Obendrein verführt das zu ineffektivem Arbeiten. Klar, dass jedem selbst überlassen ist, wie er zum Ziel kommt, aber warum nicht anständiges Arbeiten lernen? Und das versuche ich obendrei zu vermitteln. Den Sinn darin, <b> zu verwenden, sehe ich nicht.

Wenn <b> nicht verwendet wird, warum existiert es dann? Genau wie mit <strong>.
Das kann ich Dir beantworten. <b> stammt aus einer Zeit, in der es kein CSS gab. Anstatt sich die Arbeit zu machen, eine Designsprache zu entwickeln, hat man Hacks in HTML eingebaut. Daraus sind Tags wie <b>, <i> oder <u>, sowie Tabellenlayouts entstanden. Sie sind aber nicht im Sinne von HTML und heute, wo man eine solche Sprache hat, nämlich CSS, sind sie nicht mehr nötig. Außerdem sind sie vom W3C als "deprecated", d.h. "nicht mehr unterstützt" gekennzeichnet.
<strong> hingegen ist nicht physische, sondern logische Inhaltsauszeichnung. Der Unterschied scheint Dir noch nicht ganz geläufig. Das Aussehen (= physisch) macht man nicht mit HTML. Mit HTML macht man nur logische Auszeichnung (= Semantik). <strong> ist logische Inhaltsauszeichnung und hat eine semantische Bedeutung. Damit ist <strong> etwas völlig anderes als <b>. Du scheinst Webseiten zu oberflächlich zu betrachten, zu glauben, dass nur das Aussehen relevant ist. Das ist beim Print-Design so, aber im WWW zählt auch das, was darunter liegt, z.B. für Vorlesebrowser oder Suchmaschinen.

Naja, da kann aber etwas nicht stimmen, ich denke die Autoren, die die HTML-Bücher schreiben, kennen sich ganz gut damit aus.
Eben das denke ich nicht. Es gibt solche, die nur das schnelle Geld im Blick haben und es gibt solche, die - wie die Mehrheit der Unaufgeklärten - noch nicht verstanden haben, worum es bei HTML wirklich geht. Das Ergebnis sind Bücher, die sich zwar leider vielleicht ganz gut verkaufen, aber als Ahnungsloser kann man natürlich nicht wissen, wann ein Buch wirklich gut und vor allem richtig ist.

Und bis jetzt habe ich es immer so gelesen. Auch dass man mit <strong> und <em> die Wichtigkeit von Text erhöht.
Das ist ja auch richtig so. Aber es hat nichts mit der Darstellung zu tun.

Hast du ein Buchtipp, wo die perfekteste tollste 1337-Semantik ist?
Nein.

Das schwierige bei mir ist ja, worauf ich mehr vertrauen soll, die 4-5 Bücher oder dir?
In diesem Falle: Mir.

Die Buchautoren wohl auch nicht, schade. Buch fail. oO. Mal ehrlich, ich denke es gibt verschiedene Wege HTML zu schreiben, es gibt nicht nur einen Weg, den man unbedingt einschlagen sollte.
Nein, das ist nicht richtig.

Überlege es halt mal aus Sicht einer Suchmaschine oder eines Vorlesebrowsers:

Woher sollen die wissen, wann eine Textpassage wichtig ist? Das erkennen sie nur anhand der vom W3C festgelegten Standards, in dem Fall an den beiden Tags <em> und <strong>. Woran erkennen diese Clients, dass ein Text eine Überschrift ist? Nur an den Tags <h1> bis <h6>. An nichts anderem. Daran dass ein Text groß und fett ist, erkennt ein Programm nicht, dass es eine Überschrift ist.

Wenn es viele Wege gäbe, HTML zu schreiben, dann könnten Vorlesebrowser und Suchmaschinen nicht funktionieren. Siehe auf "Semantik in logischen Sprachen" bei Wikipedia.
 
:oops::roll: Ach streitet Euch doch bitte nicht.... :D

Also nochmal, bin begeistert conTux, dass es auch Leute gibt, die das - eigentlich auch ziemlich lechte Thema - auf Anhieb so richtig umsetzen können!

Danke für das Lob !! ;-)

Nein, es ging ihm darum, alles richtig zu machen

Genau, denn wie ich ganz oben auch erwähnt habe... wollte ich nicht am Anfang schon Fehler machen!

Wieso ich aber jetzt dieses < /br> nicht nutzen darf.... da stellen sich so einige Fragen im Kopf auf... !! Ist es denn kein XHTML dieses br ??

Klar, ich kann ja auch alles in Absätze schreiben (<p>bla, bla , bla</p>) - dachte aber das man dieses auch mit dem br´s machen kann/darf/sollte ?!?

Viele liebe Grüße

conTux
 
Ach streitet Euch doch bitte nicht.
Ich streite mich nicht. Ich erkläre Silar nur, wie HTML funktioniert. Ich versuche nur zu helfen.

Danke für das Lob !!
Du hast es verdient. Und ich lobe selten.

Wieso ich aber jetzt dieses < /br> nicht nutzen darf.... da stellen sich so einige Fragen im Kopf auf... !! Ist es denn kein XHTML dieses br ??
Du hast doch schon verstanden (zumindest lässt das Dein Code vermuten), dass es bei HTML um die logische Bedeutung geht. <br> ist so ein schwammiges Tag. Es hat in Deinem Fall eigentlich keine logische Bedeutung, Du setzt es nur ein, um eine Leerzeile zwischen Deine Absätze zu bekommen. Sobald Du merkst, dass Du ein Tag einsetzt, um ein optisches Ergebnis zu erzeugen, weißt Du, dass das Tag an der Stelle falsch ist.
Wie ich im letzten Satz sagte: "zwischen Deine Absätze". Da steckt das Wort "Absätze" drin. Ausgezeichnet hast Du aber nur einen Absatz. Hier ist es einfach semantisch sinnvoller, das als mehrere Absätze auszuzeichnen.

<br> macht Sinn in Gedichten, wo der Zeilenumbruch auch eine Bedeutung hat, oder in Adressen.

Klar, ich kann ja auch alles in Absätze schreiben (<p>bla, bla , bla</p>) - dachte aber das man dieses auch mit dem br´s machen kann/darf/sollte ?!?
Du hast mehrere Absäte, also hast Du auch mehrere <p>.
 
Das kann ich Dir beantworten. <b> stammt aus einer Zeit, in der es kein CSS gab. Anstatt sich die Arbeit zu machen, eine Designsprache zu entwickeln, hat man Hacks in HTML eingebaut.
Ah, das erklärt einiges. Das war das Problem mit dem Verständnis die ganze Zeit. Das mit <h1> etc ist klar, da macht es ja kein Sinn etwas anderes zu nehmen(@Suchmaschinen). ;)

Dann wäre das geklärt, Danke. ;)
 
Zurück
Oben