Header sieht in Vorschau und Smarthphone nicht so aus wie bei Erstellung

  • Ich bin stundenlang am testen und komme nicht weiter. Der Header sieht in der Vorschau und auf meinem Smartphone nach dem Hochladen in das Internet anders aus.
    Dieses Problem habe ich auch schon im anderen Forum angesprochen, aber da war es nur eine Zeilenverschiebung. Jetzt ist alles verschoben.
    Wie auf Bild 1) rechts zu erkennen ist ragt nichts über den Header hinaus
    Bei der Desktopansicht ist die Vorschau auch etwas tiefer wie im Header.
    Die Homepage ist http://www.nakwandern.de/
    Wenn das so weitergeht werde ich mit meiner Seite nie fertig.
    Ich habe 3 Bilder angehängt:
    Bild 1) Vorschau in Website X5
    Bild 2 Seite auf dem Smartphone Hochformat
    Bild 3) Seite auf dem Smartphone Querformat
    Ich würde mich freuen wenn der Fehler endlich gefunden wird.

  • Beim letzten Bild kann ich es nicht nachvollziehen. Es kommt kein Balken!


    Bei dem anderen reden wir hier von dem Text "Ein Angebot von der neuapostolischen Kirche" wobei das "e" von der Kirche abgeschnitten ist oder?


    Das Problem ist du hast zwar eine Schrift genommen die schmäler ist und deshalb geht sich das beim Desktop Browser aus und in der Vorschau auch, aber am Handy dürfte es die Schriftart nicht nehmen und deshalb nimmt es eine Standardschriftart und die ist breiter und deshalb geht es sich nicht ganz aus. Versuche man eine Standardschriftart wie ARIAL oder Verdana zu nehmen und dann per rechts klick auf das Text-Objekt und auf "anpassen" klicken. Danach hochladen und testen. Am Handy den Browser Cache löschen.

    Wissen ist MACHT ! Nichts zu Wissen macht nichts !
    Wissen ist MACHT ...ohne es zu wissen !

  • Wieso das Logo? ISt das nicht so gewollt, dass es etwas unter der HEader Hintergrundgrafik rausschaut? Ich verstehe nicht was sonst noch "nicht alles stimmt" ! WEnn dann musst du den Headerhintergrund in gewissen Breakpoints anpassen !

    Wissen ist MACHT ! Nichts zu Wissen macht nichts !
    Wissen ist MACHT ...ohne es zu wissen !

  • Schau das Vergleichsbild 1) vom Header an - genauso wollte ich den Stand vom Logo.
    Bei allen Breakpoints stimmt der Stand vom geamten Headerinhalt nicht mit der Vorschau überein.
    Was soll ich da anpassen wenn nachher die Vorschau oder die Seite im Smartphone nicht stmmt.
    Zu dem ist doch das karierte Feld da.

  • Ich habe jetzt, wie du vorgeschlagen hast, Arial verwendet und alles komplett nochmals hoch geladen. Es hat sich nichts geändert. Die untere Zeile ist bei dem Breakpoint für das Smartphone ist immer noch zu lang.

  • Du weißt aber das man die Breakpoint einzeln einstellen kann wie und wo die jeweiligen Logos sitzen.


    http://help.websitex5.com/de/v13/pro/modello_modifica.htm


    Wenn Sie eine responsive Website erstellen, enthält das Fenster Inhalt des Headers und der Fußzeile eine Responsiv-Leiste, die mit der im Fenster Auflösungen und responsives Design identisch ist.
    Die Responsiv-Leiste enthält alle eingestellten Umbruchpunkte, die die Intervalle bestimmen. Klicken Sie in ein Intervall, um es zu markieren und gestalten Sie den Header und die Fußzeile der Vorlage für die entsprechende Ansicht.


    Andy ich glaub die Sache mit dem Textobjekt im Header ist immer noch nicht vernünftig gelöst das habe ich schon mal bemängelt. Wenn man den Text im nachhinein von der Größe ändert passen die Buchstaben teilweise nicht mehr rein. Je nach Schriftart wie du schon sagtest.

  • Hallo Zoemti
    wie du aus der obigen Abbildung Nr. 1 ersehen kannst habe ich das Logo passend zum Breakpoint angelegt.
    Bei jedem Breakpoint habe ich es angespasst und bei jeder responsiven Vorschau sitzt der gesamte Inhalt vom Header in der Vorschau tiefer.
    Wenn ich den Inhalt höher setze stimmt der Stand, aber dann brauche ich kein kariertes Headerfeld auf das man sich sowieso nicht verlassen kann.

  • Ich habe nochmals verschiedene Einstellungen getestet und die Ursache gefunden.
    Mein Landschaftsbild habe ich als Hintergrundbild vom Header genommen.
    Zum Test habe ich den Header eingefärbt und der Inhalt dieser Farbfläche
    stimmt mit der Vorschau überein. Aber woher kommt der Balken der über
    dem Header bei dem kleinsten Breakpoint herausschaut? Zwischen 320px und 480px ist er schmäler.
    Dieser war für die Verschiebung verantwortlich. Kann dieser Balken entfernt werden?

  • Möglicherweise Randeinstellungen oder spezieller Code der eingefügt worden ist. Aber ohne es Online zu sehen kann ich es nicht sagen.(ich meine nicht die jetzige im NEtz)


    Nur so ne Frage...hast du ein Samsung Handy?? Dort könnte man probieren ob du eine andere "Schriftart" auswählen kannst und dann deine Seite testen.

    Wissen ist MACHT ! Nichts zu Wissen macht nichts !
    Wissen ist MACHT ...ohne es zu wissen !

    Einmal editiert, zuletzt von andy67 ()

  • Hallo nun habe ich mal wieder einige Tests gemacht.
    Ich bin aber nicht weiter gekommen. Anbei habe ich 2 Bilder angehängt die mich stutzig machen.
    Bei der Seite Home hängt der Header weiter unten als bei der Seite Gründung und den weiteren Seiten.
    Die Inhaltseiten habe ich geprüft, dass alle die gleichen Ränder haben.
    Als Code habe ich nur den farbigen Rand eingetragen.

  • Ich würde annehmen dass du einen Text in den Codebereich geschrieben hast. Oder er wurde bei der Konvertierung nicht in den richtigen Teilbereich geschoben. Das kann eine Description sein.


    Es kann aber auch sein dass der Code Fehlerhaft reinkopiert worden ist. Vielleicht fehlt eine Klammer?

    Wissen ist MACHT ! Nichts zu Wissen macht nichts !
    Wissen ist MACHT ...ohne es zu wissen !

  • Ich habe nur den Code für die runden Ecken von dir übernommen.

    • <style>
    • #imContentGraphics {
    • border-radius: 50px;
    • border: 2px solid #FF0033;
    • }
    • </style>


    Mehr weiß ich nicht wo da noch was drin sein soll.
    Kannst du es herausfinden wenn ich dir die Homepage nenne http://www.nakwandern.de/
    Hier sieht man die Verschiebung zwischen der Seite Home und dem Landschaftsbild und der Seite Gründung und dem Landschaftsbild.

  • Wie ich geahnt habe, hast du Text in den Codebereich geschrieben oder eben falsch konvertiert worden. Der steht in den Seiteneigenschaften drinnen. Schau ob irgendwo vor dem HTML Tag Text drinnen steht.
    Fehler.jpg

    Wissen ist MACHT ! Nichts zu Wissen macht nichts !
    Wissen ist MACHT ...ohne es zu wissen !

  • Super, hier wird einem geholfen - vielen Dank.
    Nachdem ich den Text entfernt und neu gespeichert habe war der Header im Desktop und auch bei Responsive ok.
    Jetzt kann ich endlich an meiner Homepage weiterbauen.
    Ich habe gedacht der Text gehört zur Suchmaschinenoptimierung und Metatags und habe ihn dort eingetragen.
    Wo kann ich die Texte eintragen damit ich bei Google gefunden werde oder geht dies automatisch?
    Obwohl ich mir die Bedienungsanleitung ausgedruckt und teilweise gelesen habe fehlt doch noch viel an Erfahrung.

  • Dazu gibt es ein den Seiteneigenschaften die "Beschreibung der Website" und nicht direkt in den Codeteil schreiben!


    Außerdem sollte man sich bei Google WEbmastertools anmelden und die Website reinstellen und auch die sitemap.xml hochladen !

    Wissen ist MACHT ! Nichts zu Wissen macht nichts !
    Wissen ist MACHT ...ohne es zu wissen !