SlideShare ist ein Scribd-Unternehmen logo
„UNWISSENHEIT IST EIN
            SEGEN!“

                   Responsive Webdesign


Dirk Jesse | Highresolution.info     Webinale 2011, Berlin
Die Welt ist im
!   Wandel!
Display Resolution Statistics (w3schools.com, 2011)
                                                                                                                           90%


                                                                                                                           80%


                                                                                                                           70%


                                                                                                                           60%


                                                                                                                           50%


                                                                                                                           40%


                                                                                                                           30%


                                                                                                                           20%


                                                                                                                           10%


                                                                                                                           0%
January   January    January   January    January   January   January    January   January   January   January   January
  2000      2001       2002      2003       2004      2005      2006       2007      2008      2009      2010      2011

                                 Higher        1024x768        800x600         640x480       Other
Unwissenheit ist ein Segen - Responsive webdesign

Empfohlen für Sie

Wbfntdy 2012
Wbfntdy 2012Wbfntdy 2012
Wbfntdy 2012

Ob online oder mobil – die Oberflächengestaltung mit Tiefgang macht sich nach wie vor rar. Anwenderfreundlichkeit und (typo)grafische Qualität stehen häufig in einem heftigen Spannungsverhältnis. Viele Webseiten begeistern zwar durch oberflächliche technische Besonderheiten, scheitern jedoch an der Vermittlung jeglichen Inhalts. Die pure Integration von Webfonts hilft da auch nicht weiter. Der Webfontday 2012 will den Mut zu herausragenden Lösungen wecken, ganz praktisch Tipps und Tricks für den gestalterischen Alltag geben und mit brillanten Beispielen aus der Praxis inspirieren. http://2012.webfontday.de/

wbfntdyiconstgm
AdWords Konferenz_2012: Viktor Zemann: Optimierungs-Strategien & -Tools tibil...
AdWords Konferenz_2012: Viktor Zemann: Optimierungs-Strategien & -Tools tibil...AdWords Konferenz_2012: Viktor Zemann: Optimierungs-Strategien & -Tools tibil...
AdWords Konferenz_2012: Viktor Zemann: Optimierungs-Strategien & -Tools tibil...

Kein Konto ist perfekt. Doch wo sind die Schwachstellen? Wie erzielen Sie schnell deutliche Verbesserungen? Sehen Sie hier, wie Sie die Schwächen in Ihrem Konto aufdecken. Erfahren Sie, wie Sie diese gezielt und strategisch beheben. Und holen Sie mit diesen Tools alles aus Ihrem Konto raus.

google adwordsonline businesssea
Icons im Web: Roundtrip for a better web experience
Icons im Web: Roundtrip for a better web experienceIcons im Web: Roundtrip for a better web experience
Icons im Web: Roundtrip for a better web experience

Update meines Vortrags vom #wbfntdy 2012 anlässlich des ersten Treffens der GTUG Munich im Münchner Google Büro 2013. Angesichts weiterer neuer Hardware wie z.B. dem Google Chromebook »Pixel« weiterhin aktuell und spannend.

html5iconscss3
Unwissenheit ist ein Segen - Responsive webdesign
Quelle: http://stevenduque.com/2010/05/the-mobile-internet-era-is-upon-us/
Quelle: http://stevenduque.com/2010/05/the-mobile-internet-era-is-upon-us/
„Es ist nicht gesagt, dass es
besser wird, wenn es anders
wird. Wenn es aber besser
werden soll, muss es anders
werden.“
Georg Christoph Lichtenberg (1742-99)
dt. Aphoristiker u. Physiker

Empfohlen für Sie

Relicamp12 Responsive Webdesign und Webapps
Relicamp12 Responsive Webdesign und WebappsRelicamp12 Responsive Webdesign und Webapps
Relicamp12 Responsive Webdesign und Webapps
kirche im webkirche 2.0responisve webdesign
121127 SouperTuesday "Responsive Webdesign"
121127 SouperTuesday "Responsive Webdesign"121127 SouperTuesday "Responsive Webdesign"
121127 SouperTuesday "Responsive Webdesign"

