Wiki: Grundgerüst und Metaangaben

[Matthias Scharwies]

Guten Morgen,

ich hatte hier ja schon mal angedacht, Rolfs Liste der Meta-Angaben in's Wiki zu ziehen.

Erst hatte ich überlegt, ob es in der Referenz beim name-Attribut schon etwas zu den verschiedenen Werten gäbe.

HTML/Tutorials/Grundgerüst

Dieses Tutorial ist ja Bestandteile des Theorie-Reihe, die die Grundlagen und Regeln von HTML vorstellt.

Das Grundgerüst war nach der Syntax das zweite Kapitel und sollte ursprünglich eben die Kopiervorlage des minimalen Grundgerüsts erklären.

Im Abschnitt über den body leitet eine Fortsetzungsvorlage auf das Seitenstrukturierungs-Kapitel weiter.

Danach kommt:

Metaangaben im Detail

Anhand des heads des Forums ^[1] werden weitere Metaangaben erklärt und mit der {{Hauptartikel|...}}-Vorlage auf weitere Tutorials verlinkt.

Einige Texte sind etwas kurz, wer Lust hat sich auszutoben…

BTW: Das Tutorial zu Favicons ist nagelneu, da hat sich einiges geändert!

Was mir erst am Schluss auffiel: Das ist der Platz für einen Link zum "Stylesheets einbinden" und den Artikel zu RSS

Fazit: Eine solche Liste kann das "Siehe auch" bzw. eine Reihe Cards ersetzen oder ergänzen.

Herzliche Grüße

Matthias Scharwies

---

1. Das ist nicht 1:1 übernommen worden. Manche Sachen müsste man mit ck durchsprechen, aber nicht momentan - wir haben andere Baustellen. ↩︎

[Rolf B]

Hallo Matthias,

„Metaangaben im Detail“ als Anhang zu gestalten ist eine gute Idee. Sollte man vielleicht sogar "Anhang: " in die Überschrift setzen? Bedeutet natürlich ggf. das anpassen von ein paar Links. Oder die {{Anchor2}}-Vorlage, die genau dafür gemacht ist (Anchor erzeugt nur versteckte Spans). Vielleicht sollte sie besser {{VisibleAnchor}} heißen?

=== Anhang: {{Anchor2|Metaangaben im Detail}} ===

/HTML/Attribute/name beschreibt vor allem das name-Attribut für Form-Elemente. Der name im meta-Element ist spezieller und bezieht sich auf vordefinierte Namen. Das wäre ein weiterer Abschnitt im Grundgerüst-Anhang (sollte man diesen Teil explizit als "Anhang" kennzeichen?)

Dann hast Du meinen Forenbeitrag fast 1:1 unter die Metas des Forums kopiert. Das muss noch etwas geputzt werden - ich kann das machen, wollte aber erstmal nicht querschießen falls Du da selbst noch 'ran wolltest.

Das Tutorial zu Favicons ist nagelneu, da hat sich einiges geändert!

Und Du hast den Tom gemacht 😉: Überschriften ohne Inhalt (Web-Manifest für Android)

Die manifest.json braucht man meiner Kenntnis nach nur für offlinefähige Seiten. Wenn man sie empfiehlt, muss man auch genau angeben, in welchen Fällen sie nötig ist. Andernfalls macht man dem Anwender unnötig Kopfzerbrechen. Aber ich bin an der Stelle auch nicht ganz sattelfest.

Ansonsten finde ich die Zweiteilung "praktische Vorgehensweise" und "Formate im Detail" in der aktuellen Form nicht hilfreich, dieser Artikel ist aus meiner Sicht noch im Entwurfsstadium.

Rolf

[Matthias Scharwies]

Servus!

Hallo Matthias,

„Metaangaben im Detail“ als Anhang zu gestalten ist eine gute Idee. Sollte man vielleicht sogar "Anhang: " in die Überschrift setzen? Bedeutet natürlich ggf. das anpassen von ein paar Links. Oder die {{Anchor2}}-Vorlage, die genau dafür gemacht ist (Anchor erzeugt nur versteckte Spans). Vielleicht sollte sie besser {{VisibleAnchor}} heißen?

=== Anhang: {{Anchor2|Metaangaben im Detail}} ===

Die Vorlage {{anchor2}} wollten wir ja einstampfen!

Also so:

{{Anchor|Metaangaben im Detail}}
 === Anhang: Metaangaben im Detail ===

Ist halt eine Doppelung. Ich würde das Wort Anhang (und den anchor) einfach weglassen.

Dann hast Du meinen Forenbeitrag fast 1:1 unter die Metas des Forums kopiert. Das muss noch etwas geputzt werden - ich kann das machen, wollte aber erstmal nicht querschießen falls Du da selbst noch 'ran wolltest.

