Environments for Humans
twitter icon facebook icon flickr icon feed icon linkedin icon email icon

CSS Summit 2013 logo

The 5th Annual 3-day online, live CSS conference

In-kind Sponsors


Environments for Humans brings together some of the Web's most notable experts in CSS and SASS for an all-new, three-day online conference, the CSS Summit 2013! Bring the experts to your desktop July 23-July 25, 2013 from 9AM to 5PM (CT).

Don't miss this great event and purchase your tickets now!

CSS3 Training \\ July 23, 2013 \\ 9AM to 5PM CT

(Schedule subject to change)

CSS3 & Selectors 9am CT

by Estelle Weyl, Author of HTML5 and CSS3 in the Real World

Pick an element, any element. Style it. Manipulate it. No IDs. No classes. No jQuery necessary. We'll learn all the new features of selectors in CSS and JavaScript that enable you to select this DOM node, that DOM node, and even an imaginary DOM node based on attributes, relation to other elements, location in the DOM, or just an element?s mere existence. The possibilities are endless, if you know how to use the tools in your tool box. Today's tool is CSS3 (and JavaScript) selectors.

About Estelle Weyl

Estelle Weyl started her professional life in architecture, then managed teen health programs.

In 2000, she took the natural step of becoming a web standardista. She has consulted for Kodakgallery, Yahoo! and Apple, among others.

Estelle shares esoteric tidbits learned while programming CSS, JavaScript and XHTML in her blog at http://evotech.net/blog and provides tutorials and detailed grids of CSS3 and HTML5 browser support in her blog at standardista.com.

She is the author of HTML5, CSS3, and JavaScript for Mobile and HTML5 and CSS3 for the Real World. While not coding, she works in construction, de-hippifying her 1960?s throwback abode.

×

CSS3 & Flexbox 10am CT

by James Williamson, Senior Author for lynda.com