Creative Director Rüdiger von Selzam, studioselzam: Einführung in das Thema "Responsive Webdesign" auf Oseon's SouperTuesday am 27.11.12

oseon pr responsive webdesign studioselzam
HTML5-Legacy-Anwendungen
HTML5-Legacy-AnwendungenHTML5-Legacy-Anwendungen
HTML5-Legacy-Anwendungen

Die Anforderungen für Websites sind heute oft widersprüchlich: verlangt ist ein zeitgemäßes Design und ansprechende Animationen, aber bitte mit offenen Webstandards, damit das ganze auch auf Smartphones und Tablets gut aussieht. Gleichzeitig ist auf Kundenseite aber ein Browser im Einsatz, der seit Jahren nicht mehr aktualisiert wurde. Jonathan Weiß stellt Lösungen vor, um diese Herausforderung zu stemmen und zeigt, welches kaum bekannte Potenzial im Legacy-Browser steckt.

pollyfillscrossbrowserlegacybrowser
Responsive Design
        =
  Mobile Design?
Responsive Design
        ≠
  Mobile Design,
    sondern …
… es ist Design für alle Geräte.
Responsive Design ist
flexibles, geräteunabhängiges
      Design für das Web.

Empfohlen für Sie

The Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive WebdesignThe Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign

Seit dem Artikel von Ethan Marcotte hat Responsive Webdesign richtig Fahrt aufgenommen. Responsive Webdesign ist ein zentrales Buzzword, wenn es um Webentwicklung, E-Commerce, UX, SEO und Marketing geht. Seit 2010 hat sich viel verändert. Browser und Techniken haben sich weiterentwickelt. Das Nutzerverhalten hat sich stark verändert, heute sind Nutzer immer und überall online. Aber was ist mit uns, wo bleiben unsere Innovationsstärke und der Mut für Neues? Wir, die Websites verkaufen, konzipieren, designen und entwickeln. Entrepreneurship und Innovation erfordern Mut und einen Schritt weiterzugehen als alle anderen - where no man has gone before. Der Vortrag zeigt, dass jetzt der Zeitpunkt ist, innovative HTML- und CSS-Techniken einzusetzen.

fluiditiyresponsivewebdesign
SEO Produktspezifikation für RWD
SEO Produktspezifikation für RWDSEO Produktspezifikation für RWD
SEO Produktspezifikation für RWD

Das Konzept: Für jeden verständlich und übersichtlich, gemacht für Designer, Template-Entwickler und IT. Alle Anforderungen, alle Besonderheiten für mobile Optimierung müssen spezifiziert sein und dabei soll alles auch noch so einfach wie möglich aufbereitet sein. Gar nicht so einfach, oder?

Responsive Images
Responsive ImagesResponsive Images
Responsive Images

Teilbereich meiner Massenarbeit Responsive Webdesign CSS Framework

mobile firstadaptive imagesresponsive webdesign
http://www.alistapart.com/articles/responsive-web-design/
http://www.alistapart.com/d/responsive-web-design/ex/ex-site-FINAL.html
Rocket Science
?   oder Alter Hut
http://www.alistapart.com/articles/switchymclayout/

Empfohlen für Sie

Netzstrategen digitaler feierabend - 1. präsentation - basiswissen
Netzstrategen   digitaler feierabend - 1. präsentation - basiswissenNetzstrategen   digitaler feierabend - 1. präsentation - basiswissen
Netzstrategen digitaler feierabend - 1. präsentation - basiswissen
Webentwicklung für das IPhone
Webentwicklung für das IPhoneWebentwicklung für das IPhone
Webentwicklung für das IPhone

Tipps zu Frameworks, Javascript code und HTML Tricks für eine angepasste Darstellung von Webseiten auf dem IPhone

