Skip to main content Jump to list of all articles

The Smashing Library (56 eBooks)

The Smashing Library (56 eBooks)

PDF, ePUB, Kindle

$ 99.00 $ 381.44

If you ever wanted a reliable source for useful and valuable content, look no further. Our Smashing eBook Library has everything you need to start crafting well-designed and well-built websites today. The Library includes 51 valuable Smashing eBooks (including Smashing Books 1-5) as well as 4 third-party eBooks — Brad Frost’s “Atomic Design”, Paul Boag’s “Client Centric Web Design”, Jonathan Snook’s “Smacss”, and Jonathan Kohl’s “Tap Into Mobile Application Testing”. The eBooks work on all eBook readers and each is available in PDF, ePUB and Kindle formats.

This eBooks Bundle contains the following books:

Design Systems (eBook) +

As the web continues to become more complex, designing static pages has become untenable, so that many of us have started to approach design in a more systematic way. In this book, Alla Kholmatova sets out to identify what makes an effective design system that can empower teams to create great digital products.

  • There isn’t a standard definition of “design system” within the web community and people use the term in different ways. In this chapter, we’ll define what a design system is and what it consists of. Design Systems
  • Solid principles are the foundation for any well-functioning system. In this chapter we’ll discuss the qualities of effective design principles and look at some of the ways of defining them. Design Principles
  • In this chapter we’ll discuss the role of functional patterns and why they should be defined early in the design process. Functional Patterns
  • In this chapter we’ll discuss how perceptual patterns work and their role in a design system. Perceptual Patterns
  • This chapter describes how to establish a shared language, which allows a group of people to create and use patterns cohesively for a particular product. Shared Language
  • This chapter introduces some of the qualities a design system can have, and the ways in which risks and downsides can be managed. Parameters of Your System
  • In this chapter we’ll look at finding support for establishing a design system in your organization, and planning and starting the work. Planning And Practicalities
  • The exercise in this chapter describes an approach to systemizing functional patterns, starting with a product’s purpose. Systemizing Functional Patterns
  • The exercise in this chapter describes how to conduct an inventory of styles, define perceptual patterns, and integrate them into the system. Systemizing Perceptual Patterns
  • In this chapter we’ll look at some of the practical techniques to set up a simple, useful, and multidisciplinary pattern library. Pattern Libraries
Digital Adaptation (eBook) +

Nothing is more frustrating than stubborn management entangled in dated workflows and inefficient processes. That’s why we created “Digital Adaptation”, a new practical book on how to help senior management understand the Web and adapt the business, culture, team structure and workflows accordingly.

  • A Message for Web Professionals
  • The Digital Divide
  • Setting Your Digital Direction
  • Adopting A Digital Culture
  • Digital Teams: Agents Of Change
  • Digital Demands A Different Way Of Working
  • Grassroots Change
Inclusive Design Patterns (eBook) +

We make inaccessible and unusable websites and apps all the time, but it’s not for lack of skill or talent. It’s just a case of doing things the wrong way. We try to build the best experiences we can, but we only make them for ourselves and for people like us.

  • Introduction
  • The Document
  • A Paragraph
  • A Blog Post
  • Navigation
  • A Menu Button
  • Inclusive Prototyping
  • A List Of Products
  • A Filter Widget
  • A Registration Form
  • Test-Driven Markup
Making It Right: Product Management For A Startup World +

This eBook will empower product managers who work in digital and help them to build better products that make their companies and users more successful.

  • Roles And Responsibilities Of The Product Manager
  • Uncovering Needs
  • Product Discovery
  • The User Experience Of kalahari.com
  • Product Roadmaps
  • Defining A Product
  • User-Centered Design And Workflows
  • What About Responsive Design?
  • Specifications
  • Build And Release
  • Assess And Iterate
  • Product Management In Agile Methodologies
  • Getting Started
Smashing Book #5: Real-Life Responsive Web Design (eBook) +