Ich hatte das am 11.03. vorgeschlagen, aber nicht explizit gesagt.

Und heute morgen:

Einige Texte sind etwas kurz, wer Lust hat sich auszutoben…

Favicons

Das Tutorial zu Favicons ist nagelneu, da hat sich einiges geändert!

Und Du hast den Tom gemacht 😉: Überschriften ohne Inhalt (Web-Manifest für Android)

ist jetzt vollständig!

Die manifest.json braucht man meiner Kenntnis nach nur für offlinefähige Seiten. Wenn man sie empfiehlt, muss man auch genau angeben, in welchen Fällen sie nötig ist. Andernfalls macht man dem Anwender unnötig Kopfzerbrechen. Aber ich bin an der Stelle auch nicht ganz sattelfest.

Es geht um PWAs, aber auch um das Speichern von Seiten auf mobilen Geräten zum späteren Lesen. Im Firefox habe ich mir grad einen Driveby-Virus namens Pocket eingefangen.

Ansonsten finde ich die Zweiteilung "praktische Vorgehensweise" und "Formate im Detail" in der aktuellen Form nicht hilfreich, dieser Artikel ist aus meiner Sicht noch im Entwurfsstadium.

Eben nicht! Du benötigst ein SVG und schmeißt diese in den realfaviconGenerator . anders als das von @Robert B. empfohlene Gimp werden die 4 pngs in den richtigen Größen automatisch erzeugt und als ZIP-Ordner zur Verfügung gestellt. Das passende HTML kannst du dir dort gleich herauskopieren. Und dann bis du fertig.

Außer du willst eben wissen, was es mit browserconfig.xml oder apple-touch-icon-precomposed auf sich hat, die irgendwo anders mal erwähnt wurden.

Deshalb diese aktualisierte Überleitung:

Und ich glaube, dass sollten wir öfter machen: Eine Kopiervorlage mit Erklärung an den Anfang und dann im Anhang die spezialgelagerten Sonderfälle.

Etwas wie x-ua-compatible habe ich 10 Jahre aus dem Wiki rausgehalten und jetzt, wo's völlig obsolet ist, bekommt's nen eigenen Artikel. 😀

Herzliche Grüße

Matthias Scharwies

[Robert B.]

Moin Matthias,

Eben nicht! Du benötigst ein SVG und schmeißt diese in den realfaviconGenerator . anders als das von @Robert B. empfohlene Gimp werden die 4 pngs in den richtigen Größen automatisch erzeugt und als ZIP-Ordner zur Verfügung gestellt. Das passende HTML kannst du dir dort gleich herauskopieren. Und dann bis du fertig.

und andere – für den Prozess unbeteiligte Parteien – sind dann noch lange nicht fertig, sondern fangen vielleicht gerade erst an:

Ich merke immer wieder, dass Addons wie µMatrix „digitale Selbstverteidigung“ sind.

Gimp exportiert zwar PNG nur als .ico in gewünschter Größe und Farbtiefe, aber es läuft lokal ohne Datenaustausch mit Dritten. Und im Sinne der Energie des Verstehens muss sich noch kurz mit HTML-Rahmen um die Icons beschäftigen.

Viele Grüße
Robert

[Rolf B]

Hallo Matthias,

x-ua-compatible habe ich 10 Jahre aus dem Wiki rausgehalten und jetzt, wo's völlig obsolet ist, bekommt's nen eigenen Artikel

Wenn Du meinst, dass wir darüber nicht reden brauchen (außer dem Hinweis, dass es irreleant geworden ist), dann nehmen wir's halt wieder raus. Ich wollte nur erklären, warum es irrelevant ist.

Rolf

[ThomasM]

Hallo zusammen,

Hallo Matthias,

x-ua-compatible habe ich 10 Jahre aus dem Wiki rausgehalten und jetzt, wo's völlig obsolet ist, bekommt's nen eigenen Artikel

Wenn Du meinst, dass wir darüber nicht reden brauchen (außer dem Hinweis, dass es irreleant geworden ist), dann nehmen wir's halt wieder raus. Ich wollte nur erklären, warum es irrelevant ist.

Rolf

Es gibt einen Grund noch X-UA-Compatible einzusetzen, der vielleicht etwas abwegig erscheint.

Hilfreich ist die Angabe für die Kompilation von HTML-Help-Dateien (*.chm). Der Windows-eigene Viewer fällt in einen IE-Modus Richtung 6/7, welcher keine moderneren Eigenschaften bzw. Selektoren aus CSS 2/3 unterstützt, SVG schon mal gar nicht.

Mit <meta http-equiv="X-UA-Compatible" content="IE=edge" /> lassen sich CSS und auch SVG immerhin so nutzen, wie es ein IE im Endstadium, also 10/11, erlaubte.

