Was heißt "sieht immer gut aus?"

Eine mobile Homepage soll
(a) auf allen Geräten und
(b)im Hoch- wie auch im Querformat

- immer gut aussehen
- bestens bedienbar sein
- Inhalte werden sauber dargestellt
- das Zoomen auf der Seite ist nicht erforderlich.

Was ist responsive Programmierung?

Beim responsiven Webdesign wird der Code so angelegt, dass sich das Seiten-Layout der Fenstergröße oder dem Gerät anpasst.

Dieses Web haben wir in responsiver Technik programmiert. Bitte testen Sie selbst: Verändern Sie die Fenstergröße ihres Browsers und Sie werden sehen, dass sich die Darstellung sofort anpasst.

Worauf muss man achten?

Es gibt verschiedene Möglichkeiten, eine responsive Homepage zu erstellen. Da diese Entscheidung ganz am Anfang steht erklären wir die Möglichkeiten unterhalb von diesem Block ganz genau.

- wechseln der Ansicht über Breakpoints
- mobile Homepage mit Browserweiche
- mobile Homepage mit CSS / Mediaquery

Wechseln der Ansicht über Breakpoints

Die kostengünstigste, populärste und technisch einfachste Lösung.
Die Darstellung wird über festgelegte Regeln (Breakpoints) automatisch angepasst.
Eingriffe in den Automatismus sind allerdings aufwändig oder unmöglich.
Ein guter Kompromiss. Je nach Bildschirm und Gerät wird Ihre Homepage nie schlecht, meistens gut, oft auch perfekt aussehen.

(+) responsive Programmierung

+ ein Code - ein Web
+ passt sich stufenlos der Fenstergröße an
+ Optimal, wenn eine komplett neue Webseite erstellt werden soll
+ nicht auf ein spezifisches Gerät ausgelegt
+ kostengünstig, automatisch, unkompliziert

(-) responsive Programmierung

- Die Übergänge sind zwar fließend, sehen aber manchmal gestalterisch nicht perfekt aus, z.B. gibt es oft ewig lange Textblöcke auf Handys.
- manchmal Mängel in der Bildqualität und Ladezeit

TRENDY WEBSITE BLOCKS

Choose from the large selection of latest pre-made blocks - full-screen intro, bootstrap carousel, content slider, responsive image gallery with lightbox, parallax scrolling, video backgrounds, hamburger menu, sticky header and more.

Tab heading 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque quis quam in risus pulvinar ultrices eget non sem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae proin accumsan odio.

Tab heading 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque quis quam in risus pulvinar ultrices eget non sem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae proin accumsan odio.

Tab heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque quis quam in risus pulvinar ultrices eget non sem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae proin accumsan odio.

Mobile Homepage mit Browserweiche

Bei einer Browserweiche haben Sie mindestens zwei Webseiten vorliegen: Eine für den Desktop-PC und einmal für die kleineren Geräte wie Tablets und Smartphones. Über einen speziellen Code wird das Gerät, das Ihre Seite besucht, zuerst ermittelt und dann auf die entsprechende Webseite umgeleitet. So kann man genau steuern, auf welchem Gerät die Seite wie dargestellt werden soll.

(+) Browserweiche

+ unabhängiges Aussehen und Inhalte für die jeweiligen Geräte
+ Darstellung kann genau gesteuert werden
+ Optimal für umfassende, vorhandene Webseiten, die eine mobile Version bekommen sollen
+ Der Seiteninhalt kann mehrfach beschrieben werden. Google mag das.

(-) Browserweiche

- es werden mehrere Webs benötigt: doppelte Seiten, doppelte Arbeit.
- keine stufenlose Anpassung an Fenstergröße
- längere Entwicklungszeit

TRENDY WEBSITE BLOCKS

Choose from the large selection of latest pre-made blocks - full-screen intro, bootstrap carousel, content slider, responsive image gallery with lightbox, parallax scrolling, video backgrounds, hamburger menu, sticky header and more.

Tab heading 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque quis quam in risus pulvinar ultrices eget non sem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae proin accumsan odio.

Tab heading 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque quis quam in risus pulvinar ultrices eget non sem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae proin accumsan odio.

Tab heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque quis quam in risus pulvinar ultrices eget non sem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae proin accumsan odio.

Mobile Homepage mit CSS Mediaquery

Bei der CSS Mediaquery (Gerätesteuerung) wird der Seiteninhalt eines Webs je nach Gerät (Desktop-PC und/oderTablets und Smartphones) jeweils anders geliefert. Es gibt nur ein einziges Web, welches sich jeweils anders darstellt.
Dabei können, anders als im responsiven Web, je nach Gerät auch ganz unterschiedliche Seiteninhalte geliefert werden. So kann man z.B. auf der PC- Webseite eine Diashow haben, im mobilen Web aber ein statt dessen statisches Bild.

(+) Browserweiche und CSS Mediaquery

+ unabhängiges Aussehen und Inhalte für die jeweiligen Geräte
+ Darstellung kann genau gesteuert werden
+ Der für Mobilgeräte optimierte Code wird aus dem bestehenden Code automatisch erstellt.

