Smashing Book #3: Links and References

On this page we collected all links from the Smashing Book #3 for your convenience. Please bear in mind that the content or designs may have changed in some cases.

You might want to check Smashing Book #3 — The Extension Links, Smashing Book #2 Links and Smashing Book #1 Links as well.

Chapter 1: The Business Side of Redesign

Written by Paul Boag, Reviewed by Collis Ta'eed

The Smashing Book 3 Chapter 1

Footnotes

  1. The Washington Post, "Facebook Changes Confuse Users, as a Major Overhaul Looms".
  2. Moll, Cameron. "Good Designers Redesign, Great Designers Realign".
  3. Nielsen, Jacob. "Fresh vs. Familiar: How Aggressively to Redesign".
  4. Verify App
  5. WebSort

Chapter 2: Selecting a Plattform: Technical Considerations for Your Redesign

Written by Rachel Andrew, Reviewed by Ryan Carson and Harley Finkelstein

The Smashing Book 3 Chapter 2

Footnotes

  1. Andrew, Rachel. "Your CMS as Curator of Your Design and Content".
  2. Chopra, Paras. "The Ultimate Guide to A/B Testing".
  3. Google Webmaster Central Blog, "Using Site Speed in Web Search Ranking".
  4. Beanstalk, "An Introduction to Version Control".

Chapter 3: Jumping Into HTML5

Written by Ben Schwarz, Reviewed by Russ Weakley

The Smashing Book 3 Chapter 3

Beta versions of several browsers

Footnotes

  1. When Can I Use
  2. Make Data Useful by Greg Linden
  3. Yepnope.js
  4. HTML5 Boilerplate Webserver configuration repository on GitHub
  5. UglifyJS compiler
  6. HTML5 Shiv on Google Code
  7. Modernizr by Faruk Ateş and Paul Irish
  8. Normalize.css by Nicolas Gallagher and Jonathan Neal
  9. Nicolas Gallagher's website
  10. Jonathan Neal on Twitter
  11. HTML5 Doctor
  12. Validator.nu

Summary

Figures

Chapter 4: Restyle, Recode, Reimagine With CSS3

Written by David Storey and Lea Verou, Reviewed by Tab Atkins

The Smashing Book 3 Chapter 4

Footnotes

  1. Modernizr by Faruk Ateş and Paul Irish
  2. List of vendor prefixes by @alrra
  3. Prefixes via JavaScript by Lea Verou
  4. Compatibility tables for browser support on When Can I Use
  5. Compatibility tables for browser support on HTML5 Please
  6. Mozilla Developer Network's documentation
  7. Example: @font-face
  8. Font Squirrel
  9. Example: Museo Sans font by Jos Buivenga
  11. Example: CSS3: Multiple Backgrounds and Gradients on Dabblet
  12. Example: CSS3: Background-size/-origin, outline on Dabblet
  14. Example: Small border image on Dabblet
  15. Example: :target on Wikipedia
  16. Selectivizr - CSS3 pseudo-class and attribute selectors by Keith Clark
  17. Cubic Bezier preview tool by Lea Verou

Figures

  1. Figure 4.4. Example: Centering with Flexbox
  2. Figure 4.5. Example: Flexing the size and position with Flexbox
  3. Figure 4.15. Example: CSS transform by Atli Harðarson
  4. Figure 4.17. Example: Mix Units on Dabblet
  5. Figure 4.18. Example: CSS Percentage Problem
  6. Figure 4.19. Example: Box-sizing on Dabblet
  7. Figure 4.20. Example: Transition timing by Paolo Camera

Chapter 5: JavaScript Rediscovered: Tricks to Replace Complex jQuery

Written by Christian Heilmann, Reviewed by Paul Irish

The Smashing Book 3 Chapter 5

Footnotes

  1. When Can I Use
  2. Easing Equations by Robert Penner
  3. Example: Easing Equation
  4. Event delegation
  5. Example: To-Do list in plain HTML5 and JavaScript
  6. Example: Animated elements using CSS3
  7. Example: Thumbnail generation in the browser

Chapter 6: Techniques for building Better User Experiences

Written by Dmitry Fadeyev, Written by Joshua Porter

The Smashing Book 3 Chapter 6

Footnotes

  1. ZURB, "Why Burying Sign Up Buttons Helps Get More Sign Ups".
  2. VWO blog, "Signups increased by 60% after actually removing the signup form".
  3. Wroblewski, Luke. "Gradual Engagement Boosts Twitter Sign-Ups by 29%".
  4. Wroblewski, Luke. "Testing Accordion Forms".
  5. The Baymard Institute. "Contextual Words Like "Continue" are Usabilty Poison".
  6. Apple Insider, "Inside Max OS X 10.7: Lion".
  7. Holst, Christian. "Redesigning The Country Selector".
  8. Porter, Joshua. "Reward The Passionates".

