Your SlideShare is downloading. ×
0
Teaching Responsive Design from the Beginning
Teaching Responsive Design from the Beginning
Teaching Responsive Design from the Beginning
Teaching Responsive Design from the Beginning
Teaching Responsive Design from the Beginning
Teaching Responsive Design from the Beginning
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Teaching Responsive Design from the Beginning

2,458

Published on

We teach web design like it's 2005, not 2013. How can we teach our students to think about responsive web design from the beginning of their college careers, where they are first learning HTML? Here …

We teach web design like it's 2005, not 2013. How can we teach our students to think about responsive web design from the beginning of their college careers, where they are first learning HTML? Here are some ideas.

Published in: Education, Technology, Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
2,458
On Slideshare
0
From Embeds
0
Number of Embeds
8
Actions
Shares
0
Downloads
10
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1.  Or how to update web design/HTML/CSS curricula for 2013
  • 2. www.jenkramer.org • jen@jenkramer.org ‹#› Draw a 960 px-wide design in Photoshop or Fireworks. Slice this comp to generate graphics. Lay out a static HTML web page using XHTML and incorporates thegraphics from the design into this page. Typically this is done withDreamweaver. Page is designed for a 960 px width. Widths, font sizes,padding, and margins are all designated with pixel widths. No mentionis made of flexible sizing, grid systems, or thinking about mobile. Send this page, and others like it, to their server via FTP.
  • 3. www.jenkramer.org • jen@jenkramer.org ‹#› Build the design in 12 evenly-sized columns. Show versions of the design. Ask questions about photos. Encourage students to think about touch. De-emphasize slicing.
  • 4. www.jenkramer.org • jen@jenkramer.org ‹#› Standardize on one browser for class. Teach HTML5. Teach CSS3 and all types of selectors. Incorporate grid-based thinking early. As soon as students have a solid understanding of floats andpositioning, start teaching how to code a grid. Responsive design is now a little lecture, not a huge lecture. Now its time for browser compatibility issues. LESS and/or Sass are hot topics. Its not a bad idea to cover responsive design frameworks (Bootstrap,Foundation).
  • 5. www.jenkramer.org • jen@jenkramer.org ‹#› The Open Source philosophy. Online portfolios Modifying/understanding someone elses code. Identify trends. Learning how to learn technology.
  • 6. www.jenkramer.org • jen@jenkramer.org ‹#›Jen KramerWaltham, MAPhone: 802-257-2657jen@jenkramer.orgwww.jenkramer.orgTwitter: @jen4webFacebook: facebook.com/webdesignjenSlides available atwww.slideshare.net/jen4webThis presentation will beavailable as an article atSmashing Magazine RealSoon Now.

×