Muhammad Shahbaz Saleem vom Entwickler- und Gründerblog Egrappler stellt eine komplette Website-Vorlage auf der Basis von HTML5/CSS3, sowie jQuery und einigen darauf aufsetzenden Plugins zur freien Verfügung. Das Template namens Onepager ist, wenn man sich mit Optik und Struktur anfreunden kann, ein guter Startpunkt für die eigene Website. Onepager eignet sich besonders für Dienstleister, die… Onepager: Ein kostenloses, responsives HTML5/CSS3-Website-Template weiterlesen
Kategorie: Responsive Design
Mit dem sogenannten Responsive Design ist es möglich, die Inhalte von Websites dynamisch und flexibel darzustellen. Dies gilt insbesondere für Seiten, die mittels HTML5 und CSS3 Media-Queries arbeiten. Dem Betrachter bietet das Responsive Design den Vorteil, dass er die gewünschten Inhalte nun bequem auf unterschiedlichsten Endgeräten wie etwa dem Smartphone oder Tablet betrachten kann, wobei alle Inhalte benutzerfreundlich dargestellt sind können und eine möglichst angenehme Handhabung garantiert ist.
Gerade der steigende Marktanteil von Smartphones und Tablets bringt es mit sich, dass immer mehr Websitebetreiber und Designer umdenken müssen – denn der Zugriff auf Onlineinhalte erfolgt nunmehr nicht mehr nur über den klassischen Desktop-PC. Eine alleinige Bildschirmauflösung von maximal 1000px Breite auf dem Computer ist heute also keinesfalls ausreichend, vielmehr muss auf die verschiedenen Endgeräte Rücksicht genommen werden. Verschiedene Standard-Auflösungen kommen dabei zum Tragen, darunter etwa 3210px bis 480px für Smartphones oder 768px bis 1024px für Tablets.
Die größten Hürden beim Responsive Design hat der Designer zu nehmen. Denn im Gegensatz zur herkömmlichen Entwicklung einer Website ist die flexible Darstellung der Inhalte deutlich zeitintensiver. Die Umsetzung erfordert zahlreiche Tests und immer wieder gilt es zu überprüfen, ob die Änderungen korrekt funktionieren und wie gewünscht angezeigt werden. Das derzeit wohl größte Problem besteht allerdings im Umdenken der Seitenbetreiber – denn vielen fällt es aktuell noch schwer, ihre Website, die oft über viele Jahre hinweg aufgebaut und weiterentwickelt wurde, plötzlich Schritt für Schritt auf das Wesentliche zu reduzieren.
Generell lässt sich jedoch sagen, dass es sich immer lohnt, auf ein Responsive Design umzusteigen, da sonstige Webdesigns als nicht mehr zeitgemäß gelten. Gerade bei einfachen CMS-Systemen wie Wordpress wird der Umstieg mittlerweile jedoch leichtgemacht, dafür sorgen speziell vorgefertigte Templates, die die notwendige Dynamik bereits mitbringen.
Mehr wissen
Responsive HTML5/CSS3-Vorlage für einseitige Websites kostenlos
Das Team von Web Code Builder stellt sein erstes freies responsives Website-Template vor. Es ist von der technischen Seite her dem jüngst hier vorgestellten Justapage nicht unähnlich, sieht aber weit besser aus und ist auch responsiver. Justapage beinhaltete ja lediglich eine mobile.css, die per Mediaquery quasi statisch hätte angesteuert werden müssen. Auch das Template der… Responsive HTML5/CSS3-Vorlage für einseitige Websites kostenlos weiterlesen
Widow Tamer JS: Javascript verbessert Typografie in responsiven Layouts
Der Widow Tamer, zu deutsch Witwenzähmer, kümmert sich um eine spezielle typografische Fragestellung. Von einer Witwe spricht der Entwickler Nathan Ford im Zusammenhang mit seinem Tool dann, wenn am Ende eines Absatzes lediglich eine geringe Zahl von Zeichen übrig bleibt, diese aber dennoch in eine neue Zeile umgebrochen werden. Diese extrem kurze Zeile störe dann… Widow Tamer JS: Javascript verbessert Typografie in responsiven Layouts weiterlesen
Hilfreiche Quellen rund um das mobile Web
Das mobile Web boomt. Die Entwicklung geht mit riesigen Schritten voran und das mobile Internet ist jetzt schon zu einer selbstständigen Richtung im Webdesign geworden. Gute, zuverlässige Tools, Tipps, Quellen, Tutorials und viel mehr zum Thema Mobiles Webdesign braucht man heute mehr als je zuvor. Aus diesem Grunde stellen wir im folgenden Beitrag eine sehr… Hilfreiche Quellen rund um das mobile Web weiterlesen
jQuery Picture steuert Bilder in responsiven Designs zuverlässig
Responsives Design stand nicht von Beginn an auf der Agenda zur Erweiterung des HTML-Standards hin zur Version 5. Und so schlägt man sich auch heute noch mit manchen Fragestellungen eher schlecht als recht herum. Das Thema “Bilder in responsiven Layouts” gehört dazu. An sich sind Bilder über das neue Figure-Tag einzubinden, doch gibt es auch… jQuery Picture steuert Bilder in responsiven Designs zuverlässig weiterlesen
Gridpak generiert Spalten-Layouts für responsives Webdesign
Vor einigen Tagen stellte ich Ihnen Responsify.it vor. Es handelt sich um ein Online-Tool, mit dessen Hilfe man Grids für responsive Layouts generieren kann. Responify.it ist ein hervorragendes Werkzeug, mit dem sich in einer intuitiv bedienbaren UI gut arbeiten lässt. Allerdings kann Responsify.it ausschließlich Designs auf Basis von Prozentwerten erzeugen. Pixelwerte werden nicht unterstützt. Hier… Gridpak generiert Spalten-Layouts für responsives Webdesign weiterlesen