Google Bewertung
5.0

Basierend auf 39 Bewertungen

reDim GmbH | Webdesign, Webentwicklung & Online Marketing
5.0
39 Rezensionen
Profilbild von Thomas Wollenweber
vor einem Monat
Neugestaltung unserer Projektwebseite auf Basis von Joomla war ein höchst erfreuliches Projekt. Gute Kommunikation, technisch einwandrei, schnelle Umsetzung, innerhalb des Budgets. Was will man mehr?
Thomas Wollenweber
Profilbild von ronnie berzins
vor einem Monat
Der "cookie hint" ist einfach genial. DafĂŒr an dieser Stelle danke fĂŒr die tolle und dazu noch kostenlose Erweiterung.
ronnie berzins
Profilbild von Rob Bots
vor einem Monat
Es ist eine Freude mit reDim zusammen arbeiten zu können. Ihre besondere Schlagkraft zeigt sich durch ein Team von meist jungen Experten aus, die sich untereinander sehr gut bereichern und ergĂ€nzen. Sie sind modern in ihren AnsĂ€tzen, offen fĂŒr Neues und auch sehr flexibel. Man bekommt den Eindruck, dass sie nicht nur ihre Arbeit professionell erledigen, sondern dabei unbedingt ihre Kunden zufrieden stellen möchten. Entsprechend fĂŒhlt man sich bei reDim gut aufgehoben und es war richtig, mich fĂŒr dieses junge und bewegliche Team zu entscheiden. onlinecoaching-manager.de / Rob G. M. Bots / Trainer und Coach
Rob Bots
Profilbild von Marcus Berg
vor 2 Monaten
Sehr kompetente und zuverlÀssige Agentur. Die EGV AG arbeitet seit einigen Jahren erfolgreich mit reDim zusammen.
Marcus Berg
Profilbild von Biker ́s Point Fuchs
vor 3 Monaten
reDim betreut uns bei unserer Internetseite und unserem Onlineshop. Zudem haben wir hier unsere E-Mail Signaturen fertigen lassen. Bei Fragen oder Problemen wird immer schnell und kompetent geholfen, ob per Telefon, E-Mail oder Fernwartung. Die Kontaktpersonen sind immer nett und freundlich und stets hilfbereit. Wir können die reDim GmbH wÀrmstens weiterempfehlen
Biker ́s Point Fuchs
 

Responsive Webdesign

Optimale Darstellung auf allen EndgerÀten.

https://www.redim.de/images/grafiken/responsive-website.png

Was ist Responsive Webdesign?

Mit dem Wachstum von Smartphones, Tablets und anderen mobilen EndgerÀten nutzen immer mehr Menschen kleinere Bildschirme, um Webseiten zu betrachten.

Heutzutage werden bereits ĂŒber die HĂ€lfte aller Suchanfragen bei Google ĂŒber mobile EndgerĂ€te getĂ€tigt. Das bedeutet gleichzeitig auch eine Umstellung auf eine neue Art von Webdesign, welche ĂŒber einen dynamischen grafischen Aufbau auf die verschiedenen DisplaygrĂ¶ĂŸen - von Desktop bis Smartphone - reagiert.

Responsive Webdesign ist unverzichtbar fĂŒr jede Website!

Responsive Design

Das responsive Design richtet sich nach der BildschirmgrĂ¶ĂŸe und -ausrichtung des verwendeten EndgerĂ€ts und Ă€ndert somit das Layout entsprechend. Dabei werden alle Elemente der Website, einschließlich MenĂŒs, Inhalte, Bilder, etc. berĂŒcksichtigt und skaliert. Das Ziel besteht darin, Webseiten benutzerfreundlicher zu gestalten. Dies erfordert unterschiedliche Ansichten, die den jeweiligen GerĂ€ten angepasst werden mĂŒssen.

Bedeutung von „Responsive Webdesign“

"Form follows function" - beim Responsive Webdesign folgen Funktion, Designkonzept und Inhalt der betreffenden Bildschirmauflösung des verwendeten Desktop, Tablet oder Smartphone.

Der Begriff Responsive Webdesign bedeutet im ĂŒbertragenen Sinne "reagierendes Webdesign". Inhalts- und Navigationselemente sowie der strukturelle Aufbau einer Website passen sich der Bildschirmauflösung des mobilen EndgerĂ€ts an – es reagiert auf die Auflösung des mobilen EndgerĂ€ts.

