Haben Sie sich gefragt: "Was ist responsives Webdesign?" Responsives Webdesign ist ein Ansatz, bei dem ein Designer eine Webseite erstellt, auf die "reagiert" oder die Größe des Objekts geändert wird. Dies kann ein übergroßer Desktop-Computer-Monitor, ein Laptop oder Geräte mit kleinen Bildschirmen wie Smartphones und Tablets sein.
Responsive Webdesign ist zu einem unverzichtbaren Werkzeug für jeden mit digitaler Präsenz geworden. Mit dem Wachstum von Smartphones, Tablets und anderen mobilen Computergeräten verwenden immer mehr Menschen kleinere Bildschirme, um Webseiten anzuzeigen.
$config[code] not foundDiese Websites müssen auch den von Google im April 2018 angekündigten Mobile-First-Index berücksichtigen. Da immer mehr kleine Unternehmen ihre mobile Präsenz erhöhen, müssen ihre Website, ihr E-Commerce, die Google Business-Seite, ihre Social-Media-Seiten und andere Assets für alle leicht zugänglich sein Geräte.
Was ist Responsive Web Design?
Der Zweck des responsiven Designs besteht darin, eine Site zu haben, jedoch mit unterschiedlichen Elementen, die auf Geräte unterschiedlicher Größe unterschiedlich reagieren.
Nehmen wir eine traditionelle "feste" Website. Wenn die Website beispielsweise auf einem Desktop-Computer angezeigt wird, werden möglicherweise drei Spalten angezeigt. Wenn Sie dasselbe Layout jedoch auf einem kleineren Tablet anzeigen, müssen Sie möglicherweise horizontal scrollen, was den Benutzern nicht gefällt. Oder Elemente werden möglicherweise nicht angezeigt oder sind verzerrt. Die Auswirkungen werden auch dadurch erschwert, dass viele Tablets entweder im Hochformat oder seitlich im Querformat angezeigt werden können.
Auf einem kleinen Smartphone-Bildschirm können Websites noch schwieriger zu sehen sein. Große Bilder können das Layout „beschädigen“. Websites können auf Smartphones nur langsam geladen werden, wenn sie stark grafikfähig sind.
Wenn jedoch eine Site Responsive Design verwendet, wird die Tablet-Version möglicherweise automatisch so angepasst, dass nur zwei Spalten angezeigt werden. Auf diese Weise ist der Inhalt lesbar und leicht zu navigieren. Auf einem Smartphone wird der Inhalt möglicherweise als einzelne Spalte angezeigt, möglicherweise vertikal gestapelt. Oder möglicherweise hat der Benutzer die Möglichkeit, über andere Spalten zu streichen. Die Größe der Bilder wird geändert, anstatt das Layout zu verzerren oder abgeschnitten zu werden.
Der Punkt ist: Mit Responsive Design passt sich die Website automatisch an das Gerät an, in dem der Betrachter es sieht.
Wie funktioniert Responsive Web Design?
Responsive Sites verwenden Fließgitter.Alle Seitenelemente werden nicht nach Pixeln, sondern nach Proportionen bemessen. Wenn Sie also drei Spalten haben, würden Sie nicht genau sagen, wie breit die Spalten sein sollen, sondern eher, wie breit sie im Verhältnis zu den anderen Spalten sein sollten. Spalte 1 sollte die Hälfte der Seite beanspruchen, Spalte 2 sollte 30% und Spalte 3 etwa 20% betragen.
Medien wie Bilder werden ebenfalls relativ skaliert. Auf diese Weise kann ein Bild innerhalb der Spalte oder des relativen Gestaltungselements bleiben.
Verwandte Themen
Maus v. Berührung: Beim Entwerfen für mobile Geräte wird auch das Problem der Maus gegenüber der Berührung thematisiert. Auf Desktop-Computern hat der Benutzer normalerweise eine Maus zum Navigieren und Auswählen von Elementen. Auf einem Smartphone oder Tablet verwendet der Benutzer meist Finger und berührt den Bildschirm. Was mit einer Maus leicht auswählbar erscheint, ist mit einem Finger an einer winzigen Stelle auf dem Bildschirm möglicherweise schwer zu wählen. Der Webdesigner muss "touch" berücksichtigen.
Grafik- und Downloadgeschwindigkeit: Außerdem gibt es das Thema Grafik, Anzeigen und Download-Geschwindigkeit. Auf Mobilgeräten ist es möglicherweise ratsam, weniger Grafiken anzuzeigen als für Desktopansichten, sodass das Laden einer Website auf einem Smartphone nicht ewig dauern kann. Größere Anzeigengrößen müssen möglicherweise gegen kleinere Anzeigen ausgetauscht werden.
Apps und mobile Versionen: In der Vergangenheit haben Sie möglicherweise darüber nachgedacht, eine App für Ihre Website zu erstellen - beispielsweise eine iPad-App oder eine Android-App. Oder Sie hätten eine mobile Version speziell für BlackBerry.
Bei so vielen verschiedenen Geräten wird es heutzutage immer schwieriger, Apps und unterschiedliche Versionen für jedes Gerät und jede Betriebsplattform zu erstellen.
Warum kleine Unternehmen zu Responsive Web Design wechseln müssen
Immer mehr Menschen nutzen mobile Geräte. Eine kürzlich durchgeführte Pew-Studie 778% der Amerikaner besitzen im Jahr 2018 Smartphones. Dies ist ein Anstieg von nur 35% in der ersten Umfrage des Pew Research Center, die 2011 von Smartphones durchgeführt wurde.
Überprüfen Sie Ihre Zugriffe und Sie sind vielleicht schockiert, wie viele Besucher über mobile Geräte auf Ihre Website gelangen. (Wählen Sie in Google Analytics auf der linken Seite "Zielgruppe" und dann "Mobil" aus, um zu sehen, wie viel Verkehr von mobilen Geräten kommt. Sie können sogar einen Drilldown durchführen, um zu sehen, welche Geräte den Verkehr senden.)
Responsive Design-Vorlagen stehen jetzt überall zum Kauf bereit. Wenn Sie beispielsweise eine WordPress-Site haben, können Sie eine seriöse Vorlagengalerie wie ThemeForest besuchen und nach „responsiven WordPress-Themes“ suchen. Kaufen Sie eine für weniger als 50 US-Dollar. Ihr Webentwickler kann ihn dann für Ihr Logo und Ihre Marke anpassen.
Anmerkung des Herausgebers: Hier bei Small Business Trends arbeiten wir an einem neuen responsiven Design. Solltest du nicht
Foto über Shutterstock
Mehr in: Content Marketing, Was ist 95 Kommentare ▼
