Pushing the Boundaries of Web Layout with CSS Grid
Rachel Andrew · Monday, March 5 · 8:30am – 5:30pm · Salon C
Explore how CSS Grid gives you the flexibility and power to create more modern responsive web layouts. Have better control over the presentation of your design’s content, while ensuring your design looks and works great on all screens, whether large or small.
Feel comfortable with what’s possible and what’s happening in the browser world. Gain the confidence to create easy-to-implement designs, while exploring a new world of layout possibilities.
Nobody can communicate the real power by CSS Grid as effectively as Rachel. Her books, Get Ready for CSS Grid Layout and The New CSS Layout are must-have favorites of designers and developers everywhere.
The Day’s Agenda
Morning
Explore the CSS Grid’s new layout capabilities
- Understand the benefits and flexibility of CSS grid layouts
- Learn how grids, flexbox, and box alignment address major design problems
- Gain an understanding of the CSS lexicon and how it differs from graphic design terminology
Apply modern CSS techniques to tackle common design patterns
- Map the CSS layout specifications to the biggest challenges you need solved
- Write and evaluate simple code examples to understand how the main CSS features work
- See when and why to use the different dimensional layouts
Afternoon
Build advanced grid layouts for the web
- Explore how space distribution and content size affects your layout
- Use whitespace and alignment properties to increase layout flexibility
- Solve layout problems in creative ways through breakpoints and content order
Design for inclusive accessibility
- Break the connection between the logical documents order and the visual order to optimize tabbing
- Identify the browsers that will support Grid
- Demonstrate the power of CSS Grid to the people who matter most in your organization
Create complex and flexible layouts with CSS Grid
See how complex layouts are within reach with CSS
Designers often feel stuck on the web with the limitations of traditional CSS techniques. With CSS Grid, you will gain the skills to build complex sites without sacrificing the design.
Learn how simple it can be to start coding with CSS Grid
It can be overwhelming to navigate the many properties inside the Grid specification, but it doesn’t have to be. You will learn how easy CSS Grid is — much simpler than floats!
Develop modern CSS skills for today’s browsers
Discover what web patterns are now possible to achieve with CSS Grid and Flexbox.
You’ll see how to:
- Expand your CSS layout skills with Grid and Flexbox
- Make sense of CSS Grid with the core fundamentals and terminology
- Choose the best approach to achieve common web patterns
- Facilitate strategic layout discussions with your development team
- Design for accessibility and test on the keyboard
- Consider browser adoption and avoid inconsistencies across different browsers
Get an in-depth tour of the CSS Grid specification and syntax
Move beyond the fragility of traditional CSS approaches
Before Grid, designers struggled with achieving a precise looking layout. You will see how to bring resiliency to your designs.
Transform the way you design for the web
By opening up to a flexible approach to page layout no longer hindered by the limitations of CSS, your team will rethink the way they approach web projects.
Get immersed in the rapidly evolving world of CSS
It’s an innovative period for CSS layout and you’ll be exposed to the most cutting edge approaches to designing for the web.
Align your development team with a common goal and a clear direction
Armed with a solid understanding of Grid and a common language for discussing its capabilities, you can get your team excited about the layout possibilities with CSS.
Get hands-on experience with CSS Grid
In this interactive workshop, you will be writing CSS. It’s not necessary to be a front-end developer, however you should arrive at the workshop with a basic understanding of CSS fundamentals.
Rachel Andrew
We’re so excited Rachel will be joining us for UX Immersion: Interactions 18. Her reputation as one of the world’s foremost web experts got her on our radar. Yet it’s her uncanny knack of making complicated stuff immediately accessible that got her on our program.
Her work as one of the brains behind the content management system, Perch (which we use all the time) gives her a real grounded understanding of how design happens. And her recent books The New CSS Layout and the second edition of HTML5 for Web Designers (which she co-authored with Jeremy Keith) have helped thousands of designers and developers produce better web sites.
Even if you have just a basic understanding of how CSS works, you’ll truly enjoy Rachel’s workshop and she pushes your design capabilities to new levels.
On Tuesday, Rachel will give a featured talk, The Creative New World of CSS.
