Dear Friends,
We often speak about ad-blockers being horrible, evil, nasty tools that push publishers to the edge of profitability. However, we tend to forget that for many users ad-blockers is the only way out. It's a protection again publishers pushing advertising over the edge with pop-ups, inline advertising, heavy animated video backgrounds and annoying scripts running in the background — blocking the page rendering. In fact, you can't access many websites at all without an ad-blocker on a flanky and slow connection. That's our fault, not users' fault.
Even if your website is bloated, in the end it's all the matter of getting priorities right. More weight doesn't mean more wait, so if you push advertising before content, it's perfectly justified to use an ad-blocker if you are serving a 9Mb video ad blocking rendering. As a publisher, we have to reinvent our business models and adapt to the way technology evolves and user behavior evolves. Think about a proper business model. The strategy is simple: sell valuable assets, themes, icons, eBooks, services, tickets, extra features, anything and prioritize content over selling products over advertising.
If you don't do it as a publisher, you will either be pushed away, or somebody else will do it for you. The "Accelerated Mobile Pages" project or Facebook Instant Articles, or Apple News, or ad-blockers. The reality is that there is no way out; rethink your advertising strategy, and rethink it now.
These days we try to focus on our products instead of fighting ad-blockers. We have books and eBooks and conferences and workshops and advertising; we value the respect and support of the community and we notice the support every single day. We have nothing against users with ad-blockers, and we know that the exponential growth of ad-block users isn't going to change any time soon. So instead of fighting ad-blockers, we invest the time and energy into producing products that we hope our readers will love and value. It works well for us, and we have to keep doing more in this direction.
Care about content and its quality, not dirty techniques on pushing advertising over the edge. Don't fight ad-blockers; tackle internal issues and figure out the right strategy to not just stay afloat, but thrive and grow.
Image source
— Vitaly (@smashingmag)
Table of Contents
1. Gain Control Over Your Layouts Today… With Flexbox!
Flexbox has the makings to put an end to hacky coding solutions and, finally, provide us with real control over our layouts — something that CSS has been lacking so long. If you find Flexbox difficult to grasp and miss a clear strategy on how to start using it today, then Chris Wright's comprehensive write-up on Using Flexbox today is just for you. It outlines a strategy for adding Flexbox to your projects and provides examples of how to progressively enhance existing layouts with some Flexbox power.
To dive deeper into the possibilities that Flexbox has to offer, you might also want to check out Philip Walton's "Solved by Flexbox", a collection of coding challenges where Flexbox excels at — think simpler grid systems, vertical centering and media objects that get by without any overflow, clearfixing or block formatting hacks. And for the occasions when things don't work out as expected, Flexbugs is bound to cater for a fix. This community-curated list of Flexbox issues is regularly updated to provide solutions and browser workarounds for nasty bugs. (cm)
2. Tips And Hacks To Become A Slack Power User
Slack is a real productivity booster. But did you know that you probably only use a small part of its power? The app comes with a lot of hidden features — and they all are bound to make your team's communication even more effective. Keyboard shortcuts, advanced search, managing your messages — there's a lot to discover to unlock Slack's full potential.
A great primer to get the most out of Slack comes from the Slack team itself. And if that's not enough for you, yet, Tom Ewer's article features even more hacks that make Slack more efficient — and fun — to use (did you know about the /shrug, shortcut for example?). To stay on top of all the commands that Slack has to offer, make sure to check out the keyboard shortcut cheatsheet. And if you want everything at a glance The Ultimate Slack Cheat Sheet features the most important things you need to know in order to become a power user neatly compiled in a 2-page PDF. (cm)
Advertisement
3. Join The Offline-First Revolution
There are enough situations when our internet connections let us down — in the subway, in an elevator, on the plane. But that doesn't necessarily mean that the websites we visit have to let us down, too. Here come Service Workers into play. The technology allows you to serve content to your users even when they are offline (and much more). And to make the use of this magic on your site a breeze, developer Tal Ater built a tiny, open-source library: UpUp.
With UpUp, you can make fully functional single page applications available offline — with a few lines of JavaScript. It's even possible to customize the content for each user or provide access to videos and other files. Simply include the script on your page and define the content you want your users to see when they are offline. Since Service Workers require a secure connection to work, you'll need an HTTPS setup to use the script, though. UpUp currently supports Chrome 40+, Opera 27+, and Firefox 41+. But no worries, with progressive enhancement in place, it plays nicely with all browsers — users who are on a different browser won't notice any difference. (cm)
4. The Cost Of Mobile Ads
With iOS9, Apple paved the way for ad blockers on the iPhone. What better occasion could there be to ask how much of our mobile data comes from advertising? To find out, the New York Times conducted a study of the top 50 news websites. It measured the ratio between advertising and editorial content on mobile news sites to gain insights into the weight of ads, their estimated load times, as well as the cost per page on a typical data plan. The result: more than half of the data comes from ads and other content filtered by ad blockers.
For the study, each mobile website was loaded on an iPhone 6 at least five times over two days. The test was then repeated with an ad blocker enabled. The amount of data varies, but many websites did load noticeably faster and felt easier to use with the ad blocker enabled. However, there's two things we should keep in mind when talking about ad blockers: they can also cause sites to load erratically — during the study one site even crashed repeatedly — and, not to forget, ads support (and sometimes even enable) news sites, so if enough people block them, they will struggle. No wonder that ad-blockers are so popular then, given the amount of weight content providers push to users. (cm)
Advertisement
5. The Obvious, The Easy, And The Possible
When developing a product, it can be quite tricky to prioritize which features should go front and center. An interesting approach that has the makings to take some of the tension out of product development and interface design comes from Jason Fried, founder and CEO at Basecamp. Instead of asking "What's high priority?", he suggests dividing things up into three categories: the obvious, the easy and the possible.
Obvious are the things that people do all the time — the core of the product, so to say. Things they do frequently fall into the category "easy", and things they only do sometimes are "possible". The most difficult part in product design? Defining and dealing with the components that should be easy to reach but still stay out of the way of obvious. It takes quite some practice to fully grasp the difference between the three but figuring out which things go in which bucket can help you find out what really matters and where to lay your focus — an essential step to building a useful product. Do you know how your features fit in those categories? (cm)
6. When Code Meets Creativity
Often we challenge what's possible in design against what's doable in development. When designing in the browser, we often end up with websites that look like they were designed in the browser. When designing in Photoshop, we end up creating mock-ups that might not be realistic in terms of performance. Both worlds don't have to be contradictory or fundamentally different, though.
Pt is a coding experiment and study of point, form, and space, all written in JavaScript by William Ngan. It's experimental and fun, and you can do quite mesmerizing things with it. Warning: it's very very addictive! (mse)
Advertisement
7. With A View To Golden Gate Bridge: Meet SmashingConf San Francisco!
So how can we really push ourselves to craft a conference experience that will be just impossible to forget? We've got an idea: SmashingConf San Francisco, taking place on April 5–6, 2016 with a tremendous view, right opposite to Golden Gate Bridge and Alcatraz Island (oh my!). Speakers? Ilya Grigorik, Susan Weinschenk, Harry Roberts, Jina Bolton, Tim Kadlec, Una Kravetz, Mark Boulton, Frances Berriman, Jeff Atwood and many, many more. Make sure to set up your alarm clock: tickets go on sale on October 27th, at 10AM Pacific Time. Early-bird price: $549 for two full days. You better be quick: only 50 early-birds are available!
San Francisco is way too far away from you? Well, we have SmashingConf Barcelona coming up in October (only few tickets left!) and SmashingConf Oxford 2016 coming up in March 2016. We can't wait to see you, and just in case you need to convince your manager to send you to the event, we've got a Convince Your Boss PDF ready for you, too. Just sayin'!
Image credit
(vf)
8. Keep Calm And Attend A Smashing Workshop!
With so many techniques, tools, libraries, design patterns, strategies, abstractions, frameworks and boilerplates available nowadays, what do you really need to know to keep your workflow fast, smart and efficient? That's exactly what our front-end and RWD workshops are all about: practical front-end and RWD workshops that will help you become better front-end developers and designers, today.
Upcoming Online Workshops
Full-Day Workshops at SmashingConf Oxford
Online Courses (new!)
Upcoming Smashing Workshops and Meet-Ups:
But what about in-house training instead? We can improve your eCommerce checkout and conversion rates right on spot — or performance, accessibility or UX. Feel free to get in touch with Vitaly at vitaly@smashingconf.com and briefly describe what problems you're facing and would like to solve. Don't worry about the cost — we'll find a fair price for sure. Get in touch — it's that easy! (vf)
9. New On Smashing Job Board
Here are the recent job openings published on our Smashing Job Board:
-
UX Designer (HTML/CSS) at Booking.com (Amsterdam, NL)
"As a member of our Front End team you'll be given the freedom to make meaningful and measurable improvements impacting millions of people. You'll join us at our beautiful Amsterdam HQ and work with some of our industry's smartest people."
-
Wordpress Web Developers at Jupiter Highway (New York, NY)
"You constantly search for new web and interactive development examples, you burn to be better, for you web development is more than just a website—it's an experience, it's an interactive story, it solves business challenges, and makes users want to interact with it. You love to share what you've learned, to use your skills across a wide variety of projects, and you always rise to the challenge."
-
Senior Front End Engineer at Mindbody, Inc. (San Luis Obispo, CA)
"We are looking for a Senior Front End Engineer to join our San Luis Obispo, CA team. This person is an integral part of our UX Team, committed to the on-going and professional development of the user interface, as well as creating the best possible user experience. Ideal candidates bring at least 5 years of web development experience, expert knowledge of HTML/CSS, solid design, layout, and usability knowledge, and the ability to execute with minimal supervision."
10. Recent Articles On Smashing Magazine
11. Smashing Highlights
-
So You've Decided To Open-Source A Project At Work. What Now?
A while back, I wrote a post about starting an open-source project. The focus of that article was on starting an open-source project as an individual. I received a lot of positive feedback and also some questions about how the process changes when you're open-sourcing a project at work.
-
Designing With Your Clients
We have all known the pain of a client interfering in the design process. Phrases like "Make the logo bigger" and "Put that above the fold" have become a running joke in the web design community.
-
CSS Baseline: The Good, The Bad And The Ugly
Vertical rhythm is clearly an important part of Web design, yet on the subject of baseline, our community seems divided and there is no consensus as to how it fits in — if at all — with our growing and evolving toolkit for designing online.