Responsive design is a default these days, but we are all still figuring out just the right process and techniques to better craft responsive websites. That’s why we created a new book — to gather practical techniques and strategies from people who have learned how to get things done right, in actual projects with actual real-world challenges.

  • Front-end techniques. Scalability. Design systems. Bullet-proof solutions. Real-world challenges. Preface
  • Responsive workflow. Element collage. Style tiles. Tools. Deliverables. Performance budget. Interface inventory. Sketching. Planning. Manifestos. Hypothesis. Atomic design. Designing in the browser. Photoshop. Responsive Designer's Workflow
  • Design patterns. Navigation. Smart front-end techniques. Priority+ pattern. Improved off-canvas. Lazy loading. Autocomplete. Filters. Responsive PDF. Portrait/landscape mode. Sliders. Country selector. Responsive iconography. Responsive Design Patterns & Components
  • Structured content. Content consistency. Content models. Structural audit. Editorial content. Content types. Content relationships. Data-driven gaps. Feature-driven gaps. Authors and editors. CMS. Content maintenance. Structured Content for RWD
  • SVG. Syntax. Accessibility. Viewport. ViewBox. Exporting. Embedding. Sprites. Icon systems. Data URIs. Performance. Smart SVG techniques. Responsive iconography. Cross-browser fallbacks. Mastering SVG For RWD And Beyond
  • Syntax variants. Flex container. Orientation. Wrapping. Sizing boxes. Flex property. Forms with Flexbox. Advanced alignment. Magical margins. Reordering boxes. Order property. Flexbox as progressive enhancement. Building Responsive Components With Flexbox
  • Font formats. Font loading. Font-rendering. FOIT and FOUT. Font Loading API. Fallback fonts. Inlining fonts. Simulating swapping. Promises. Asynchronous loading and caching. Prioritized loading. Web Fonts Performance
  • CSS pixel and DPR. Retina displays. Fixed-width images. Variable-width images. Srcset and sizes. Art direction. <picture> element. Separation of concerns. Image format fallback. Accessibility. Background images. Image optimization. WebP and JPEG-XR. Compressive images. Deployment. Common pitfalls. Using Responsive Images, Today
  • Email landscape. CSS in email. Market share. Navigation and CTA buttons. Foundational markup. Reset and client-specific CSS. Fluid containers. Pattern-based development. Layout techniques. Microsoft Outlook. Windows Live Mail. Apple Mail. Mozilla Thunderbird. Outlook.com. Yahoo! Mail. AOL. iOS Mail. Gmail. The Dark Side Of Responsive HTML Email
  • “Cutting the mustard”. Predictable, simple CSS. Naming conventions. BEM and class names. Sass organization. Debugging media queries. Lazy loading. Content-out media queries. Separation of concerns. Exploratory testing. Functional testing. Visual regression testing. Automated testing. Dealing with false positives. Common dependencies. Troubleshooting bugs on mobile. Testing, Maintaining And Debugging RWD
  • Advertising. User experience design. Creative hijinks. Allergic to research. Process and predictability. Building blocks of creativity. Intoxicated by process. Platform for creativity. Creative brief. Line between control and chaos. Buying creativity. copywriting. Creative teams. Creative direction Counting Stars: Creativity Over Predictability In RWD
  • navigator.onLine. Online and offline events. HTML5 Application Cache. Cache manifest. Fallbacks. AppCache gotchas. Web Storage. localStorage. Service Workers. Beyond Responsive: Optimizing For Offline
  • Collaboration. Estimates. Spiraling. “One-deliverable” workflow. Efficiency. Content priority guide. Style comparisons. Testing the aggregate. Content prototype. Wireframes. Style prototypes. Pattern libraries. Happy teams. Efficient Responsive Process With Clients
  • Mobile first. jQuery dependence. Dealing with IE8. Advertising. Refactoring. Code inventory. Front-end optimization. Performance budget. SpeedIndex. Deferring web fonts. Critical CSS. Smart font fallback. Dealing with JavaScript. Asynchronous loading. SPDY/HTTP 2.0. Core content/functionality priority lists. Responsive images. Performance Optimization Roadmap
The Sketch Handbook (eBook) +

If you’re designing for the web today, you are probably using Sketch. We do, too, so we created “The Sketch Handbook”, filled with many practical examples and tutorials in 12 jam-packed chapters.

  • An Introduction To Sketch
  • Designing An App
  • The Power Of Iterations And Artboards
  • Creating A Logo For The App
  • Creating The Overview Page
  • Exporting
  • Design The Article Page
  • Going Responsive
  • The Final Breakpoint: Desktop Widescreen
  • Designing The Category Icons
  • Export The Category Icons
  • Mini Projects
User Experience Revolution (eBook) +