(-) Browserweiche und CSS Mediaquery

- die Gestaltung und Programmierung ist anfangs aufwändiger
- keine stufenlose Anpassung an Fenstergröße
- längere Entwicklungszeit

TRENDY WEBSITE BLOCKS

Choose from the large selection of latest pre-made blocks - full-screen intro, bootstrap carousel, content slider, responsive image gallery with lightbox, parallax scrolling, video backgrounds, hamburger menu, sticky header and more.

Tab heading 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque quis quam in risus pulvinar ultrices eget non sem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae proin accumsan odio.

Tab heading 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque quis quam in risus pulvinar ultrices eget non sem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae proin accumsan odio.

Tab heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque quis quam in risus pulvinar ultrices eget non sem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae proin accumsan odio.

Responsives Webdesign:
WEITERE FRAGEN DAZU

Können vorhandene Homepages optimiert werden?

Ja, und bei Neukunden starten wir kostenlos. Zunächst geht es um den IST-Zustand Ihrer Homepage. Wir durchleuchten Konzept, Erscheinung, Usability, Suchmaschinenfreundlichkeit oder Technik. Folgend geht es darum, welche Möglichkeiten Ihnen bei behutsamer Änderung oder radikalem Neuaufbau offen stehen würden.

Nehmen Sie meine Homepage in Pflege?

a, wir pflegen auch Webseiten, welche nicht von uns erstellt wurden. Allgemeine Pflege, Suchmaschinen-Optimierung (SEO) und Aktualisierung von wechselnden Inhalten sind bei uns Tagesgeschäft.

Bekomme ich eine kostenlose Beratung?

Ja. Alle Neukunden bekommen bei uns zunächst eine ausführliche und kostenlose Beratung.

Das Thema kann sich dabei um Website, Homepage-Inhalte (Content), Benutzerführung oder Suchmaschinenoptimierung (SEO) drehen.

Würden Sie meine Homepage mal begutachten?

Ja. Die meist kostenlose Begutachtung einer Homepage kann sich zum Beispiel auf Webdesign und Optik beziehen, gerne aber auch zum Content (Seiteninformationen) oder zu technischen Fragen Stellung nehmen.

Gerne schauen wir uns auch mal ihre Konkurrenz genau an und untersuchen deren Stärken und Schwächen.

Wie geht die Abwicklung eines Auftrages?

Unsere Inhouse Kernkompetenz liegt in der Konzeption, Idee und Gestaltung von Marken, Unternehmensbild und Kommunikation.

Sie bekommen nur einem einzigen verantwortlichen Ansprechpartner, den Chef.

Wir machen alles kreative, wie Design, Fotografie, Illustration und Text selbst. Außerdem die technische Betreuung unserer Projekte, sowie das Coden kleinerer Webseiten, LandingPages und OnePager.

Größere Projekte, E-Commerce-Projekte, Online-Shops, u.ä. werden über das Agenturnetzwerk im In- und Ausland umgesetzt.

duktus. Webagentur, Vendelaustr. 37, 72622 Nürtingen, Kreis Esslingen. Das ist bei Stuttgart.

Von Metzingen kommend fahren Sie über die B313. Vor der 1. Neckar Brücke biegen Sie nach rechts auf die B297 Richtung Nürtingen Innenstadt ab und folgen dem Straßenverlauf. An der 3. Kreuzung am Amtsgericht Nürtingen fahren Sie geradeaus in die Vendelaustraße.

Von Weilheim kommend fahren Sie auf die A8 bis Ausfahrt Kirchheim-Teck West und dann links auf der B297 Richtung Nürtingen
...weiter wie von Kirchheim kommend.

Von Kirchheim-Teck kommend fahren Sie durch Reudern und dann bergab ins Neckartal. Wenn die Straße wieder eben wird, nehmen Sie die 3. Ampel halb rechts (B297), dann die 2. Straße links (Jakobstraße). Dort können Sie parken und zur Ecke Vendelaustraße 37 zu Fuß gehen.

Von Filderstadt kommend fahren Sie auf der Autobahn Richtung München bis zur Ausfahrt Wendlingen Nürtingen. Dort auf die B313 Richtung Nürtingen
... weiter wie von Esslingen kommend.

Von Esslingen kommend nehmen Sie die B10 über Esslingen. Bei Plochingen biegen Sie auf die B313 Richtung Nürtingen Wendlingen.

Am Ortsanfang Nürtingen nehmen Sie die 1. Brücke links durch das Gewerbegebiet Zizishausen Richtung Innenstadt Nürtingen. Sie folgen der Straße jedoch geradeaus konsequent bis zur T-Kreuzung. Am Ende biegen Sie rechts Richtung Nürtingen Stadtmitte auf die B297, dann erste halb rechts und 2. links in die Jakobstraße. Dort parken und zu Fuß zum Eckhaus Vendelaustr. 37.

Barrierefreies Webdesign für Nürtingen: