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

Beitrag lesen

problematische Seite

@@HTML_go

Den Tip mit den Weiterleitungen hast du auch umgesetzt?

Ne, sorry, hatte ich vergessen, danach zu fragen. Muss jetzt erst mal kapieren (Link oben), wie das geht.

Und ich hatte vergessen zu erwähnen, warum man das bei Umbenennungen von URLs machen sollte – und zwar sofort: damit das Ranking bei Suchmaschinen nicht verlorengeht.


Schreibt am besten mal nichts weiter; das ist ja irre verwirrend. Ich versuche, einen Ratschlag umzusetzen und dann kommen gleich drei neue! Der Service hier ist einfach bombastisch!👍

Vielen Dank für die Blumen. Man trifft aber auch nicht immer auf so willfähige Empfänger von Ratschlägen wie dich.

Deshalb ignoriere ich das mit Nichts-weiter-Schreiben. 😄

Du gibst im Stylesheet keine Schriftarten an, dann wird die im Browser eingestellte Defaultschrift verwendet – auf den meisten Systemen dürfte das Times New Roman sein. Nicht gerade mein Favorit, sowohl was Lesbarkeit als auch was Schönheit angeht. Dann schon lieber Georgia, wenn’s eine System-Serifenschrift sein soll. Oder eine von Microsofts C-Schriften (Cambria, Calibri, …), die durch MS Office auch auf anderen System (macOS) verfügbar sein könnten. Oder doch ein Webfont.

Auf jeden Fall ist in allen Browsern die Default-Zeilenhöhe zu gering. Die solltest du (je nach Schriftart) auf das 1.4- bis 1.5-fache der Schriftgröße setzen:

html { line-height: 1.5 }

Wie @Matthias Scharwies schon erwähnte, ist das Logo unscharf. Da wird eine 758 × 312 Pixel große Grafik auf 840 × 346 hochskaliert – das kann nicht gut aussehen. Im Gegenteil, die Grafik sollte für hochauflösende Monitore (gibt’s heutzutage noch andere?) die doppelte Auflösung (also 1680 × 692) haben.

(Bei JPEG kann man da mit der Qualität runtergehen, ohne das das sichtbar wird, sodass die Bilddatei gar nicht mal so viel größer sein muss.)

Wo wir bei JPEG sind: Ich bin nicht sicher, ob das von dir verwendete PNG für diese Art von Grafik das beste Format ist. 175 kB scheint mir zu groß zu sein. Ist das PNG-8 oder PNG-24? Mit JPEG sollte das kleiner werden; mit WebP oder AVIF umso mehr.

Aber wie @Matthias Scharwies schon sagte, wäre eigentlich eine Vektorgrafik (SVG) das Mittel der Wahl. (Gradienten gehen auch in SVG.)

🖖 Живіть довго і процвітайте

--
Ad astra per aspera
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