responsive web design patterns
DESCRIPTION
How can we make pages that work across all devices out there? The answer is responsive web design and these are some patterns (techniques) that are currently being used.TRANSCRIPT
PatternsResponsive
Linz fh hagenberg web
15 inch
19 inch
800x600
1280x960
http:/
/w
ww
.alis
tapart.c
om
/artic
les/responsiv
e-w
eb-d
esig
n
http:/
/bradfrostw
eb.c
om
/blog/w
eb/m
obil
e-f
irst-r
esponsiv
e-w
eb-d
esig
n/
3/7
”A pixel is not a pixel.
A pixel is not a pixel.
3/7
vs
Slow
LoadingSlow
Loading
pixel-ated
pixel-ated
4/7
”73% ofweb design is typography.
73% ofweb design is typography.
4/7 http:/
/in
form
atio
narchit
ects.n
et/blog/responsiv
e-t
ypography-t
he-b
asic
s/:/
/stephanie
rie
ger.c
om
/a-p
lea-f
or-p
rogressiv
e-e
nhancem
ent/
”Embrace the flexibility.
Embrace the flexibility.
7/7
desktop
mobile
7/7
7/7
http://stephanie
rie
ger.com/a-p
lea-f
or-p
rogressiv
e-e
nhancement/
RESPONSIVE
patterns
RESPONSIVEpatterns
ThanksthanksFont: http://www.behance.net/gallery/Frontage-Typeface-freefont/3292158
Wood Texture: http://free-textures.got3d.com/architectural/free-wood-textures/pages/free-wood-texture-002.html
Pattern Texture: http://www.freegreatpicture.com/background-patterns/light-green-background-pattern-20329
Rubber Duck: http://www.flickr.com/photos/21723187@N04/2608418319/
Inspiration: http://www.lukew.com/ff/entry.asp?1514
Responsive Gallery: http://mediaqueri.es/
Responsive testing: http://responsive.is/
Original Article: http://www.alistapart.com/articles/responsive-web-design/