Die Idee dahinter ist, dass Design und Entwicklung auf Verhalten sowie Umgebung des Nutzers reagieren sollen. Fluid grids, fluid images und Media Queries sind die drei technischen Zutaten fĂŒr responsives Webdesign, erfordern aber auch eine andere Denkweise. Wenn z. B. die Benutzerziele fĂŒr Ihre mobile Website begrenzter sind als die Desktop-Entsprechungen, kann es sinnvoll sein, unterschiedliche Inhalte fĂŒr beide bereitzustellen.

57% der Suchanfragen sind heutzutage mobil

Die mobile Suche ist, was das Traffic-Volumen betrifft, inzwischen wichtiger als die Suche ĂŒber den herkömmlichen PC. Aktuelle Zahlen von Brightedge zeigen, was das fĂŒr Website-Betreiber heißt.

Die BrightEdge-Studie aus dem Jahr 2017 kommt demnach zu dem Ergebnis, dass 57% der gesamten Suchanfragen inzwischen ĂŒber Smartphone und Tablet abgewickelt werden. Mit der Studie wird der starke und anhaltende Trend zur mobilen Suche bestĂ€tigt. 

Die Zahlen untermauern, wie wichtig es fĂŒr Unternehmen heute ist, die mobile Seite ihrer InternetprĂ€senz zu pflegen.

Suchanfragen Diagramm von Mobile und Tablet / Desktop

Wie funktioniert Responsive Webdesign?

Es gibt mehrere Möglichkeiten, Responsive Webdesign zu implementieren. Eine Methode besteht darin, die Plattform des Benutzers (z. B. Tablet oder Smartphone) dynamisch zu erkennen und spezifische HTML- und CSS-Dateien fĂŒr das entsprechende GerĂ€t zu laden. Alle Seitenelemente werden nach Proportionen und nicht nach Pixeln sortiert.

Beispiel: Wenn ein dreispaltiges Layout dargestellt werden soll, wird nicht die breite einer einzelnen Spalte angegeben. Stattdessen wir nur das VerhÀltnis zu den anderen Spalten angegeben.

Spalte 1 sollte die halbe Seite einnehmen, Spalte 2 sollte 30% und Spalte 3 beispielsweise 20% einnehmen. Medien wie Bilder werden ebenfalls relativ verkleinert. Auf diese Weise kann ein Bild innerhalb seiner Spalte oder seines relativen Designelements bleiben.

Eine andere Option ist die Verwendung von Media Queries, bei denen abhĂ€ngig von der GrĂ¶ĂŸe des Browserfensters automatisch unterschiedliche CSS-Stile geladen werden. Ein hĂ€ufig im Responsive Webdesign verwendetes Framework ist Bootstrap. Es enthĂ€lt mehrere JavaScript- und CSS-Dateien die auf Media Queries basieren und somit ein gutes Fundament fĂŒr eine Responsive Website bieten.

Vorteile von responsive Design

ZukunftsfÀhig

ZukunftsfÀhiger Internetauftritt

Die Online-PrÀsenz ist ihr AushÀngeschild im Web und reprÀsentiert ihr Unternehmen. Ein seriöser und mobiltauglicher Internetauftritt steigert die Bekanntheit und gewinnt neue Kunden.

Besseres Ranking im mobilen Suchindex

Besseres Ranking im Google Index

Mit einer Responsive Website profitieren Sie von einer höheren Sichtbarkeit in der Suchmaschine. Außerdem verbessert sich dadurch die Usability der Website.

Zufriedene Nutzer

Zufriedene Nutzer

Internetnutzer werden immer anspruchsvoller. Sie sind es gewöhnt, dass alles schnell und einwandfrei funktioniert. Eine gute User-Experience auf dem mobilen EndgerÀte ist somit Pflicht.

Einmalige Integration

Einmalige Integration

Das Responsive Webdesign wird einmalig integriert und funktioniert anschließend fĂŒr mobile EndgerĂ€te jeglicher Auflösung. Es mĂŒssen keine weiteren Ansichten erstellt werden.

Responsive Design

Optimale Nutzung auf allen EndgerÀten

Die Webseite lĂ€sst sich auf allen EndgerĂ€ten einwandfrei benutzen und sieht immer optimal aus. Individuelle Elemente sorgen fĂŒr eine hohe Benutzerfreundlichkeit.

Geringe Ladezeiten auf mobilen EndgerÀten

Geringere Ladezeiten auf mobilen EndgerÀten

Eine gute mobile Internetverbindung ist nicht immer garantiert. Auf Smartphone- oder Tablet-Ansichten werden daher nur die wichtigsten Elemente angezeigt.

Interesse an Responsive Webdesign? Nehmen Sie unverbindlich Kontakt mit uns auf.

