Franz: Umstellung auf HTML5

  1. Meine alten Dokumente werden noch mit "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">" eingeleitet. Macht es Sinn alle auf "HTML5" zu ändern oder kann es noch Probleme mit Browsern geben?

  2. Alle Umlaute wurden noch mit "&uuml;" angeführt. Nun gibt es die Möglichkeit "<meta charset="utf-8" />" einzufügen. Soll man ebenfalls dies ändern und verstehen alle Browser das? Die Lesbarkeit des Dokumentes würde sich bei einer Änderungen wesentlich erleichtern.

  3. In meinem Dokument wird ein Abschnitt mit "<hr align="left"></hr>" abgeschlossen. Das gehört natürlich zu HTML. Wie würde man das mit CSS gestalten? Ich habe eine Seite mit Rezepten das mit einem Sprung zum Rezept und wieder Seitenanfang geht und das Rezept eben mit dieser Linie abschließt.

<a name="anfang"></a> <tr align="center" > <td><a href="#Allgemein">Allgemein</a></td>

<h1><a name="Allgemein">Allgemein</a></h1> <a href="#anfang">Seitenanfang</a><br> <hr align="left"></hr>

Eine Überlegung wäre das Rezept in "div" zu stellen und mit border-bottom die Linie zu ziehen (div { border-bottom: 2px solid grey; }); Allerdings müßte jedes einzelne Rezept "div" erhalten. Wie müßte der Code in CSS aussehen um gleich aussehen wie "hr"?

  1. Macht es Sinn Ein Aufklappt-Menü zu gestalten, wie zum Beispiel Rind Rezept 1 Rezept 2 ...

Bei mehreren Rezepten würde es allerdings riesig lange.

LG Franz