Many companies try to create a great experience for customers. But few are willing to make the changes required to deliver on that promise. In fact most don’t even realize just how bad their experience can be.

  • Getting Real About User Experience Design
  • How To Sell The Benefits Of User Experience Design
  • Create Customer Experience Evangelists
  • Raise The Profile Of The Customer
  • Get Managerial Support
  • Develop A Proof Of Concept
  • Establish Better Working Practices
A Career On The Web: Assuming Leadership +

Fresh ideas and practical advice to help you improve your leadership skills and foster a passionate and agile team.

  • Assuming Leadership In Your Design Agency
  • Lessons Learned From Leading New Web Professionals
  • How And Why To Make Side Projects Work At A Digital Agency
  • Internal Developer Training: Doing It Right
  • How To Build An Agile UX Team: The Culture
  • How To Build An Agile UX Team: Hiring
  • How To Build An Agile UX Team: Integration
  • How To Recruit A UX Designer
A Career On The Web: On The Road To Success +

There comes a time in everyone’s career when changing jobs is the natural next step. But how can you make the most of this situation and find a job you’ll love?

  • How A Designer Can Find A Job They Will Truly Love
  • The Difference Between Good And Bad Job Requirements
  • Preparing For A Front-End Job Interview
  • Land Your Next Web Development Job: The Interview Process
  • Career Advice For Graduating Web Design Students
  • The Habits Of Successful New Web Professionals
  • How To Maintain Your Brand As A Corporate Employee
A Field Guide To Usability Testing +

Testing usability is vital to creating a successful website — even more so if it’s an e-commerce website, a complex app or any other complicated project.

  • The Ultimate Guide to A/B Testing
  • Multivariate Testing in Action: Five Simple Steps To Increase Conversion Rates
  • 15 Essential Checks Before Launching Your Website
  • Test Usability By Embracing Other Viewpoints
  • Multivariate Testing 101: A Scientific Method Of Optimizing Design
  • Comprehensive Review Of Usability And User Experience Testing Tools
A Field Guide To User Research +

With this eBook, you will learn to take the guesswork out of your design decisions and base them on real-life experiences and user needs instead.

  • A Five-Step Process For Conducting User Research
  • A Closer Look At Personas: What They Are And How They Work
  • A Closer Look At Personas: A Guide To Developing The Right Ones
  • All You Need To Know About Customer Journey Mapping
  • Facing Your Fears: Approaching People For Research
  • Considerations When Conducting User Research In Other Countries: A Brazilian Case Study
  • How To Run User Tests At A Conference
Apps For All: Coding Accessible Web Applications +

Accessibility is not just about addressing specific disabilities, but making sure as many people as possible have access to the same information.

  • This Is For Everyone
  • It’s All About Buttons
  • The WAI Forward
  • Getting Around
  • Peekaboo
  • It’s Alive!
  • Welcome To The Community
Behind The Scenes Of Real-Life Projects +

The eBook “Behind the Scenes of Real-Life Projects” takes a closer look at the techniques and stories of some folks behind real-life Web projects.

  • Building The New Financial Times Web App
  • Bringing Angry Birds To Facebook
  • Behind The Scenes Of Nike Better World
  • Behind The Scenes Of Tourism New Zealand
  • Tale Of A Top-10 App, Part 1: Idea And Design
  • Tale Of A Top-10 App, Part 2: Marketing And Launch
  • Gone In 60 Frames Per Second: A Pinterest Paint Performance Case Study
  • Inside Google’s User Experience Lab: An Interview With Google’s Marcin Wichary
  • Mistakes I’ve Made (And Lessons Learned Along The Way)
Clients: Friends You Never Had +

The eBook “Clients: Friends You Never Had” provides valuable advice to foster stable relationships and a fruitful cooperation with your clients.

  • Getting Engaged
  • How To Build Long-Term Client Relationships
  • Keys To Better Communication With Clients
  • Guidelines For Successful Communication With Clients
  • Effective User Research And Transforming The Minds Of Clients
  • Why Account Managers Shouldn't Prevent Designers From Speaking To Clients
  • How Do You Deal With Overstressed, Irrational Clients? An Entrepreneur's View
  • How To Sell The Value Of Mobile To Clients
  • Encouraging Better Client Participation In Responsive Design Projects
Content Strategy +