webseiteniuiiphone
Lokales Online-marketing & sportplatz.sh
Lokales Online-marketing & sportplatz.shLokales Online-marketing & sportplatz.sh
Lokales Online-marketing & sportplatz.sh
sportplatzsh
http://www.themaninblue.com/writing/perspective/2004/09/21/
1   Flexibles Layout
    Make %, not px!
Letztes Jahr …

                       >1024px
            ~ 768px


~ 480px
Nächstes Jahr …

                    >> 1024px
           ? px


? px
           ?
 ?

Empfohlen für Sie

20110921 netzstrategen - wvo - präsentation online-marketing
20110921   netzstrategen - wvo - präsentation online-marketing20110921   netzstrategen - wvo - präsentation online-marketing
20110921 netzstrategen - wvo - präsentation online-marketing

Möglichkeiten der Verknüpfung von Prospekten/Direktverteilung und Online-Marketing.

printdirektverteilungwvo
Online / Offline
Online / OfflineOnline / Offline
Online / Offline

Talk zum Responsive Design Day auf der Webinale 2015 in Berlin.

internethtml5local storage
Webmontag karlsruhe – responsive images, maddesigns (sven wolfermann)
Webmontag karlsruhe – responsive images, maddesigns (sven wolfermann)Webmontag karlsruhe – responsive images, maddesigns (sven wolfermann)
Webmontag karlsruhe – responsive images, maddesigns (sven wolfermann)

Kurzüberblick über Responsive Image Techniken beim Webmontag Karksruhe

#wmkaresponsive imagesresponsive
http://www.alistapart.com/articles/fluidgrids/
http://www.designinfluences.com/fluid960gs/
http://cssgrid.net/
http://www.yaml.de

Empfohlen für Sie

Responsive Web Design für Mobilgeräte mit Drupal
Responsive Web Design für Mobilgeräte mit Drupal Responsive Web Design für Mobilgeräte mit Drupal
Responsive Web Design für Mobilgeräte mit Drupal

Der Anteil an mobilen Besuchern von Webseiten steigt stetig und immer rasanter. Eine der Lösungen dafür nennt sich "Responsive Web Design" und wird von Drupal durch verschiedenste Base Themes unterstützt. Allerdings gibt es dabei einige wichtige Dinge zu beachten, da die Möglichkeiten für Responsive Web Design fast endlos sind. Michael Schmid von Amazee Labs hat schon mehrere Responsive Webseiten geplant und umgesetzt und wird einige der Hürden und dessen Lösungen präsentieren. • Was ist Responsive Web Design und was kann es? • Übersicht über die verschiedensten Responsive Themes in Drupal 7 • Probleme und Learnings nach über 10 gebauten Drupal Responsive Web Design Webseiten

drupalacquia webinardrupal webinar
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive WebdesignThe Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign

Seit dem Artikel von Ethan Marcotte hat Responsive Webdesign richtig Fahrt aufgenommen. Responsive Webdesign ist ein zentrales Buzzword, wenn es um Webentwicklung, E-Commerce, UX, SEO und Marketing geht. Seit 2010 hat sich viel verändert. Browser und Techniken haben sich weiterentwickelt. Das Nutzerverhalten hat sich stark verändert, heute sind Nutzer immer und überall online. Aber was ist mit uns, wo bleiben unsere Innovationsstärke und der Mut für neues? Wir, die Websites verkaufen, konzipieren, designen und entwickeln. Entrepreneurship und Innovation erfordern Mut und einen Schritt weiterzugehen als alle anderen - where no man has gone before. Der Vortrag zeigt, dass jetzt der Zeitpunkt ist, innovative HTML- und CSS-Techniken einzusetzen. Der Vortrag richtet sich in erster Linie an Frontend Entwickler und User Experience Designer/Consultants die mehr als Grundkenntnisse in HTML, CSS und JavaScript mitbringen.

css3flexboxwebstandards
LESSONS LEARNED FROM THE DESIGN OF AN USER INTERFACE
LESSONS LEARNED FROM THE DESIGN OF AN USER INTERFACELESSONS LEARNED FROM THE DESIGN OF AN USER INTERFACE
LESSONS LEARNED FROM THE DESIGN OF AN USER INTERFACE

