HTML_go: Unverständnis von CSS-Eigenschaften; Hintergrund der aktiven Navigationsauswahl ändern

Beitrag lesen

problematische Seite

Hallo Gunnar,

doch gleich Detailfragen:

Mal in deinen Kopf geschaut:

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

Die doppelte Angabe der Zeichencodierung macht keinen Sinn. Weg mit der ersten Angabe! Übrig bleibt:

    <meta charset="utf-8" />

Das heißt, der Bereich fällt komplett weg?

<meta http-equiv="content-type" content="text/html; charset=UTF-8" />

und nicht "nur" das doppelte charset=UTF-8?



Siehe [Slide 39](https://speakerdeck.com/csswizardry/get-your-head-straight?slide=39) von Harry Roberts’ Talk [Get Your <head> Straight](https://beyondtellerrand.com/events/dusseldorf-2021/speakers/harry-roberts#talk) (Video + Transkiption).

Habe reingeschaut. Ich bin des Englischen inzwischen recht gut mächtig; aber das ist doch zu viel fremdes Vokabular. Und dann noch HTML-Code am Schirm, den ich erst mal abtippen müsste, um zu kapieren, was er im Browser bewirkt. Sorry, für mich zu viel.


Mal in deinen Kopf geschaut (mal sollte head und header auseinanderhalten können 😏):

      <a href="./index.html">
        <img
          src="https://kontakt-vs.de/kontakt.png"
          alt="Banner Sozialwerk KONTAKT e.V. | 78050 Villingen-Schwenningen"
        />
      </a>

Gut, dass das Bild einen Alternativtext hat. Nur passt der hier nicht so richtig. Das Bild verlinkt auf die Startseite; der Alternativtext sollte das in diesem Kontext auch sagen.

Du meinst, dass ich als Alternativtext beispielsweise "Banner" gegen "Startseite" austausche?

“Universal law is for lackeys. Context is for kings.” — Lorca in Star Trek: Discovery S1:E3

(Hier in der passenden Schrift. Dasselbe hab ich bei dem Vortrag auch gesagt. Das Video gibt’s wohl noch nicht online. Aber diesen Codepen.)


Wo wir bei Accessibility [Du meinst Barrierefreiheit?] und du nun schon <main id="main"> hast,

passende Schrift? Code-Pen?

Um was geht es hier? Brauche ich das? Wenn es um Barrierefreiheit geht, möchte ich es. 👍

Das dort zu tabindex="-1" Gesagte ist schlecht gealtert; AFAIK sollte man das nicht mehr tun.

Was wäre dann die Alternative für tabindex="-1"?

Ich versuche das mit "SkipLink" umzusetzen / einzubauen und frag' dann noch, ob richtig gemacht.

Danke!

Holger

0 117

Unverständnis von CSS-Eigenschaften; Hintergrund der aktiven Navigationsauswahl ändern

HTML_go
  • javascript
  1. 0
    Rolf B
    1. 0
      HTML_go
  2. 0
    Auge
    • css
    • html
    1. 0
      Rolf B
      1. 0
        Auge
        1. 0
          Gunnar Bittersmann
          • html
      2. 0

        Navigations-Tutorial im SELF-Wiki

        Matthias Scharwies
        1. 0
          Gunnar Bittersmann
          • aria
          • html
          • ux
        2. 0
          HTML_go
          1. 0
            Auge
      3. 0
        Gunnar Bittersmann
        • begriff
        • html
    2. 0
      Gunnar Bittersmann
      • css
    3. 0
      HTML_go
      1. 0
        Auge
        1. 0
          Gunnar Bittersmann
          • html
  3. 0
    Gunnar Bittersmann
    • css
    • html
    1. 0
      HTML_go
      1. 0
        Gunnar Bittersmann
        1. 0
          Matthias Scharwies
        2. 0
          HTML_go
          1. 0
            Gunnar Bittersmann
            • grafik
            • suchmaschinen
            • typografie
            1. 0
              Rolf B
              1. 0
                Gunnar Bittersmann
                • grafik
            2. 0
              HTML_go
            3. 0
              HTML_go
              1. 0
                Gunnar Bittersmann
                • css
                • grafik
                • typografie
                1. 0
                  HTML_go
                  1. 0

                    Logo als SVG

                    Matthias Scharwies
                    1. 0
                      HTML_go
                      1. 0
                        HTML_go
                  2. 0
                    Gunnar Bittersmann
                    • grafik
                    1. 0
                      Rolf B
                      1. 0
                        HTML_go
                      2. 0
                        Gunnar Bittersmann
                        • menschelei
                        1. 0
                          MudGuard
                    2. 0
                      HTML_go
                      1. 0
                        Gunnar Bittersmann
                        1. 0
                          HTML_go
              2. 0
                HTML_go
                1. 0

                  ein Projekt nach Prioritäten sortieren

                  Matthias Scharwies
                  1. 0
                    HTML_go
                    1. 0
                      Auge
                      1. 0
                        HTML_go
                        1. 0
                          Auge
            4. 0
              HTML_go
              1. 0
                HTML_go
                1. 0
                  HTML_go
                  1. 0
                    Gunnar Bittersmann
                    • css
                    1. 0
                      HTML_go
                2. 0
                  Gunnar Bittersmann
                  • css
                  • font
                  • typografie
                  1. 0
                    HTML_go
                    1. 0
                      HTML_go
                      1. 0

                        Begriffe lokal, google-Fonts

                        Matthias Scharwies
                        1. 0
                          HTML_go
                          1. 0
                            Matthias Scharwies
                            1. 0
                              Rolf B
                              1. 0
                                Matthias Scharwies
                            2. 0
                              HTML_go
                        2. 0
                          Gunnar Bittersmann
                          • css
                          • font
                          1. 0
                            Gunnar Bittersmann
      2. 0
        Rolf B
      3. 0
        Auge
        1. 0
          HTML_go
          1. 0
            Auge
            1. 0
              Gunnar Bittersmann
              • css
            2. 0
              HTML_go
              1. 0
                Gunnar Bittersmann
                • css
                • font
                • html
                1. 0
                  HTML_go
  4. 0
    Rolf B
    1. 0
      HTML_go
      1. 0
        Gunnar Bittersmann
        • css
        1. 0
          HTML_go
        2. 0
          HTML_go
          • browser
          • css
    2. 1
      Gunnar Bittersmann
      • css
      1. 0
        Rolf B
        1. 0
          HTML_go
      2. 0
        Auge
      3. 0
        Gunnar Bittersmann
      4. 0
        HTML_go
        1. 0
          Auge
          • browser
          • css
          1. 0
            Gunnar Bittersmann
            1. 0
              Auge
              1. 0
                Gunnar Bittersmann
        2. 0
          Gunnar Bittersmann
          1. 0
            HTML_go
            1. 0
              Gunnar Bittersmann
              1. 0
                HTML_go
  5. 0
    Gunnar Bittersmann
    • barrierefreiheit
    • html
    • performance
    1. 0
      HTML_go
    2. 0
      HTML_go
      1. 0
        HTML_go
        1. 0
          Rolf B
          1. 0
            HTML_go
            1. 0
              Gunnar Bittersmann
              • markdown
              • zu diesem forum
              1. 0
                HTML_go
      2. 0
        HTML_go
      3. 0
        Gunnar Bittersmann
        • html
        • performance
        • typografie
        1. 0
          HTML_go
          1. 0
            Gunnar Bittersmann
            • css
            • html
            • typografie
            1. 0
              HTML_go
              1. 0
                Rolf B
                1. 0
                  HTML_go
                  1. 0
                    Rolf B
                    1. 0
                      Gunnar Bittersmann
                      • css
                  2. 0
                    Tabellenkalk
                    1. 0
                      Gunnar Bittersmann
                      • css
                      1. 0

                        Fehler im verlinkten Adventkalenderartikel

                        Auge
                        • adventskalender
                        • php
                        1. 0
                          Rolf B
                          1. 0
                            Matthias Scharwies
                            • adventskalender
                            • php
                            • sonstiges
                            1. 0
                              Rolf B
                              1. 0
                                Matthias Scharwies
                    2. 0
                      HTML_go
                2. 0
                  Gunnar Bittersmann
                  • inclusive design
                  1. 0
                    Gunnar Bittersmann
    3. 0
      Gunnar Bittersmann
      • star trek
      • typografie
      1. 0
        Gunnar Bittersmann