kulturbanause Blog

Responsive Design, WordPress, Konzeption, HTML, CSS, JS & UX/UI …

Websites auf verschiedenen Endgeräten testen: Screenfly

Ich möchte euch gerne ein weiteres Online-Tool vorstellen, mit dem ihr eure Website auf verschiedenen Viewports testen könnt. Der Dienst nennt sich Screenfly und simuliert eine Vielzahl an (mobilen) Endgeräten. Angefangen bei Desktop-Computern über Smartphones und TV-Geräte bis hin zu Tablets werden alle gängigen Devices abgedeckt.
Besonders gut gefällt mir, dass nicht nur die Apple-Geräte berücksichtigt werden, sondern eben auch Blackberry, Android und Co. Darüber hinaus lässt sich auch noch vom Portrait- in den Landscape-Modus wechseln.

Workshops und Seminare von kulturbanause

Unsere Seminar-Termine für 2018 sind online!

Visual Prototyping, Responsive Design, WordPress, Adobe Muse, HTML & CSS, Website-Optimierung …

Jetzt Frühbucher-Preise sichern!

Nachteilig ist allerdings, dass auch dieser Dienst lediglich den Viewport simuliert. Geräteabhängige Settings werden nicht berücksichtigt.

Screenfly does not mimic the behavior of the devices you select. For example, most mobile phones and tablets have a zoom feature that displays the entire page at once, even if it appears to be clipped off the edges of the screen here.

Media Queries über den Viewport simulieren

Jetzt bist du gefragt!

Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freuen wir uns auf deinen Kommentar.

Du kannst diesen Beitrag natürlich auch weiterempfehlen. Wir sind dir für jede Unterstützung dankbar!

Unterstützung bei Responsive Design-Projekten

Unsere Agentur ist auf responsive Design spezialisiert. Wir realisieren u.a. maßgeschneiderte Websites und führen Schulungen durch. Wenn du Unterstützung bei der Planung, Gestaltung und Entwicklung einer Website im Responsive Design benötigst, helfen wir gerne weiter.
Responsive Webdesign-Leistungsangebot →

Das könnte dich auch interessieren

7 Kommentare

  1. Jim

    Verfasst am 2. August 2011 um 15:41 Uhr.

    Sehr gut sowas sucht man immer gerade in der steigenden Nachfrage an Mobilen Webseiten :)

  2. Moev

    Verfasst am 4. August 2011 um 8:53 Uhr.

    Ich finde es nur komisch, das er bei den Seiten die ich getestet habe kein Stylesheet benutzt wird. Ich weiß nicht, ob das grade nen Bug ist oder normal. Sonst aber eine gute Sache.

  3. Tim

    Verfasst am 4. August 2011 um 12:35 Uhr.

    Echt praktisch. Bei den „nich WordPress“- Seiten wurde das Stylesheet bei mir auch nich berücksichtigt. Woran kann das liegen?

    Ich hab mal noch eine Frage: Jonas, wie bekommst du es hin, dass sich die Bilder in deinen Artikeln dynamisch an die Größe anpassen? Verwendest du mehrere Bilder (in den verschiedenen Größen) oder werden diese direkt verändert?

    Grüße
    Tim

    • Jonas Hellwig

      Verfasst am 4. August 2011 um 13:17 Uhr.

      @Tim: Ich vergebe den Bilder einfach eine Breite von 100% und eine proportionale Höhe dazu. Wenn der Content-Bereich dann ebenfalls flexibel ist passt sich alles dynamisch an die mobilen Endgeräte an.

      img {
      width:100%;
      height:auto;
      }

  4. Moev

    Verfasst am 9. August 2011 um 8:53 Uhr.

    @Tim: Anscheinend geht das wirklich nur mit WordPress Seiten. Sehr komisch. Fand das Tool ja recht nett. Aber sehr schade, das es nicht mit normalen Seiten geht :(

  5. Tim

    Verfasst am 9. August 2011 um 21:55 Uhr.

    @Jonas: Vielen Dank für die schnelle Antwort, funktioniert!!

    @Moev: jo schade, aber vlei kommt ja bald ein nächstes Wundertool heraus :)

  6. Felix

    Verfasst am 14. August 2011 um 19:36 Uhr.

    Leider funktioniert dieses tool auch bei meinen Webseiten nicht. Sehr schade.

    Bezüglich der Bilder und deren Skalierung hast du folgendes empfohlen:

    img {
    width: 100%;
    height: auto;
    }

    bewirkt das folgende genau das gleiche oder worin besteht der Unterschied?

    img, embed, object, video, iframe {
    max-width: 100%;
    }

Kommentar verfassen

Dieser Blog lebt vom Feedback der Besucher! Also los, mach mit!
Bitte habe Verständnis dafür, dass Kommentare die mit dem Inhalt dieses Beitrags nichts zu tun haben, gelöscht werden.