<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Der Webdesigner - das Magazin</title>
	<atom:link href="http://www.webdesigner-magazin.de/feed" rel="self" type="application/rss+xml" />
	<link>http://www.webdesigner-magazin.de</link>
	<description>Know-how - Coding - Tutorials für Aufsteiger und Profis</description>
	<lastBuildDate>Fri, 17 May 2013 13:18:45 +0000</lastBuildDate>
	<language>de-DE</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.5.1</generator>
		<item>
		<title>Firefox-22-Beta enthält viele Neuerungen</title>
		<link>http://www.webdesigner-magazin.de/3529/news/firefox-22-beta-enthalt-viele-neuerungen</link>
		<comments>http://www.webdesigner-magazin.de/3529/news/firefox-22-beta-enthalt-viele-neuerungen#comments</comments>
		<pubDate>Fri, 17 May 2013 13:09:12 +0000</pubDate>
		<dc:creator>Tobias Henke</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[Beta]]></category>
		<category><![CDATA[Mozilla]]></category>
		<category><![CDATA[Update]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3529</guid>
		<description><![CDATA[Mozilla hat Firefox 22 in einer Betaversion veröffentlicht, die einige große Neuerungen enthält. Unter anderem wird WebRTC  mit allen Bestandteilen in der Standardeinstellung unterstützt und mit Odinmonkey wird Javascript fast so schnell wie nativer Code. Falls in der finalen Version von Firefox 22 keine Funktionen gestrichen werden, die in der jetzt veröffentlichten Betaversion enthalten sind, stellt Firefox 22 ein wirklich großes und wichtiges Update für Mozillas Browser dar. In der Beta von Firefox 22 ist dort WebRTC standardmäßig aktiviert. Das umfasst sowohl get UserMedia, was Web-Apps Zugriff auf Mikrofon und Kamera einräumt, als auch Peerconnection und Datachannels. Peerconnection ermöglicht es, direkte Verbindungen zwischen zwei Browsern herzustellen, ohne dass die Daten über einen Server laufen. So lassen sich beispielsweise in Kombination mit getUserMedia Videotelefonate mit zwei oder mehr Teilnehmern abwickeln, bei denen die Datenströme direkt ausgetauscht werden. Datachannels ermöglichen es zudem, beliebige Daten über solche direkten Verbindungen auszutauschen, nicht nur Audio- und Videostreams. PeerCDN  nutzt dies beispielsweise, um ein verteiltes CDN zu schaffen, bei dem Nutzer auf einer Website eingebundene Inhalte austauschen, um Ladezeiten zu verkürzen und Traffic-Kosten auf Anbieterseite einzusparen. Neben Firefox unterstützt auch Chrome bereits die entsprechende Technik, so dass via WebRTC eine Kommunikation über Browsergrenzen hinweg möglich ist. Die Einbindung von WebRTC ist aber bei weitem nicht die einzige geplante Neuerung. So soll es beispielsweise eine bessere Unterstützung von HTML5 und von hochauflösenden Geräten geben.Detailliertere neuerungen gibt es auf mozilla.de. &#160; &#160; &#160;<div class='yarpp-related-rss'>

Related posts:<ol>
<li><a href='http://www.webdesigner-magazin.de/3293/news/mozilla-hat-firefox-20-veroffentlicht' rel='bookmark' title='Mozilla hat Firefox 20 veröffentlicht'>Mozilla hat Firefox 20 veröffentlicht</a></li>
<li><a href='http://www.webdesigner-magazin.de/3485/news/typo3-hat-version-6-1-veroffentlicht' rel='bookmark' title='TYPO3 hat Version 6.1 veröffentlicht'>TYPO3 hat Version 6.1 veröffentlicht</a></li>
<li><a href='http://www.webdesigner-magazin.de/2459/news/update-zu-flash-schliest-sicherheutslucke' rel='bookmark' title='Update für Flash schließt Sicherheitslücke'>Update für Flash schließt Sicherheitslücke</a></li>
</ol>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3529/news/firefox-22-beta-enthalt-viele-neuerungen/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>SEO WEEK</title>
		<link>http://www.webdesigner-magazin.de/3520/news/seo-week</link>
		<comments>http://www.webdesigner-magazin.de/3520/news/seo-week#comments</comments>
		<pubDate>Fri, 17 May 2013 12:11:51 +0000</pubDate>
		<dc:creator>Sebastian Biada</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[Aktion]]></category>
		<category><![CDATA[community]]></category>
		<category><![CDATA[Seo]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3520</guid>
		<description><![CDATA[Achtung: 20.05. &#8211; 24.05.2013, jeden Tag ein neuer Beitrag zum Thema Suchmaschinenoptimierung (SEO)! Weitere Informationen hier: http://www.der-webdesigner.net/dw/artikel/37-seo-week &#160;<div class='yarpp-related-rss yarpp-related-none'>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3520/news/seo-week/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Kostenloses Update für Windows 8</title>
		<link>http://www.webdesigner-magazin.de/3514/news/kostenloses-update-fur-windows-8</link>
		<comments>http://www.webdesigner-magazin.de/3514/news/kostenloses-update-fur-windows-8#comments</comments>
		<pubDate>Thu, 16 May 2013 14:39:57 +0000</pubDate>
		<dc:creator>Tobias Henke</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[kostenlos]]></category>
		<category><![CDATA[Update]]></category>
		<category><![CDATA[Windows 8]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3514</guid>
		<description><![CDATA[Der US-Softwarekonzern Microsoft hat nach vielen Spekulationen um die Zukunft von Windows 8 bestätigt, dass das bisher unter dem Codenamen &#8220;Blue&#8221; gehandelte Update &#8220;Windows 8.1&#8243; heißen und den Nutzern kostenlos zur Verfügung stehen wird. Eine Vorabversion für Windows 8 und RT soll am 26. Juni veröffentlicht werden, schreibt das Unternehmen in einem Blogbeitrag. Mit dem schnellen Update für das erst Ende Oktober 2012 eingeführte Betriebssystem reagiert Microsoft auf heftige Kritik. Während Anwender nach dem Designwechsel vor allem das gewohnte Startmenü samt Button vermissen, machen Marktforscher Microsoft für die Misere am PC-Markt verantwortlich. Auch große Hersteller waren unzufrieden mit dem neuen Windows. Die Financial Times verglich die Markteinführung mit dem vor 30 Jahren fehlgeschlagenen Versuch von Coca-Cola, eine anderes Rezept für die braunsüße Brause einzuführen – der Getränkeriese musste zurückrudern. Windows 8 hatte sich zunächst sogar recht gut verkauft.<div class='yarpp-related-rss'>

Related posts:<ol>
<li><a href='http://www.webdesigner-magazin.de/2459/news/update-zu-flash-schliest-sicherheutslucke' rel='bookmark' title='Update für Flash schließt Sicherheitslücke'>Update für Flash schließt Sicherheitslücke</a></li>
<li><a href='http://www.webdesigner-magazin.de/3072/news/flash-player-update-behebt-sicherheitslucken' rel='bookmark' title='Flash-Player-Update behebt Sicherheitslücken.'>Flash-Player-Update behebt Sicherheitslücken.</a></li>
<li><a href='http://www.webdesigner-magazin.de/3038/news/verbesserte-gruppenkommunikation-nach-update-fur-den-facebook-messanger' rel='bookmark' title='Verbesserte Gruppenkommunikation nach Update für den Facebook-Messanger'>Verbesserte Gruppenkommunikation nach Update für den Facebook-Messanger</a></li>
</ol>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3514/news/kostenloses-update-fur-windows-8/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5: W3C arbeitet weiter an einer DRM-Schnittstelle</title>
		<link>http://www.webdesigner-magazin.de/3508/news/html5-w3c-arbeitet-weiter-an-einer-drm-schnittstelle</link>
		<comments>http://www.webdesigner-magazin.de/3508/news/html5-w3c-arbeitet-weiter-an-einer-drm-schnittstelle#comments</comments>
		<pubDate>Fri, 10 May 2013 12:15:35 +0000</pubDate>
		<dc:creator>Tobias Henke</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[DRM]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[Netzneutralität]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3508</guid>
		<description><![CDATA[Das World Wide Web Consortium (W3C) hat am Freitag den ersten öffentlichen Entwurf für Encrypted Media Extensions (EME) vorgelegt. EME machen es Inhalteanbietern möglich , Schnittstellen für Rechtemanagement (DRM) in HTML5-basierende Media-Player zu integrieren. Google, Microsoft und der Online-Streamingdienst Netflix arbeiten gemeinsam an den Encrypted Media Extensions. Die Verschlüsselungstechnik selbst ist nicht Bestandteil des Entwurfs. Mit dem neuen Entwurf setzt sich das Webstandards-Gremium über die Kritiker hinweg, die sich rund um die Free Software Foundation (FSF) versammelt haben. Die von der FSF betriebene Anti-DRM-Kampagne Defective by Design&#8221;  hatte unter dem Motto &#8220;We don&#8217;t want the Hollyweb&#8221; Unterschriften gegen diesen &#8220;katastrophalen Entwurf&#8221; gesammelt. Dem FSF und befreundete Organisationen gelang es allerdings nur die Hälfte der geplanten 50.000 Unterstützer mobilisieren. In einemInterview verteidigte der CEO des W3C, Jeff Jaffe, das EME-Konzept. &#8220;Es wird geschützten Content im Web geben&#8221;, erklärte Jaffe. Bisher greifen Inhalteanbieter für DRM in Multimedia auf Flash oder (wie Netflix) auf Silverlight zurück. Das W3C wolle keine abgezäunten Bereiche, denn ein wenig Offenheit und Standardisierung sei besser als gar keine. Silverlight soll es nur noch bis 2021 als Browser-Plug-in geben. Google hat EME bereits in Chrome und Chrome OS integriert, was man auf einer Testseite ausprobieren kann. Netflix arbeitet derzeit an einem HTML5-Player. Dieser hängt jedoch außer von EME noch von Media Source Extensions ab, welche die Auslieferung über Content Delivery Networks (CDN) ermöglichen. &#160;<div class='yarpp-related-rss yarpp-related-none'>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3508/news/html5-w3c-arbeitet-weiter-an-einer-drm-schnittstelle/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Adobe stellt die Creative Suite ein</title>
		<link>http://www.webdesigner-magazin.de/3497/news/adobe-stellt-die-creative-suite-ein</link>
		<comments>http://www.webdesigner-magazin.de/3497/news/adobe-stellt-die-creative-suite-ein#comments</comments>
		<pubDate>Tue, 07 May 2013 11:58:36 +0000</pubDate>
		<dc:creator>Tobias Henke</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[adobe]]></category>
		<category><![CDATA[Creativ Suite]]></category>
		<category><![CDATA[Creative Cloud]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3497</guid>
		<description><![CDATA[Nutzer der Creative Suite werden sich umstellen müssen, denn einen Nachfolger wird es nicht geben. Laut Adobe sollen die Nutzer auf das Abo-Modell der Creative Cloud umsteigen. Die aktuelle CS6 ist die letzte der Reihe. Dies hat das Unternehmen auf der hauseigenen Messe &#8220;Max&#8221; bekanntgegeben. Fehler sollen allerdings weiterhin behoben werden. Adobe legt den Schwerpunkt eindeutig auf die Creative Cloud. Hier wird es im Juni neue Versionen der entsprechenden &#8220;CC-Apps&#8221; geben.Nur bei Fireworks wird es keine Weiterentwicklung geben.<div class='yarpp-related-rss'>

Related posts:<ol>
<li><a href='http://www.webdesigner-magazin.de/2484/news/sicherheitslucke-im-adobe-reader' rel='bookmark' title='Sicherheitslücke im Adobe Reader'>Sicherheitslücke im Adobe Reader</a></li>
<li><a href='http://www.webdesigner-magazin.de/2474/news/februar-patches-von-microsoft-und-adobe' rel='bookmark' title='Februar-Patches von Microsoft und Adobe'>Februar-Patches von Microsoft und Adobe</a></li>
<li><a href='http://www.webdesigner-magazin.de/3493/news/gibt-es-bald-eine-lightroom-version-fur-tablets' rel='bookmark' title='Gibt es bald eine Lightroom-Version für Tablets?'>Gibt es bald eine Lightroom-Version für Tablets?</a></li>
</ol>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3497/news/adobe-stellt-die-creative-suite-ein/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Gibt es bald eine Lightroom-Version für Tablets?</title>
		<link>http://www.webdesigner-magazin.de/3493/news/gibt-es-bald-eine-lightroom-version-fur-tablets</link>
		<comments>http://www.webdesigner-magazin.de/3493/news/gibt-es-bald-eine-lightroom-version-fur-tablets#comments</comments>
		<pubDate>Fri, 03 May 2013 12:30:14 +0000</pubDate>
		<dc:creator>Tobias Henke</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[adobe]]></category>
		<category><![CDATA[Lightroom]]></category>
		<category><![CDATA[Tablet]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3493</guid>
		<description><![CDATA[Adobe arbeitet an einer Tablet-Version des Raw-Entwicklers Lightroom. Das hat Lightroom-Produktmanager Tom Hogarty in einer Episode von Scott Kelbys Video-Blog The Grid gezeigt. Mit dem Tablet-Lightroom soll es möglich sein, Raw-Dateien und nicht etwa die JPEG-Bilder der integrierten Kamera zu bearbeiten Der von Hogarty gezeigte Prototyp zeigt Werkzeuge für Belichtung, Kontrast, Lichter, Schatten, Lebendigkeit, Klarheit, Farbtemperatur, Tönung, Schärfe, Reduzierung von Bildrauschen, Weiß und Schwarz. Das deckt sich weitgehend mit den Grundeinstellungen des Moduls Entwickeln von Lightroom 4 und 5. Mit dem Programm bearbeitete Hogarty in der Show Raw-Dateien aus einer Canon 5D Mark III. Die Grundeinstellungen der Desktop-Version findet man aber alle wieder. Abgesehen von den genannten Werkzeugen kann man Bilder pixelgenau begutachten und beschneiden sowie sortieren und bewerten. Das zeigte Hogarty auf einem iPad 2. Es geht aber ums große Ganze. Das Ziel soll, betonte Hogarty, &#8220;bessere Integration von Web-Angeboten und mobilen Geräten&#8221; in den Lightroom-Workflow sein. &#8220;Ich möchte meine Dateien bearbeiten, wo immer ich bin, ohne an den Schreibtisch gefesselt zu sein.&#8221; Eine wichtige Grundlage für die Tablet-Lösung ist der neue DNG-Standard 1.4, den Adobe zur Photokina vorgestellt hat. Er erlaubt verlustbehaftete Kompression von Raw-Dateien bei Erhalt des vollen Farbumfangs. Änderungen an den Einstellungen komprimierter Raw-Dateien lassen sich später mit den Originalen synchronisieren. Mit einem JPEG-Stellvertreter wären die Änderungen nicht farbecht. Eine erste Anwendung für diese DNG-Option hat Adobe in der Beta von Lightroom gezeigt. Mit Foto-Entwicklung auf dem Tablet hat Adobe mit der App Revel Erfahrungen gesammelt. Auch Photoshop Touch bietet Fotobearbeitung auf iPad und Android-Tablet. Das ist keine große Neuigkeit. Es geht um die Cloud. Im Creative-Cloud-Angebot bietet Adobe seine Software und 20 GByte Online-Speicherplatz zur Miete an. Auch Lightroom lässt sich dort mieten, allerdings kann man seine Fotos und seinen Katalog nicht in der Cloud speichern und mit Lightroom darauf zugreifen.<div class='yarpp-related-rss'>

Related posts:<ol>
<li><a href='http://www.webdesigner-magazin.de/2474/news/februar-patches-von-microsoft-und-adobe' rel='bookmark' title='Februar-Patches von Microsoft und Adobe'>Februar-Patches von Microsoft und Adobe</a></li>
<li><a href='http://www.webdesigner-magazin.de/2484/news/sicherheitslucke-im-adobe-reader' rel='bookmark' title='Sicherheitslücke im Adobe Reader'>Sicherheitslücke im Adobe Reader</a></li>
<li><a href='http://www.webdesigner-magazin.de/1928/news/dreamweaver-cs6-funktionen' rel='bookmark' title='Dreamweaver CS6 / Funktionen'>Dreamweaver CS6 / Funktionen</a></li>
</ol>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3493/news/gibt-es-bald-eine-lightroom-version-fur-tablets/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Sind Tablets bald vom Markt verschwunden?</title>
		<link>http://www.webdesigner-magazin.de/3489/news/sind-tablets-bald-vom-markt-verschwunden</link>
		<comments>http://www.webdesigner-magazin.de/3489/news/sind-tablets-bald-vom-markt-verschwunden#comments</comments>
		<pubDate>Thu, 02 May 2013 12:43:18 +0000</pubDate>
		<dc:creator>Tobias Henke</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[Blackberry]]></category>
		<category><![CDATA[Smartphone]]></category>
		<category><![CDATA[Tablets]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3489</guid>
		<description><![CDATA[Geht es nach dem Chef von Blackberry, wird es bald keine PCs im Tabelt-Format mehr geben. &#8220;Ich glaube nicht, dass es in fünf Jahren noch einen Grund gibt, ein Tablet zu haben. Vielleicht ein großer Bildschirm in ihrem Arbeitsbereich, aber kein Tablet als solches. Tablets sind selbst kein gutes Geschäftsmodell&#8221; sagte Blackberry-Chef Thomas Heins der Nachrichtenagentur Bloomberg Der Hersteller bietet saktuell das Blackberry Playbook an, ein Tablet mit 7-Zoll-Touchscreen, 1-GHz-Prozessor, 1 GByte RAM und einem Gewicht von 425 Gramm. Auf dem Tablet lief das Tablet-Betriebssystem Blackberry Playbook OS mit der Option, später auf das Betriebssystem Blackberry 10 zu aktualisieren. Bisher wurde das Update aber noch nicht ausgeliefert. Erst seit September 2012 gibt es das Blackberry Playbook in Deutschland auch in einer Ausführung mit UMTS-Modem, das es nur mit 32 GByte Speicher gibt. Anders als die Nur-WLAN-Ausführung hat die UMTS-Version einen Prozessor mit einer Taktrate von 1,5 GHz. Heins hat vor Blackberry zum &#8220;absoluten Makrtführer im bereich Mobile-Computing&#8221; machen Mit dem Z10 hat  Blackberry gerade ein Comeback im Smartphone-Markt gestartet. Auch Android-Anwendungen lassen sich auf dem Gerät installieren. &#160;<div class='yarpp-related-rss yarpp-related-none'>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3489/news/sind-tablets-bald-vom-markt-verschwunden/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>TYPO3 hat Version 6.1 veröffentlicht</title>
		<link>http://www.webdesigner-magazin.de/3485/news/typo3-hat-version-6-1-veroffentlicht</link>
		<comments>http://www.webdesigner-magazin.de/3485/news/typo3-hat-version-6-1-veroffentlicht#comments</comments>
		<pubDate>Tue, 30 Apr 2013 12:19:42 +0000</pubDate>
		<dc:creator>Tobias Henke</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[Release]]></category>
		<category><![CDATA[Typo3]]></category>
		<category><![CDATA[Update]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3485</guid>
		<description><![CDATA[Seit heute kann man sich die Version 6.1 des beliebten Content-Management-Systems herunterladen. Der vollständige Name lautet TYPO3 CMS 6.1. Letztes Jahr hatte die für die Entwicklung zuständige TYPO3 Asociation beschlossen, künftig in einem halbjährlichen Rythmus neue Versionen auf den Markt zu bringen. Die neue Version soll sicherer und stabiler werden als die Vorgängerversion. Laut dem Changelog der neuen Version soll es fast 600 Änderungen gegeben haben. Hierzu zählen beispielsweise Verbesserungen beim Extension-Manager. Komplett neue Features wird es in Version 6.1 nicht geben. Auf der Homepage von TYPO3 wird die neue Version wie immer kostenlos zum Download angeboten. &#160;<div class='yarpp-related-rss'>

Related posts:<ol>
<li><a href='http://www.webdesigner-magazin.de/2416/news/die-besten-extensions-fur-typo3' rel='bookmark' title='Die besten Extensions für Typo3'>Die besten Extensions für Typo3</a></li>
<li><a href='http://www.webdesigner-magazin.de/3293/news/mozilla-hat-firefox-20-veroffentlicht' rel='bookmark' title='Mozilla hat Firefox 20 veröffentlicht'>Mozilla hat Firefox 20 veröffentlicht</a></li>
<li><a href='http://www.webdesigner-magazin.de/2452/news/opera-12-14-behebt-absturzursache-des-vorgangers' rel='bookmark' title='Opera 12.14 behebt Absturzursache des Vorgängers'>Opera 12.14 behebt Absturzursache des Vorgängers</a></li>
</ol>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3485/news/typo3-hat-version-6-1-veroffentlicht/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Tutorial: CSS-Grundlagen für responsive Design</title>
		<link>http://www.webdesigner-magazin.de/3448/tutorials-workshops/tutorial-css-grundlagen-fur-responsive-design</link>
		<comments>http://www.webdesigner-magazin.de/3448/tutorials-workshops/tutorial-css-grundlagen-fur-responsive-design#comments</comments>
		<pubDate>Mon, 29 Apr 2013 09:53:03 +0000</pubDate>
		<dc:creator>Tobias Henke</dc:creator>
				<category><![CDATA[Tutorials / Workshops]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[mobile Endgeräte]]></category>
		<category><![CDATA[responsive design]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3448</guid>
		<description><![CDATA[Responsive Design wird häufig als das Nachrüsten einer Nutzeroberfläche für mobile Endgeräte verstanden. Dabei können bereits beim Coden von Desktopseiten verschiedene Dinge implementiert werden, um das Design möglichst flexible zu halten. &#160; Die Ausgabe auf verschiedenen Ausgabegeräten sollte bereits bei der Gestaltung von Webseiten berücksichtigt werden, selbst wenn diese zunächst als reine Desktopseiten konzipiert werden. Seit der Einführung von Smartphone und Tablet-Computer ist im Web Design das &#8220;Responsive Design&#8221; in aller Munde. Und wie bei allen neuen Web-Trends gibt es auch hier so manches Missverständnis. Worum geht es beim Responsive Design eigentlich? Um das Erstellen von Webseitenablegern für mobile Endgeräte? Oder um das Gestalten von drei Versionen für Desktop-Monitor, Tablet-Computer und Smartphone? Eigentlich nicht. Das Wesentliche des Responsive Designs ist die Anpassungsfähigkeit des Layouts einer Website an verschiedene Viewports. Ein alternativer Begriff, der dieses Konzept besser verdeutlicht, ist der des &#8220;Liquid Designs&#8221;, denn das Ziel dieses Gestaltungsansatzes ist, ein Layout zu entwickeln, der automatisch jedes erdenkliche Displayformat optimal für die Darstellung der Inhalte nutzt. Dies betrifft sowohl das Layout einer bereits vorhandenen Website, die bereits existiert hat, als es noch keine Smartphones und Tablets gab, als auch von Grund auf neu gestaltete Webseiten, bei denen die mobilen Endgeräte und deren Bedienkonzepte von vornherein berücksichtigt werden können. Grundlage für das Responsive Design ist insbesondere die Möglichkeit, dass die Breite von Containern im CSS so definiert werden kann, dass sie durch den vorgegebenen Platz bestimmt wird. Damit ist das Arbeiten mit festen Breiten endgültig passé. In diesem Tutorial soll eine Herangehensweise vorgestelAlt werden, die als fester Bestandteil in jedes neue Webprojekt einfließen sollte. Bei den hier vorgestellten Techniken handelt es sich sozusagen um Best Practices, durch die eventuell später auftauchende Probleme bezüglich der weiteren Optimierung für mobile Endgeräte vermieden werden können. Ist das Layout flexibel genug, wird sich zum Beispiel das Anpassen von Schaltflächen für die Bedienung mit dem Finger ebenfalls weniger problematisch gestalten. Die flexible Gesamtbreite Die Grundlage für ein anpassungsfähiges Layout ist eine Gesamtbreite, die sich an die Breite des Viewports anpasst. Dazu müssen im Wesentlichen alle Inhalte von einem Wrapper mit flexibler Breite umschlossen werden und die Breite für Inhalte und Spalten muss ebenfalls flexibel angelegt werden. Die Möglichkeiten dazu bestehen in CSS schon länger, sie sind nun aber wichtiger denn je. Als Beipiel dient eine Website, die über eine Navigation, ein großes Bild und einem zweispaltigen Text besteht. Im HTML sieht das Ganze dann wie folgt aus. &#160; Die Desktopseite besitzt eine maximale Breite. Der Wrapper, der den gesamten Content umschließt, ist in der Breite begrenzt, damit die Inhalte nicht zu sehr in die Breite gezogen werden. Die maximale Breite als Limit Obwohl das Layout flexibel sein soll, empfiehlt es sich, eine maximale Breite zu definieren. Sonst würde der Content bei Desktop-Monitoren über die gesamte Bildschirmbreite verteilt werden, was nicht nur unschön ist, sondern auch die Usability beeinträchtigt. Zudem ist eine flexible Breite für Bilder ungeeignet, da diese dann in verzerrt oder gestaucht dargestellt würden. Um dies zu verhindern, wird für Bilder einfach eine Größe von 100 Prozent festgelegt. &#160; Bei den Tablets erhält man in unserem Beispiel die in der Breite zusammengeschobene Variante des Desktop-Layouts. &#160; Das Querformat auf einem Tablet lässt etwas mehr Platz in der Breite. Je nach Displayauflösung hätte eine zusätzliche Spalte mit einer Seitennavigation und/oder Suchleiste hier noch Platz. Maximale Bildbreite &#60; maximale Container-Breite Damit das Bild korrekt dargestellt wird, muss sichergestellt sein, dass die maximale Breite des Bildes kleiner ist, als die Breite des Containers. Die 100%-Ansicht des Bildes sollte aber auch nicht zu klein ausfallen, damit das Bild für die größte Darstellung des Layouts die Breite des Containers angemessen ausfüllen kann. Wenn Sie die Seite mit dem Resizer-Bookmarklet (http://lab.maltewassermann.com/viewport-resizer/, für alle gängigen Browser verfügbar außer Internet Explorer) testen, werden Sie feststellen, dass sich das Bild an jede beliebige Bildschirmgröße anpasst. Erst ab der 100%-Ansicht wird das Bild nicht mehr vergrößert. Große Bilddateien sorgen jedoch für eine verlängerte Ladezeit. Gerade bei mobilen Internetverbindungen liegt die Bandbreite deutlich unter der von Festnetzanschlüssen. Unter Umständen kann es sich daher lohnen, das gleiche Bild in mehreren Größen zu hinterlegen und je nach Viewport-Breite das Bild in der geeigneten Größe laden zu lassen. &#160; Smartphones bieten die geringste Displaybreite, sodass hier ein einspaltiges Layout die beste Lösung ist. Auch die Navigation wurde im Beispiel als Liste umgestaltet. Navigation als Liste und einspaltiges Layout Vor allem Smartphones werden in der Regel im Hochformat genutzt. Aber auch im Querfomat ist bei Smartphones die Breite beschränkt, so dass ein mehrspaltiges Layout nicht besonders nutzerfreundlich ist. Gleiches gilt auch für kleine Tablets mit einer Diagonale von etwa sieben Zoll. Das Design der Seite sollte daher ab einer bestimmten Pixelbreite auf ein einspaltiges Layout mit einer Navigation in Form einer Liste umgestellt werden. Als sinnvolle maximale Breite für dieses Layout hat sich ein Wert von 480 Pixeln bewährt. Dieser wird in dem Media Query festgelegt und mit dem &#8220;#skipTo&#8221;-Tag ausgezeichnet. Die beiden Spalten aus dem Abschnitt &#8220;Die maximale Breite als Limit&#8221; werden dabei kurzerhand untereinander aufgeführt. Somit steht der gleiche Content zur Verfügung wie im zweispaltigen Layout. Das Bild im Header und die Überschrift mit dem kleinen Logo wirken nun aber wie eine Barriere zwischen Navigation und dem textlichen Content. Dazu wurde im HTML ein Hyperlink eingefügt, der dem User den Sprung zur Haupt-Section gestattet. Geschrumpftes Desktop-Layout vermeiden Wenn Sie die Seite auf verschiedenen Geräten testen, kann es sein, dass auf manchen Geräten trotzdem die Desktop-Version geladen und stark verkleinert dargestellt wird. Damit das Media Query immer seine Wirkung zeigt, sollte im Head der HTML die nachfolgende Zeile eingefügt werden. Diese Anweisung sorgt dafür, dass das Skalieren grundsätzlich unterbunden wird, indem die minimale und die maximale Skalierung auf den Wert 1.0 gesetzt werden. Auch im Querformat ist die Breite von Smartphone-Displays sehr beschränkt.<div class='yarpp-related-rss'>

Related posts:<ol>
<li><a href='http://www.webdesigner-magazin.de/2157/tutorials-workshops/gratis-workshop-responsive-navigation' rel='bookmark' title='Gratis Workshop: Responsive Navigation'>Gratis Workshop: Responsive Navigation</a></li>
<li><a href='http://www.webdesigner-magazin.de/1800/tutorials-workshops/inhalte-mit-ajax-laden' rel='bookmark' title='Inhalte mit AJAX laden'>Inhalte mit AJAX laden</a></li>
<li><a href='http://www.webdesigner-magazin.de/1491/ratgeber/10-kreative-css-tricks' rel='bookmark' title='10 kreative CSS Tricks'>10 kreative CSS Tricks</a></li>
</ol>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3448/tutorials-workshops/tutorial-css-grundlagen-fur-responsive-design/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Twitter soll sicherer werden.</title>
		<link>http://www.webdesigner-magazin.de/3444/news/twitter-soll-sicherer-werden</link>
		<comments>http://www.webdesigner-magazin.de/3444/news/twitter-soll-sicherer-werden#comments</comments>
		<pubDate>Thu, 25 Apr 2013 12:43:48 +0000</pubDate>
		<dc:creator>Tobias Henke</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[Passwortschutz]]></category>
		<category><![CDATA[Sicherheit]]></category>
		<category><![CDATA[Twitter]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3444</guid>
		<description><![CDATA[Twitter führt angeblich eine Zwei-Faktor-Authentifizierung ein Twitter soll angeblich an einer Zwei-Faktor-Authentifizierung arbeiten und diese bald einführen. Das berichtet das Magazin Wired. Im Februar hatte Twitter hierfür eine Stelle ausgeschrieben. Gesucht wird ein Mitarbeiter, der unter anderem &#8220;Mehrfachauthentifizierungen&#8221; entwickelt. Konkret bedeutet dies beispielsweise, dass man zunächst sein Passwort eingibt und anschließend eine SMS mit einem Code bekommt, den man ebenfalls eingeben muss, um sich einloggen zu können. Für die Authentifizierung sollen ein Passwort und ein für den Account registriertes Gerät genutzt werden – ein Hack ohne passendes Gerät würde also nicht mehr ohne Weiteres funktionieren. Um die akuten Probleme mit Passwörtern  in den Griff zu bekommen, scheint Zwei-Faktor-Authentifizerung momentan der einzig gangbare Weg zu sein. Google bietet sie bereits seit etwa zwei Jahren an, Microsoft hat kürzlich nachgelegt. Erst in den letzten Tagen waren wieder mehrere Twitter-Konten von bekannten Persönlichkeiten, Unternehmen und Medienanstalten geknackt worden. Mit einer Zwei-Faktor-Authentifizierung wäre das nicht mehr so leicht möglich.<div class='yarpp-related-rss yarpp-related-none'>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3444/news/twitter-soll-sicherer-werden/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Microsoft: Schon wieder ein neuer Sicherheits-Patch</title>
		<link>http://www.webdesigner-magazin.de/3439/news/microsoft-schon-wieder-ein-neuer-sicherheits-patch</link>
		<comments>http://www.webdesigner-magazin.de/3439/news/microsoft-schon-wieder-ein-neuer-sicherheits-patch#comments</comments>
		<pubDate>Wed, 24 Apr 2013 12:21:45 +0000</pubDate>
		<dc:creator>Tobias Henke</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[Microsoft]]></category>
		<category><![CDATA[Patch]]></category>
		<category><![CDATA[Sicherheitsupdate]]></category>
		<category><![CDATA[Windows 7]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3439</guid>
		<description><![CDATA[Microsoft unternimmt einen neuen Versuch, um die Rechteausweitungslücke im Kerneltreiber des NTFS-Dateisystems von Windows 7 und Server 2008 (auch R2) zu schließen. Der neue Patch mit der Nummer 2840149 tritt die Nachfolge des Sicherheitsupdates 2823324 an, das Microsoft an seinem April-Patchday herausgegeben hatte. Kurz darauf musste der Software-Riese das erste Update allerdings zurückrufen, weil es sich nicht mit einigen Drittanbieter-Programmen vertrug; es legte Rechner lahm und verursachte Fehlermeldungen. Darüber hinaus spielten Antivirenprogramme von Kaspersky nach dem Update verrückt – sie waren plötzlich irrtümlich der Meinung, dass ihnen keine gültige Lizenz mehr vorliegt und stellten ihre Schutzfunktion ein. Ob sie für die Fehlfunktionen verantwortlich waren, hat Microsoft auch mit dem Re-Release nicht geklärt. Der neue Patch wird bereits über Windows Update ausgeliefert. Nutzern, deren Rechner seit der Installation des ersten Patches nicht mehr booten, stelltMicrosoft eine bootfähige Reparatur-Disk  als ISO zur Verfügung<div class='yarpp-related-rss'>

Related posts:<ol>
<li><a href='http://www.webdesigner-magazin.de/2474/news/februar-patches-von-microsoft-und-adobe' rel='bookmark' title='Februar-Patches von Microsoft und Adobe'>Februar-Patches von Microsoft und Adobe</a></li>
<li><a href='http://www.webdesigner-magazin.de/3023/news/microsoft-muss-500-millionen-strafe-zahlen' rel='bookmark' title='Microsoft muss 500- Millionen-Strafe zahlen'>Microsoft muss 500- Millionen-Strafe zahlen</a></li>
<li><a href='http://www.webdesigner-magazin.de/3204/news/kein-windows7-support-mehr-ohne-das-service-pack-1' rel='bookmark' title='Kein Windows7-Support mehr ohne das Service Pack 1'>Kein Windows7-Support mehr ohne das Service Pack 1</a></li>
</ol>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3439/news/microsoft-schon-wieder-ein-neuer-sicherheits-patch/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Die Telekom drosselt künftig Flatrates</title>
		<link>http://www.webdesigner-magazin.de/3430/news/die-telekom-drosselt-kunftig-flatrates</link>
		<comments>http://www.webdesigner-magazin.de/3430/news/die-telekom-drosselt-kunftig-flatrates#comments</comments>
		<pubDate>Tue, 23 Apr 2013 10:10:46 +0000</pubDate>
		<dc:creator>Tobias Henke</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[Drosselung]]></category>
		<category><![CDATA[Flatrates]]></category>
		<category><![CDATA[Telekom]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3430</guid>
		<description><![CDATA[Nachdem es schon vor einiger Zeit Gerüchte gab ist es jetzt offiziell: Die Deutsche Telekom hat bestätigt, dass sie künftig für alle Breitbandanschlüsse im Festnetz eine Volumendrossel einführt. Ab dem 2. Mai umfasst die Leistungsbeschreibung bei allen Festnetz-Neuverträgen eine Bandbreiten-Drossel abhängig vom Transfervolumen.Bestandskunden sind davon vorerst nicht betroffen. Bislang fand sich solch ein Passus bei der Telekom nur für VDSL- und Glasfaseranschlüsse mit 25 bis 200 MBit/s im Downstream. Je nach Datenrate der Verbindung schlägt die Drossel nach 75 (bis 16 MBit/s) bis 400 Gigabyte pro Monat (bei 200 MBit/s) zu, die gedrosselte Datenrate liegt bei einheitlich 384 kBit/s – bandbreitenhungrige Dienste lassen sich damit nicht mehr nutzen: Internetanschluss mit einer Bandbreite von bis zu 16 Mbit/s (ADSL2+): 75 GByte Transfervolumen Internetanschluss mit einer Bandbreite von bis zu 50 Mbit/s (VDSL): 200 GByte Transfervolumen Internetanschluss mit einer Bandbreite von bis zu 100 Mbit/s (Glasfaseranschluss oder VDSL-Vectoring): 300 GByte Transfervolumen Internetanschluss mit einer Bandbreite von bis zu 200 Mbit/s (Glasfaseranschluss): 400 GByte Transfervolumen &#160; Zunächst soll eine Drosselung praktisch aber nicht stattfinden, die Telekom sichert sich nur das Recht dazu zu. Wann die Umsetzung erfolge, hänge &#8220;von der Verkehrsentwicklung im Internet ab&#8221;. &#8220;Wir gehen bisher davon aus, dass wir die Limitierung technisch nicht vor 2016 umsetzen&#8221;, erklärte Michael Hagspihl, Geschäftsführer Marketing bei der Telekom Deutschland. Die Telekom begründet ihren Schritt mit dem ständig steigenden Transfervolumen, das einen kontinuierlichen Ausbau der Netze erforderlich mache. Eine flächendeckende Glasfaserinfrastruktur für Deutschland koste 80 Milliarden Euro, führt die Telekom aus. Dabei geht es in diesem Punkt nur um die Hausanschlüsse. Angesichts dieser Pläne ist es nicht verwunderlich, dass die Kritik nicht lange auf sich warten ließ: Der Verein &#8220;Digitlale Gesellschaft&#8221; kritisierte beispielsweise, dass eine solche Drosselung, wie die Telekom sie vorhabe, &#8220;die Verbindung unter heutigen Ansprüchen nicht mehr nutzbar&#8221; mache. Die Geschwindigkeit werde damit auf ein Niveau der 90er Jahre reduziert. Kritik kam auch aus der Piratenpartei, die die Netzneutralität in Gefahr sieht.<div class='yarpp-related-rss'>

Related posts:<ol>
<li><a href='http://www.webdesigner-magazin.de/2982/news/telekom-plant-wlan-to-go' rel='bookmark' title='Telekom plant &#8220;WLAN to go&#8221;'>Telekom plant &#8220;WLAN to go&#8221;</a></li>
<li><a href='http://www.webdesigner-magazin.de/3318/news/das-turbo-internet-kommt' rel='bookmark' title='Das Turbo-Internet kommt'>Das Turbo-Internet kommt</a></li>
</ol>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3430/news/die-telekom-drosselt-kunftig-flatrates/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Schöne Single-Pages</title>
		<link>http://www.webdesigner-magazin.de/3415/news/schone-single-pages</link>
		<comments>http://www.webdesigner-magazin.de/3415/news/schone-single-pages#comments</comments>
		<pubDate>Mon, 22 Apr 2013 12:58:09 +0000</pubDate>
		<dc:creator>Tobias Henke</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[funktional]]></category>
		<category><![CDATA[minimalistisch]]></category>
		<category><![CDATA[Singlepage]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3415</guid>
		<description><![CDATA[Seiten ohne jede Unterseite  sind absolut „in“. Wir möchten Ihnen heute eine solche Seiten vorstellen. Alleine durch den Verzicht auf Unterseiten, wirken die Seiten zunächst einmal relativ schlicht, aber dies ist zum Teil nur der erste Eindruck. Bei Chleon.com handelt es sich um eine Seite von Autofreunden, die sich des Themas Autos und Internet angenommen haben. Die Seite hat eine Navigation im Header und enthält insgesamt sechs Menüpunkte. Wenn man auf einen der Menüpunkte klickt, scrollt man automatisch nach unten. Die Informationen der einzelnen  Menüpunkte werden abwechselnd auf weißem und auf gelben Untergrund angezeigt. Die Seite ist sehr übersichtlich und ein wenig minimalistisch gestaltet. Je weiter man nach unten scrollt, umso detaillierter werden die Informationen über Chleon.com.<div class='yarpp-related-rss yarpp-related-none'>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3415/news/schone-single-pages/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Der Webdesigner 05/2013</title>
		<link>http://www.webdesigner-magazin.de/3379/das-magazin/der-webdesigner-052013</link>
		<comments>http://www.webdesigner-magazin.de/3379/das-magazin/der-webdesigner-052013#comments</comments>
		<pubDate>Mon, 22 Apr 2013 07:54:13 +0000</pubDate>
		<dc:creator>Sebastian Biada</dc:creator>
				<category><![CDATA[2013]]></category>
		<category><![CDATA[Das Magazin]]></category>
		<category><![CDATA[Animationen]]></category>
		<category><![CDATA[CodeIgniter]]></category>
		<category><![CDATA[css3]]></category>
		<category><![CDATA[Farbkonzepte]]></category>
		<category><![CDATA[Fireworks]]></category>
		<category><![CDATA[Icons]]></category>
		<category><![CDATA[Mouse Tracking]]></category>
		<category><![CDATA[Photoshop]]></category>
		<category><![CDATA[Pulse Pro]]></category>
		<category><![CDATA[SEO-Plugins]]></category>
		<category><![CDATA[Theme]]></category>
		<category><![CDATA[Webtypografie]]></category>
		<category><![CDATA[Wordpress]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3379</guid>
		<description><![CDATA[Typografie ist dank der neuen Möglichkeiten zur Einbindung von Schriftarten zu einem spannenden Thema im Webdesign geworden. Abgesehen von einem Gespür für die passenden Schriftarten braucht es vor allem ein gewisses technisches Know-how, um die gewünschten Schriftarten sicher einbinden zu können. Stammautor Oliver Berghold hat sich die Mühe gemacht und die interessantesten Techniken und vor allem auch die besten Quellen für originelle Schriftarten in einem umfassenden Ratgeber zusammengetragen. Eine weiteres Thema im Heft ist der Umgang mit freiem Content. Im Netz gibt es unzählige Quellen für kostenfreien Content. Jedoch ist auch bei diesen Inhalten nicht immer klar, was genau mit dem Material gemacht werden darf, und was nicht. Eine sehr hilfreiche Orientierung bieten die Standardlizenzen der Creative Commons (CC). In einem großen Ratgeber zeigt Ihnen Tobias Henke, welche Nutzungsarten genau die einzelnen Lizenzen abdecken und auf welchen Seiten es den besten freien Content gibt. Als Gestalter von Webseiten hat man kaum Einfluss darauf hat, wie die Farben auf den Monitoren und Displays der Besucher dargestellt werden. Dennoch ist es für das Design immens wichtig, die Farben für eine Website vorab klar zu definieren. Für das Erstellen einer Farbpalette bietet Photoshop verschiedene Methoden an, die wir Ihnen in einem Ratgeber vorstellen möchten. Außerdem enthält diese Ausgabe unter anderem verschiedene Tutorials über Themen wie CSS3-Animationen, die Gestaltung eines Prototypen mit Fireworks oder das PHP-Framework &#8220;CodeIgniter&#8221;, das durch seine Einfachheit und Performance-Freundlichkeit besticht. &#160; INHALT RATGEBER Bild- und Tonmaterial  &#8211; Der richtige Umgang mit kostenlosem Content SEO-Plugins für WordPress &#8211; Was freie und kostenpflichtige SEO-Plugins leisten können Farbkonzepte entwickeln mit Photoshop &#8211; Professionelle Gestaltung mit den richtigen Farben WordPress-Themes selber bauen &#8211; WordPress-Seiten individuell gestalten Webtypografie &#8211; Mehr Ausdruck mit den richtigen Schriftarten Website-Optimierung mit Mouse Tracking &#8211; Usability-Testing 2.0 KOLUMNE Auf zu neuen Ufern! NEWS &#38; BUCHREZENSIONEN News und Buchvorstellungen Buchrezension WEB-GALERIE Internetauftritte von Webdesignern &#8211; Wie sich Angehörige der Zunft im Web präsentieren Sehenswerte Internetseiten &#8211; Gelungene Websites aus aller Welt JOB BOERSE Stellenangebote für Webworker TUTORIALS Profitechniken &#8211; Schritt für Schritt erklärt Pulse Pro &#8211; Kompaktes CMS für kleine Websites &#8211; Das CMS für den Kleinunternehmer JavaScript einbinden und minifizieren &#8211; Bessere Performance durch geschickt eingebundene Skripte Animationen und Effekte mit CSS3 erstellen &#8211; Farben, Größen und Deckkraft von Elementen animieren Prototypen mit Fireworks entwerfen &#8211; Layout und Illustration mit nur einem Tool gestalten Das Plus von Google &#8211; Einstieg in die APIs von Google+ Die erste Anwendung mit CodeIgniter &#8211; Das einsteigerfreundliche PHP-Framework sinnvoll einsetzen Icons entwerfen mit Illustrator &#8211; Leicht anpassbare Icons für jeden Zweck Inserentenverzeichnis Download-Anleitung &#160;<div class='yarpp-related-rss'>

Related posts:<ol>
<li><a href='http://www.webdesigner-magazin.de/1651/das-magazin/der-webdesigner-vol-7-022012' rel='bookmark' title='Der Webdesigner Vol 7 02/2012'>Der Webdesigner Vol 7 02/2012</a></li>
<li><a href='http://www.webdesigner-magazin.de/1353/das-magazin/der-webdesigner-032012' rel='bookmark' title='Der Webdesigner 03/2012'>Der Webdesigner 03/2012</a></li>
<li><a href='http://www.webdesigner-magazin.de/1946/das-magazin/der-webdesigner-042012' rel='bookmark' title='Der Webdesigner 04/2012'>Der Webdesigner 04/2012</a></li>
</ol>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3379/das-magazin/der-webdesigner-052013/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Tutorial: Farbverläufe in CSS3</title>
		<link>http://www.webdesigner-magazin.de/3353/tutorials-workshops/tutorial-farbverlaufe-in-css3</link>
		<comments>http://www.webdesigner-magazin.de/3353/tutorials-workshops/tutorial-farbverlaufe-in-css3#comments</comments>
		<pubDate>Thu, 18 Apr 2013 12:54:36 +0000</pubDate>
		<dc:creator>Tobias Henke</dc:creator>
				<category><![CDATA[Tutorials / Workshops]]></category>
		<category><![CDATA[css3]]></category>
		<category><![CDATA[Farbverläufe]]></category>
		<category><![CDATA[Tuttorial]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3353</guid>
		<description><![CDATA[Freie Hand in der Gestaltung von Websites bietet CSS3 durch den Einsatz von Farbverläufen. Die neue Methode zeichnet sich durch einige praktische Vorteile aus und erspart so beispielsweise den herkömmlichen Weg zur Erstellung von Verläufen über die Grafiksoftware. Um einen sanften Übergang von einer Farbe zu einer anderen zu schaffen, greifen Webdesigner schon seit langem auf die Wirkungsweise von Farbverläufen zurück. Bestand die bisher nahezu einzige Methode darin, einen Verlauf zunächst mithilfe einer Bildbearbeitungssoftware zu erzeugen, um ihn anschließend als Bilddatei in die Website zu integrieren, so bietet CSS3 nun die Möglichkeit, Verläufe direkt im Style Sheet anzugeben. Obwohl dieses noch relativ neue Feature von einigen älteren Browsern nicht berücksichtigt wird, bietet es dennoch viele Vorteile gegenüber der herkömmlichen Variante zur Verlaufserstellung mittels Grafiksoftware. So reduziert sich bei der CSS3-Methode beispielsweise die allgemeine Zugriffszeit auf eine Seite erheblich, da beim Seitenaufbau weniger Bilddateien geladen werden müssen. Zudem wird bei dieser Vorgehensweise das Problem einer zum Teil sehr unschönen Darstellung von Verläufen, die als Bilddateien mit einer geringeren Auflösung abgespeichert wurden, vermieden. Auch lassen sich Änderungen an den Verläufen vergleichsweise einfach und schnell über das Style Sheet vornehmen. Sind die hierzu erforderlichen Deklarationen, auf die im Folgenden näher eingegangen wird, erst einmal gemerkt, spart es dem ambitionierten Webdesigner viel Zeit und Mühe, wenn er in seinen zukünftigen Webprojekten Farbverläufe mithilfe von CSS realisiert. Lineare und radiale Verläufe Grundsätzlich wird zwischen linearen (geradlinigen) und radialen (kreisförmigen) Farbverläufen unterschieden. Am häufigsten werden mit CSS erzeugte Verläufe als Hintergrundelement für Boxen eingesetzt, weshalb die Funktion für den jeweiligen Verlauf auch in den meisten Fällen als Wert für die background-Eigenschaft notiert wird. Die grundlegende Syntax für einen linearen Verlauf lautet „background: linear-gradient( &#8230; );“ bzw. „background: radial-gradient( &#8230; );“ für einen radialen Farbverlauf. Innerhalb der Klammern folgen, durch Kommata getrennt, in der vom W3C festgelegten Reihenfolge die Werte für den jeweiligen Verlauf. Lineare Verläufe Bei linearen Verläufen gibt der erste Wert stets die Richtung der Verlaufsachse an. Diese kann sowohl in Winkelgraden (deg), als auch mithilfe von Schlüsselbegriffen wie „to top“, „to right“, „to bottom“ oder „to left“ festgelegt werden. In Grad ausgedrückt, wären in diesem Fall die entsprechenden Angaben: „0deg“, „90deg“, „180deg“ oder „270deg“. Ferner lässt sich auch ein diagonaler Verlauf erzeugen, beispielsweise durch die Angabe „to top right“ oder „45deg“. Wird für die Verlaufsachse kein Wert angegeben, so verläuft deren Richtung standardmäßig von oben nach unten. Als zweiter und dritter Wert werden Anfangs- und Zielfarbe des Verlaufs festgelegt. Es besteht jedoch auch die Möglichkeit, weitere Farbunterbrechungen zwischen Anfangs- und Zielfarbe zu notieren. Zu guter Letzt kann für jede Farbe noch eine dazugehörige Position auf der Achse bestimmt werden, die, von einer Leerstelle getrennt, direkt hinter der jeweiligen Farbbezeichnung vermerkt wird. Fehlen die Positionsangaben (zum Beispiel in Prozent), werden alle Farben automatisch im gleichen Abstand zueinander entlang der Achse aufgereiht. Die Anfangsfarbe liegt standardmäßig bei 0%, die Zielfarbe bei 100%. Die Abbildung soll dieses Prinzip anhand einiger Funktionsbeispiele verdeutlichen. Ein Sonderfall tritt ein, wenn in einem Verlauf zwei Farbunterbrechungen an derselben Position eingefügt werden. In diesem Fall werden die Farben nicht sanft überblendet, sondern durch harte Stoßkanten voneinander getrennt. Durch diese Methode lassen sich gestreifte Hintergründe wie im Beispiel erzeugen. Radiale Verläufe Zwar stimmen beide Verlaufsarten in ihrem syntaktischen Aufbau größtenteils überein. Anstelle einer einfachen Verlaufsachse gibt es bei radialen Verläufen jedoch einen Mittelpunkt, der den Anfang des Verlaufs markiert und den alle weiteren Farben kreis- oder ellipsenförmig umgeben. Der erste Wert gibt also die Art des radialen Verlaufs („circle“ oder „ellipse“) und dessen Größe an, gefolgt von „at“ und der Position des Mittelpunkts. Sollten hierbei Angaben weggelassen werden, geht CSS standardmäßig von einem horizontal und vertikal zentrierten Kreis aus. Die Größenangabe erfolgt entweder in expliziter Weise oder mithilfe eines der folgenden Schlüsselbegriffe: „closest-side“, „farthest-side“, „closest-corner“ oder „farthest-corner“. Hierbei ist zu beachten, dass für den Radius eines Kreises derzeit keine prozentualen Angaben gemacht werden können; diese sind nur bei Ellipsen möglich. Ähnlich wie bei linearen Verläufen können auch bei der radialen Variante neben Anfangs- und Zielfarbe beliebig viele weitere Farbunterbrechungen eingefügt werden. Bei der Notierung gelten hier dieselben Regeln wie schon oben bei den linearen Verläufen beschrieben. Die Abbildung zeigt jeweils ein Beispiel für einen einfachen kreis- und einen ellipsenförmigen radialen Farbverlauf. Verlaufswiederholungen Möchte man, dass sich ein Verlauf innerhalb eines bestimmten Elements unendlich oft wiederholt, dienen als Ergänzung zu den beiden vorgestellten Verlaufsarten die Funktionen „repeating-linear-gradient( &#8230; )“ und „repeating-radial-gradient( &#8230; )“. Syntaktisch sind diese beiden Funktionen grundsätzlich identisch mit „linear-gradient( &#8230; )“ bzw. „radial-gradient( &#8230; )“. Die Position der Zielfarbe gibt dabei an, wie oft der Verlauf wiederholt wird. Liegt diese beispielsweise bei 25%, wird der Verlauf insgesamt viermal wiederholt, bei 20% fünfmal, usw. Es sollte allerdings darauf geachtet werden, dass Anfangs- und Zielfarbe bei der Verlaufswiederholung übereinstimmen, da andernfalls harte Stoßkanten entstehen. Browserkompatibilität Die neuen Gestaltungsmöglichkeiten, die CSS3 mit der Einführung von Farbverläufen bietet, werden in der oben vorgestellten Standard-Syntax vom Firefox ab Version 16 und vom Internet Explorer ab Version 10, sowie vom Opera ab Version 12.1 unterstützt. In älteren Browsern wird die Darstellung von Verläufen durch den Gebrauch von bestimmten Vendor-Prefixen dennoch teilweise ermöglicht. Auf diese Weise können mit CSS erzeugte Verläufe auch beispielsweise in Chrome ab Version 10 und Safari ab Version 5.1 durch das Voranstellen des Prefix &#8220;-webkit-&#8221; und in Opera ab Version 11.10 durch das Prefix &#8220;-o-&#8221; angezeigt werden. Als eine Ausnahme gilt der Internet Explorer in der Version 6 bis 9, da hier auf die Funktionsweise von Filtern zurückgegriffen werden muss, um einen Farbverlauf zu simulieren. Farbwerte und Farbräume Farbwerte können in gewohnter Weise sowohl in Farbbezeichnungen wie „yellow“ oder „blue“ als auch in Hexadezimal-, RGB- und HSL-Codes angegeben werden. Ebenso können die beiden erweiterten Farbräume RGBA und HSLA für Transparenz genutzt werden. Für das Bestimmen der Farbcodes können neben Bildbearbeitungsprogrammen auch Browsererweiterungen wie der Rainbowpicker, der für  Mozilla Firefox zur Verfügung steht, verwendet werden. Mit dem Rainbowpicker lassen sich innerhalb des Browsers alle angezeigten Farben bestimmen und per Klick in die Zwischenablage kopieren. &#160;<div class='yarpp-related-rss'>

Related posts:<ol>
<li><a href='http://www.webdesigner-magazin.de/3050/tutorials-workshops/farbverlaufe-in-css3' rel='bookmark' title='Farbverläufe in CSS3'>Farbverläufe in CSS3</a></li>
<li><a href='http://www.webdesigner-magazin.de/3272/tutorials-workshops/3272' rel='bookmark' title='Animationen mit CSS3'>Animationen mit CSS3</a></li>
<li><a href='http://www.webdesigner-magazin.de/1904/tutorials-workshops/mit-css3-einen-flipslider-erstellen' rel='bookmark' title='Mit CSS3 einen Flipslider erstellen'>Mit CSS3 einen Flipslider erstellen</a></li>
</ol>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3353/tutorials-workshops/tutorial-farbverlaufe-in-css3/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Google hat Google-Glass an Entwickler geliefert</title>
		<link>http://www.webdesigner-magazin.de/3349/news/google-hat-google-glass-an-entwickler-geliefert</link>
		<comments>http://www.webdesigner-magazin.de/3349/news/google-hat-google-glass-an-entwickler-geliefert#comments</comments>
		<pubDate>Wed, 17 Apr 2013 14:19:21 +0000</pubDate>
		<dc:creator>Tobias Henke</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[Datenbrille]]></category>
		<category><![CDATA[google]]></category>
		<category><![CDATA[Google Glass]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3349</guid>
		<description><![CDATA[Google hat mit der Auslieferung der ersten Ausgaben seiner Datenbrille begonnen. Es handelt sich dabeium eine frühe &#8220;Explorer&#8221;-Version, die sich voraussichtlich vom kommerziellen Endprodukt unterscheiden wird. &#8220;Die Hardware und Software ist fertig. Wir sehen jetzt gerade die ersten wenigen Geräte aus der Fertigungsstraße kommen&#8221;, schrieb das Glass-Team in einer E-Mail. Es war an die 2.000 potenziellen Glass-Entwickler gerichtet , die auf der Google I/O 2012 ein Exemplar der Augmented-Reality-Brille bestellt haben. Google hat außerdem die erste Version der Mirror-API freigegeben. Sie dient dazu, Apps und Web-Dienste (von Google &#8220;Glassware genant) zu entwickeln, die mit Google Glass interagieren bzw. mit der Datenbrille genutzt werden können. Anleitungen für den schnellen Einstieg in die Entwicklung für Glass bietet Google ebenfalls – sowie einige Hinweise auf Restriktionen, so dürfen Apps für Glass keine Werbung einblenden. Laut The Verge bietet Google Glass ein Display mit 640 × 360 Punkten, was einem 25-Zoll-HD-Display aus einer Entfernung von rund 2,40 Metern entspreche. Die 5-Megapixel-Kamera soll 720p-Videos aufnehmen können. Die Brille ist mit 16 GByte Flash-Speicher ausgerüstet, von denen 12 GByte für Anwendungen und Daten nutzbar sind. Die Batterie soll bei &#8220;typischer Nutzung&#8221; rund einen Tag halten. &#160;<div class='yarpp-related-rss'>

Related posts:<ol>
<li><a href='http://www.webdesigner-magazin.de/2194/news/google-glass-bald-mit-virtueller-tastatur-2194' rel='bookmark' title='Google Glass bald mit virtueller Tastatur'>Google Glass bald mit virtueller Tastatur</a></li>
<li><a href='http://www.webdesigner-magazin.de/2949/news/das-kann-google-glass' rel='bookmark' title='Das kann Google Glass'>Das kann Google Glass</a></li>
</ol>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3349/news/google-hat-google-glass-an-entwickler-geliefert/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Linktipp: Webdesign-Turorial</title>
		<link>http://www.webdesigner-magazin.de/3341/tutorials-workshops/linktipp-webdesign-turorials</link>
		<comments>http://www.webdesigner-magazin.de/3341/tutorials-workshops/linktipp-webdesign-turorials#comments</comments>
		<pubDate>Tue, 16 Apr 2013 11:22:47 +0000</pubDate>
		<dc:creator>Tobias Henke</dc:creator>
				<category><![CDATA[Tutorials / Workshops]]></category>
		<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[Webdesign]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3341</guid>
		<description><![CDATA[Auf  www.webdesign-tutorial.net haben wir ein Tutorial gefunden, das unserer Meinung nach keine Wünsche offen lässt. Über die Konzepterstellung bis hin zur Umsetzung. Alles wird in sehr einfachen Worten gut erklärt. Wir wünschen euch viel Spaß beim Lesen!<div class='yarpp-related-rss'>

Related posts:<ol>
<li><a href='http://www.webdesigner-magazin.de/3197/tutorials-workshops/responsive-webdesign-mit-css3-media-queries' rel='bookmark' title='Responsive Webdesign mit CSS3 Media-Queries'>Responsive Webdesign mit CSS3 Media-Queries</a></li>
<li><a href='http://www.webdesigner-magazin.de/3002/tutorials-workshops/windows-8-oberflache-mit-css-und-jquery' rel='bookmark' title='Windows 8 Oberfläche mit CSS und jQuery'>Windows 8 Oberfläche mit CSS und jQuery</a></li>
<li><a href='http://www.webdesigner-magazin.de/3255/tutorials-workshops/so-erstellen-sie-einen-html-newsletter' rel='bookmark' title='So erstellen Sie einen HTML-Newsletter'>So erstellen Sie einen HTML-Newsletter</a></li>
</ol>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3341/tutorials-workshops/linktipp-webdesign-turorials/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Weltweite Angriffeswelle gegen WordPress-Seiten</title>
		<link>http://www.webdesigner-magazin.de/3337/news/weltweite-angriffeswelle-gegen-wprdpress-seiten</link>
		<comments>http://www.webdesigner-magazin.de/3337/news/weltweite-angriffeswelle-gegen-wprdpress-seiten#comments</comments>
		<pubDate>Mon, 15 Apr 2013 12:43:45 +0000</pubDate>
		<dc:creator>Tobias Henke</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[Angriff]]></category>
		<category><![CDATA[Hacker]]></category>
		<category><![CDATA[Wordpress]]></category>

		<guid isPermaLink="false">http://www.webdesigner-magazin.de/?p=3337</guid>
		<description><![CDATA[Hacker haben eine weltweite Angriffswelle gegen WordPress-Seiten gestartet. Angeblich Zehntausende Blog-Konten wurden schon gekapert. Was die Einbrecher vorhaben, ist unbekannt. Dafür ist klar, wie man Schaden abwendet &#8211; mit einem sicheren Passwort. Zehntausende WordPress-Nutzer  sind von einem Online-Angriff betroffen. Sie seien Opfer einer sogenannten Brute-Force-Attacke, meldet das kalifornische Sicherheitsunternhemen Sucuri. In den vergangenen Tagen habe sich die Anzahl der Angriffe gegen WordPress-Nutzer verdreifacht. Auch der Webdienstleister CloudFlare meldete am Samstag, dass er innerhalb einer Stunde 60 Millionen vermutlich illegitime Zugriffsversuche auf WordPress habe. Dies waren laut CloudFlare Anzeichen einer großen Zahl an Angriffen, die durch ein sogenanntes Botnet organisiert worden seien. Der leitende Entwickler bei WordPress, Matthew Mullenweg, warnt in seinem Blog vor der Angriffswelle &#8211; und davor, der Aufregung der Sicherheitsfirmen zu folgen, die von einer möglichst drastischen Darstellung des Problems profitieren. Sein Tipp an WordPress-Anwender: Wählen Sie jetzt ein neues, starkes und tragen Sie es unter Benutzer/Dein Profil/Neues Passwort ein. &#8220;Machen Sie das und Sie sind 99 Prozent der Websites da draußen einen Schritt voraus und werden wahrscheinlich nie ein Problem haben.&#8221; Noch untersuchen die Sicherheitsexperten den Vorgang und dessen Konsequenzen. Derzeit zeichnet sich folgendes Szenario ab: Ein oder mehrere Hacker haben ein Botnet mit etwa 100.000 gekaperten Rechnern gemietet und machen damit Jagd auf schlecht geschützte WordPress-Blogs. Was die Angreifer mit den geknackten WordPress-Konten erreichen wollen, bleibt unklar. Sie könnten allerdings weitere Malware installieren, die bei der Verbreitung des Botnetzes hilft. Oder sie könnten Werbe-Spam oder Links zu illegitimen Netzangeboten in den betroffenen Blogs unterbringen, wie bei einem ähnlichen Angriff im Dezember vergangenen Jahres geschah. Bei einer Brute- Force-Attacke gehen Angreifer nach und nach Anmeldename/Passwort-Kombinationen durch, bis sie durch Zufall die richtige Kombination finden. Das im aktuellen Fall genutzte Botnet hat dem Web-Dienstleister CloudFlare zufolge genug Rechenkraft, um stündlich zwei Milliarden Passwörter durchzuprobieren. Der Schutz vor solchen Angriffen  ist einfach. Man sollte sichere Passwörter wählen, die so lang und komplex sind, dass sie sich nicht einfach erraten lassen. Sie müssen nicht einmal schwer zu merken sein. WordPress erlaubt beispielsweise Leerzeichen im Passwort . Damit sind ganze Sätze oder Kombinationen von Namen möglich, die äußert schwer zu knacken sind. Zusätzlich kann mit &#8220;Zwei-Faktoren-Authentifizierung&#8221; ein weiterer Schutzwall gegen Hacker errichtet werden, indem ein Zugangsversuch zum Beispiel über eine zugesandte SMS verifiziert werden muss.  <div class='yarpp-related-rss'>

Related posts:<ol>
<li><a href='http://www.webdesigner-magazin.de/2427/news/community-seiten-mit-wordpress-gestalten' rel='bookmark' title='Community-Seiten mit WordPress gestalten'>Community-Seiten mit WordPress gestalten</a></li>
<li><a href='http://www.webdesigner-magazin.de/2393/news/eine-hitliste-mit-wordpress-plugin' rel='bookmark' title='Eine Hitliste mit WordPress-Plugins'>Eine Hitliste mit WordPress-Plugins</a></li>
<li><a href='http://www.webdesigner-magazin.de/2972/news/top10-plugins-fur-wordpress' rel='bookmark' title='Top10 Plugins für WordPress'>Top10 Plugins für WordPress</a></li>
</ol>
</div>
]]></description>
		<wfw:commentRss>http://www.webdesigner-magazin.de/3337/news/weltweite-angriffeswelle-gegen-wprdpress-seiten/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