Die mobile Nutzung des Internets stellt Webentwickler vor neue Herausforderungen bei der Planung und Entwicklung von Webseiten. Der damit einhergehende, sich verändernde Workflow bedingt eine frühzeitige Verlagerung der Konzept- und Entwurfsarbeit in den Browser. Dieser Idee folgend entwickelt Dirk Jesse seit ca. 4 Jahren mit "Thinkin' Tags" eine browserbasierte Entwicklungsumgebung zur Erstellung von Wireframes, Mockups und Prototypen. Der Vortrag gibt Einblicke in die Konzeption und Entwicklung der Benutzeroberfläche von "Thinkin' Tags" aus dem Blickwinkel der Usability. Daher geht es nicht um die technische Umsetzung, sondern um Fragen, wie z.B. ein visuell orientierter Workflow robust gestaltet werden kann? Wie unterscheidet sich die Arbeit in einer Webapplikation von der Arbeit mit klassischen Desktoptools? Wodurch wird eine Benutzeroberfläche nicht nur performant, sondern auch nutzerfreundlich?

user experienceuser interfaceweb applications
2   Flexible Schriften
Mobile Displays
Fonts
Basisdefinition                    Inhalte

 body {                            h1 {
    font-size: 100%; /* ~16px */       font-size: 200%; /* ~ 32px */
    line-heigth: 1.6;                  …
    …                              }
 }



                                   p{
                                        font-size: 87,5%; /* ~ 14px */
                                        …
                                   }
3   Flexible Medien

Empfohlen für Sie

Browser-based Rapid Prototyping
Browser-based Rapid PrototypingBrowser-based Rapid Prototyping
Browser-based Rapid Prototyping

These are the slides from my lightning talk at Beyond Tellerrand Conference 2013 in Duesseldorf

htmlcss3rapid prototyping
Thinkin' Tags - Rapid Prototyping of CSS Layouts
Thinkin' Tags - Rapid Prototyping of CSS LayoutsThinkin' Tags - Rapid Prototyping of CSS Layouts
Thinkin' Tags - Rapid Prototyping of CSS Layouts

Some thoughts about the challenges of creating "Thinkin' Tags" as a JavaScript developer ... presented on apps.berlin.js (Feb., 28th, 2013)

javascripthtml5editor
Layout Frameworks im professionellen Webdesign
Layout Frameworks im professionellen WebdesignLayout Frameworks im professionellen Webdesign
Layout Frameworks im professionellen Webdesign
css framworkswebdesignrapid prototyping
Medien skalieren
up- & downscale       downscale only

 img {                 img {
    width: 100%;          max-width: 100%;
 }                     }

 video,                video,
 object {              object {
    width: 100%;          max-width: 100%;
 }                     }
Legacy Support
• min-width Support für IE6

  img { width: 100%; }




• Windows Image Resizing
 http://unstoppablerobotninja.com/entry/fluid-images

 JS aktiviert AlphaImageLoader (Proprietärer IE-Filter), oder …



  img { -ms-interpolation-mode: bicubic; }
Bandbreite beachten!
Datenvolumen reduzieren!

             volle Größe




       reduzierte Größe

Empfohlen für Sie

Für Wen, Wie Und Warum - Webstandards im Projektalltag
Für Wen, Wie Und Warum - Webstandards im ProjektalltagFür Wen, Wie Und Warum - Webstandards im Projektalltag
Für Wen, Wie Und Warum - Webstandards im Projektalltag

Kleine Einführung in die Arbeit mit Webstandards im Rahmen des World Usability Days 2009 in Dresden.

webstandards
CSS Frameworks (09/2008)
CSS Frameworks (09/2008)CSS Frameworks (09/2008)
CSS Frameworks (09/2008)
cssframeworkswke
Css Frameworks - Ein Überblick (04/2008)
Css Frameworks - Ein Überblick (04/2008)Css Frameworks - Ein Überblick (04/2008)
Css Frameworks - Ein Überblick (04/2008)

Wie definiert sich ein CSS Framework, Vorstellung aktueller Projekte, Diskussion von Vor- und Nachteilen von CSS Framworks.

tripolicssframeworks
Bilder optimal einbinden
• Hintergrundgrafiken

  body { background-image: url(…); }




• Responsive Images (Filament Group)
 http://filamentgroup.com/lab/responsive_images_experimenting_with_context_aware_image_sizing/




  <img src="small.r.jpg" data-fullsrc="large.jpg">
4   Media Queries
Media Types
Desktop

  <link rel="stylesheet" media="screen" href="screen.css" />


Drucker
  <link rel="stylesheet" media="print" href="print.css" />


Mobilgeräte ???

  <link rel="stylesheet" media="handheld" href="mobile.css" />
Media Features
Eigenschaft           Schlüsselwort                     Werte       min/max

Viewportgröße         width, height,                  <length>        ja
                      aspect-ratio                     <ratio>

Displaygröße          device-width, device-height,    <length>        ja
                      device-aspect-ratio              <ratio>

Auflösung             resolution                     <resolution>     ja

Ausrichtung           orientation                      portrait,       -
                                                      landscape
Farbe                 color, color-index,             <integer>       ja
                      monochrome
TV-Darstellungsmodus scan                            progressive,      -
                                                      interlace
Art des Displays      grid                             1 (grid)        -
                                                      0 (bitmap)

http://www.w3.org/TR/css3-mediaqueries/

Empfohlen für Sie

Media Queries
Desktopbrowser allgemein:
 Viewport Mindestbreite: 768 Pixel

  <link rel="stylesheet"
        media="screen and (min-width: 768px)"
        href="screen.css" />


  /* Desktop Styles */
  @ media screen and (min-width: 768px) {
        ….
  }
Media Queries
Mobilgeräte allgemein:
 Viewport Maximalbreite: 480 Pixel

  <link rel="stylesheet"
        media="screen and (max-width: 480px)"
        href="screen.css" />


  /* Mobile Styles */
  @media screen and (max-width: 480px) {
       ….
  }
Media Queries
Desktop:
 Viewport Mindestbreite: 768 Pixel

  <link rel="stylesheet"
        media="screen and (min-width: 768px)"
        href="screen.css" />


  /* Desktop Styles */
  @ media screen and (min-width: 768px) {
        ….
  }
Media Queries
Hochauflösende Displays:
 iPhone Retina-Display: 326dpi

  <link rel="stylesheet"
        media="screen and (min-resolution: 300dpi)"
        href="screen.css" />


  /* Desktop Styles */
  @ media screen and (min-resolution: 300dpi) {
        ….
  }

Empfohlen für Sie

Mobile Resizing

<meta name="viewport" content="width=device-width; initial-scale=1.0">



Eigenschaft                Schlüsselwort      Wert
Viewport                   width              <integer> | device-width
Zoom-Level (initial)       initial-scale      <number>
Zoom-Level (maximal)       max-scale          <number>


https://developer.mozilla.org/en/Mobile/Viewport_meta_tag
http://www.highresolution.info/webdesign/responsive-design/index.html
http://www.laufbild-werkstatt.de/
http://stephencaver.com/

Empfohlen für Sie

Browser-
5   Nachhilfe
Browser-Kompatibilität
• Media Queries für FF 2, IE 6-8, Safari 2
  – jQuery-Plugin für Media Queries von 2008
    http://plugins.jquery.com/project/MediaQueries

  – JS-Library: css-mediaqueries.js
    http://code.google.com/p/css3-mediaqueries-js/
http://mediaqueri.es
„UNWISSENHEIT IST EIN
      SEGEN!“


Responsive Webdesign ist ein
Weg zum bestmöglichen Design
       für jedes Gerät.

Empfohlen für Sie

Danke
office@highresolution.info
                 @djesse
Vortrag inspiriert durch:
                  Mike Bollinger
     http://www.slideshare.net/livefront/responsive-design-7877412



   YAML Demo „Responsive Design“