This eBook delves into the world of content, providing beginners as well as communications pros with a fundamental understanding of how content strategy works.

  • The Immersive Web And Design Writing
  • Content: A Blessing, A Bubble, A Burden
  • Make Your Content Make a Difference
  • Content Strategy Within The Design Process
  • Content Strategy: Optimizing Your Efforts For Success
  • Finding Your Tone Of Voice
  • Fluidity Of Content And Design: Learning From Where The Wild Things Are
  • The Role Of Design In The Kingdom Of Content
  • How Disregarding Design Limits The Power Of Content
Content Strategy, Vol. 2: Planning, Producing And Maintaining Quality Content +

This eBook is your guide through the critical phases of content planning, production and maintenance, your partner in crime to develop a sound content strategy.

  • Editing Tips For Business Web Content
  • Framing Effective Messages To Motivate Your Users
  • Ways To Avoid Overwhelming Users: Lessons Learned From My High-School Teachers
  • How To Run A Content-Planning Workshop
  • Help Your Content Go Anywhere With A Mobile Content Strategy
  • Improving Your Information Architecture With Card-Sorting: A Beginner’s Guide
  • Content Knowledge Is Power
  • Dealing With Redundant, Out-Of-Date And Trivial (ROT) Content
Creating Meaningful Websites +

What is it that makes a website stand out from the crowd? What makes it memorable and meaningful? This eBook wants to explore these questions.

  • A Comprehensive Website Planning Guide
  • A Fun Approach To Creating More Successful Websites
  • Defending The Generalists In The Web Design Industry
  • Breaking Down Silos: The Consequences Of Working In Isolation
  • MUD: Minimum Usable Design
  • A Craft Of Consequences: Reader, Writer And Emotional Design
  • Easier Is Better Than Better
  • Designing Engaging And Enjoyable Long-Form Reading Experiences
  • Symptoms Of An Epidemic: Web Design Trends
Creativity Lessons For Web Designers +

The infamous creative spark isn’t as random as we might think. The creativity lessons in this eBook may help you overcome a creative trough.

  • The Process Of Creativity
  • Work, Life And Side Projects
  • “I Draw Pictures All Day”
  • Ignorance Is Bliss For A Creative Mind
  • The Big Think: Breaking The Deliverables Habit
  • Changing Perspective: A New Look At Old Problems
  • Collaging: Getting Answers To The Questions You Don't Know To Ask
  • Creating A Lasting Impression
Customizing WordPress +

If WordPress got you hooked, and you want to tailor your site more to your needs and ideas, then this eBook is for you.

  • A Detailed Guide To WordPress Custom Page Templates
  • Extending WordPress With Custom Content Types
  • Building A Custom Archive Page For WordPress
  • Customizing Tree-Like Data Structures In WordPress With The Walker Class
  • Extending Advanced Custom Fields With Your Own Controls
  • Building An Advanced Notification System For WordPress
  • How To Use Autoloading And A Plugin Container In WordPress Plugins
  • How To Deploy WordPress Plugins With GitHub Using Transients
Designing Better UX +

“Designing Better UX” raises awareness for those little things that add up to an ideal user experience. A valuable resource for your daily UX routine.

  • When You Shouldn’t Use Fitt’s Law To Measure User Experience
  • Five Ways To Prevent Bad Microcopy
  • Infinite Scrolling: Let's Get To The Bottom Of This
  • Designing Great Feedback Loops
  • Sketching For Better Mobile Experiences
  • Converting Our Stories Into Multi-Screen Experiences
  • Creating An Adaptive System To Enhance UX
Designing For Email +

“Designing For Email” offers practical advice to cater for a flawless and engaging experience on web, desktop, and mobile email clients.

  • What 22 Billion Email Newsletters Tell Us About Designing For Email
  • From Monitor To Mobile: Optimizing Email Newsletters With CSS
  • Improve Your Email Workflow With Modular Design
  • Size Matters: Balancing Line Length And Font Size In Responsive Web Design
  • How To Raise Your Email Above Inbox Noise
  • Designing The Words: Why Copy Is A Design Issue
  • How To Use Email To Alienate Your Users
  • Email Marketing For Mobile App Creators
  • How To Create A Self-Paced Email Course
Effective Copywriting +