Chapter 7: Designing for the Future, Using Photoshop

Written by Marc Edwards, Reviewed by Jon Hicks

The Smashing Book 3 Chapter 7

Footnotes

  1. Photoshop Action: Copy Merge

Figures

Chapter 8: Redesigning With Personality

Aarron Walter, Reviewed by Denise Jacobs

The Smashing Book 3 Chapter 8

Footnotes

  1. Wikipedia: Borg (Star Trek)
  2. Carbonmade
  3. Photojojo
  4. GE
  5. The travel-booking company Hipmunk site
  6. Wufoo
  7. SurveyMonkey
  8. Wilson, Fred. "Minimum Viable Personality".
  9. Wroblewski, Luke. "Warm Gun: Designing for Emotion".
  10. Forbes, "Why Does Emotional Design Work on the Web".
  11. Download: User Persona Template
  12. Van Gorp, Trevor. "Emotional Design With A.C.T.: Part 1".
  13. Anderson, Stephen P. "Mental Notes".
  14. Download: User Persona Template
  15. Voice & Tone
  16. Bonus Content for Chapter 08

Chapter 9: Mobile Considerations in User Experience Design: "Web or Native?"

Written by Aral Balkan, Reviewed by Josh Clark and Anders M. Andersen

The Smashing Book 3 Chapter 9

Footnotes

  1. Presentation: "Understanding 'The Other': Roles, Process and Architecture for RIAs" by Aral Balkan
  2. Apples iOS "Human Interface Guidelines"
  3. Feathers
  4. Swype keyboard
  5. Çelik, Tantek. "Web Human Interface Guidelines" & Hewitt, Joe. "Web Technologies Need an Owner".
  6. Statement: "If you are not paying for it, you're not the customer; you're the product being sold." by Andrew Lewis
  7. Balkan, Aral. "My websites will only support the latest browser versions".
  8. Topolsky, Joshua. "A modest proposal: the Continuous Client".
  9. Whinnery, Kevin. "The Future of Titanium Desktop".

Figures

Chapter 10: Workflow Redesigned: A Future-Friendly Approach

Written by Stephen Hay, Reviewed by Bryan Rieger

The Smashing Book 3 Chapter 10

Footnotes

  1. CSS Flexible Box Layout Module & Tutorial: Learn You a Flexbox for Great Good!
  2. Marcotte, Ethan. "Responsive Web Design".
  3. Wroblewski, Luke. "Mobile First".
  4. Few, Stephen. PDF: "Bullet Graph Design Specification". & Wikipedia: Bullet graph

Figures

  1. Figure 10.1. Image "You Are Here" by Joe Goldberg
  2. Figure 10.2. Image by Fabrice Florin, Wikimedia Foundation, licensed under the CC-BY-SA and GFDL license.
  3. Figure 10.9. Pandoc - a universal document converter

Chapter 11: Becoming Fabulously Flexible: Designing Atoms and Elements

Written by Andy Clark

The Smashing Book 3 Chapter 11

Footnotes

  1. Hume, Andy. "Responsive by default".
  2. Clarke, Andy. "I don’t care about Responsive Web Design".
  3. Wikipedia: Animal Magic (TV series)
  4. Allsopp, John. "A Dao of Web Design".
  5. Dreamweaver FAQ: Using Frames To Align Page Content
  6. Santa Maria, Jason. "A List Apart Redesign".
  7. Clarke, Andy. "A List (taken) Apart".
  8. Hicks, John. "Is 1024 OK?".
  9. Keith, Jeremy. "A List Too Far Apart?".
  10. Santa Maria, Jason. "A Real Web Design Application".
  11. Rieger, Stephanie. "The 'trouble' with Android".
  12. Marcotte, Ethan. "Responsive Web Design".
  13. Walton, Trent. "Content Choreography".
  14. Warren, Samantha. "Style Tiles as a Web Design Process Tool".
  15. Style Tiles by Samantha Warren
  16. Twitter Bootstrap
  17. Dribbble
  18. BBC's GEL (Global Experience Language)
  19. MailChimp
  20. Food Sense
  21. Jay Stocks, Elliot. "The Typography-Out Approach In The World Of Browser-Based Web Design"
  22. Jamie Oliver
  23. BBC Food
  24. BBC GEL (Global Experience Language): Fonts

Errata

Although we tried to do our best to avoid any mistakes or errors in the book, we did make some mistakes. We apoplogize for that. Here is the list of the mistakes we've found so far (you can also report mistakes and errors in the book):