Link-Tipp: Am I Responsive? Screenshot-Tool

Nachdem ich heute morgen den neusten Responsive Webdesign Newsletter von @justinavery gelesen habe, hatte ich ein kleines Aha-Erlebnis, da ich sein Site-Project Tool „Am I Responsive?“ bisher noch nicht entdeckt hatte. Dabei ist das Screenshot-Tool wirklich genial und macht jede Menge Spaß, denn mit nur einem Klick kannst du dir deine responsive Website in einer schönen Präsentation auf verschiedenen Geräten anzeigen lassen.

Elmastudio.de auf Am I Responsive?.
Elmastudio.de auf Am I Responsive?.

Gezeigt wird die Webseiten-Ansicht für Desktop (1600x992px), Laptop (1280x802px), Tablet (768x1024px) und Smartphone (320x480px) und per Drag’n’Drop kann sogar die Anordnung der Geräte im Bild geändert werden.

Das Tool ist auf jeden Fall eine tolle Sache, um kurz einen Überblick über die eigene Webseiten-Präsentation auf verschiedenen Geräten zu bekommen und schöne Screenshots der eigenen responsive Webseite vorzubereiten.

19 Kommentare zu “Link-Tipp: Am I Responsive? Screenshot-Tool

  1. Sehr cooles Tool! Danke für den Linktipp!

  2. Nützlich, sehr nützlich! Danke.

  3. Genial! Danke für den Hinweis! :-)

  4. Danke für den Tipp. ;)

  5. verdammt ist das Geil!
    Sehr toll und sehr nützlich!

    Lieben Dank für den Link!

    Danny

  6. Wow, tolle Idee, perfektes kleines Tool zum schnellen Testen, Danke!

  7. immer wieder super was es bei euch zu lesen gibt! danke.

  8. Hi, finde das Tool auch sehr cool. Welches ich noch komfortabler finde und mit einem Bookmark jederzeit ausführbar ist, wäre der Resizer von Malte Wassermann:

    http://lab.maltewassermann.com/viewport-resizer/

    Grüße

    Tommi

  9. Schöner Link-Tip – sowas hatte ich gerade gesucht. Ich kannte bisher nur http://quirktools.com/screenfly/ aber das ist eher zum Testen und nicht für ein schönes Foto. Danke Ellen, und auch an die anderen mit den interessanten Links oben.

  10. Mal wieder ein sehr nützlicher Tipp! Vielen Dank!
    Grüße
    Thomas

  11. Ellen, vielen herzlichen Dank für diesen tollen Tipp.
    Wirklich ausgesprochen nützlich.

    Viele Grüße
    Michaela Steidl

  12. Stephan Lück

    Ich nutze meist die Chrome dev tools dort kann ich sogar verschiede modele eingeben und auch touch events testen. https://developers.google.com/chrome-developer-tools/docs/overview
    https://developers.google.com/chrome-developer-tools/docs/mobile-emulation

  13. Ich nutze die Erweiterung Webdeveloper Tools als Firefox Erweiterung,
    dort gibt es einen Button „Resize“ und dann das Untermenü „View Responsive Layouts“ gezeigt wird dann:
    Mobile portrait (320×480)
    Mobile landscape (480×320)
    Small tablet portrait (600×800)
    Small tablet landscape (800×600)
    Tablet portrait (768×1024)
    Tablet landscape (1024×768)

    Der Clou, das ganze geht auch offline mit localhost :)

    Desweiteren lassen sich aber auch benutzerdefinierte Auflösungen hinterlegen, bzw. die bestehenden bearbeiten, siehe „Resize -> Edit Resize Demensions“ dann den Button „Responsive“, hier kann man unendlich viele Auflösungen hinterlegen.

    Grüße Henri

  14. @alle: Es freut mich, dass euch der Link-Tipp gefallen hat und vielen Dank für die hilfreichen, weiteren Tipps zum Testen von responsive Designs :) Grüße, Ellen

  15. Besonders hübsch finde ich, dass man das Ergebnis als URL verschicken kann. Allerdings funktioniert das Tool zumindest im IE 8 nicht, ist zur Präsentation für den Kunden also nur bedingt geeignet.

  16. Schön uns simpel.. so kann man sich schnell einen kurzen Überblick verschaffen :-) Danke für den Tipp! Sehr praktisch.
    Gruß
    Markus

  17. nett. noch einfacher ist es, das browserfenster zu verkleinern. macht auch spaß, wenn man sieht, wie sich das theme währenddessen anpasst…;)

  18. http://quirktools.com/screenfly/
    Habe ich gerade gefunden und finde es auch sehr praktikabel!

Hinterlasse einen Kommentar zu Marianna Antworten abbrechen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *