If you’ve spent the last few months under a rock, then we've got a surprise for you. We are working on two brand new Smashing Books. The first, New Perspectives on Coding, will cover state-of-the-art techniques, case studies and coding strategies — all neatly packed into a gorgeous printed hardcover (and available as an eBook, of course).
So if you’ve always wanted to leave a trace of yourself to posterity, now you can (well, kind of). From the very first Smashing Book, we’ve reserved space to feature our readers in the book, and our fourth undertaking will be no exception.
Add Your Twitter Avatar To The Book!
A picture says more than a thousand words, and a Twitter avatar says more about one’s personality than a name ever could! So, following our tradition, we welcome you to submit your Twitter avatar for a double-page spread in the (printed and digital) book. Space is very limited, with only 750 slots available, so please be quick!
How Does It Work? Easy!
- Type in your Twitter username, and — voilà — your spot it reserved!
- We'll grab your avatar automatically and will notify you about the status of the submission via email.
Presto! And if for some mysterious reason, you happen to feel like a Jedi afterwards, well, why not tweet about it using the hash tag #feellikejedi? No pressure: just sayin’!
What Is The Book About?
We’ve assembled a remarkable lineup of authors for the book. All of them are well-respected designers and developers who will be divulging practical insights, design strategies and hands-on tools as they share new perspectives on Web design today. Here is a quick summary of the book’s theme and table of contents.
Summary
What works in theory sometimes doesn’t quite work as expected in practice. In this pragmatic book, well-respected designers and developers analyze their personal experiences, failures and successes from working on common front-end issues, and share the tools they use to tackle these issues effectively. You'll learn state-of-the-art techniques and strategies to make your workflow more effective.
The book will feature valuable insights into large-scale projects, front-end architecture, maintainable code and responsible responsive Web design. It will also uncover smart front-end strategies, CSS and JavaScript tricks and obscure back-end techniques, and it will explore what it takes to improve performance for faster and more robust websites and Web apps.
Table of Contents
| AUTHOR | CHAPTER | DETAILS |
|---|---|---|
| Addy Osmani | Rendering Performance Optimization For Mobile | |
 Whether it’s on desktop or mobile, users want their web experience to be snappy, smooth and delightful. What this means is that even if the browser is busy rendering the page (i.e drawing it) or loading in content, the user should still be able to scroll around and interact with it without any slow-down. No one likes seeing visual glitchyness. In this chapter, Addy Osmani, the mastermind behind Yeoman and Devtools, provides a walkthrough on how to find and fix visual jitter in your pages. If you care about providing fast and smooth experiences, you will care about this chapter, too. Keywords: tools, techniques, strategy, workflow, optimization, rendering. |
||
| Harry Roberts | Breaking Good Habits: CSS Architecture For Tomorrow | |
 The Web is changing. Are you keeping up? We’ve outgrown the methods of yesteryear and it’s now up to us to update the unwritten rules of web development to fit the new landscape. This chapter explores some misconceptions about CSS, encourages a change in attitude in front-end development, explores practical approaches of and lessons learned in object-oriented CSS development, code structure, code management, naming conventions and verbosity of HTML.
You’ll explore a new frame of mind that is better equipped for building more powerful, pragmatic front-ends.
Chapter keywords: CSS, OOCSS, BEM, architecture, strategy, semantics, code structure, front-end, naming conventions, performance. |
||
| Nicholas C. Zakas | The Roadmap to Maintainable, Clean and Effective Code | |
 Code is code no matter where you go, and code has a tendency to get messy as it gets large and old. What if you need to make changes? What if you didn’t anticipate the additional features that would be required? What if the project ends up going in a different direction? Can your code adapt?
We are rarely taught how to deal with messy code. However, someone is going to have to maintain that code. That someone might be you next month or it might be someone else next year, but someone eventually will need to maintain that code. On a large project with many developers, the problem is magnified. How can everyone work in the same code base in such a way that making changes in the future are easy? That’s what this chapter is about.
Chapter keywords: maintenance, architecture, conventions, code style, documentation, components, legacy code, testing, CSS, JavaScript. |
||
| Tim Kadlec | The Culture of Performance | |
 The Web has a serious weight problem and the users are the ones who suffer as a result. The impact of improved web performance is no minor detail: by caring a lot about how fast our websites and applications are, we can explore new markets, gain increased revenue, improved business metrics and better user satisfaction. But how do we bake performance into the design process? We must make performance part of the discussion from the very beginning of the process, and we must be concrete about it.