JETZT KONTAKTIEREN!

Die 3 Zutaten von Responsive Webdesign

  • Feste Einheitsangaben vermeiden

    Responsive Design lebt von Dynamik. Eine Webseite muss sich an viele verschiedene BildschirmgrĂ¶ĂŸen richten, es macht also nur Sinn, Einheitsangaben wie zum Beispiel em, rem oder % anstatt px fĂŒr die SchriftgrĂ¶ĂŸe zu nutzen, da diese relativ im VerhĂ€ltnis zum Eltern-Element oder HTML-Element berechnet werden. Es muss also nicht auf jede BildschirmgrĂ¶ĂŸe nochmal einzeln eingegangen werden. Genauso verhĂ€lt es sich mit BildgrĂ¶ĂŸenangaben. Wenn man einem Bild eine feste Angabe von 800px in der Breite macht, wird das Bild nicht komplett auf dem MobilgerĂ€t zu sehen sein und die Seite lĂ€sst sich nach rechts scrollen, was immer ein schlechtes Zeichen ist.

  • Dynamische Grid Systeme nutzen

    UnabhĂ€ngig von EndgerĂ€t oder BildschirmgrĂ¶ĂŸe fließen die Komponenten in bei Grid Systemen und passen sich der Benutzerumgebung an. Man definiert man eine maximale LayoutgrĂ¶ĂŸe fĂŒr das Design. Das Raster ist in eine bestimmte Anzahl von Spalten unterteilt, um das Layout sauber und einfach zu halten. Dann wird jedes Element einzeln entworfen - mit proportionalen Breiten und Höhen anstelle von pixelbasierten und statischen Dimensionen. Wenn also die GerĂ€te- oder BildschirmgrĂ¶ĂŸe geĂ€ndert wird, passen die Elemente ihre Breite und Höhe an den ĂŒbergeordneten Container an.

  • Auf die wesentlichen Elemente reduzieren

    Da auf dem Desktop mehr Platz ist, neigt man auch dazu, mehr Spielereien und auflockernde Elemente einzubauen. Der Smartphone-Benutzer braucht keinen Schnick-Schnack – in der Regel möchte er sich schnell ĂŒber das Unternehmen informieren, vielleicht sogar nur die Öffnungszeiten oder Kontaktdaten ansehen. Es ist also von Vorteil, diese Informationen gut sichtbar auf der mobilen Version zu platzieren. Auf Elemente wie eine Slideshow oder riesige Bildergalerien können verzichtet werden – der Benutzer, der gerade nicht im W-Lan ist, sondern ĂŒber mobile Daten surft, wird Ihnen danken!

Warum ist responsive Design so wichtig?

Viele Webmaster besitzen noch eine nicht Responsive Webseite. Doch was bedeutet das fĂŒr die Webseite und wie wirkt sich dies auf das Besucherverhalten oder die Position in Suchmaschinen aus? GrundsĂ€tzlich ist jede Webseite auch von mobilen EndgerĂ€ten aus aufrufbar. Das bedeutet aber nicht, dass die Webseite sich auch optimal bedienen lĂ€sst.

Oft werden bei Webseiten Elemente verwendet, welche auf mobilen EndgerÀten gar nicht oder nur schwer bedienbar sind. Internetnutzer sind sehr anspruchsvoll. Sie sind es gewöhnt, dass alles schnell und einwandfrei funktioniert. Wenn mal etwas nicht klappt, ist der Besucher daher direkt unzufrieden und verlÀsst die Webseite bereits nach kurzer Zeit.

Da jeder Besucher ein potenzieller Kunde ist, sollte das natĂŒrlich nicht passieren. Ein Umstieg oder die Erstellung einer Website mit responsive Design wird damit umso wichtiger. Ein No-Go bei Smartphones oder Tablets, da man dadurch in alle Richtungen scrollen muss, um den Inhalt der Webseite zu sehen. Im Optimalfall bricht alles schön um, sodass die Elemente und der Inhalt auf jedem mobilen EndgerĂ€t, ob Smartphone oder Tablet, optimal bedienbar und lesbar sind.

Responsive Design

Responsive Webdesign lockt potenzielle Kunden an

Local SEO ist ein wichtiges Stichwort, wenn es um responsive Webdesign geht. Es bedeutet im Grunde, dass man seine WebprĂ€senz fĂŒr lokale Suchanfragen optimiert. Das gilt zum Beispiel fĂŒr Suchanfragen wie „Restaurant Frankfurt“, aber auch „Restaurant“ allein reicht Google schon aus, um dem Suchenden Restaurants in unmittelbarer Umgebung zu prĂ€sentieren.