http://www.highresolution.info/webdesign/responsive-design/index.html

Weitere ähnliche Inhalte

Ähnlich wie Unwissenheit ist ein Segen - Responsive webdesign

Die Zukunft der Webstandards - Webinale 31.05.2010
Die Zukunft der Webstandards - Webinale 31.05.2010Die Zukunft der Webstandards - Webinale 31.05.2010
Die Zukunft der Webstandards - Webinale 31.05.2010
Patrick Lauke
 
Typografie im Responsive Webdesign
Typografie im Responsive WebdesignTypografie im Responsive Webdesign
Typografie im Responsive Webdesign
Sven Wolfermann
 
Responsive Webdesign - Unter der Haube
Responsive Webdesign - Unter der HaubeResponsive Webdesign - Unter der Haube
Responsive Webdesign - Unter der Haube
falconwhite
 
Wbfntdy 2012
Wbfntdy 2012Wbfntdy 2012
Wbfntdy 2012
Markus Greve
 
AdWords Konferenz_2012: Viktor Zemann: Optimierungs-Strategien & -Tools tibil...
AdWords Konferenz_2012: Viktor Zemann: Optimierungs-Strategien & -Tools tibil...AdWords Konferenz_2012: Viktor Zemann: Optimierungs-Strategien & -Tools tibil...
AdWords Konferenz_2012: Viktor Zemann: Optimierungs-Strategien & -Tools tibil...
e-dialog GmbH
 
Icons im Web: Roundtrip for a better web experience
Icons im Web: Roundtrip for a better web experienceIcons im Web: Roundtrip for a better web experience
Icons im Web: Roundtrip for a better web experience
Markus Greve
 
Relicamp12 Responsive Webdesign und Webapps
Relicamp12 Responsive Webdesign und WebappsRelicamp12 Responsive Webdesign und Webapps
Relicamp12 Responsive Webdesign und Webapps
Maria Herrmann
 
121127 SouperTuesday "Responsive Webdesign"
121127 SouperTuesday "Responsive Webdesign"121127 SouperTuesday "Responsive Webdesign"
121127 SouperTuesday "Responsive Webdesign"
Oseon
 
HTML5-Legacy-Anwendungen
HTML5-Legacy-AnwendungenHTML5-Legacy-Anwendungen
HTML5-Legacy-Anwendungen
Jonathan Weiß
 
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive WebdesignThe Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign
Peter Rozek
 
SEO Produktspezifikation für RWD
SEO Produktspezifikation für RWDSEO Produktspezifikation für RWD
SEO Produktspezifikation für RWD
Conny Stier
 
Responsive Images
Responsive ImagesResponsive Images
Responsive Images
Christoph Zeller
 
Netzstrategen digitaler feierabend - 1. präsentation - basiswissen
Netzstrategen   digitaler feierabend - 1. präsentation - basiswissenNetzstrategen   digitaler feierabend - 1. präsentation - basiswissen
Netzstrategen digitaler feierabend - 1. präsentation - basiswissen
strategen-team
 
Webentwicklung für das IPhone
Webentwicklung für das IPhoneWebentwicklung für das IPhone
Webentwicklung für das IPhone
reinhardh
 
Lokales Online-marketing & sportplatz.sh
Lokales Online-marketing & sportplatz.shLokales Online-marketing & sportplatz.sh
Lokales Online-marketing & sportplatz.sh
larsnotleast
 
20110921 netzstrategen - wvo - präsentation online-marketing
20110921   netzstrategen - wvo - präsentation online-marketing20110921   netzstrategen - wvo - präsentation online-marketing
20110921 netzstrategen - wvo - präsentation online-marketing
Andre Hellmann
 
Online / Offline
Online / OfflineOnline / Offline
Online / Offline
Peter Rozek
 
Webmontag karlsruhe – responsive images, maddesigns (sven wolfermann)
Webmontag karlsruhe – responsive images, maddesigns (sven wolfermann)Webmontag karlsruhe – responsive images, maddesigns (sven wolfermann)
Webmontag karlsruhe – responsive images, maddesigns (sven wolfermann)
Sven Wolfermann
 