Grüße,
Thomas

[Rolf B]

Hallo ThomasM,

autsch. Danke. CHMs habe ich vor drölfundzwanzig Jahren mal gemacht; ich wüsste gar nicht mehr, wie man die überhaupt erstellt 😳.

Naja, meine Programme sind eh selbsterklärend, dumdidumdidum…

Rolf

[ThomasM]

Hallo Rolf,

Hallo ThomasM,

autsch. Danke. CHMs habe ich vor drölfundzwanzig Jahren mal gemacht; ich wüsste gar nicht mehr, wie man die überhaupt erstellt 😳.

Habe ich in diesem zusammengefassten Kursvideo von Mitschnitten aus einem Online-Semester dokumentiert, wobei hier der Fokus auf den verwendeten Tools liegt.

Kleiner Hinweis: das CHM-Beispiel wird nachfolgend noch für ein E-Book im Format EPUB 2.0 verwendet und dort ist XHTML 1.0 angesagt. Von daher also das <div class="abb">-Element für die Abbildungen und nicht figure/figcaption aus HTML5 (was wiederum als XHTML5 in EPUB 3.x möglich ist).

Grüße,
Thomas

[Matthias Scharwies]

Servus!

Hallo zusammen,

Hallo Matthias,

x-ua-compatible habe ich 10 Jahre aus dem Wiki rausgehalten und jetzt, wo's völlig obsolet ist, bekommt's nen eigenen Artikel

Wenn Du meinst, dass wir darüber nicht reden brauchen (außer dem Hinweis, dass es irreleant geworden ist), dann nehmen wir's halt wieder raus. Ich wollte nur erklären, warum es irrelevant ist.

Rolf

Es gibt einen Grund noch X-UA-Compatible einzusetzen, der vielleicht etwas abwegig erscheint.

Hilfreich ist die Angabe für die Kompilation von HTML-Help-Dateien (*.chm).

Da hatte ich jetzt an Stefan Münz erstes Werk - eine Hilfe für Windows - gedacht, die man im Archiv herunterladen kann:

selfhtml.org/wiki/Museum#ZIP-Archiv

Allerdings ist das eine gezippte .hlp-Datei, die ich gar nicht mehr öffnen kann.

---

Unser Grundproblem ist ja, dass Interessierte von irgendwo etwas zusammenkopieren und dann nicht einsehen, warum unsere Version besser ist. Und so ist es gut, wenn wir im Wiki auch einen kürzeren Abschnitt zu x-ua-compatible haben - es stellt sich aber eben die Frage, wie man solche Informationen aus dem Grundteil herauslöst.

0. Eine Erwähnung im Hauptteil mit Achtung-Schild und {{Beachte|...}}-Vorlage, dass man es nicht mehr verwenden solle - Stört den Lesefluss für Anfänger.

1. eine Anlage von Fußnoten lässt solche Abschnitte verschwinden. Man kann sie mangels Überschrift auch nicht verlinken.

2. Eine Info-Box - Komisch, ich dachte immer, dass man Wichtiges in einer Box zusammenfasst. Mein Sohn lernt alle Vokabeln, außer die in den Boxen!?

3. Im Favicon-Tutorial und hier eben ausprobiert:

   • ein relativ kurzer Hauptteil mit einer erklärten Kopiervorlage
   • ein letztes Kapitel "...im Detail", das eben zusätzliche Informationen für Fortgeschrittene und Interessierte bringt.

Ob 1., 2. oder 3. besser ist, müssen wir eben diskutieren.

Herzliche Grüße

Matthias Scharwies

[Camping_RIDER]

Aloha ;)

Die manifest.json braucht man meiner Kenntnis nach nur für offlinefähige Seiten. Wenn man sie empfiehlt, muss man auch genau angeben, in welchen Fällen sie nötig ist. Andernfalls macht man dem Anwender unnötig Kopfzerbrechen. Aber ich bin an der Stelle auch nicht ganz sattelfest.

Kommt drauf an, was man unter „brauchen“ versteht. Sie ist jedenfalls am Rande auch für nicht-offlinefähige Seiten relevant. Ich bin da auch nicht ganz sattelfest, aber zwei Dinge, die mir spontan einfallen, die man mit der manifest.json regeln kann, sind:

1. die Farbe, die (v.a. Mobil-)Browser als Hintergrundfarbe ihrer Werkzeugleiste und für andere Zwecke, z.B. als Hintergrund einer Tab-Kachel in der Tabliste, anzeigen (Achtung, mit Dark Mode wird das ggf. ignoriert)

2. das Bild (Logo oder dergleichen), das bei Link-Vorschauen in Messengerdiensten angezeigt werden soll

Grüße,

RIDER