From avoiding pitfalls to optimizing content and turning words into marketing tools, this eBook highlights the real-word copywriting experiences of Smashing’s authors.

  • Quick Course On Effective Website Copywriting
  • Five Copywriting Errors That Can Ruin A Company’s Website
  • Design With Dissonance
  • How Content Creators Benefit From The New SEO
  • How To Improve Your Branding With Your Content
  • The Art Of Content Marketing
  • Content Meaning
  • 10 Ways To Put Your Content In Front Of More People
Emotional Design Elements +

Find out how to integrate emotional appeal into your website — a personal touch can make all the difference, if you know how to design it.

  • Inclusive Design
  • The Personality Layer
  • Give Your Website Soul With Emotionally Intelligent Interactions
  • Not Just Pretty: Building Emotion Into Your Websites
  • Playful UX Design: Building A Better Game
  • Gamification And UX: Where Users Win Or Lose
  • Adding A Personal Touch To Your Web Design
HTML Semantics +

You won’t get far without the foundational understanding of HTML semantics. This eBook addresses the importance of semantics in our code.

  • HTML5 Semantics
  • When One Word Is More Meaningful Than A Thousand
  • HTML5 And The Document Outlining Algorithm
  • Our Pointless Pursuit Of Semantic Value
  • Pursuing Semantic Value
  • The Semantic Grid System: Page Layout For Tomorrow
How To Create Selling E-Commerce Websites, Vol. 2 +

This eBook takes a look at the challenges that crafting online shopping experiences bring along, and equips you with the necessary know-how on how to deal with them effectively.

  • How To Plan Your Next Mobile E-Commerce Website
  • Exploring Ten Fundamental Aspects Of M-Commerce Usability
  • An E-Commerce Study: Guidelines For Better Navigation And Categories
  • The Current State Of E-Commerce Search
  • Better Product Pages: Turn Visitors Into Customers
  • Designing A Better Mobile Checkout Process
  • Creating A Client-Side Shopping Cart
  • Reducing Abandoned Shopping Carts In E-Commerce
Inside Creative Minds: Workflows, Habits And Strategies +

In “Inside Creative Minds” experienced influencers and successful designers provide first-hand insights into their workflows, habits and strategies.

  • How I Work: Doug Crockford on JavaScript
  • How I Work: IDEO's Duane Bray On Creating Great Digital Experiences
  • How I Work: Meetup's Andres Glusman On The Power Of UX And Lean Startup Methods
  • Copying Others Is Not The Answer
  • “Be Careful: Trends Come And Go”
  • “Be Humble, Be Honest, Don't Be Afraid To Fail”
  • WordPress: How It Came To Be And Where It’s Heading
  • Interview With Nadine Chahine: The Art And Craft Of Arabic Type Design
  • Ask The Expert — A Chat About Art, Design, Computers And Education With Milton Glaser
Legacy Of Typography +

Typography is everywhere. This eBook introduces historical and cultural aspects of type and how they relate to the web industry.

  • Japanese, A Beautifully Complex Writing System
  • Respect Thy Typography
  • Typography Carved In Stone
  • Industrial-Strength Types
  • Legitima Typeface: An Experience Of Fossils And Revivals
  • When Typography Speaks Louder Than Words
  • Weird And Wonderful, Yet Still Illegible
  • Font Wars: A Story On Rivalry Between Type Foundries
  • Hands-On Experience: The Rehabilitation Of The Script
Marketing Secrets For Web Designers +

Marketing is an essential part of web design and knowing its 101 helps you see your design decisions in a broader context.

  • Stop Shouting. Start Teaching
  • If You Love Your Brand, Set It Free
  • What Successful Products Teach Us About Web Design
  • Social Media Is A Part Of The User Experience
  • How To Use Email To Alienate Your Users
  • How Metrics Can Make You A Better Designer
  • Keep Your Analytics Data Safe And Clean
  • It Works For “You”: A User-Centric Guideline To Product Pages
  • How To Launch Anything
Navigation & Interaction +

The foundations of good UX design lie in transparent navigation and interaction patterns and systems. A solid understanding of the rules is as important as knowing when to break them.

  • The Elements Of Navigation
  • Sticky Menus Are Quicker To Navigate
  • Design Patterns: When Breaking The Rules Is OK
  • Navigation Patterns: Exploration Of Single-Page Websites
  • Redefining Hick’s Law
  • What Web Designers Can Learn From Video Games
  • Motion & Animation: A New Mobile UX Design Material
  • Mission Transition
  • Designing With Audio: What Is Sound Good For?
Navigation & Interaction, Vol. 2 +

