Viewport richtig setzen/Shop für Mobilgeräte optimieren

  • Hallo zusammen,


    ich hoffe hier kann mir weitergeholfen werden.
    2021 habe ich unseren Onlineshop neu aufgesetzt als absoluter Neuling in der Materie CSS habe ich lange durch "Try and Error" gebastelt und probiert und im Endeffekt einen lauffähigen Shop erhalten, der vielleicht nicht den gängigen Schönheitsidealen entspricht, aber für mich zumindest nutzbar ist.

    Leider habe ich in dem Ganzen Probieren irgendwann im Stylesheet so dermaßen rum gespielt, daß der Shop auf Mobilgeräten nicht mehr angepasst wird.

    Ich weiß noch, daß ich damals irgendwelche Werte im Stylesheet gelöscht habe und danach eigentlich zufrieden war. Jetzt sagt Google allerdings, daß unsere Seite nicht für Mobilgeräte optimiert ist und nimmt uns nicht in die Suchergebnisse mit auf. Das würde ich gerne wieder ändern, finde aber leider nicht mehr, was ich damals geändert habe.
    Meine Hoffnung ist nun, daß sich hier fähige User befinden, die mir helfen können. Sei es auch einfach nur ein Hinweis, wonach ich suchen muss.
    Der Softwareanbieter hhg-multistore ist leider mittlerweile nicht mehr erreichbar.

    hier ein Link zu unserem Shoop:
    https://www.hochdruck-musick.de/HHG/index.php


    Liebe Grüße und schon vorab vielen Dank für eure Mühen.

  • 2021 habe ich unseren Onlineshop neu aufgesetzt als absoluter Neuling in der Materie CSS habe ich lange durch "Try and Error" gebastelt und probiert und im Endeffekt einen lauffähigen Shop erhalten, der vielleicht nicht den gängigen Schönheitsidealen entspricht, aber für mich zumindest nutzbar ist.

    Die verwendeten Techniken waren auch 2021 schon veraltet: Layouts mit float waren auch damals schon lange nicht mehr notwendig, grid (und flex) existierten auch damals schon und wurden auch schon längst von allen Browsern unterstützt. Auch werden irgendwelche Krücken für den IE, Mac-IE, Firefox 2 sowie Safari und Opera um 2000 rum verwendet - alle Browser(-versionen) sind lange nicht mehr relevant und die Krücken können ersatzlos entfallen.

    Von nutzbar ist die Seite auch weit entfernt: Tastaturbedienung ist nicht möglich da du die mutwillig kaputt gemacht hast (mit outline: 0pt;, das darf nur verwendet werden wenn aktive Elemente anderweitig gekennzeichnet werden). Von der Unbedienbarkeit der Navigation mal ganz zu schweigen: ohne Maus gibt es eben kein hover …

    Leider habe ich in dem Ganzen Probieren irgendwann im Stylesheet so dermaßen rum gespielt, daß der Shop auf Mobilgeräten nicht mehr angepasst wird.

    Evtl. hast du an der Zeile "@media (max-width: 100px) {" im CSS rumgepfuscht: damit werden die Regeln (welche die Inhalte alle untereinander anordnen) erst angewendet wenn das Fenster weniger als 101px breit ist - und das ist in der Praxis nie der Fall. Wobei Pixel hier ohnehin die falsche Einheit ist. Ebenfalls nicht ganz richtig ist die Viewportangabe im head der Seite: setze da mal <meta name="viewport" content="width=device-width, initial-scale=1.0"> hin (1.0 ist eigentlich der Standardwert, scheint zumindest in Vivaldi aber einen Unterschied zu machen ob der da steht oder nicht).


    Ich fürchte aber mit irgendwelchen kleinen Änderungen ist es nicht getan, damit die Seite wirklich benutzbar ist braucht die eine komplette Überholung …

    Der Softwareanbieter hhg-multistore ist leider mittlerweile nicht mehr erreichbar.

    Da wird es auch andere Anbieter geben …

  • Hallo tk1234 ,


    vielen Dank für deine ausführliche Antwort.

    Das ich als absolut unbedarfter Nutzer wohl auf ein sehr veraltetes System gesetzt habe, welches auf mehreren Seiten empfohlen wurde, ist mir leider auch schon aufgefallen und auf Dauer werde ich auch auf einen anderen Anbieter wechseln. Da der Shop neben meinen Hauptjobs und der Familie allerdings nur als Hobby nebenbei läuft, wird dies noch dauern und bis dahin versuche ich mich zumindest mit dem Bestehenden über Wasser zu halten.


    Deine Anregungen werde ich auf jeden Fall testen, 1000 Dank dafür :thumbup: :thumbup:

Jetzt mitmachen!

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