pcguy
Goto Top

Tool für Responsive Mobile Test

Hallo zusammen

Ich suche ein Tool das mich bei der Test und Fehlersuche der Mobile Webseite in Apple & Android System unterstützt.
Es soll mir helfen CSS Fehler zu finden...

Leider zeigt mir im "Firefox Tools für Webentwickler" => Bildschirmgrösse testen nicht dasselbe Ergebniss wie es live auf dem Handy aussieht?


Danke für eure Feedbacks face-smile

Content-ID: 1579013518

Url: https://administrator.de/forum/tool-fuer-responsive-mobile-test-1579013518.html

Ausgedruckt am: 26.12.2024 um 23:12 Uhr

149569
149569 02.12.2021 aktualisiert um 11:34:13 Uhr
Goto Top
Zitat von @pcguy:
Leider zeigt mir im "Firefox Tools für Webentwickler" => Bildschirmgrösse testen nicht dasselbe Ergebniss wie es live auf dem Handy aussieht?
Das kommt auf den genutzten Browser am Mobile an, wenn du am Mobile Chrome als Browser nutzt musst du auch Chrome und nicht Firefox am Desktop zum Testen nutzen, das hat ebenfalls einen solchen Modus.
https://developer.chrome.com/docs/devtools/device-mode/#viewport
Die Rendering-Engine ist ja der Punkt der für einen Vergleich gleich sein muss, und natürlich auch der User-Agent muss stimmen.

https://www.browserstack.com/browser-emulator
https://bluetree.ai/screenfly/
https://appetize.io/
https://chrome.google.com/webstore/detail/mobile-simulator-responsi/ckej ...
https://www.lambdatest.com/browser-emulator-online
pcguy
pcguy 02.12.2021 um 11:34:14 Uhr
Goto Top
besten Dank!

Wenn ich auf dem PC (Win) FF das Mobilegerät simuliere ... passt es
Auf dem Android Gerät mit FF sind Div's verschoben (überbreite) ...

Es muss nicht auf jedem Gerät perfekt sein, aber sicher keine überbreite face-confused
149569
149569 02.12.2021 aktualisiert um 11:36:56 Uhr
Goto Top
pcguy
pcguy 02.12.2021 um 11:44:04 Uhr
Goto Top
Danke face-smile

Es ist Wordpress mit einem Bootstrap:
das sollte passen => <meta name="viewport" content="width=device-width, initial-scale=1">

Bis jetzt war alles ok, jetzt haben sich einige fehler eingeschlichen ...
149569
149569 02.12.2021 aktualisiert um 11:57:25 Uhr
Goto Top
Zitat von @pcguy:
Bis jetzt war alles ok, jetzt haben sich einige fehler eingeschlichen ...
Dann prüfe das was du seit dem geändert hast. Vor allem auch genutzte Einheiten und Maßangaben.
https://css-tricks.com/the-trick-to-viewport-units-on-mobile/
Für Mobile Browser gibt es auch Developer-Tools, ansonsten siehe die ergänzten Links oben.
137960
137960 02.12.2021 um 15:10:33 Uhr
Goto Top
Wenn für Apple entwickelt wird, bietet sich Xcode an. Dort kann man eine Emulation beliebiger Apple-Hardware einschalten, wobei die Auflösung und Pixeldichte automatisch gesetzt wird.

Hier ein Screenshot, der exemplarisch einen Auschnitt anzeigt:
gnmpf