Much of the plot of Indiana Jones and the Temple of Doom revolves around the Sankara stones, their powers, how much problems it brings to remove them from their original dwellings, and how they light up when they get close to another. We have something similar in web development: the separation of concerns - markup, presentation and behaviour. But over all these years we've forgotten some things about them. In this closing keynote Chris Heilmann of Mozilla will remind us of our powers, hint at new ones and give advice how to avoid being eaten by crocodiles.

Responsive Web Design is the solution for improving your mobile site. Or is it? A bloated site that simply shrinks in width is not a usable site. Squishy design is not the only, or even the main, solution for improved mobile user experience. Learn how to leverage modern web standards to improve performance so your sites, responsive or not, are more usable, accessible.

We’re working on increasingly complex websites. There’s a temptation to match this growth with increasingly complex solutions. But there’s a real value in keeping things simple…or at least starting things simple. If you can build a solid robust foundation, there’s a good chance that your work will be future-friendly. Prepare to have your brain subtly rewired as we look beneath the surface-level implementation details of the web to reveal the semantic structure below. Whether you’re publishing content or building the latest hot app, the principle of progressive enhancement will change the way you think about your work.

We have the technology to add amazing interactions to our websites. With just a little bit of CSS or JavaScript, we can layer enhancements and animations onto our pages which allow our visitors to interact with our content in different ways. These enrichments, if used responsibly, can make our sites fun memorable, and more enjoyable to use.

Examples of interactions we see range from common drop-down menus for navigation to interesting, in-depth transitions while hovering over links. Often, we rely on our mouse device to trigger actions on our sites. While we don't want to lose these interactions, we also need to find solutions for our visitors without a mouse.

These days, we have users browsing our websites on desktops with a mouse, desktops that can touch, small screen mobile phones, large screen tablets, and more. Sometimes the endless possibilities for our audience might seem daunting, but we can find ways to make sure we optimize our site experience for the majority of our users without sacrificing our vision.

We'll take a look at:

• How interactions on your website affect your visitors
• Ways to create meaningful and useful interactions with CSS animations and transitions
• What happens to our actions and enhancements on mobile and touch devices
• Options to make sure our interactions work well on all devices while maintaining design integrity

It's probably fair to say that the hot web technology of 2014 is Web Components, a suite of technologies including templates, custom elements and Shadow DOM, aimed at creating reusable elements that are powerful, self-contained, and shareable. In this talk I will look at each of the technologies in the suite, focusing not only on their technical implementation but also putting them in context of their purpose and importance. I will show how quite simple HTML, CSS and JS are combined to create the future of web development, and why it matters to you and the users of the web.

The currency of written communication — words on the page, words on the screen — comprises many denominations. To further our ends in web design and development, we freely spend and receive several. Our community thrives on sharing knowledge and experience through the written word. We write articles to teach and to document our processes. Some of us write books. But can there be a web design discourse that isn't focused on tools and technique? Maybe received wisdom about online writing holds us back from gaining a deeper understanding of what we do.

When we build web products today we’re increasingly moving away from siloed roles. We’re breaking down the distinctions between various prefixes of designers & developers in favour of being multi-skilled generalists. Rather than having an awkward mix of disparate skills, though, generalist make-all-the-startup-things-y hackers are the inevitable foundation of the product teams of the future.

"The Bauhaus strives to combine all the arts—sculpture, painting, applied art & visual art—as the inseparable components of a new architecture" — 90 years later, I think we're finally achieving the vision of the Bauhaus.

The presentation covers the reasons why we need to be automating our front-end processes, and the tools you can use to achieve that.

To begin with, we'll look at what automation does for us, why it is important, and how to make it work for us.

We'll consider the option to build first, before we do anything else in the project, and analyze the trade-offs in doing that.
We'll look at specific tasks such compiling static assets, as well as minifying them, and generating spritesheets or icon fonts.
We'll go into more advanced topics such as testing, continuous integration, deployments, and continuous development, as well.

Later on, we'll go over package managers, how these play with build systems and how to use bower or npm to automate asset management and optimization, while keeping our code-base succinct.

Convincing your client on investing in continuous, real-device testing can be quite tedious. 'What do you mean we need testing budget; can't you just code it right?' is a common perception on the paying end of the table. Is it really impossible to explain the problem to a total development noob? If we don't get around this fucking problem soon, the web and our work will continue to suffer; or, we will continue to give in and do the important part in our free time. Help yourself and the greater good and join me in sharing and completing an ultimate guide to convince the uninformed!

Scalable Vector Graphics, or SVGs, are the new big thing in web design today, and for a good reason. With the proliferation of retina screens and high resolution displays, we need to adopt techniques that allow us to serve graphics that look good on all screens in all circumstances. Since SVGs offer resolution-independent, fully scalable and crystal clear graphics, it is safe to say that they are the future graphics format of the web.

In her talk Sara will demonstrate how SVGs can be styled with CSS, and how they can be animated using CSS animations and transitions. She will share her knowledge about the gotchas, bugs, and tips to help you get started with CSS and SVGs and to save you moments of frustration as you deal with SVGs using CSS. Sara will cover responsifying SVGs and using CSS media queries with them. Last but not least she will dive into code and walk through it all the way from styling and animating to responsifying SVGs.

With so many frameworks, boilerplates and starting points to choose from in front-end development we are selling ourselves short with instant 'cookie cutter’, ‘one size fits all’ development. I’ll go through my idea of rolling your own starting point but taking the code you like from others adapting as you go and documenting for your future self and team ultimately caring about your code and making it /#codelicious/.

You’re an expert programmer, you take the craftmanship of producing code seriously. On top of that, you spend your weekends at hackathons and your github repo is bustling. What else could you do to make your product more successful? Bring in a tester! Not just any old grumpy, pessimistic, bug obsessed kind of QA, but a real tester. One who will help your team push the quality of your product and your code.

Join this session to find out how a good tester will make you look even better and your software even more awesome. Ulrika will also share some of the tester’s tricks of the trade which you can use right away.

Developers are often seem as mere implementors, when the reality is that their choices can have a huge impact on the overall success of projects - for good, or for bad. A user-centric design process is common in most projects, but in this talk we’ll cover how viewing usability and responsibility as part of development decisions is equally as important. We’ll travel through time from the beginning of the digital age, observing how a focus on users (or lack of) has helped to make or break the success of ideas. We’ll also consider how other industries apply similar principles, and how we can learn from them, finishing with some tips to apply to our builds.

While purists propagate to not mix content structure (HTML), presentation (CSS) and behavior (JavaScript) layers for the reason of maintainability, concepts like OOCSS aim at the same goal, but from a different angle: reusable CSS code, at the expense of bloated, presentational mark-up, violating the separation of concerns. Can’t we have both, clean mark-up and reusable CSS? The benefits of both approaches without the drawbacks? Yes, we can. This talk shows how to take the OO concept out of the HTML and put it where it belongs to: into the style sheet. Not directly into the CSS though, but into an intermediate layer provided by a CSS preprocessor like Sass. Like Ogers and onions, concepts have layers. Unlike Ogers and onions, they don’t always stink, but eventually lead to the best of both worlds.