{"id":482,"date":"2012-09-12T09:05:49","date_gmt":"2012-09-12T08:05:49","guid":{"rendered":"http:\/\/diesesinternet.de\/blog\/?p=482"},"modified":"2013-07-09T14:10:46","modified_gmt":"2013-07-09T13:10:46","slug":"redesign-wildwings-de","status":"publish","type":"post","link":"https:\/\/www.diesesinternet.de\/blog\/redesign-wildwings-de\/","title":{"rendered":"Redesign wildwings.de"},"content":{"rendered":"<p><img loading=\"lazy\" class=\"alignnone size-medium wp-image-642\" alt=\"ww2012\" src=\"http:\/\/diesesinternet.de\/blog\/wp-content\/uploads\/2012\/09\/ww2012-300x213.jpg\" width=\"300\" height=\"213\" \/><\/p>\n<p>Zwei Jahre sind seit dem letzten gr\u00f6\u00dferen Update vergangen, seit gestern ist nun die neue Website der <a href=\"http:\/\/www.wildwings.de\" target=\"_blank\">Schwenninger Wild Wings<\/a> online. Technisch basiert die Site weiterhin auf dem Open Source CMS Typo3. In der t\u00e4glichen redaktionellen Arbeit hat sich Typo3 bew\u00e4hrt, das System l\u00e4uft stabil und die x selbst-entwickelten oder zumindest angepassten Erweiterungen w\u00e4ren eine Menge Migrations-Holz. Ausserdem haben wir mit Matthias eine ausgewiesene Koryph\u00e4e der Typo3 Administration in unseren Reihen.<br \/>\n<!--more--><br \/>\nWas sich ge\u00e4ndert hat ist das Layout der Site. Und damit meine ich nicht einfach nur das &#8222;Aussehen&#8220;, das Design der Seite. Denn, seien wir ehrlich, ob die Boxen mit Ergebnissen, Tabelle etc links oder recht angeordet sind, interessiert Otto-Normalfan herzlich wenig. Trotzdem war es an der Zeit f\u00fcr einen Fr\u00fchjahrsputz. Im Laufe der Zeit altert vor allem die Startseite einer Webpr\u00e4senz merklich. Inhalte \u00e4ndern sich, passen nicht mehr ins urspr\u00fcnglich geplante Raster, neue Inhalte m\u00fcssen meist quick and dirty eingebaut werden (Nach dem Motto &#8222;kannsch mol schnell&#8230;&#8220;). All das f\u00fchrt zu einem unruhigen Seitenaufbau und ist der \u00dcbersichtlichkeit wenig zutr\u00e4glich.<\/p>\n<p>Das neue Layout greift zwar die bisherigen Elemente (Sidebar-Boxen, News-Ticker, Quicklinks) auf, wirkt aber deutlich ruhiger und \u00fcbersichtlicher. Als Key-Visual wird nun auch online die von einem Schlagschuss zersplitterne Eisfl\u00e4che verwendet, die auch schon auf Spielplakaten, der Stadionzeitschrift etc verwendet wird.<\/p>\n<p>Was aber wirklich neu ist, spielt sich unter der Haube ab. Das neue Layout basiert auf dem kommenden Webstandard HTML5 und ist &#8222;responsive&#8220; angelegt.<br \/>\nWas bedeutet das nun? Zum ersten bedeutet es, dass \u00e4ltere Browser (vor allem Internet Explorer 6 und 7) in die R\u00f6hre schauen. Diese Browser sind technisch nicht in der Lage, den neuen Standard korrekt umzusetzen. Die Seite bleibt zwar benutzbar, aber nicht in vollem Umfang.<br \/>\nDieser Schritt ist mehr als nur konsquent. IE6\/7 sind \u00fcber Jahre alt und sollte definitv von niemanden mehr verwendet werden. Selbst Microsoft r\u00e4t mittlerweile von deren Benutzung ab. Trotzdem verwenden laut Statistik noch ca 3% der Besucher von wildwings.de diese alten Browser.<\/p>\n<p>Und &#8222;responsive&#8220;? Dieses Buzzword taucht momentan im Bereich der Webentwicklung an jeder Ecke auf. Jede Website MUSS unbedingt und ohne wenn und aber nicht nur &#8222;responsive&#8220; sein, sondern am &#8222;responsivsten&#8220;. Ansonsten kannst du einpacken.<\/p>\n<p>Spass beiseite, &#8222;responsive&#8220; bedeutet einfach, dass sich ein Seitenlayout an das darstellende Medium anpasst. Bis vor kurzer Zeit gab es nur Desktop-Rechner, meist mit einer Bildschirmaufl\u00f6sung von 1024&#215;768 Pixel. Dort musste die Website gut aussehen, alles andere war egal.<br \/>\nMittlerweile gibt es Smartphones, Tablets, Retina Displays und jeden Tag kommen neue Ger\u00e4te hinzu. Und nat\u00fcrlich soll eine Website auch \u00fcberall zumindest benutzbar sein, am besten auch toll aussehen &#8211; und mit eben diesem HTML5 gibt es jetzt auch das entsprechende Werkzeug daf\u00fcr.<\/p>\n<p>Auf wildwings.de \u00e4ussert sich das wie folgt: bei gro\u00dfer Aufl\u00f6sung (&gt; 1024px) erscheint das Key-Visual (&#8222;der Puck&#8220;) als gro\u00dffl\u00e4chiges Hintergrundbild, bei kleineren Aufl\u00f6sungen wird es in der Header-Grafik und der Fusszeile der Seite integriert. Und schrumpft die Aufl\u00f6sung unter 800 Pixel Breite werden die Boxen auf der linken Seite nach oben in den Hauptbereich geschoben. So bleibt die Site auf allen Medien les- und benutzbar.<\/p>\n<p>Noch ist nicht alles perfekt, aber das Fundament f\u00fcr eine zukunftsf\u00e4hige Site sind gelegt!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Zwei Jahre sind seit dem letzten gr\u00f6\u00dferen Update vergangen, seit gestern ist nun die neue Website der Schwenninger Wild Wings online. Technisch basiert die Site weiterhin auf dem Open Source CMS Typo3. In der t\u00e4glichen redaktionellen Arbeit hat sich Typo3 bew\u00e4hrt, das System l\u00e4uft stabil und die x selbst-entwickelten oder zumindest angepassten Erweiterungen w\u00e4ren eine &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/www.diesesinternet.de\/blog\/redesign-wildwings-de\/\" class=\"more-link\"><span class=\"screen-reader-text\">\u201eRedesign wildwings.de\u201c<\/span> weiterlesen<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[35,22,4],"tags":[59,60,44],"_links":{"self":[{"href":"https:\/\/www.diesesinternet.de\/blog\/wp-json\/wp\/v2\/posts\/482"}],"collection":[{"href":"https:\/\/www.diesesinternet.de\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.diesesinternet.de\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.diesesinternet.de\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.diesesinternet.de\/blog\/wp-json\/wp\/v2\/comments?post=482"}],"version-history":[{"count":6,"href":"https:\/\/www.diesesinternet.de\/blog\/wp-json\/wp\/v2\/posts\/482\/revisions"}],"predecessor-version":[{"id":484,"href":"https:\/\/www.diesesinternet.de\/blog\/wp-json\/wp\/v2\/posts\/482\/revisions\/484"}],"wp:attachment":[{"href":"https:\/\/www.diesesinternet.de\/blog\/wp-json\/wp\/v2\/media?parent=482"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.diesesinternet.de\/blog\/wp-json\/wp\/v2\/categories?post=482"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.diesesinternet.de\/blog\/wp-json\/wp\/v2\/tags?post=482"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}