The foundation of a solid, frustration-free user experience lies in a well-considered navigation system. But which design decisions have proven themselves in practice?

  • The Line Of Least Resistance
  • Efficiently Simplifying Navigation, Part 1: Information Architecture
  • Efficiently Simplifying Navigation, Part 2: Navigation Systems
  • Navigation For Mega-Sites
  • Responsive Navigation On Complex Websites
  • Off The Beaten Canvas: Exploring The Potential Of The Off-Canvas Pattern
  • Smart Transitions In User Experience Design
  • How Do You Design Interaction?
Performance Optimization: Techniques And Strategies +

Tracking down performance bottlenecks does not only improve loading times but also results in a much snappier experience and a higher user engagement.

  • Improving Smashing Magazine’s Performance: A Case Study
  • How To Speed Up Your WordPress Website
  • You May Be Losing Users If Responsive Web Design Is Your Only Mobile Strategy
  • How To Make Your Websites Faster On Mobile Devices
  • Creating High-Performance Mobile Websites
  • Don’t Get Crushed By The Load: Optimization Techniques And Strategies
  • Speed Up Your Mobile Website With Varnish
  • Cache Invalidation Strategies With Varnish Cache
  • Gone In 60 Frames Per Second: A Pinterest Paint Performance Case Study
Practical Approaches For Designing Accessible Websites +

With the help of this eBook, you will gain a deeper understanding of common accessibility pitfalls and learn to circumvent them to create a better experience for everyone.

  • Accessibility APIs: A Key To Web Accessibility
  • Accessibility Originates With UX: A BBC iPlayer Case Study
  • Mobile And Accessibility: Why You Should Care And What You Can Do About It
  • Making Modal Windows Better For Everyone
  • Notes On Client-Rendered Accessibility
  • Design Accessibly, See Differently: Color Contrast Tips And Tools
  • Designing For The Elderly: Ways Older People Use Digital Technology Differently
Practical Approaches For Designing Usable Websites +

Put your users in the focus and learn about designing flows, optimizing emotional engagement and performing heuristic website reviews.

  • Evolve Your User Interface To Educate Your Users
  • Optimizing Emotional Engagement In Web Design Through Metrics
  • Enhancing User Interaction With First Person User Interface
  • A Guide To Heuristic Website Reviews
  • Stop Designing Pages And Start Designing Flows
  • The Data-Pixel Approach To Improving User Experience
Psychology Of Web Design +

“Psychology Of Web Design” gives you insights on how the human brain deals with different elements, colors, contrast, symmetry and balance.

  • Designing For The Mind
  • Persuasion Triggers In Web Design
  • Designing For A Hierarchy Of Needs
  • 10 Useful Usability Findings And Guidelines
  • 30 Usability Issues To Be Aware Of
  • Designing For Start-Ups: How To Deliver The Message Across
  • Color Teory For Designers, Part 1: The Meaning Of Color
  • Color Theory For Designers, Part 2: Understanding Concepts And Terminology
  • Color Theory For Designer, Part 3: Creating Your Own Color Palettes
Rethinking UX +

Rethinking UX is a springboard for developing a new perspective and for creating future-proof user experiences.

  • Thirteen Tenets Of User Experience Design
  • Improving Your Website Usability Test
  • Designing For The Multifaceted User
  • 50 Design Problems In 50 Days: Real Empathy For Innovation
  • Beyond The Button: Embracing The Gesture-Driven Interface
  • What Leap Motion And Google Glass Mean For Future User Experience
Successful Freelancing For Web Designers +

Read up on how to pitch like a pro and handle your finances properly and get precious tips on communicating with clients and partners.

  • Basic Skills Of Freelance Web Designers
  • Communication With Clients & Partners
  • Marketing — Convincing Strategies For Freelancers
  • Contracts & Pricing
The New Hardboiled Web Design +

