Welche Breite sollte ein Header sein

  • Hallo zusammen!

    Ich beschäftige mich mit dem Theme schon den ganzen Tag, aber irgendwie bringt mich auch Google nicht weiter. Irgendwie schreiben alle um die heißen Brei und keiner nennt Fakten.

    Also, ich würde einfach gerne wissen, wie Breit ein Bild für ein Header sein sollte. Höhe steht bei mir fest: 400 px. Doch wie sieht es bei der Breite aus? Mein Notebook hat eine Auflösung von 1920 x 1080 px. Das von meiner Freundin 1366 x 768 px. Mein Monitor meines alten Computers hatte auch wieder andere Maße und die Tablets und Smarthones sowieso.

    Natürlich soll der Header auf jedem Display gleich gut sein. Wenn ich mir so Beiträge auf diversen Seiten durchlese, empfehlen die immer so zwischen 900 und 1200 px. Doch was ist dann bei 1920 x 1080 px und größeren Monitoren? Wird das Foto dann nicht hochskaliert? Denn dadurch wird ja die Qualität schlechter.

    Wie sieht das bei euch aus? Zum The7 Theme hab ich nämlich nichts gefunden.

    PS: Solle natürlich heißen: [size=24]Welche Breite sollte ein Header haben?[/SIZE]

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Ich habe mir angewöhnt, meine Headerbiilder auf ein Maß von 1920 px zu beschneiden. Aber ich glaube nicht, daß man das allgemeingültig schreiben kann.

  • Sonst niemand? :( Ihr habt doch alle Header? Ich bin ja recht neu hier, aber wirklich geholfen wird hier nicht. In einer Facebook Gruppe hat man innerhalb von Minuten mehrere Antworten. Ist nicht böse gemeint, hab halt mehr erwartet. Gerade bei so einem Thema.

    Einmal editiert, zuletzt von radio82 (25. Januar 2019 um 08:37)

  • Ich weiß nicht, ob das repräsentativ ist. aber es trifft jemand eine Aussage - LINK!
    Da sind die 1920px von den "Großen" Anzeigen an erster Stelle.

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

  • Danke. Die Seite hatte ich natürlich auch schon gelesen, aber geholfen hat es mir nicht wirklich. Ich hab mir das jetzt zwei Mal durchgelesen, aber schlauer bin ich jetzt auch nicht. Der Autor schreibt nur über seine Auswertungen der Browser letzten 7 Jahre, aber wie breit heute ein Header/Slider sein sollte, davon steht ja gar nichts. Er schreibt, dass er seit 2017 keine Auswertungen mehr macht, weil es heute responsive Webseiten gibt. Aber wie breit da mindestens ein Bild sein sollte erwähnt er nicht. Mein Notebook hat 1920 x 1080 und für mich heißt das, wenn ich meinen Header auf meinem Notebook scharf sehen möchte, dann muss dieser mindestens 1920 px breit sein. Alles was dann kleiner ist, ist dann eigentlich egal.

    Was ich halt seltsam finde, in anderen Beiträgen heißt es, jedes Theme hat andere größen, aber 800 bis 1400 px sollten reichen.

    2 Mal editiert, zuletzt von maxe (25. Januar 2019 um 10:24)

  • Soviel ich bei verschiedenen Themes bemerkt habe ist es so, dass beim Hochladen eines Headerbildes die Abmessungen angegeben sind und ggf nachgefragt wird, das bild bei Übermaß zuzuschneiden. Das ist aber wie du schreibst vom Theme abhängig. Wenn der body-Tag z.B. 1200px hat bringen 1920px nicht viel.

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

  • Stimmt fällt mir gerade auch ein. Hatte ich auch mal. Hab das aber ignoriert. Ich dachte, was soll ich da was beschneiden, dann wird die Qualität schlechter. Ich werde das gleich mal testen. Denn dann sollte er ja die richtige Größe anzeigen.

    Einmal editiert, zuletzt von maxe (25. Januar 2019 um 10:25)

  • Weiters hatte ich (vor DSGVO) eine Zugriffstatistik in der ich sehen konnte mit welche Äuflösung die Site aufgerufen wurde. Das sagt aber noch immer nicht aus ob das mit full-width angesehen wurde.....

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

  • kommt ja drauf an, ob man ein full width Theme hat. Viele Themes haben ja eine max-width und da würde ich auch irgendwas mit 1200 sagen.

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

  • nö, das Theme ist dann ja nicht breiter als 1200

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

  • Wäre schön wenn du nicht immer ein direktes Voll-Zitat einfügen würdest (s. Forenregeln).

    Wenn ein Theme nur 1200 breit ist, ist an den Seiten natürlich Platz, sofern du das Browser Fenster maximiert hast.

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

  • Wusstest ich nicht. Sorry, diese Regel kenne ich von anderen Foren nicht. Na gut. Wer feste Größen hat und auf Full Screen verzichtet, dann ist das okay. Ich dachte gerade deshalb ist WordPress besonders, dass man nicht mehr auf die strickte Breite achten muss. Ist auch egal. Hat mir jetzt alles nicht wirklich weiter geholfen. Werde mich weiter schlau machen. Trotzdem Danke für die Hilfe.

  • egal welches CMS oder statische Site muss man nicht mehr auf eine statische Breite achten.
    Ein Theme was max-width von 1200 hat, kann trotzdem responsive sein.

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

  • Also dei Theme bietet für den Content 825px Breite und für die Sidebar 325px. Der gesamte Arbeitsbereich ist mit 1300px eingestellt, davon fallen je 50px links und rechts (für die responsive Darstellung) sowie zwischen dem beiden o.g. Bereichen weg. Der Header ist hingegen nicht begrenzt. Aber so wie er derzeit ist, auch nicht responsive.
    Das nicht responsive versuche mal mit folgenden Code in den zusätzlichen CSS umzustellen.

    Code
    .masthead:not(.mixed-header) {
        background-size: 100%;
    }

    Nun hast du den Arbeitsbereich wieder auf "Bitte warten" gestellt ;-)

    Weiters könnte man auch den Header mit den 1300px begrenzen ;-) Was bringt ein z.B. 1920px Header wenn der Rest mit 1200px (ohne Rand) auskommt. Ist aber Geschmacksache..

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

  • ... aber wirklich geholfen wird hier nicht.....

    Damit gibst Du eine sehr subjektive Meinung wieder. Mir ist bisher immer noch schnell und viel geholfen worden. Was erwartest Du eigentlich? Du scheinst auch aus dem Geschriebenen nicht die richtigen Schlüsse zu ziehen.

    Es gibt nun einmal nicht die eine ideale Headerbreite!!

  • Wer feste Größen hat und auf Full Screen verzichtet,


    ..... und du hast ja, wie schon geschrieben, den Full Screen NUR beim Header. Wäre ja auch spannend, den Content auf full-width bei 3000px zu lesen. Dann geht der Kopf wie bei den Zusehern eines Tennisspieles hin und her....
    aber wie auch geschrieben könnte man mit wenigen Zeilen CSS das in jede erdenkliche Variante lösen.
    Header = Content (Header auf 1300px)
    Content = Header (wf-wrap auf 100%)
    ......

    Für mich müßt die Frage eigentlich anders lauten. Wie breit soll der maximale Lesebereich sein? Wieso wird in Printmedien die ganze Zeile nur bei Überschriften verwendet. Oder unterteilt man den Full Screen dann wieder in Spalten der usability wegn.

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!