P.S.: Ein Photo rein zu stellen habe ich noch immer nicht geschafft.

  1. Hallo und guten Tag,

    ich gebe mal meinen Senf (Bauchgefühl) dazu, obwohl Gunnar hier bestimmt der kompetente Ansprechpartner wäre.

    1. Meine alten Dokumente werden noch mit "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">" eingeleitet. Macht es Sinn alle auf "HTML5" zu ändern oder kann es noch Probleme mit Browsern geben?

    Ja, aber die sind überschaubar. Ich wollte es auch erst nicht glauben. Aber die meisten Browser machen in ihren letzten 3 bis 30 Versionen *gg* mit der HTML5-Document-Spezifikation inzwischen weniger Probleme, als sie es mit HTML 4.x gemacht haben.

    1. Alle Umlaute wurden noch mit "&uuml;" angeführt. Nun gibt es die Möglichkeit "<meta charset="utf-8" />" einzufügen. Soll man ebenfalls dies ändern und verstehen alle Browser das? Die Lesbarkeit des Dokumentes würde sich bei einer Änderungen wesentlich erleichtern.

    Die konnte man schon zu HTML 4.x-Zeiten bedenkenlos austauschen, wenn man die Kodierung angegeben hat.

    1. In meinem Dokument wird ein Abschnitt mit "<hr align="left"></hr>" abgeschlossen. Das gehört natürlich zu HTML. Wie würde man das mit CSS gestalten? Ich habe eine Seite mit Rezepten das mit einem Sprung zum Rezept und wieder Seitenanfang geht und das Rezept eben mit dieser Linie abschließt.

    Hier will ich mal Gunnar rausreizen: Ich bin der Meinung, dass sowohl <br>, als auch <hr> in die Abteilung Vorgestern gehören, zumindest, seit auch der FF endlich die CSS-Angaben zu Wordwrap ordentlich respekiert :-P

    Bei <hr> hatr sich Gunnar hier neulich noch anders ausgelassen. Ich habe versäumt, ihn dazu näher zu befragen, was hiermit nachgeholt werden soll :-P

    [2bc]

    Grüße
    TS

    1. @@TS

      Hier will ich mal Gunnar rausreizen: Ich bin der Meinung, dass sowohl <br>, als auch <hr> in die Abteilung Vorgestern gehören, zumindest, seit auch der FF endlich die CSS-Angaben zu Wordwrap ordentlich respekiert :-P

      br nicht so ganz, weil es kein Element für „Zeile“ gibt.

      hr auch nicht, denn das hat eine (geänderte) Bedeutung.

      Bei <hr> hatr sich Gunnar hier neulich noch anders ausgelassen.

      Du meinst hier neulich?

      Ich habe versäumt, ihn dazu näher zu befragen, was hiermit nachgeholt werden soll :-P

      Welche nähere Frage hast du denn? Gern auch im dortigen Thread.

      LLAP 🖖

      --
      Ist diese Antwort anstößig? Dann könnte sie nützlich sein.
      1. @@TS

        Ich bin der Meinung, dass sowohl <br>, als auch <hr> in die Abteilung Vorgestern gehören, ...

        br nicht so ganz, weil es kein Element für „Zeile“ gibt.

        hr auch nicht, denn das hat eine (geänderte) Bedeutung.

        hr ist aber Teil von HTML5 (hr fügt eine Trennlinie ein und erzeugt dabei einen eigenen Absatz für das nächste Rezept). Genau das wollte ich bezwecken.

        br ebenfalls, das einen Zeilenumbruch erzeugt. Es gibt zwar <p> für eigene Absätze das für Abstände sorgt, aber dann müßte es in einem einzigen Rezept mehrere p geben. Wird damit der Text im Dokument nicht etwas verunstaltet?

        LG Franz

        1. Hallo und guten Nachmittag Franz,

          Ich bin der Meinung, dass sowohl <br>, als auch <hr> in die Abteilung Vorgestern gehören, ...

          br nicht so ganz, weil es kein Element für „Zeile“ gibt.

          hr auch nicht, denn das hat eine (geänderte) Bedeutung.

          hr ist aber Teil von HTML5 (hr fügt eine Trennlinie ein und erzeugt dabei einen eigenen Absatz für das nächste Rezept). Genau das wollte ich bezwecken.

          br ebenfalls, das einen Zeilenumbruch erzeugt. Es gibt zwar <p> für eigene Absätze das für Abstände sorgt, aber dann müßte es in einem einzigen Rezept mehrere p geben. Wird damit der Text im Dokument nicht etwas verunstaltet?

          Die Frage hinter meinem Kommentar hier war eher nicht, was es bei HTML5 noch oder schon alles gibt, sondern ob das auch noch sinnvoll ist unter Berücksichtigung der Betrachtung von z. B. <br>. Da sit doch <hr> auch nicht weit entfernt von der Diskussion um die Sinnhaftigkeit des Elementes.

          Grüße
          TS

  2. Hi,

    1. Meine alten Dokumente werden noch mit "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">" eingeleitet. Macht es Sinn alle auf "HTML5" zu ändern oder kann es noch Probleme mit Browsern geben?

    alle heutzutage relevanten Browser können AFAIK mit HTML 5 umgehen, so gesehen steht der Umstellung eigentlich nichts im Weg. Nur das Label (sprich: Die DOCTYPE-Deklaration) zu ändern, ergibt aber wenig Sinn, denn HTML 4, vor allem in der Transitional-Variante, ist nicht automatisch semantisch sinnvolles HTML 5. Umstellen würde ich an deiner Stelle nur, wenn du sowieso Seiten überarbeitest oder den ganzen Webauftritt neu machst.

    1. Alle Umlaute wurden noch mit "&uuml;" angeführt. Nun gibt es die Möglichkeit "<meta charset="utf-8" />" einzufügen. Soll man ebenfalls dies ändern und verstehen alle Browser das? Die Lesbarkeit des Dokumentes würde sich bei einer Änderungen wesentlich erleichtern.

    Ja, aber das eine hat mit dem anderen nur entfernt zu tun. Wenn man Zeichen außerhalb des ASCII-Bereichs als Entity-Referenzen angibt, ist das zunächst mal unabhängig von der verwendeten Zeichencodierung. Wenn man allerdings eine Zeichencodierung verwendet, die Umlaute und andere Nicht-ASCII-Zeichen direkt darstellen kann (so wie UTF-8), dann bietet es sich an, diese Zeichen auch tatsächlich als Klartext hinzuschreiben.

    1. In meinem Dokument wird ein Abschnitt mit "<hr align="left"></hr>" abgeschlossen.

    Das ist ein Fehler, denn hr ist per Definition ein leeres Element und wird daher in klassischem HTML ohne End-Tag geschrieben, in XHTML mit der Kurzschreibweise <hr ... />.

    
    > <a name="anfang"></a>
    >   <tr align="center" >
    >      <td><a href="#Allgemein">Allgemein</a></td>
    > 
    > <h1><a name="Allgemein">Allgemein</a></h1>
    >      <a href="#anfang">Seitenanfang</a><br>
    >      <hr align="left"></hr>
    
    

    Auch das ist anscheinend ungültiges HTML. Das Auftreten von <tr> lässt darauf schließen, dass dieser Abschnitt in einer Tabelle steht. Allerdings dürfen weder a, noch h1, noch hr Kinder (direkte Nachfahren) von table oder tr sein.

    Eine Überlegung wäre das Rezept in "div" zu stellen und mit border-bottom die Linie zu ziehen (div { border-bottom: 2px solid grey; }); Allerdings müßte jedes einzelne Rezept "div" erhalten.

    Richtig. Und wenn du sowieso auf HTML 5 umstellen möchtest, wäre anstatt dem neutralen div eventuell ein section- oder article-Element sinnvoll. Vermutlich bekommen diese Elemente dann die Klasse "recipe" oder so ähnlich, und man kann sie mit CSS leicht selektieren.

    Wie müßte der Code in CSS aussehen um gleich aussehen wie "hr"?

    Schwierige Frage, weil auch hr von Browser zu Browser unterschiedlich aussieht.

    P.S.: Ein Photo rein zu stellen habe ich noch immer nicht geschafft.

    Dabei ist es so einfach: Per Drag&Drop ein Bild auf das graue Feld unterhalb des Posting-Textes ziehen, wo doch schon steht "Bilder hierher ziehen oder klicken, um sie hochzuladen."

    So long,
     Martin

    1. Hi,

      1. Meine alten Dokumente werden noch mit "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">" eingeleitet. Macht es Sinn alle auf "HTML5" zu ändern oder kann es noch Probleme mit Browsern geben?

      Umstellen würde ich an deiner Stelle nur, wenn du sowieso Seiten überarbeitest oder den ganzen Webauftritt neu machst.

      Das habe ich eben vor und daher meine Fragen. Da ich mich noch in HTML5 und CSS3 einarbeite bin ich mir eben nicht sicher.

      1. In meinem Dokument wird ein Abschnitt mit "<hr align="left"></hr>" abgeschlossen.

      Das ist ein Fehler, denn hr ist per Definition ein leeres Element und wird daher in klassischem HTML ohne End-Tag geschrieben, in XHTML mit der Kurzschreibweise <hr ... />.

      Da ich die Dokumente vor längerer Zeit erstellte gehe ich davon aus, daß man früher mit End-Tag geschrieben hat. Da ich aber beabsichtige alle Dokumente auf HTML5 umzustellen werden in der Folge auch die Tags konform gemacht.

      > <a name="anfang"></a>
      >   <tr align="center" >
      >      <td><a href="#Allgemein">Allgemein</a></td>
      > 
      > <h1><a name="Allgemein">Allgemein</a></h1>
      >      <a href="#anfang">Seitenanfang</a><br>
      >      <hr align="left"></hr>
      

      Auch das ist anscheinend ungültiges HTML. Das Auftreten von <tr> lässt darauf schließen, dass dieser Abschnitt in einer Tabelle steht. Allerdings dürfen weder a, noch h1, noch hr Kinder (direkte Nachfahren) von table oder tr sein.

      Das ist nur ein Ausschnitt. Wollte nur zeigen wie ich eben von der Auswahl zum Rezept springe und von dort zum Anfang zurück. Die Rezepte werden mit hr optisch getrennt.

      Eine Überlegung wäre das Rezept in "div" zu stellen und mit border-bottom die Linie zu ziehen (div { border-bottom: 2px solid grey; }); Allerdings müßte jedes einzelne Rezept "div" erhalten.

      Richtig. Und wenn du sowieso auf HTML 5 umstellen möchtest, wäre anstatt dem neutralen div eventuell ein section- oder article-Element sinnvoll. Vermutlich bekommen diese Elemente dann die Klasse "recipe" oder so ähnlich, und man kann sie mit CSS leicht selektieren.

      Ein Rezept enthält:

      Rezeptnamen (evtl. Zubereitungszeit) <br> Zutaten: <br> Zubereitung: <br> eventuell Zusatztext.

      Muß mir aber noch überlegen wie ich das gemeinsam mit HTML% und CSS gestalte, damit es etwas gleichsieht.

      Wie müßte der Code in CSS aussehen um gleich aussehen wie "hr"?

      Schwierige Frage, weil auch hr von Browser zu Browser unterschiedlich aussieht.

      Wenn das so ist ist es dann sowieso vernünftiger den Schlussstrich mit CSS zu gestalten; am Ende des Containers border-bottom zu schreiben. Somit fällt das hr weg und kommt in CSS nur mehr einmal vor.

      P.S.: Ein Photo rein zu stellen habe ich noch immer nicht geschafft.

      Dabei ist es so einfach: Per Drag&Drop ein Bild auf das graue Feld unterhalb des Posting-Textes ziehen, wo doch schon steht "Bilder hierher ziehen oder klicken, um sie hochzuladen."

      Beides habe ich schon ein paar mal probiert aber außer einem drehenden Punkt tut sich nichts.

      LG Franz

      P.S.: Wie erzeugt man hier im Forum einen Zeilenumbruch?

      1. Hallo und guten Abend,

        1. Meine alten Dokumente werden noch mit "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">" eingeleitet. Macht es Sinn alle auf "HTML5" zu ändern oder kann es noch Probleme mit Browsern geben?

        Umstellen würde ich an deiner Stelle nur, wenn du sowieso Seiten überarbeitest oder den ganzen Webauftritt neu machst.

        Das habe ich eben vor und daher meine Fragen. Da ich mich noch in HTML5 und CSS3 einarbeite bin ich mir eben nicht sicher.

        Ich wäre da an deiner Stelle ganz frech:

        DocType ändern. Charset richtig setzen, usw. Dann die Dokumente durch den NuValidator https://validator.w3.org/nu/ jagen und gucken, was angemeckert wird.

        Dann handeln und nochmal testen lassen.

        Da bleibt weniger Handlungsbedarf, als man es vorab vermutet. :-)

        Grüße
        TS

        1. Hallo TS,

          DocType ändern. Charset richtig setzen, usw.

          Da bleibt weniger Handlungsbedarf, als man es vorab vermutet. :-)

          Mit dem Ändern der Charset-Angabe ist aber nicht getan. Nur weil du auf eine Wasserflasche ein Etikett mit ‚Rotwein‘ klebst, ist da noch lange kein Rotwein drin. Es müssen also alle Dokumente auch als UTF-8 (ohne BOM) abgespeichert werden. Und das kann ziemlich aufwändig sein. Zumal es nur Sinn ergibt, wenn man auch &uuml; durch ü ersetzt. Es spricht nichts dagegen, Dokumente die in einer Nicht-UTF-Codierung gespeichert sind, so zu lassen, falls die Darstellung funktioniert.

          Bis demnächst
          Matthias

          --
          Signaturen sind bloed (Steel) und Markdown ist mächtig.
          1. Hallo und guten Abend,

            DocType ändern. , usw. Da bleibt weniger Handlungsbedarf, als man es vorab vermutet. :-)

            Mit dem Ändern der Charset-Angabe ist aber nicht getan. Nur weil du auf eine Wasserflasche ein Etikett mit ‚Rotwein‘ klebst, ist da noch lange kein Rotwein drin. Es müssen also alle Dokumente auch als UTF-8 (ohne BOM) abgespeichert werden. Und das kann ziemlich aufwändig sein. Zumal es nur Sinn ergibt, wenn man auch &uuml; durch ü ersetzt. Es spricht nichts dagegen, Dokumente die in einer Nicht-UTF-Codierung gespeichert sind, so zu lassen, falls die Darstellung funktioniert.

            Ich habe nichts anderes behauptet!

            "Charset richtig setzen" sagt doch wohl aus, dass es auch zum Charset des Dokumentes passen muss, denn sonst wäre es schließlich nicht richtig!

            Ich mag deine Art der Besserwisserei nicht, um mal das Thema von neulich wieder aufzugreifen.

            Grüße
            TS

            1. Hallo TS,

              DocType ändern. , usw. Da bleibt weniger Handlungsbedarf, als man es vorab vermutet. :-)

              Mit dem Ändern der Charset-Angabe ist aber nicht getan. […]

              Ich habe nichts anderes behauptet!

              "Charset richtig setzen" sagt doch wohl aus, dass es auch zum Charset des Dokumentes passen muss, denn sonst wäre es schließlich nicht richtig!

              Das mag für dich selbstverständlich sein, meine Antwort ist aber hauptsächlich für den OP (und alle anderen, die als blutige Anfänger ein ähnliches Problem haben) gedacht.

              Ich mag deine Art der Besserwisserei nicht, um mal das Thema von neulich wieder aufzugreifen.

              Es liegt mir fern, dich zu kritisieren. Sieh es als Ergänzung im Interesse des Fragestellers.

              Bis demnächst
              Matthias

              --
              Signaturen sind bloed (Steel) und Markdown ist mächtig.
          2. @@Matthias Apsel

            Es müssen also alle Dokumente auch als UTF-8 (ohne BOM) abgespeichert werden.

            Warum ohne BOM?

            Das wäre wichtig für eingebundene Snippets, da das BOM nur einmal am Anfang der generierten Ressource vorkommen darf. Bei statischen HTML-Dateien sollte das BOM keine Probleme verursachen[^1], sondern im Gegenteil die Zeichencodierung als UTF-8 angeben[^2].

            LLAP 🖖

            --
            Ist diese Antwort anstößig? Dann könnte sie nützlich sein. [^1]: Browser, die damit Probleme hatten, sollten inzwischen ausgestorben sein. [^2]: Was ist mit dem BOM?
            1. Hallo Gunnar Bittersmann,

              Es müssen also alle Dokumente auch als UTF-8 (ohne BOM) abgespeichert werden.

              Warum ohne BOM?

              Das wäre wichtig für eingebundene Snippets, da das BOM nur einmal am Anfang der generierten Ressource vorkommen darf.

              eben.

              Wenn man aufpassen muss, welche Datei mit und welche ohne BOM angegeben gespeichert werden muss, kann man am besten alle ohne BOM speichern.

              Bis demnächst
              Matthias

              --
              Signaturen sind bloed (Steel) und Markdown ist mächtig.
        2. Ich wäre da an deiner Stelle ganz frech:

          Habe ich gemacht und es läuft alles wie bisher. Mit finden und Ersetzen geht alles flott. Lediglich der Umbau auf CSS3 macht einige Arbeit; noch dazu wenn die Routine und die Erfahrung fehlt.

          LG Franz

      2. Hallo Franz,

        P.S.: Wie erzeugt man hier im Forum einen Zeilenumbruch?

        Oberhalb des Antwortfeldes steht „Dieses Forum nutzt Markdown zur Formatierung der Postings. Formatierungs-Hilfe“ Formatierungs-Hilfe ist ein Link, der dich zu einer Wiki-Seite führt, die deine Fragen beantworten sollte.

        Bis demnächst
        Matthias

        --
        Signaturen sind bloed (Steel) und Markdown ist mächtig.
      3. @@Franz

        Ein Rezept enthält:

        Rezeptnamen (evtl. Zubereitungszeit) <br> Zutaten: <br> Zubereitung: <br> eventuell Zusatztext.

        Schema.org könnte was für dich sein.

        Und mein Klingonischkurs dazu. (Video, Folien)

        LLAP 🖖

        --
        Ist diese Antwort anstößig? Dann könnte sie nützlich sein.
        1. @@Franz

          Ein Rezept enthält:

          Rezeptnamen
          (evtl. Zubereitungszeit)

          Zutaten:

          Zubereitung:

          eventuell Zusatztext.

          Um die Zwischenräume wie oben gezeigt zu erhalten, müßte ich jedes einzelne in <p> einschließen?

          Text wird mit "text-align: justify;" zu einem Blocksatz. Wie kann man festlegen wie breit ein Blocksatz sein soll?

          List-Elemente können mit "list-style: none;" als einfacher Text dargestellt werden. Wie stelle ich es an, daß zwar mit ol eine Nummerierung erfolgt, aber nicht unterstrichen ist?

          Der Rezeptname wird mit h? geschrieben was einen Absatz erzeugt. Nun schreibt man oft darunter einen Zusatztext wie (für 3 Personen). Nun soll der Zusatztext direkt unter den Rezeptnamen stehen das aber nicht möglich ist, weil bei "h1" beispielsweise die zwei Zeilen zu weit auseinander stehen. Wie organisiere ich das, daß der Zusatztext direkt darunter steht?

          LG Franz

          1. Hallo,

            wenn du schon Rezepte veröffentlichst, dann antworte ich auch mal im Kochrezept-Stil. ;-)

            Ein Rezept enthält:

            Rezeptnamen
            (evtl. Zubereitungszeit)

            Zutaten:

            Zubereitung:

            eventuell Zusatztext.

            Um die Zwischenräume wie oben gezeigt zu erhalten, müßte ich jedes einzelne in <p> einschließen?

            Ja, das wäre meines Erachtens sinnvoll. Und das gesamte Rezept mit einem gruppierenden Element wie article oder section, zur Not auch div, zusammenfassen.

            Text wird mit "text-align: justify;" zu einem Blocksatz. Wie kann man festlegen wie breit ein Blocksatz sein soll?

            Über die Breite des p-Elements, wer hätte es gedacht? Und die ergibt sich aus der Breite seines Elternelements und eventuell geltender margins und paddings. Von der harten Tour, die Breite des p-Elements mit width explizit festzulegen, würde ich aber abraten.

            List-Elemente können mit "list-style: none;" als einfacher Text dargestellt werden. Wie stelle ich es an, daß zwar mit ol eine Nummerierung erfolgt, aber nicht unterstrichen ist?

            Gegenfrage: Was tust du, dass die Numerierung unterstrichen ist? Üblicherweise ist sie das nicht.

            Der Rezeptname wird mit h? geschrieben was einen Absatz erzeugt. Nun schreibt man oft darunter einen Zusatztext wie (für 3 Personen). Nun soll der Zusatztext direkt unter den Rezeptnamen stehen das aber nicht möglich ist, weil bei "h1" beispielsweise die zwei Zeilen zu weit auseinander stehen. Wie organisiere ich das, daß der Zusatztext direkt darunter steht?

            Spiele mit den margins der Überschrift (vor allem deren margin-bottom) und des Folgeabsatzes mit der Rezeptinfo (hier logischerweise margin-top). Auf 0 setzen würde ich den Abstand vermutlich nicht, aber sehr klein machen.

            So long,
             Martin

            1. Hallo,

              wenn du schon Rezepte veröffentlichst, dann antworte ich auch mal im Kochrezept-Stil. ;-)

              Ein Rezept enthält:

              Rezeptnamen
              (evtl. Zubereitungszeit)

              Zutaten:

              Zubereitung:

              eventuell Zusatztext.

              Um die Zwischenräume wie oben gezeigt zu erhalten, müßte ich jedes einzelne in <p> einschließen?

              Ja, das wäre meines Erachtens sinnvoll. Und das gesamte Rezept mit einem gruppierenden Element wie article oder section, zur Not auch div, zusammenfassen.

              Ja, das hätte ich auch geschafft.

              Über die Breite des p-Elements, wer hätte es gedacht? Und die ergibt sich aus der Breite seines Elternelements und eventuell geltender margins und paddings. Von der harten Tour, die Breite des p-Elements mit width explizit festzulegen, würde ich aber abraten.

              Auch das ist erledigt. Hatte etwas gedauert weil es halt bei Anfängern doch etwas happert mit dem Berechnen vom Elternelement.

              List-Elemente können mit "list-style: none;" als einfacher Text dargestellt werden. Wie stelle ich es an, daß zwar mit ol eine Nummerierung erfolgt, aber nicht unterstrichen ist?

              Gegenfrage: Was tust du, dass die Numerierung unterstrichen ist? Üblicherweise ist sie das nicht.

              Ich machte zwei Spalten. In der Einen ist die Liste der Rezepte mit denen man zu den Rezepten springt und rechts erscheinen die Rezepturen. Daher die Unterstreichung.

              Der Rezeptname wird mit h? geschrieben was einen Absatz erzeugt. Nun schreibt man oft darunter einen Zusatztext wie (für 3 Personen). Nun soll der Zusatztext direkt unter den Rezeptnamen stehen das aber nicht möglich ist, weil bei "h1" beispielsweise die zwei Zeilen zu weit auseinander stehen. Wie organisiere ich das, daß der Zusatztext direkt darunter steht?

              Spiele mit den margins der Überschrift (vor allem deren margin-bottom) und des Folgeabsatzes mit der Rezeptinfo (hier logischerweise margin-top). Auf 0 setzen würde ich den Abstand vermutlich nicht, aber sehr klein machen.

              Da muß ich mich noch etwas einspielen.

              Wie oben erwähnt habe ich zwei Spalten. Wie zentrier ich die mit CSS3. Bei einer Spalte habe ich eine Erklärung gefunden nämlich:
              margin-left: auto;
              margin-right: auto;

              Weiters habe ich ein wenig probiert nav zu fixieren. Allerdings müßte dann auch die Überschrift fixiert werden. Ist das möglich? Leider kommt dann die ganze Überschrift in Unordnung.

              LG Franz

  3. @@Franz

    1. Meine alten Dokumente werden noch mit "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">" eingeleitet. Macht es Sinn alle auf "HTML5" zu ändern oder kann es noch Probleme mit Browsern geben?

    Ja, das kann es. Aber aus einem anderen Grund als du vielleicht denkst.

    Zum Parsen von HTML-Code ist es Browsern völlig egal, ob da ein HTML-3-, -4- oder -5-DOCTYPE oder gar keiner angegeben ist.

    Das HTML5 bewusst abwärtskompatibel entworfen wurde, ist es auch in den allermeisten Fällen formal richtig, HTML-4-Dokumente als HTML5 auszuweisen (auch wenn keine der neuen Elemente/Attribute darin verwendet werden).

    Es ist aber nicht sinnvoll, bei der Neu- oder Weiterentwicklung auf die neuen HTML5-Elemente/Attribute zu verzichten. Die Verwendung der neuen Elemente/Attribute unter altem HTML-4-DOCTYPE wäre aber formal nicht korrekt. (Ein Browser wird das Dokument aber dennoch richtig parsen.)

    Der Verwendung von <!DOCTYPE html> steht also nichts im Wege.

    Aber: Zum Rendern der Seite ist Browsern die DOCTYPE-Angabe nicht egal. Sie wird als Umschalter zwwischen verschiedenen Darstellungsmodi missbraucht.

    Der von dir bislang verwendete HTML-4-DOCTYPE ohne system identifier (URI) schickt Browser in den Quirks-Modus; <!DOCTYPE html> jedoch in den Standard-Modus. (Déjà-vu) Es könnten also Darstellungsunterschiede auftreten.

    Generell dürfte es ratsam sein, die Browser in den Standard-Modus zu schicken und ggfs. das Stylesheet dahingehend anzupassen. Wenn du das gerade nicht schaffen solltest, aber die neuen HTML5-Elemente/Attribute verwenden willst, kannst du die DOCTYPE-Angabe auch ganz weglassen (dann auch Quirks-Modus).

    1. Alle Umlaute wurden noch mit "&uuml;" angeführt. Nun gibt es die Möglichkeit "<meta charset="utf-8" />" einzufügen.

    Du meinst: Es gibt die Möglichkeit, die tatsächlich verwendete Zeichencodierung anzugeben. (Und ja, das sollte UTF-8 sein.) Die Möglichkeit gab es in HTML 4 auch, nur halt nicht mit charset-Attribut.

    Und das Escapen von Umlauten ist auch in ISO 8859-1 o.ä. Codierungen nicht erforderlich gewesen.

    Soll man ebenfalls dies ändern

    Ob sich das bei bestehenden Dokumenten lohnt zu ändern? Bei neu erstellten auf jeden Fall Umlaute nicht verst&uuml;mmeln.

    und verstehen alle Browser das?

    Alle relevanten Browser.

    Die Lesbarkeit des Dokumentes würde sich bei einer Änderungen wesentlich erleichtern.

    So ist es.

    1. In meinem Dokument wird ein Abschnitt mit "<hr align="left"></hr>" abgeschlossen.

    Fehler: hr ist ein leeres Element und hat darum kein End-Tag. </hr> ist falsch.

    Wie würde man das mit CSS gestalten? […] eben mit dieser Linie abschließt.

    Im einfachsten Fall mit border-bottom.

    <a name="anfang"></a>

    Das wäre kein gültiges HTML5; a-Elemente dürfen keine name-Attribute mehr haben. Für Sprungmarken verwendest du eine ID an einem passenden Element …

    <h1><a name="Allgemein">Allgemein</a></h1>

    … hier bspw. <h1 id="Allgemein">Allgemein</h1>

     <a href="#anfang">Seitenanfang</a><br>
    

    Zum Sprung an den Seitenanfang eignet sich auch <a href="#">

    1. Macht es Sinn Ein Aufklappt-Menü zu gestalten, wie zum Beispiel

    Ganz klares Njein.

    Bei mehreren Rezepten würde es allerdings riesig lange.

    Warum nicht für jedes Rezept eine eigene Seite?

    LLAP 🖖

    --
    Ist diese Antwort anstößig? Dann könnte sie nützlich sein.
    1. @@Franz

      1. Alle Umlaute wurden noch mit "&uuml;" angeführt. Nun gibt es die Möglichkeit "<meta charset="utf-8" />" einzufügen.

      Ob sich das bei bestehenden Dokumenten lohnt zu ändern? Bei neu erstellten auf jeden Fall Umlaute nicht verst&uuml;mmeln.

      Bei einem Editor mit Suchen- Ersetzen-Funktion ist das kein zu großer Aufwand. Außerdem wird das Dokument etwas kürzer.

      <a name="anfang"></a>

      Das wäre kein gültiges HTML5; a-Elemente dürfen keine name-Attribute mehr haben. Für Sprungmarken verwendest du eine ID an einem passenden Element …

      <h1><a name="Allgemein">Allgemein</a></h1>

      … hier bspw. <h1 id="Allgemein">Allgemein</h1>

       <a href="#anfang">Seitenanfang</a><br>
      

      Zum Sprung an den Seitenanfang eignet sich auch <a href="#">

      Werde ich ausprobieren. Allerdings trotz Änderung des Doctype auf HTML5 funktioniert es weiterhin. "id" finde ich in den Referenzen lediglich als Selektor der aber anders behandelt wird. Da steht mir einiges an Änderungen bevor.

      Bei mehreren Rezepten würde es allerdings riesig lange.

      Warum nicht für jedes Rezept eine eigene Seite?

      Nun, derzeit ist es so konzipiert, daß die Auswahl (Tabelle) unterteilt ist in Fisch, Rind, Wild, etc. Von hier springe ich beispielsweise zu den Rezepten mit Rindfleisch. Von hier gibt es alle Rezepte mit Rindfleisch aufgelistet. Allerdings habe ich schon überlegt die einzelnen Fleischarten in eigene Dokumente aufzuteilen. Von hier müßte ich wieder zur Ursprungsliste zurückspringen.

      LG Franz

      1. Hallo und guten Morgen,

        Das wäre kein gültiges HTML5; a-Elemente dürfen keine name-Attribute mehr haben. Für Sprungmarken verwendest du eine ID an einem passenden Element …

        *Hoppla*

        Wieder 'was gelernt. Derartige Änderungen sollten auf jeden Fall eine eigene Seite im Wiki bekommen und in den Beschreibungen der Elemente dann einen auffälligen Verweis auf die Änderung.

        Wer könnte denn sowas? Oder gibts so ein "Change-Log" HTML 4 -> HTML 5 schon im SelfWiki?

        Grüße
        TS

        1. Das wäre kein gültiges HTML5; a-Elemente dürfen keine name-Attribute mehr haben. Für Sprungmarken verwendest du eine ID an einem passenden Element …

          Wieder 'was gelernt. Derartige Änderungen sollten auf jeden Fall eine eigene Seite im Wiki bekommen

          .. und in den Beschreibungen der Elemente dann einen auffälligen Verweis auf die Änderung.

          Das könnte auf dieser Seite noch optimiert werden. Vor lauter Attributen findet man die Unterseiten (Siehe auch:) fast gar nicht.

          Wer könnte denn sowas? Oder gibts so ein "Change-Log" HTML 4 -> HTML 5 schon im SelfWiki?

          Im Wiki darf jeder mitschreiben!

          Am besten würde so ein Change-Log auf den Fehlermeldungen des Validators basieren.

          Herzliche Grüße Matthias Scharwies

          1. hier ist der Wiki-Artikel, der aber noch ausgebaut werden muss:

            http://wiki.selfhtml.org/wiki/HTML/HTML5

            Herzliche Grüße Matthias Scharwies

            PS: Weitere Vorschläge, oder sogar eigene Beiträge erbeten!

    2. @@Franz

      <a name="anfang"></a>

      Das wäre kein gültiges HTML5; a-Elemente dürfen keine name-Attribute mehr haben. Für Sprungmarken verwendest du eine ID an einem passenden Element …

      <h1><a name="Allgemein">Allgemein</a></h1>

      … hier bspw. <h1 id="Allgemein">Allgemein</h1>

       <a href="#anfang">Seitenanfang</a><br>
      

      Zum Sprung an den Seitenanfang eignet sich auch <a href="#">

      Habe meine Sprungziele entsprechend angepaßt. Meine Seite nimmt langsam Gestalt an.

      Zum obigen Thema habe ich folgenden Beitrag gefunden der diese Schreibweise noch praktiziert. Was ist nun richtig?

      http://wiki.selfhtml.org/wiki/CSS/Selektoren/Pseudoklasse/target

      1. Liebe Mitdenker, liebe Wissende, liebe Neugierige,

        @@Franz

        <a name="anfang"></a>

        Das wäre kein gültiges HTML5; a-Elemente dürfen keine name-Attribute mehr haben. Für Sprungmarken verwendest du eine ID an einem passenden Element …

        <h1><a name="Allgemein">Allgemein</a></h1>

        … hier bspw. <h1 id="Allgemein">Allgemein</h1>

         <a href="#anfang">Seitenanfang</a><br>
        

        Zum Sprung an den Seitenanfang eignet sich auch <a href="#">

        Habe meine Sprungziele entsprechend angepaßt. Meine Seite nimmt langsam Gestalt an.

        Zum obigen Thema habe ich folgenden Beitrag gefunden der diese Schreibweise noch praktiziert. Was ist nun richtig?

        http://wiki.selfhtml.org/wiki/CSS/Selektoren/Pseudoklasse/target

        Das Beispiel funktioniert zwar noch auf meinem Tablet, aber es sollte wohl überarbeitet werden.

        In der Spezifikation ist es nicht mehr enthalten
        http://www.w3.org/TR/html5/text-level-semantics.html#the-a-element

        Spirituelle Grüße
        Euer Robert
        robert.r@online.de

        --
        Möge der wahre Forumsgeist ewig leben!
        1. vielen Dank für eure Rückmeldung, das Beispiel ist geändert!

          http://wiki.selfhtml.org/wiki/CSS/Selektoren/Pseudoklasse/target

          Matthias Scharwies