If you’re hungry to learn about how the latest techniques will make your websites more creative, flexible and adaptable, then “Harboiled Web Design” is for you.

  • You’ll discover what it means to be hardboiled for you, your designs and your workflow. Think again about what we can do instead of what we couldn’t. Embrace the possible, instead of complaining about limitations. What The Hell Is Hardboiled?
  • You’ll discover why it’s important to constantly re-evaluate concepts such as progressive enhancement and graceful degradation. Learn about the basics of how a page should work in first place, not necessarily how a design should look. Get away from limiting your creativity to the capabilities of a lowest common denominator browser. (Give Me That) Ol’ Time Religion
  • You’ll find out the cold, hard truth about how standards are really developed. Learn about ten CSS modules that are most relevant to the work we do, its vendor-specific prefixes, and how to manage them with your favorite tools effectively. The Way Standards Develop
  • You’ll learn that responsive web design is an opportunity to make fabulous creative work, an opportunity that you should grab with both mitts. Embrace that not all browsers should render websites in the same way and focus on providing the most appropriate experience for the capabilities of a browser or device. All that without anyone being left unable to access content or features. It Doesn’t Have To Look The Same
  • You’ll learn about designing atoms and elements and how web design style guides help you presenting designs in a more effective way. Learn how to present the atmosphere of a design while designing components separate from layout with Style Guides. Atoms And Elements
  • You’ll find out how to design a great atmosphere by starting with typographic elements, how to select the right typeface, weight, line-height, and more. Learn how to use type proofs for presentation, how to balance them the right way and how to make them legible and readable on many different screens. Last but not least, you’ll dig into color accessibility and add decorative aspects that help give a design its personality. Designing Atmosphere
  • You’ll learn how to use HTML’s semantic elements alongside the BEM naming system. You’ll repeat the widely supported contemporary HTML5 standards such as section, article, aside, header, footer, and nav. You’ll learn how to make your markup faster, more responsive and, of course, hardboiled. Destination HTML5
  • Because your SEO ranking matters, you’ll discover the updated microformats2 — simple markup patterns for making your data machine-readable and therefore search engine friendly. Hardboiled Microformats2
  • While microformats2 are dedicated to make you website machine-readable, WAI-ARIA roles have different but complementary goals. You’ll learn how to make your web content easier to use by people who use assistive technologies such as navigation menus, sliders, progress meters, properties that define dynamically updated sections of a page, ways to enable keyboard navigation and roles to describe the structure of a page, including headings, regions, and tables (grids). WAI-ARIA Roles
  • In this chapter, you’ll dive deep into CSS Media Queries. By organizing it into six groups of elements that consider site-wide page styles, typography, form elements, tables, and images, you’ll learn how to style small screens first and how to choose breakpoints that are based on content rather than devices. Hardboiled Foundations
  • You’ll investigate new Flexible Box layouts and how to visually reorder content without laying a hand on your markup, how to overcome common frustrations such as equal height backgrounds on unequal height columns, and more. Flexible Box Layout
  • Much of the web content we consume every day consists of the written word. Learn about the different web font formats and how to implement them properly, with fallback fonts and website performance in mind. You’ll learn how to specify the web fonts to low-resolution and high-resolution display, and how to test them on different resolution screens. Responsive Typography
  • With your hardboiled HTML all set and your smaller screen styling in place, you’ll now give your design an extra level of fidelity and interaction that makes the most of the space available on larger screens. You’ll redevelop our vertical list into a grid of eight magazine covers that reveal their descriptions when we press on them. You’ll do this by applying relative positioning but without any horizontal or vertical offsets. RGBa And Opacity
  • CSS borders can be exciting because they include properties that open up a wealth of creative opportunities. You’ll investigate new design possibilites with properties such as border-radius (that our clients love so much) and border-image for using images inside those borders. Borders
  • Since we’re also able use multiple background images and to change their origin point and size, there’s a vast variety new creative opportunities. You’ll get started by making a design using multiple background images. Background properties give us precise control over the size of our background images and how they’re rendered behind our elements. Background Images
  • Flat design aesthetic has become the norm. Almost every site you see these days include large, flat areas of colour, often laid out across horizontal bands, almost always the full width of our screens, with flat or outlined buttons, and icon graphics that are also flat. You’ll learn how to move on from the mediocrity this flat aesthetic epitomises and you’ll see web design that’s rich and full of life. Whether you like linear gradients, radial, repeating or with multiple background images — you’ll need to know how to handle them. Gradients
  • The rapidly increasing pace of change is a good thing for designers and developers, businesses and brands, and the internet in general. New technologies like CSS filters and background blends are not only being introduced faster, but they’re being implemented in browsers and turned into standards faster, too. Now’s not a time to kick back — it’s a time to use these exciting new tools to make creative work with depth and subtlety, work that’s hardboiled. Background Blends And Filters
  • CSS layouts can sometimes be a little strait-laced. You’ll learn how two-dimensional and three-dimensional transforms can help your designs break out of the box. Transforms
  • In web pages and applications, changes in state can have a huge impact on how it feels to use an interface. Make a change too fast and an interaction can feel unnatural. Make it too slow, even by a few milliseconds, and an interface will feel sluggish. You’ll learn how to make state changes smoother with a host of CSS transitions. Transitions
  • You might be surprised how unimaginative most website layouts are today, particularly since the responsive web design came up. But there’s so much to learn from print design that should inspire your work on the web. The different ways that magazine designers use columns of text to make their publications individual are an enormous inspiration. In this chapter, we’ll learn how to use CSS multicolumn layout and how to use it for today’s responsive designs. Multi-column Layout