While the CSS Flexible Box Layout Module (Flexbox) has gone through some radical changes over the past two years, the specification is now stable enough for designers and developers to give it a hard look. Find out what Flexbox can (and can't) do to save your layout woes and how to integrate into your projects!

About James Williamson

James Williamson is a Senior Author for lynda.com and has over 15 years of web, print, and digital video experience.

His current focus is on front-end web development and related technologies. He is passionate about web standards, good design, and promotion.

×

CSS3 Grids & Regions 11am CT

by Rachel Andrew, Author of CSS Anthology

The possibilities that await us by way of proposed layout modules for CSS are exciting. While some of these modules are at an early stage, it is important that designers and developers start to look at, play with and discuss these proposals. If we don’t then we can’t complain when the final specifications don’t meet our needs.

Based on the work I have been doing for my Five Simple Steps Pocket Guide, and this article for 24 Ways on CSS3 Grid Layout, I will introduce the proposed and upcoming modules - Grid Layout, Regions and Exclusions and Shapes.

About Rachel Andrew

Rachel Andrew is a web developer and Director of edgeofmyseat.com, a UK web development consultancy and creators of the small content management system, Perch. She is the author of a number of web design and development books including The CSS3 Anthology for SitePoint and the CSS3 Layout Modules Pocket Guide published by Five Simple Steps.

Rachel writes about business and technology on her blog at rachelandrew.co.uk.

×

Web Typography 1pm CT

by Tim Brown, Type Manager at Adobe Typekit

The web is universal and, in this talk, Tim Brown shows us how to practice typography in a way that is equally universal. Focusing on traditional typographic principles, while also embracing progressive enhancement, Tim explains how fonts, CSS, web-enabled devices, and user contexts coexist. Together, we will reevaluate what it means to successfully set type--and inform our routine decisions about typefaces, font sizes, and white space.

About Tim Brown

Tim Brown is a designer, writer, speaker, and toolmaker, with a focus on typography. Formerly a web designer at Vassar College, he is now Type Manager for Adobe Typekit, a curator for A List Apart, and the author of Nice Web Type (@nicewebtype on Twitter).

After making Modular Scale and Web Font Specimen, Tim wrote about each in two all-time staff favorite A List Apart articles. His ideas about Molten Leading inspired jQuery plugins for fluid line-height. He has spoken at Inspire and Build, participated in AIGA Breakthroughs, and appeared on The Big Web Show with Jeffrey Zeldman.

Tim lives and works in New York State?s beautiful Hudson Valley with his wife and college sweetheart, Eileen, their two daughters, and two dogs.

×

Getting Rid of Images with CSS 2pm CT

by Chris Mills, Opera Web Evangelist & Dev Rels Editor

For years when designing web sites we'e had to use a lot of of image files--a lot!--for anything and everything. And I’m moving beyond content images here, thinking more about background images for textures, gradients, interesting borders, rounded corners, transparency, drop shadows, interesting fonts, and more.

This contributed to the whole experience being complicated, inflexible, and inefficient, with loads of assets and HTTP requests to deal with. Fast forward to the modern day, and the good news is that CSS now provides us with a lot of new tools for programmatically creating images for many common uses, making things a whole lot easier to handle.

In this talk Chris Mills will touch upon a number of more widely supported featured such as gradients, border-radius, border-image, and box-shadow, before moving on to what we can expect a bit further down the line with more nascent features like shaders, filters and masks. In addition, he will also briefly discuss what can be done about older browsers that do not support such features.

About Chris Mills

Chris Mills is a web technologist, open standards evangelist and education agitator, currently working at Opera Software in the developer relations team. He spends most of his time writing articles about web standards for dev.opera.com and other publications (such as .net mag and A List Apart), giving talks at universities and industry conferences, and lobbying universities to improve their web education courses. He believes that education is the answer to everything, but in particular he is passionate about using education to improve the overall content quality, accessibility, usability and future-viability of the Web.

He is the creator of the Opera Web standards curriculum, contributor to the WaSP InterACT project, and coauthor of InterACT with web standards: A Holistic Approach to Web Design. In August 2011, he also accepted the position of co-chair of the newly-formed Web Education Community Group.

Outside work he is a heavy metal drummer, proud father of three and lover of good beer.

×

Music Videos with CSS3 and HTML5 3pm CT

by Rachel Nabors, Front-end Developer and UI Engineer

Rachel Nabors will show you how to make a browser-based music video using the HTML5 audio, JavaScript and CSS3 animations.

Load assets, loop music, and fire events using JavaScript. Animate images and backgrounds with CSS3. Combine the two to let users interact with and change the video.

This talk is an excellent introduction to CSS3's shiniest features and HTML5's audio API. Even if you never need to make a music video, you're sure to come away with a head full of ideas.

About Rachel Nabors

Rachel Nabors is a front end developer, UI engineer, and award-winning cartoonist in Raleigh, North Carolina.

She has given talks and written about topics ranging from wabi-sabi to contributing to open source projects with github. She spends her free time making comics, drinking tea, and tending orchids.

You can follow her work at rachelnabors.com and @CrowChick and read her comics at rachelthegreat.com.

×

Fun & Games with CSS3 4pm CT

by Chris Ruppel, Frontend Engineer at Four Kitchens

Chris Ruppel demonstrates some bleeding-edge creative concepts you can achieve using CSS3. Examples aren't as practical as they are inspiring, showing off the possibilities of CSS3 and touching on components like animation, media queries, masks, transforms, transitions, filters, shaders, and 3D.

The audience should walk away with excitement, new awareness, and the desire to implement some of this awesome eye candy in a practical manner.

About Chris Ruppel

Chris Ruppel lives and breathes all things frontend. He makes sites load fast and loves the challenge of the multi-screen web. A visual thinker with technical roots, Chris is often found excitedly parsing the latest CSS module that was published on dev.w3.org, looking for fun toys that will crash his browser.

Active in many open source communities, Chris maintains the CSS3 Playground, created DrushMake.me, and is an active contributor to both the D8 Mobile Initiative and the pending Drupal.org D7 upgrade. Chris is also involved with the local Austin community, helping organize the Austin Drupal User Group.

When he?s not busy improving the web, Chris is out playing disc golf, kickball, swimming, or getting a healthy dose of Austin?s live music.

×

ADVANCED CSS \\ July 24, 2013 \\ 9AM to 5PM CT

(Schedule subject to change)

Automated CSS Testing 9am CT

by Simon Madine, Senior Engineer on Nokia Maps

Even in the biggest web apps built on continuous integration servers with automated deploys, CSS is still often tested only visually. Something can easily be missed or regressions can slip in and not be spotted until production.

As CSS is a declarative language, traditional automated testing techniques either don’t apply or aren’t sensible. This talk aims to give an overview of the techniques available for automated testing such as page render image diffs, cross-browser equality, frozen DOM structure comparisons. It will also cover some of the tools you can use to integrate automated CSS testing into your build pipeline.

About Simon Madine

Senior Engineer and Technologies Evangelist on Nokia Maps. Organiser and host of the Nokia Berlin Tech Talks and editor of the Nokia Web Dev blog. I write regularly for creativejs.com as well as my own site thinginjars.com. Worked in Edinburgh and Tokyo as a web dev for a top creative agency then spent a couple of years running The Angry Robot Zombie Factory making iOS and web apps.

×

Animating CSS Infographics 10am CT

by Val Head, Web Designer and Consultant

Animations and transitions are a powerful way to add design details and polish of your web site.

Whether your call them good UX or transitional interfaces, when used well, motion can bring a whole new dimension to your designs.

In this session we'll dig into how CSS and JS based animation can add surprise and delight to your work using common interactions and infographics as our examples.

About Val Head

Val Head is a designer obsessed with type and code. She speaks internationally at conferences and leads workshops on web design and creative coding. Every year she bring a swarm of web designers to Pittsburgh for Web Design Day, the conference she co-founded. She is the managing editor of CreativeJS.com and the author of the upcoming Pocket Guide to CSS Animations from Five Simple Steps. Val tweets too much, occasionally dribbbles, and blogs somewhat consistently.

×

Performance Testing Your CSS 11am CT

by Ben Frain, Author of Sass and Compass for Designers

The chrome developer tools make it easy to test some of the long held beliefs when it comes to performant CSS. In this presentation, Ben will demonstrate how to use the Chrome developer tools in specific relation to CSS:

  • How to test paint times of styles and trouble shoot slow pages
  • How to test selector speed
  • Find out if you have selector ‘rot’ - rules in your CSS that are no longer used on any pages
  • Check frame rates and how you can easily switch of elements for a live update
  • Saving style amendments from the Chrome dev tools back to the source files
  • Configuring and using a ‘lint’ tool to catch common CSS issues

About Ben Frain

Ben Frain is a front-end developer and author living in Cheshire, UK. He works for the worlds largest online gambling company, bet365.com and his books, Responsive web design with HTML5 & CSS3 and Sass and Compass for Designers are available now. You can follow him on Twitter @benfrain.

×

How to Prototype Using Responsive Frameworks 1pm CT

by Jared Ponchot, Creative Director at Lullabot

It's becoming clear that it's preferable to transfer your designs into code as early in the process as possible, and using a grid or a framework can give you a head start. But how do you use them? Jared introduces the best options and translates a sketch to an HTML prototype before your eyes!

About Jared Ponchot

Jared Ponchot is the Creative Director at Lullabot, an interactive strategy, design and development agency. Jared received his BFA in Graphic and Interactive Communications from Ringling College of Art and Design and began his career in print design, but has now spent more than ten years designing for the web and interactive applications. A strong advocate for responsive design, Jared helped create the first fully responsive site for GRAMMY.com for their 54th annual awards show. Jared is passionate about beautiful, usable design, and has shared his knowledge speaking extensively around the world on design principles, visual hierarchy, and designing for complex content models. He also hosts a bi-weekly Podcast called "The Creative Process", where he and Lullabot co-founder Jeff Robbins chat with designers, artists, musicians, authors and filmmakers about how creativity happens.

×

CSS Variables & Conditionals 2pm CT

by Tab Atkins, Web Standards Hacker at Google
Session information forthcoming.

About Tab Atkins

Tab Atkins Jr. wears many hats. Working for Google on the Chrome browser as a Web Standards Hacker, he also is a member of the CSS Working Group and several others, and contributes to even more working groups in the W3C.

×

Complex RWD CSS Grid Layouts Made Easy 3pm CT

by Sam Richard, Sr. Front End Developer for NBCUniversal's Publisher Team

Grids are powerful. They provide order to your design and structure to your content, but until we get native grids in CSS they’re hard to work with. When you need to make them fluid and responsive, they get harder. When you need to change a grid from a generic grid system, it becomes a nightmare to maintain. All of this, however, can be made easy and simple thanks to CSS Preprocessing and the right grid framework.

In this session, Sam shows:

  • How choose your girds
  • Why you should use a Grid Framework instead of a Grid System
  • Setting up Grid Framework
  • How to use grids within a Grid Framework
  • Creating compound or asymmetric grids easily

About Sam Richard

Sam Richard is the Senior Front End Developer for NBCUniversal’s Publisher team where he waxes philosophical about Sass+Compass, Responsive Web Design, Drupal, Photography, and, on occasion, bacon. He also makes all of the above, occasionally dipped in chocolate He organizes the New York Responsive Web Design meetup and co-organizes the New York Sass meetup and has spoken at a number of local, national, and international camps and conferences. He also maintains a number of open source projects to make designing in browser and build responsive sites easier.

×

Dealing with Responsive Images 4pm CT

by Dave Rupert, Lead developer for Paravel, Inc.

In this session, Dave Rupert discusses the good, the bad, and the ugly when it comes to responsive image solutions.

We'll figure out some best practices and learn how to not penalize users along the way.

About Dave Rupert

Dave Rupert is the lead developer for Paravel and host of the ATX Web Show, a podcast about the local web design and development scene in Austin, TX. Most of his attention is focused on current buzzwords: HTML5 / CSS3, Javascript, Rails, Sinatra, and the Mobile Web.

×

PREPROCESSORS \\ July 25, 2013 \\ 9AM to 5PM CT

(Schedule subject to change)

The State of Sass & Compass 9am CT

by Chris Eppstein, Creator of Compass and SASS Core Team Member

In addition to reviewing the latest in the new in Sass 3.3 and Compass, Chris Eppstein discusses the roadmap of these technologies and answers your questions about their future.

About Chris Eppstein

Chris Eppstein is the Software Architect at Caring.com, a website devoted to caregivers of the sick and elderly.

Chris is also the creator of Compass, a stylesheet authoring framework and is on the core team of Sass, the stylesheet syntax upon which Compass is built.

Chris maintain about a dozen less well known ruby libraries and rails plugins on github, and am an active contributor of patches to the many open source projects that I use.

×

Sass for Designers 10am CT

by Laura Kalbag, Designer

Sass still isn’t particularly easy for designers to pick up right away.

The documentation can be hard to understand, being written in a way that’s really aimed at those more familiar with programming.

Laura Kalbag will introduce you to the basics of Sass, emphasising the areas where there’s most value for designers, and how to start working with Sass without touching the command line.

This talk will include:

  • Why bother using Sass?
  • Setting up a project using Sass
  • How to use Sass in your existing projects

And will look at basic Sass concepts including:

  • Variables
  • Mixins
  • Nesting and media queries
  • Colour operations and other cool tricks

About Laura Kalbag

Laura Kalbag is a designer easily excited by web design and development. Among her list of ever-changing pet subjects are mobile web, semantic web, web fonts and design theory, but she’s really fascinated by anything in the areas of web, mobile and design.

Laura has been a freelancer for the whole of her professional life. She revels in working with small and meaningful clients, creating websites, apps, icons, illustrations and the odd logo.

×

Sass for Developers 11am CT

by Roy Tomeij, Co-founder of AppSignal

Roy Tomeij wants to teach you how to handle real-life problems with Sass and Compass:

  • write insanely DRY code with nested lists
  • create retina friendly sprites
  • code for performance
  • and much more you’ll want to use on your next project

About Roy Tomeij

Roy Tomeij is co-founder of 80beans and SliceCraft in Amsterdam, where he takes care of front-end architecture using an agile approach. He loves front-end meta languages like Haml, Sass & CoffeeScript because they are DRY, produce quick results & lead to better maintainable code.

×

Sass Case Study: Behance 1pm CT

by Jackie Balzer, Front-end Web Developer at Behance

CSS, Sass, and responsive web development are all awesome. But doing them all at once on a really big website can be tricky.

Behance’s home page, a gallery of art work and a complex search and filtering tool, recently underwent its first big responsive undertaking, so you can browse the world’s creative work on anything from a tiny phone to a huge desktop. Lots of Sass, JavaScript and device testing later, we learned a lot about what works, what doesn’t, what’s painful and what’s easy. In this session I’ll talk about:

  • How we used Sass to structure our code, manage breakpoints, build some cool pure-CSS interactions, and keep our large code base modular and maintainable
  • How we used JavaScript to manage breakpoints
  • What we learned about mobile browser quirks (IE never goes away)
  • Tools for Sass that made our code and workflow better

About Jackie Balzer

Jackie Balzer is the Head of Front-End Development at Behance, the leading online platform for showcasing and discovering creative work.

She leads the incredibly talented front-end development team in a mission to pave the way towards ultimate CSS modularity, maintainability, speed and efficiency by constantly experimenting and utilizing Sass and JS, all while working on websites that not only empower the creative world, but also totally shrink on phones.

She lives across the river in beautiful Brooklyn, NY and loves beer, cats, online shopping, riding her bike, and of course, Sass and CSS.

×

Interview Session 2pm CT

by Dan Cederholm, Founder of Simplebits & Co-Founder of Dribbble

Host of the CSS Summit, Christopher Schmitt, interviews Dan Cederholm, founder of Simplebits and Dribbble.

In this special session, Cederholm talks about his challenges and victories in going from handcrafting CSS to adopting Sass for his projects as well as his forthcoming book, Sass for Web Designers, coming later this year by A Book Apart.

About Dan Cederholm

A designer, author, speaker, and dad living in Salem, Massachusetts. Dan is the Founder and Principal of SimpleBits, LLC, a tiny web design studio.

A recognized expert in the field of standards-based web design, Dan has worked with YouTube, Microsoft, Google, MTV, ESPN, Electronic Arts, Blogger, Fast Company, Inc. Magazine, and others. He also received a TechFellow award for Product Design & Marketing in early 2012.

Dan is co-founder and designer of Dribbble, a vibrant community for sharing screenshots of your work. Previously, he co-founded and designed Cork?d, the first social network for wine aficionados which was later acquired by Gary Vaynerchuk.

×

Making Sass Our Own 3pm CT

by Scott Kellum, Designer at VOX Media

In this Session, Scott Kellum focuses on Sass and Compass:

  • Identify opportunities to integrate design decisions in your code
  • Abstracting CSS for re-use
  • The basics of Compass extensions
  • Using Compass extensions to add tools without complicating your workflow or CSS

About Scott Kellum

Scott Kellum is a designer at VOX Media creating beautiful features for The Verge as well as having worked on SB Nation and Polygon.

With a classical graphic design background and passion for code, Scott is particularly interested in the areas where design and development meet and has worked on numerous Compass plugins like Modular Scale, Singularity, Susy, Color Schemer, and Toolkit to help solve design problems in code.

He has previously worked at Treesaver creating rich magazine-like experiences for the web and Darden Studio drawing type.

×

Featuring
speakers from:

many fine organizations and companies

About the CSS Summit 2013

Whether it's the implementation of the new techniques available in CSS3, mobile concerns, pre-processor workflows or the ever-growing list of available fonts and how to use them, Web designers and developers will get up-to-speed with the help of these internationally recognized speakers and educators.

Why attend the online conference?
  • Attending a conference online means no travel hassle!
  • Bring the experts live to your desktop!
  • Time spent on the road is better spent instead in the office or with family, friends!
  • Sessions are developed to dive deeper into the material!
  • Ask questions directly to the speakers!
  • Can't make it the day of the conference? Watch the recordings whenever you want!
Testimonials from
Attendees
This conference was a load of fun. I loved the instant feedback from the speakers and the atmosphere.


John-David Dalton
Web Application Developer
& Web Performance Summit Attendee

I love these online conferences. It's convenient and you can still learn a lot from the comfort of your home or at work.


Candi Ligutan
5by5.tv Producer

An absolutely fantastic event. Well done—will definitely be back for more!


Russ Weakley
Chair of Web Standards Group
& CSS Summit Attendee

I can honestly say I've learned more attending E4H's virtual summits than I've learned attending real life conferences.


Glenda Sims
Senior Accessibility Consultant at Deque Systems, Inc
& Accessibility Summit Attendee

Next Event →

After this event, join us for our Digital Biz Summit 2013, the 1st annual online, live digital business conference.

Satisfaction Guaranteed 100%

Buy Tickets

HOW IT WORKS

Once you are registered, you will receive a follow-up email to confirm your reservation. Later on, as the event draws near, you will receive a more detailed message, with the full schedule and other helpful information to help you take full advantage of your conference-going experience and plan your day.

On the day of the conference, you will receive an email invitation about 45 minutes before everything starts. Click on the enclosed link to sign in and enter the virtual meeting space. Once you are signed in, you'll be able to see and hear the presentations as they happen, ask questions as needed and chat with the other attendees if you like!

Technical Specifications: to attend The Summit, you will need a modern web browser (Firefox 1.5, IE 6 & Safari 2 or newer, for example) and a recent version of the Adobe Flash Player. Follow this link to run our system diagnostic (opens in a new window). It will let you know right away which plug-ins, if any, you will need to update before the event.

Still have questions? Drop us a line or contact us at e4h@heatvision.com if there's anything else you'd like to know.