Responsive Web Design für Mobilgeräte mit Drupal
Responsive Web Design für Mobilgeräte mit Drupal Responsive Web Design für Mobilgeräte mit Drupal
Responsive Web Design für Mobilgeräte mit Drupal
Acquia
 
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive WebdesignThe Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign
Peter Rozek
 

Ähnlich wie Unwissenheit ist ein Segen - Responsive webdesign (20)

Die Zukunft der Webstandards - Webinale 31.05.2010
Die Zukunft der Webstandards - Webinale 31.05.2010Die Zukunft der Webstandards - Webinale 31.05.2010
Die Zukunft der Webstandards - Webinale 31.05.2010
 
Typografie im Responsive Webdesign
Typografie im Responsive WebdesignTypografie im Responsive Webdesign
Typografie im Responsive Webdesign
 
Responsive Webdesign - Unter der Haube
Responsive Webdesign - Unter der HaubeResponsive Webdesign - Unter der Haube
Responsive Webdesign - Unter der Haube
 
Wbfntdy 2012
Wbfntdy 2012Wbfntdy 2012
Wbfntdy 2012
 
AdWords Konferenz_2012: Viktor Zemann: Optimierungs-Strategien & -Tools tibil...
AdWords Konferenz_2012: Viktor Zemann: Optimierungs-Strategien & -Tools tibil...AdWords Konferenz_2012: Viktor Zemann: Optimierungs-Strategien & -Tools tibil...
AdWords Konferenz_2012: Viktor Zemann: Optimierungs-Strategien & -Tools tibil...
 
Icons im Web: Roundtrip for a better web experience
Icons im Web: Roundtrip for a better web experienceIcons im Web: Roundtrip for a better web experience
Icons im Web: Roundtrip for a better web experience
 
Relicamp12 Responsive Webdesign und Webapps
Relicamp12 Responsive Webdesign und WebappsRelicamp12 Responsive Webdesign und Webapps
Relicamp12 Responsive Webdesign und Webapps
 
121127 SouperTuesday "Responsive Webdesign"
121127 SouperTuesday "Responsive Webdesign"121127 SouperTuesday "Responsive Webdesign"
121127 SouperTuesday "Responsive Webdesign"
 
HTML5-Legacy-Anwendungen
HTML5-Legacy-AnwendungenHTML5-Legacy-Anwendungen
HTML5-Legacy-Anwendungen
 
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive WebdesignThe Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign
 
SEO Produktspezifikation für RWD
SEO Produktspezifikation für RWDSEO Produktspezifikation für RWD
SEO Produktspezifikation für RWD
 
Responsive Images
Responsive ImagesResponsive Images
Responsive Images
 
Netzstrategen digitaler feierabend - 1. präsentation - basiswissen
Netzstrategen   digitaler feierabend - 1. präsentation - basiswissenNetzstrategen   digitaler feierabend - 1. präsentation - basiswissen
Netzstrategen digitaler feierabend - 1. präsentation - basiswissen
 
Webentwicklung für das IPhone
Webentwicklung für das IPhoneWebentwicklung für das IPhone
Webentwicklung für das IPhone
 
Lokales Online-marketing & sportplatz.sh
Lokales Online-marketing & sportplatz.shLokales Online-marketing & sportplatz.sh
Lokales Online-marketing & sportplatz.sh
 
20110921 netzstrategen - wvo - präsentation online-marketing
20110921   netzstrategen - wvo - präsentation online-marketing20110921   netzstrategen - wvo - präsentation online-marketing
20110921 netzstrategen - wvo - präsentation online-marketing
 
Online / Offline
Online / OfflineOnline / Offline
Online / Offline
 
Webmontag karlsruhe – responsive images, maddesigns (sven wolfermann)
Webmontag karlsruhe – responsive images, maddesigns (sven wolfermann)Webmontag karlsruhe – responsive images, maddesigns (sven wolfermann)
Webmontag karlsruhe – responsive images, maddesigns (sven wolfermann)
 
