mobile Version - springende Website mit responsive Design

PKO schrieb am 27.01.2021 um 17:22 Uhr

Hallo zusammen, ich habe gleich mehrere Fragen aufeinmal. Auch Teilantworten würden mir weiterhelfen.,

-nachdem ich auf responsive Design umgestellt habe, springt meine Website in der mobilen Version von links nach rechts, dann wieder halb zurück und nochmal vertikal. Das sieht schrecklich aus und ich verstehe nicht, an welcher Stelle ich hier eine Anpassung vornehmen kann.

Dazu habe ich auch ein Bild angehangen aus der google page speed analyse (cumulative Layout shifts) vielleicht hängt das zusammen?

 

- Weiterhin verstehe ich die Logik beim "Varianten-Teilen" nicht ganz, manchmal kann die Schriftgröße für die mobile Variante geändert werden, obwohl teilen aktiv ist, manchmal wird dann auch in der Website-Version die Größe geändert, was natürlich nicht sein soll.

Dass ist deshalb ärgerlich, weil ich dann mehrere H1, H2 etc. Überschriften habe, die identisch sind. Wie wäre die richtige Vorgehensweise, dass nur der Inhalt bestehen bleibt, die Formatierung aber anpassbar ist?

- Beim ersten Laden der Seite, tauchen zuerst Namen der Bilder als Link auf und danach die Bilder, dass sieht komisch aus. Wie kann ich hier eine Priorisierung des Erscheinens erreichen?

- Wie kann ich "Ressourcen beseitigen, die das Rendering blockieren"? Habe ich einen Einfluss auf zB. folgende URLS

  • /index_htm_files/xr_fonts.css
  • /index_htm_files/highslide.css
  • /index_htm_files/highslide.js
  • /index_htm_files/xr_main.css
  • /index_htm_files/custom_styles.css

Ich nutze WD 17 Premium

www.iprotec.de

Vielen Dank für eure Hilfe.

 

 

Kommentare

marboe schrieb am 27.01.2021 um 19:14 Uhr

Als ersten Einstieg kannst du dir mal dieses Tutorial ansehen : https://www.magix.info/de/tutorials/varianten-geteilter-text-mobile-navileisten--1231669/

Als nächstes wäre deine URL hilfreich da du keine Infos zur Seitengestaltung gegeben hast. Gruß Marboe

PKO schrieb am 28.01.2021 um 12:11 Uhr

Ich habe es mir angeschaut, den Großteil hatte ich so schon verstanden. Wie kann man jetzt die Schriftgröße verändern, ohne dass eine zweite identische H1-Überschrift erzeugt wird, weil das "Varianten-Teilen" beendet werden muss? (denn eigentlich versteht google doch, dass die mobile- und Web-Version identisch sind)

Entschuldige der Link oben ist wohl nicht so deutlich hervorgehoben. www.iprotec.de

marboe schrieb am 28.01.2021 um 14:27 Uhr

Wie kann man jetzt die Schriftgröße verändern, ohne dass eine zweite identische H1-Überschrift erzeugt wird,

Diese Frage lässt mich vermuten, dass du dir das Tut nicht angesehen hast. Das ist doch eindeutig erklärt; und sogar mehrfach vorgemacht.
Du musst "nur in dieser Variante" speichern.

Das setzt natürlich voraus, dass du auch nur zwei Formatvorlagen erstellt hast auf Basis von H1.

Ja, den Link habe ich überlesen. Sorry. Bei mir springt nichts nach rechts, links oder oben / unten bei Aufruf deiner mobilen Seite. Gruß Marboe