Menu Icon Dark Cyan

Projekte und Tests - Websites mit und ohne responsivem Webdesign

Das Webdesign ist im Verlauf der Zeit sowohl geschmacklichen wie auch technischen Veränderungen unterworfen. So findet man heutzutage im professionelen oder semiprofessionellen kaum noch Websites, die Frames als technisches Mittel der Gestaltung nutzen. Auch Tabellen haben als Gestaltungsmittel schon lange ausgedient.



Websites mit traditionellem Webdesign

Virtueller Reiseführer Bolivien

Screenshot Website Virtueller-Reisefuehrer-Bolivien

Diese Website verwendet im Rahmen eines eigenen PHP-Menüssystem traditionelle Designtechniken. Der virtuelle Reiseführer Bolivien ist einen Website, die sich schwerpunktmäßig mit den Themen:

befasst.


Reisebericht Bolivien auf nPage

Screenshot Website Reisebericht Bolivien auf hPage / nPage

Beim hPage Homepagebaukasten (früher bekannte unter nPage) kann man entweder eine der vielen vorgefertigten Designvorlagen nutzen oder ein eigenes Design verwenden. Auf dieser Website mit einem Reisebericht zu Bolivien wird eine nPage Designvorlage genutzt. Der Reisebericht Bolivien hat unter anderem die folgenden Schwerpunkte:

Mit Hilfe einer eigenen CSS-Datei wird jedoch versucht, die Navigation für Geräte mit geringer Bildschirmgröße erleichtern.



Designpatch auf nPage

Screenshot Website Designpatch auf hPage / nPage

Beim hPage Homepagebaukasten (früher bekannte unter nPage) kann man entweder eine der vielen vorgefertigten Designvorlagen nutzen oder ein eigenes Design verwenden. Bei den vorgefertigten Designvorlagen gibt es aber keine, die mit einem responsiven Design eine vernünftige Darstellung mit tragbaren Geräten ermöglichen. Auf der Website Designpatch werden unter anderem die folgenden Schwerpunkte behandelt:

Mit Hilfe einer eigenen CSS-Datei wird jedoch versucht, die Navigation für Geräte mit geringer Bildschirmgröße erleichtern.



Websites, die sowohl traditionelles wie auch respronsives Webdesign verwenden.



Websites mit responsivem Webdesign

Skywalk-Webdesign.de

Skywalk-Webdesign.de mit responivem Design

Screenshot Skywalk-Webdesign

Diese Website wurde im Rahmen eines Software-Updates des verwendeten CMS auf responives Webdesign umgestellt. skywalk-webdesign.de ist einen Website, die sich schwerpunktmäßig mit den Themen:

beschäftigt.

Skywalk-Webdesign.de mit responsivem Design auf Basis des Amazium Frameworks - Desktopansicht

Screenshot Skywalk-Webdesign mit Amazium Framework - Desktopansicht

Die responsive Variante dieser Website, die zunächst nur als Designstudie vorliegt, wurde mit dem Amazium-Framework auf Skywalk-webdesign.de umgesetzt.

Skywalk-Webdesign.de mit responsivem Design - Verkleinerte Ansicht

Beispielbild mit class max-img

Sobald man die Bildschirmgröße deutlich verkleinert, wird die horizontale menüleiste zu einem grafischen Button zusammengefasst, der sich mit einem Klick aufklappen lässt.


Freehost-Profi's Blog

Wordpress Blog Freehost-Profi.de

Diese Website verwendet das bekannte, vor allem für Blogs genutzte Content management System Wordpress. Der Freehost-Profi.de-Blog ist einen Website, die sich schwerpunktmäßig mit dem kostenlosen, teilweise auch werbefreiene Webhosting befasst.

Mobile Droppages mit jQuery Mobile

Responsive Website bei Droppages mit jQuery Mobile

Bei diesem neuen Design verwende ich die Technik des Responsiven Webdesigns. Mit dieser Technik soll ereicht werden, dass die Seite mit beinahe jedem Gerät gut lesbar ist.




Tutorial zum responsiven Webdesign

Das Tutorial erklärt Schritt für Schritt, wie man ein responsives Webdesign aufbaut. Dabei wird zunächst davon ausgegangen, dass man keines der gängigen Frameworks wie z.B. Bootstrap oder Amazium nutzt.

Tutorial ansehen und lesen.



Impressum und Kontaktforumular

Impressum lesen Kontaktformular nutzenDatenschutzerklärung lesen.