Laut einer Studie von Google zum lokalem Suchverhalten besucht die HĂ€lfte aller Personen, die eine Suchanfrage mit lokaler Intention getĂ€tigt haben (Öffnungszeiten, Adresse), spĂ€testens am nĂ€chsten Tag genau dieses GeschĂ€ft. Ganze 18% davon werden innerhalb eines Tages zu Kunden. Egal ob Ärzte, Restaurants oder GeschĂ€fte – die potenziellen Kunden informieren sich gerne online, bevor sie ein GeschĂ€ft aufsuchen. Hier kann man mit einer mobil optimierten Webseite punkten.

Mobile, Responsive oder Adaptive Webdesign - Wo liegt der Unterschied?

Nicht jede Webseite, die sich von selbst an die BrowsergrĂ¶ĂŸe anpasst, ist wirklich responsive. Keine Panik: Auch Profis tun sich schwer, bei den vielen Synonymen fĂŒr anpassungsfĂ€hige Webseiten.

Mobile Website

Alternativ zum Responsive Webdesign kann auch eine eigenstĂ€ndige mobile Website entwickelt werden. Diese ist dann meist unter einer Subdomain erreichbar. Allerdings ist der Aufwand fĂŒr eigenstĂ€ndige mobile Domains deutlich grĂ¶ĂŸer. So mĂŒssen hĂ€ufig eigenstĂ€ndige Inhalte gepflegt werden.

Adaptive Webdesign

adaptive = anpassungsfÀhig

Bei einem Adaptive Layout, werden verschiedene Ansichten fĂŒr exakte Viewports entwickelt. Üblicherweise sind das eine Desktop-Ansicht, eine Tablet-Ansicht und eine Variante fĂŒr Smartphones. Die Abmessungen der verschiedenen Ansichten orientieren sich dabei meist an bestimmten GerĂ€ten. Das iPad und das iPhone werden zu diesem Zweck gern verwendet, da die GerĂ€te einerseits weit verbreitet sind, und darĂŒber hinaus das mobile Internet populĂ€r gemacht haben. Im Grunde genommen wird die Website also fĂŒr diese GerĂ€te optimiert.

Responsive Webdesign

responsive = reaktionsfÀhig

Im Gegensatz zum Adaptive Design, passt sich das Responsive Webdesign flexibel der GrĂ¶ĂŸe des Browserfensters an. WĂ€hrend fixe Breakpoints pro Device-GrĂ¶ĂŸe fĂŒr das richtige Adaptive Design entscheidend sind, verfolgt das Responsive Design den Ansatz, ĂŒber relative GrĂ¶ĂŸen (% oder em) die Ausgabe des Designs zu steuern.

Kann man Responsive Webdesign noch nachrĂŒsten?

Die NachrĂŒstungskosten von einem bestehenden Projekt zu einem responsive, können vergleichbar mit den Kosten fĂŒr die komplette Neuerstellung sein. Daher sollte das Responsive Webdesign schon von Grund auf erfolgen. Eine NachrĂŒstung ist deshalb nicht kosteneffizient, da einzelne Optimierungen aufwĂ€ndiger sind als ein grundsĂ€tzlich sauberer Aufbau des responsive Designs.

Responsive Webdesign und Suchmaschinenoptimiertung

Der Entwicklungsaufwand lohnt sich aus SEO-Sicht, denn er verbessert die User Experience von Nutzern, die ĂŒber ein mobiles EndgerĂ€t online gehen. Dadurch erhöht sich deren Verweildauer, was sich wiederum positiv auf das Ranking der Seite auswirkt. Auch die Absprungrate (Bounce Rate) kann gesenkt werden, da mobile Nutzer besser mit den Webinhalten interagieren und alle gewĂŒnschten Funktionen nutzen können.

Weltkugel, Smartphone mit SEO und Suchfeldeingabe

Zudem bringt das responsive Design den entscheidenen Vorteil, dass fĂŒr die mobil-optimierte Darstellung keine zusĂ€tzliche URL erstellt wird. Dadurch wird der Crawling-Aufwand des Suchmaschinen-Bots kaum erhöht, denn es wird exakt derselbe HTML-Quelltext fĂŒr alle GerĂ€teklassen verwendet. Lediglich die zusĂ€tzlichen Cascading Style Sheets (CSS) Angaben fĂŒhren dazu, dass die Inhalte den verschiedenen Auflösungen angepasst werden. Das bedeutet auch, dass alle Inhalte auf dem selben System basieren und Wartungsarbeiten nicht fĂŒr jedes System separat durchgefĂŒhrt werden mĂŒssen.