Chapter keywords: performance budget, optimization, speed, efficiency, mobile, latency, loading, rendering |
||
| Paul Tero | How To Fix The Web: Obscure Back-end Techniques And Terminal Secrets | |
 Imagine that you wake up one morning, groggily reach for your laptop and fire it up. You’ve just finished developing a brand new website and last night you were proudly clicking through the product list. The browser window is still open, the Widget 3000 is still sparkling in its AJAXy newness. You grin like a new parent and expectantly click on “more details.” And nothing happens. You click again, still nothing. You press "Refresh" and get that annoying swirling icon and then the page goes blank. Help! The Internet is gone!
This chapter starts with the worst case scenario and works inwards, exploring the infrastructure of the Internet and the make-up of a Web server, imparting lots of little tips and commands along the way, opening up a new perspective on how websites can stop working and be fixed.
Chapter keywords: back-end, DNS, servers, networking, infrastructure, SSH, firewalls, DOS, hacks, debugging, backup, Apache, security. |
||
| Aaron Gustafson | Building Adaptive Interfaces | |
 To create truly exceptional designs, we must not only reduce the friction inherent in completing a task, but we must reconcile aesthetics with usability by designing adaptive interfaces. Smartly built interfaces offer a continuum of experience. So what if we architect our interfaces to adapt to the capabilities of our user’s devices in order to ensure a positive experience, even if it’s not an identical one?
In this chapter, Aaron explores the layers of a typical Web experience and breaks down the development process into manageable steps that enable accessible, functional and empathetic interfaces. He also describes his own process and various techniques that help him to achieve this very goal in daily routine.
Chapter keywords: adaptive interface, progressive enhancement, empathy, layer cake, constraints, lazy loading, UI Construction Flow, JavaScript, adaptive components, patterns, style tiles |
||
| Mat Marquis | Robust, Responsible, Responsive Web Design (Filament Group’s Case-Study) | |
 Responsive Web design is starting to get a reputation, and not the kind of reputation that it rightfully deserves. The most common death knell we’ve heard ringing out—lately, anyway—is that every page of a responsive site is fated to weigh in at a couple dozen megabytes and there isn’t a single thing that any of us can do about it.
There are good solution though. We can’t blame responsive Web design for mistakes that we, developers, have been making. This is on us, and you don’t see any carpenters writing blog posts about how hammers are a failed methodology because of the time they dropped one on their foot. We can do better than blaming our tools for our mistakes. This chapter is about exactly that: tools, techniques, lessons learned and practical tips to manage responsible responsive designs in real-life projects.
Chapter keywords: Responsive Web design, responsive images, conditional loading, progressive enhancement, optimization, CSS, JavaScript, workflow, optimization, case-study. |
||
| Andy Hume | Real-Life Responsive Web Design (The Guardian’s Case-Study) | |
 Ensuring good cross device and cross browser experiences has always been a thing, but browsers adoption of media quieries solved a key problem and let us jump forward very fast. This chapter looks at some lessons from implementing on Guardian and discussions with others like BBC, Boston Globe. In a world where the number and diversity of browsing platforms is increasing every day these orgs understand the value of having one platform and codebase for delivering their web products.
Chapter keywords: Responsive Web design, optimization, performance, RESS, case-study. |
||
| Christian Heilmann | Vanilla Web Diet | |
 When we go out and use our mobile devices or wireless that is available in cafes and hotels things don’t look as bright as they do on our incredibly fast connections at home. There, the larger part of our time is consumed looking at spinning animations telling us something is loading and many a time we are being told that “the connection is wonky” and that we should try again.
That’s a sign of the Web being broken. It’s time to fix it. Let’s try to take a break in our drive to be cool and new and innovative the whole time and check out what we are doing — analyze our eating habits so to say. Christian Heilmann calls this the “Vanilla Web Diet,” much like people start calling using JavaScript without any libraries “Vanilla JavaScript.” This chapter explores some of the fundamental ideas and thoughts that you can apply to slim down your next app or existing solution.
Chapter keywords: optimization, performance, speed, strategy, browsers, quality of code. |
||
Technical Details
- 320 pages, 14.0 × 21.0 cm (5.5 × 8.3 inches).
- Quality hardcover, with stitched binding and a ribbon page marker.
- Also available as an eBook (PDF, EPUB, Kindle).
- Shipping starts in September/October 2013.
- Pre-order your book today.