Typography Best Practices +

Web design is not just about a flamboyant or simply beautiful website appearance. This eBook is about small — but crucial — typographic details.

  • The Perfect Paragraph
  • Mind Your En And Em Dashes: Typographic Etiquette
  • How To Choose The Right Face For A Beautiful Body
  • Why Subtle Typographic Choices Make All The Difference
  • The Creative Way To Maximize Design Ideas With Type
  • Applying Macrotypography For A More Readable Web Page
  • Avoiding Faux Weights And Styles With Google Web Fonts
  • Setting Weights And Styles With The @font-face Declaration
Typography: Practical Considerations And Design Patterns +

Learn how to train and sharpen your eyes to recognize specific typographic details which will be sure to guide you in your own projects.

  • Understanding The Difference Between Type And Lettering
  • Making Sense Of Type Classification, Part 1
  • Making Sense Of Type Classification, Part 2
  • A Critical Approach To Typefaces
  • Taking A Second Look At Free Fonts
  • Dear Web Font Providers
  • Typographic Design Patterns And Current Practices (2013 Edition)
  • Creating Exciting And Unusual Visual Hierarchies
  • Type Makes A Difference: An Exploration Of Type-Focused Websites
UX Design Process +

User Experience design isn’t a new field. But sometimes new approaches lead to new perspectives.

  • Interaction Design In The Cloud
  • Lean Startup Is Great UX Packaging
  • Fitting Big-Picture UX Into Agile Development
  • You Already Know How To Use It
  • Fixing A Broken User Experience
  • Beyond Wireframing: The Real-Life UX Design Process
  • Stop Redesigning And Start Tuning Your Site Instead
  • Designer Myopia: How To Stop Designing For Ourselves
  • The UX Research Plan That Stakeholders Love
Unlocking Innovation: How To Generate And Realize Great Ideas +

“Unlocking Innovation” goes beyond the mere process of generating ideas and looks at how we can actually bring them to life.

  • On Creative Leadership
  • Examining The Design Process: Clichés And Idea Generation
  • Using Brainwriting For Rapid Ideas Generation
  • Up On The Wall: How Working Walls Unlock Creative Insight
  • Design Better And Faster With Rapid Prototyping
  • The Skeptic’s Guide To Low-Fidelity Prototyping
  • Five Tips For Making Ideas Happen
  • How To Make Innovative Ideas Happen
User Experience Design +

“User Experience Design” provides you with insights on how to improve your website based on the most important UX principles.

  • A Design Is Only As Deep As It Is Usable
  • Why User Experience Cannot Be Designed
  • Design Is About Solving Problems
  • Designing The Well-Tempered Web
  • Better User Experience With Storytelling – Part I
  • Better User Experience With Storytelling – Part II
  • Taking A Customer From Like To Love: The UX Of Long-Term Relationships
  • Idiots, Drama Queens And Scammers: Improving Customer Service With UX
  • Relationship Engineering: Designing Attraction – Part I
  • Relationship Engineering: Designing The Happily Ever After – Part II
Work Smart, Live Healthy +

Web design is more than a job. It’s a passion. This eBook focuses on practical tips and strategies to foster a balanced lifestyle so that you can tackle the job you love with more energy.

  • Maximize Your Creative Energy
  • Feeling Stuck? Design What You Don’t Know
  • Be A Better Designer By Eating An Elephant
  • Dealing With Workaholism On Web Teams
  • When 24/7/365 Fails: Turning Off Work On Weekends
  • Fostering Healthy Non-Professional Relationships
  • You Are Not A Machine. You Are Not Alone.
  • Let’s Talk About It