kulturbanause Blog

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

Responsive Webdesign


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.

Beitrag zu Ende lesen

Mobile Websites online testen: Media Query Previewer für iPhone und iPad

Media Queries und Responsive Web Design sind die aktuellen Buzzwords der Webdesign-Szene. Gemeint ist damit eine Website, die mithilfe der CSS-Technik "Media Query" für unterschiedliche Ausgabemedien und Displaygrößen optimiert wurde. Da die mobile Web-Nutzung rasant zunimmt, muss eine zeitgemäße Website auch auf Smartphones und Tablet-PCs eine gute Figur machen.
Wie ihr eine Website für iPhone, iPad & Co. optimiert, habe ich in einem früheren Artikel bereits beschrieben. Nun möchte ich euch ein Online-Tool vorstellen, mit dem sich die Darstellung auf iPhone und iPad simulieren lässt.

Beitrag zu Ende lesen

Media Queries Showcase

Webdesign-Showcases, Galerien und Pseudo-Awards gibt es mittlerweile ja einige im Web. Nun habe ich einen neuen - zur Abwechslung einmal sehr sehenswerten - Showcase kennengelernt. MediaQueri.es listet Websites, die mithilfe von CSS3 Media Queries umgesetzt wurden. Besonders gut gefällt mir die puristische Darstellung der Web-Galerie. Wenig Klicken, keine Werbung, keine Thumbnails. Einfach nur die Seiten. Nice!

Beitrag zu Ende lesen

Websites mit CSS3 Media Queries für iPhone, iPad, Android & Co. optimieren

Das Web ist längst mobil geworden und moderne Websites müssen nicht nur auf dem Monitor, sondern auch auf unzähligen Ausgabemedien eine Top-Figur machen. Zwar rufen die meisten User Websites noch über einen Computer auf, aber die Zugriffe über mobile Endgeräte wie iPad, Smartphones und portable Spielekonsolen steigt stetig an. Wie soll man da eine Website für all diese Geräte optimieren können? Mit CSS Media Queries ist das gar nicht so schwierig.
In diesem Beitrag möchte ich Euch die Vor- und Nachteile dieser Technik erklären und an einem praktischen Beispiel zeigen wie schnell Ihr auch Eure Website für Smartphones und Tablet PCs optimieren könnt.

Beitrag zu Ende lesen

Viewport-Bestimmung mit Browser-Resize

Den Viewport für alle gängigen Bildschirmauflösungen zu kennen oder zu simulieren kann heutzutage ein aufwändiges Unterfangen werden. Viel zu viele unterschiedliche Desktop-Rechner, Netbooks und SmartPhones gibt es mittlerweile. Neben einigen Tools wie der Webdeveloper Toolbar oder der Google Browser Size möchte ich Euch heute die Website Resize My Browser vorstellen.

Beitrag zu Ende lesen

Websites für das iPhone erstellen und optimieren

Das iPhone stellt das "echte" Internet dar, soviel wissen wir schon aus der Werbung. Doch es gibt auch diverse Websites die extra für das iPhone geschrieben oder zumindest optimiert wurden.
Experten und Web-Pioniere sind sich einig: Die Zukunft des Internets ist mobil. Höchste Zeit also sich mit diesem Thema auseinander zu setzen. In diesem Artikel erläutere ich einige Funktionen hinsichtlich des iPhones.

Beitrag zu Ende lesen