Blog

Im Blog von Peter und Ursula Schäublin berichten wir von Aktualitäten rund um unser Grafikatelier 720 Grad, über Fotografie und Film, Kajaken und weitere Aktivitäten.

Responsives Webdesign

Die Zukunft

Die Herausforderungen für uns Webdesigner werden immer grösser. Einerseits möchten Surfer auf Ihren Smartphones eine Website abrufen können und zwar so, dass sie die Texte lesen und die Navigation bedienen können. Am anderen Ende der Skala gibt es immer grössere und höher aufgelöste Bildschirme, und auch auf ihnen sollte eine Website attraktiv dargestellt werden. Wie löst man dieses Problem?


Die Lösung der Vergangenheit

Bis jetzt haben Firmen und Verbände, die auf allen Medien optimal präsent sein wollten, zwei Websites geführt – eine für Bildschirme und eine für Smartphones. Das hat den Vorteil, dass unterschiedliche Inhalte eingegeben werden können. Der Nachteil ist, dass zwei Content Management Systeme geführt werden und damit viele Daten doppelt erfasst werden müssen.


Die neue Lösung

Mit dieser Doppelarbeit ist Schluss. Neue «intelligente» Templates sind in der Lage, die Auflösung und Art des Bildschirms abzufragen und dann die entsprechende Darstellungsform zu wählen. Das geht blitzschnell. So kannst Du mit einem Content Management System erreichen, dass auf allen Ausgabegeräten eine optimale Darstellung gewährleistet ist.


Ein Beispiel

Kraftwerk Fitness und Physio Thayngen hat uns mit der Erstellung einer neuen Homepage beauftragt. Schnell war klar, dass es wichtig ist, ihre Homepage auch auf Mobilgeräten optimal betrachten zu können. Zusammen mit unserem Technologiepartner InnoTix haben wir die Website realisiert. Es sind noch nicht ganz alle Texte eingearbeitet, doch man kann schon einen Blick auf die Homepage werfen:

The Future

Web designers are facing increasingly bigger challenges. Web surfers want to go to websites on their smart phone and be able to read texts and navigate easily. At the same time you want your website to be displayed in excellent quality on large computer screens with a high resolution. How can both be achieved?


Past Solutions

Companies and organizations who wanted to be best presented on all digital media used to decide for two different websites, one for computer screens and one for smart phones. That allows you to feed the website with two different contents. But it also means that two content management systems have to be maintained, data has to be processed for two sites and the amount of work almost doubles.


The New Solution

No more of that double effort. The new «intelligent» templates can scan the resolution and nature of the screen they are connecting to and instantly choose the form of display needed. A content management system using this technique guarantees you optimal display results on all devices.


A Sample

Kraftwerk Fitness und Physio Thayngen, a local fitness studio, commissioned us to design their new home page. We realized right away that their customers needed to be able to browse their website comfortably on a mobile device. Our technology partner InnoTix helped us to build their website. Some contents still have to be filled in but there is already a lot to discover:

 So präsentiert sich die Homepage auf einem Bildschirm. Je nach Browserfenstergrösse wird der Content kleiner oder grösser dargestellt. This is how you see the home page on a computer screen. The size of the contents adjusts to the size of the browser window   

So präsentiert sich die Homepage auf einem Bildschirm. Je nach Browserfenstergrösse wird der Content kleiner oder grösser dargestellt.
This is how you see the home page on a computer screen. The size of the contents adjusts to the size of the browser window

 

 So sieht die Homepage auf dem Smartphone aus. Links die Startansicht, rechts die Ansicht mit ausgeklappter Navigation. Die Schrift und die Navigationselemente sind im Vergleich zu den Bildern grösser als auf dem Computerbildschirm, damit der Inhalt lesbar ist und die Navigation problemlos bedient werden kann. On a smart phone the home page is displayed like this. On the left you see the start window and on the right the navigation bars. In relation to the pictures script and navigation elements are bigger than on a computer screen, which helps when reading the texts and navigating the subpages.   

So sieht die Homepage auf dem Smartphone aus. Links die Startansicht, rechts die Ansicht mit ausgeklappter Navigation. Die Schrift und die Navigationselemente sind im Vergleich zu den Bildern grösser als auf dem Computerbildschirm, damit der Inhalt lesbar ist und die Navigation problemlos bedient werden kann.
On a smart phone the home page is displayed like this. On the left you see the start window and on the right the navigation bars. In relation to the pictures script and navigation elements are bigger than on a computer screen, which helps when reading the texts and navigating the subpages.

 

Webdesign mit Zukunft

Responsives Webdesign ist die Zukunft, denn die Vielzahl an Ausgabegeräten wird nicht ab-, sondern zunehmen. Mit einer responsiven Weblösung von uns bist Du technologisch auf dem neuesten Stand.

Und selbstverständlich ist auf einer responsiven Plattform von Newsslidern über Onlineshops bis hin zu datenbankbasierten Anwendungen alles möglich. The sky – or the budget  – is the limit ;-). Kontaktiere uns bei Bedarf für ein unverbindliches Beratungsgespräch.

Web Design with a Future

Responsive web design is the future because the variety of user devices for browsing the internet will rather increase than decrease. With a website solution including responsive design you are technologically most advanced and can face this challenge.

On a responsive platform you also can realize all applications from news sliders over online shops to apps using data bases. The sky – or the budget - is the limit ;-). Contact us for free consultation.