Responsive Web Design für Mobilgeräte mit Drupal
Responsive Web Design für Mobilgeräte mit Drupal Responsive Web Design für Mobilgeräte mit Drupal
Responsive Web Design für Mobilgeräte mit Drupal
 
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive WebdesignThe Future is now! Flexbox und fancy Stuff im Responsive Webdesign
The Future is now! Flexbox und fancy Stuff im Responsive Webdesign
 

Mehr von djesse

LESSONS LEARNED FROM THE DESIGN OF AN USER INTERFACE
LESSONS LEARNED FROM THE DESIGN OF AN USER INTERFACELESSONS LEARNED FROM THE DESIGN OF AN USER INTERFACE
LESSONS LEARNED FROM THE DESIGN OF AN USER INTERFACE
djesse
 
Browser-based Rapid Prototyping
Browser-based Rapid PrototypingBrowser-based Rapid Prototyping
Browser-based Rapid Prototyping
djesse
 
Thinkin' Tags - Rapid Prototyping of CSS Layouts
Thinkin' Tags - Rapid Prototyping of CSS LayoutsThinkin' Tags - Rapid Prototyping of CSS Layouts
Thinkin' Tags - Rapid Prototyping of CSS Layouts
djesse
 
Layout Frameworks im professionellen Webdesign
Layout Frameworks im professionellen WebdesignLayout Frameworks im professionellen Webdesign
Layout Frameworks im professionellen Webdesign
djesse
 
Für Wen, Wie Und Warum - Webstandards im Projektalltag
Für Wen, Wie Und Warum - Webstandards im ProjektalltagFür Wen, Wie Und Warum - Webstandards im Projektalltag
Für Wen, Wie Und Warum - Webstandards im Projektalltag
djesse
 
CSS Frameworks (09/2008)
CSS Frameworks (09/2008)CSS Frameworks (09/2008)
CSS Frameworks (09/2008)
djesse
 
Css Frameworks - Ein Überblick (04/2008)
Css Frameworks - Ein Überblick (04/2008)Css Frameworks - Ein Überblick (04/2008)
Css Frameworks - Ein Überblick (04/2008)
djesse
 

Mehr von djesse (7)

LESSONS LEARNED FROM THE DESIGN OF AN USER INTERFACE
LESSONS LEARNED FROM THE DESIGN OF AN USER INTERFACELESSONS LEARNED FROM THE DESIGN OF AN USER INTERFACE
LESSONS LEARNED FROM THE DESIGN OF AN USER INTERFACE
 
Browser-based Rapid Prototyping
Browser-based Rapid PrototypingBrowser-based Rapid Prototyping
Browser-based Rapid Prototyping
 
Thinkin' Tags - Rapid Prototyping of CSS Layouts
Thinkin' Tags - Rapid Prototyping of CSS LayoutsThinkin' Tags - Rapid Prototyping of CSS Layouts
Thinkin' Tags - Rapid Prototyping of CSS Layouts
 
Layout Frameworks im professionellen Webdesign
Layout Frameworks im professionellen WebdesignLayout Frameworks im professionellen Webdesign
Layout Frameworks im professionellen Webdesign
 
Für Wen, Wie Und Warum - Webstandards im Projektalltag
Für Wen, Wie Und Warum - Webstandards im ProjektalltagFür Wen, Wie Und Warum - Webstandards im Projektalltag
Für Wen, Wie Und Warum - Webstandards im Projektalltag
 
CSS Frameworks (09/2008)
CSS Frameworks (09/2008)CSS Frameworks (09/2008)
CSS Frameworks (09/2008)
 
Css Frameworks - Ein Überblick (04/2008)
Css Frameworks - Ein Überblick (04/2008)Css Frameworks - Ein Überblick (04/2008)
Css Frameworks - Ein Überblick (04/2008)
 

Unwissenheit ist ein Segen - Responsive webdesign