Slide 1

Slide 1 text

No content

Slide 2

Slide 2 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26 , 2011 RESPONSIVE WEB DESIGN DIGGING INTO DEVELOPMENT

Slide 3

Slide 3 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011

Slide 4

Slide 4 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011

Slide 5

Slide 5 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 MISTAKEN PERSONA

Slide 6

Slide 6 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 We have once again created a consensual hallucination. Just as we generated a mythical desktop user with the perfect viewport size, a fast connection and an infinite supply of attention, we have now generated a mythical mobile user who has a single goal and no attention span. - Jeremy Keith

Slide 7

Slide 7 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 Embrace Flexibility

Slide 8

Slide 8 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 RESPONSIVE DESIGN

Slide 9

Slide 9 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 A design that can adapt to the constraints of the browser window or device that renders it, creating a design that almost responds to the user's needs. - Ethan Marcotte

Slide 10

Slide 10 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 Flexible Grids

Slide 11

Slide 11 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 Flexible Media

Slide 12

Slide 12 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 Media Queries

Slide 13

Slide 13 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 THE HOLY WAR

Slide 14

Slide 14 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 One Web to Rule Them All

Slide 15

Slide 15 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 Many Webs to...

Slide 16

Slide 16 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 It Depends

Slide 17

Slide 17 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 the audience It depends on...

Slide 18

Slide 18 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 business requirements It depends on...

Slide 19

Slide 19 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 time & technology constraints It depends on...

Slide 20

Slide 20 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 maintenance requirements It depends on...

Slide 21

Slide 21 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 politics It depends on...

Slide 22

Slide 22 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 CONTENT FIRST

Slide 23

Slide 23 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 1. Build your content

Slide 24

Slide 24 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 2. Add semantic structure

Slide 25

Slide 25 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 3. Add the presentation

Slide 26

Slide 26 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 4. Add the behavior

Slide 27

Slide 27 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 Progressive Enhancement

Slide 28

Slide 28 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26, 2011 Tailor the approach to the project

Slide 29

Slide 29 text

CHARLOTTE FRONT-END DEVELOPERS BERMON PAINTER OCT 26 , 2011 FIN