Auf den Responsive Websites muss auch Googles Mobile-First-Index berĂŒcksichtigt werden, der nun den Desktop Index als Hauptindex ersetzt. Seit 2018 schaut Google also nicht mehr, ob es zu der Desktop-Version einer Seite auch eine Mobile-Version gibt, sondern umgekehrt, ob es zu der Mobile-Version auch eine Desktop-Variante gibt.

Der Mobile Index und Mobile SEO werden damit massiv aufgewertet. Selbst wenn der grĂ¶ĂŸte Teil der UmsĂ€tze einer Website ĂŒber die Desktop-Version generiert werden, wird Mobile SEO spĂ€testens jetzt zur absoluten Pflicht, da es zukĂŒnftig wahrscheinlich einen direkten Einfluss auf das Crawling der Desktop-Version und damit auf die Desktop-Rankings hat.

Da immer mehr kleine Unternehmen ihre mobile PrĂ€senz erhöhen, mĂŒssen Website, eCommerce-Seiten, Google Business-Seiten, Social-Media-Seiten und andere Inhalte optimiert und leicht zugĂ€nglich fĂŒr alle GerĂ€te sein.

Sollte man bei der Umsetzung eine Agentur beauftragen?

Responsive Webdesign ist seit Jahren ein fester Bestandteil der digitalen Branche - es ist jetzt die Norm.
Jedoch hat nicht jeder das notwendige Know-how, um Responsive Webseiten zu erstellen.

In den letzten Jahren hat die Nachfrage nach Responsive Webdesign stark zugenommen. Mittlerweile ist die Umsetzung von Responsive Webdesign absoluter Standard fĂŒr Agenturen. Sie sind darauf vorbereitet, alle BedĂŒrfnisse und Erwartungen Ihrer Kunden professionell abzudecken. Der Anspruch der User in Bezug auf die mobile Usability ist sehr hoch, daher empfiehlt es sich, eine Agentur zu beauftragen, die das nötige Know-how und Erfahrung im Bereich Webdesign besitzt und das Responsive Design somit professionell umsetzen kann.

Fazit –  FĂŒr wen lohnt sich Responsive Design?

Responsive Webdesign lohnt sich fĂŒr alle, die sicherstellen wollen, dass ihr Webangebot auf allen ZugangsgerĂ€ten optimal angesehen und genutzt werden kann. Zudem sorgt es fĂŒr einen besseren Content, bessere Usability und letztlich auch bessere Performance.

Responsive Webdesign könnte relevant fĂŒr Sie sein, wenn:

  • Ihre Website hĂ€ufig mobil aufgerufen wird
  • Sie ihre Website neu entwickeln oder einen Relaunch geplant haben
  • Suchmaschinenoptimierung fĂŒr Sie ein wichtiger Faktor ist
  • Sie großen Wert auf gute Usability und Benutzerfreundlichkeit legen
Monitor Fenster und Smartphone Ansicht von responsive design

Wenn Sie Ihre Seite allen mobilen GerĂ€ten verfĂŒgbar machen und in der Suchmaschine gefunden werden möchten, dann ist ein Responsive Webdesign unerlĂ€sslich.

Sollte Ihre Website demnach noch nicht mobile-friendly sein, empfehlen wir Ihnen den Umstieg, denn auch wenn die Anpassung Ihrer Webseite mit ein wenig Aufwand verbunden ist, ist eine responsive Webseite schon heutzutage nicht mehr wegzudenken. Es handelt sich hierbei um eine sinnvolle Investition, welche viele Vorteile mit sich bringt.

Mehr Informationen finden Sie auf unserer Webdesign Unterseite.

Sie benötigen eine neue Website?

Fordern Sie jetzt Ihr unverbindliches Angebot an.

ANFRAGE STELLEN

Joomla Partner
IONOS - Offizieller Partner
Newsletter2Go Partner
eRecht24 Partner
...
JETZT BERATEN LASSEN!

Norbert Bayer

+49 (0) 6181 36 96 96 0
team@redim.de

WIR VERWENDEN COOKIES

Wir nutzen Cookies auf unserer Website. Einige von ihnen sind essenziell fĂŒr den Betrieb der Seite, wĂ€hrend andere uns helfen, diese Website und die Nutzererfahrung zu verbessern (Tracking Cookies).

Sie können selbst entscheiden, ob Sie die Cookies zulassen möchten. Bitte beachten Sie, dass bei einer Ablehnung womöglich nicht mehr alle FunktionalitĂ€ten der Seite zur VerfĂŒgung stehen.