Progressive Enhancement

Progressive Enhancement

Laying Out the Future with Rachel Andrew

Jen Simmons's picture by Jen Simmons on

114

Everything about web page layout is changing. New CSS specifications will make it possible to do designs we've never seen before. Rachel Andrew joins Jen Simmons to talk about what's happening.

Thank you An Event Apart for sponsoring the show! Use discount code AEAAHEAD for $100 off any two- or three-day event in 2016. And thanks to Squarespace. Use JENSENTME to get 10% off your first purchase.

Show Notes: 
List of Contents: 
  • The radical change that's coming to layout on the web
  • Grid, Flexbox, Alignment, Multicolumn, and more
  • What we've had to do for the last 15 years because we have not had proper tools for doing layout in CSS
  • Why we started using 960 Grid, Bootstrap, Foundation and other such layout frameworks
  • What can Grid do that floats cannot do
  • How is Grid different than Bootstrap
  • What's the difference between Grid and Flexbox? Why do we have two specs for layout?
  • How can we learn all these things?
    • Related Episodes: 
    CSS Layouts with Rachel Andrew
    Grids with Mark Boulton
    Predicting the future with Rachel Andrew, Eric Meyer, and Jeffrey Zeldman
    Duration: 
    6 444
    Technology: 
    CSS Grids & Regions
    CSS Shapes & Exclusions
    Flexbox
    Progressive Enhancement
    Is there a transcript?: 
    Yes Transcript, Yes Comments

    Going Responsive with Karen McGrane

    Jen Simmons's picture by Jen Simmons on

    111

    It’s clear. Responsive is the way to go. One website for all screen sizes, for all devices. But what does it take for a company with an pre-existing site or pre-existing way of working together to make the needed changes to go responsive? It's not about the media queries. It's about everything else. Karen McGrane joins Jen Simmons to talk about her new book, and to imagine an amazing future.

    Thanks to Squarespace for sponsoring this episode. Use coupon code JENSENTME to get 10% off your first purchase.

    You can’t rely on static comps being thrown over the wall to developers to build. It’s got to be something that’s based on a prototype. Those teams have to be working closely together. Those teams have to have a shared language and a shared value system.

    a photo of Karen's book cover, on various screens and in paper
    Show Notes: 
    List of Contents: 
  • What does it take to revise an existing site to be responsive? What are the biggest challenges?
  • How can you get the whole team on the same page, understanding the complexity of modern web design?
  • What about responsive web design is so hard?
  • Why using PDFs generated in Photoshop to make final decisions is a lousy way to design. How a process that includes prototypes is much better.
  • How to make big changes to the work flow inside a team.
  • What we can learn from the past, the transition from analog to digital.
  • The possibilities in design that open up once we modernize our content systems and workflows.
  • The dangers of using a front-end framework.
  • What’s wrong with the industry’s current focus on style guides?
  • What does it take to design a true system of content and layout options?
  • How might we start empowering content creators with tools for true editorial design?
    • Related Episodes: 
    Web Strategy with Karen McGrane
    Duration: 
    3 893
    Technology: 
    Progressive Enhancement
    Is there a transcript?: 
    Yes Transcript, Yes Comments

    Progressive Enhancement with Aaron Gustafson

    Jen Simmons's picture by Jen Simmons on

    105

    Progressive Enhancement is a core principle of the web. But these days it seems a lot of folks don't quite understand what it's about. Aaron Gustafson joins Jen Simmons to break it down, and explain why and how your website should be built using the principles of Progressive Enhancement.

    Thanks to Media Temple for sponsoring this episode. Use coupon code TWA to get 25% off their web hosting.

    When you're developing software for the web, there's very little that you control. You control what it is that you create, but you do not control what ultimately gets delivered to your users. You don't control the execution environment. You don't control the screen size. You don't control the pixel density. You don't control the network it's delivered over. You don't control the router that's used. There are so many factors you need to take into account. So many things you need to understand are beyond your control. If you assume JavaScript is always going to be available and every machine that accesses your site is going to be able to run all of the JS, I think you're deluding yourself.

    Show Notes: 
    List of Contents: 
  • What is progressive enhancement?
  • How do we do it?
  • But what about supporting the old browsers?
  • But what about doing the hot new stuff?
  • Doesn’t it take longer?
  • Why in the world?
  • Ok, ok, I know I should, but how? no really, how?
  • But what about my cool JavaScript-based Web App for my awesome new startup? That doesn’t need to bother with progressive enhancement, I know it.
    • Related Episodes: 
    The Nature of the Web with Jeremy Keith
    Duration: 
    4 880
    Technology: 
    Progressive Enhancement
    Is there a transcript?: 
    Yes Transcript, Yes Comments

    Rethinking Microsoft's Browser with Rey Bango

    Jen Simmons's picture by Jen Simmons on

    94

    Microsoft announced that they will be introducing a new browser, code-named Project Spartan. Windows 10 will ship with both IE and Project Spartan, but Spartan is the future. What is happening? How is it that the oldest popular browser is going to end? Rey Bango joins Jen Simmons to tell all.

    This episode is sponsored by Thinkful (use that link for 10% off).

    Sane markup means: let's build stuff that's interoperable. That's the premise that the IE team has been working on — work on the standards and make sure they're interoperable. The way that you build a page should work across any browser, across any form factor… Let's truly focus on cross-browser by using standards.

    a screenshot of Spartan
    Show Notes: 
    List of Contents: 
  • What is Spartan?
  • What's the rendering engine in Spartan? How similar is it to IE?
  • What's the web standards support like?
  • Why is Microsoft changing browsers?
  • What are the priorities for Spartan?
  • Is that the name? When is it coming out?
  • It's "evergreen"? What's that mean?
  • How long will Internet Explorer stick around?
    • Related Episodes: 
    Internet Explorer 10 with Rey Bango
    Duration: 
    4 996
    Technology: 
    Progressive Enhancement
    Is there a transcript?: 
    Yes Transcript, Yes Comments
    Image caption: 

    The new Project Spartan browser, as seen on the IEBlog.

    Responding Responsibly with Scott Jehl

    Jen Simmons's picture by Jen Simmons on

    89

    It's clear that responsive web design is the way to build a website in today's crazy world of mobile devices, but what's the best way to do so? How can you create a responsive site that's fast and snappy? Scott Jehl joins Jen Simmons to tell us about the latest in how to do RWD right.

    Thanks to this week's sponsor, Casper. Use the code WEBAHEAD for $50 off. And thanks to Mandrill. Use the code 5by5 to receive 50,000 free email sends per month for the first six months. And thanks to CITRIX GoToAssist. Sign up today for a 30-day free trial.

    These days progressive enhancement is important to businesses for much more important reasons than just developer maintenance alone.

    Show Notes: 
  • A Book Apart, Responsible Responsive Design
  • How we make RWD sites load fast as heck | Filament Group, Inc., Boston, MA
  • Open-Source Projects | Filament Group, Inc., Boston, MA | Filament Group, Inc., Boston, MA
  • filamentgroup/criticalCSS
  • LEGO Shop
  • Scott Jehl, Web Designer/Developer, Seagrove Beach, Florida, USA
  • Scott Jehl (@scottjehl) | Twitter
  • Articles| Filament Group, Inc., Boston, MA | Filament Group, Inc., Boston, MA
    • List of Contents: 
  • Progressive enhancement: why, when, how
  • Making sites load quickly
  • Using inline CSS instead of external stylesheets for the sake of performance
  • Preventing jank — problems of things jumping around as the page loads
  • Building resilient websites
  • Content order in RWD (HTML source order)
  • Pros and cons of JavaScript frameworks. Which one is better?
  • How to work with folks who aren't convinced progressive enhancement is important
    • Related Episodes: 
    Smart Responsive Web Design Implementation with Scott Jehl
    Duration: 
    5 086
    Technology: 
    JavaScript frameworks
    Progressive Enhancement
    Is there a transcript?: 
    Yes Transcript, No Comments

    Everything Web with Jeremy Keith

    by The Web Ahead on

    3

    Jeremy Keith joins Jen to talk about Mobilewood, future-friendlying websites, responsive design techniques, digital preservation, HTML5 semantics, Firefox 7, and much more.

    The truth is, it never worked that well to have this split between design and development — where you have someone who works in Photoshop and hands over a comp to somebody who turns it into HTML and CSS.

    Show Notes: 
    Related Episodes: 
    Understanding the Web with Jeremy Keith
    Duration: 
    4 230
    Technology: 
    Progressive Enhancement
    Is there a transcript?: 
    Yes Transcript, No Comments
    Subscribe to RSS - Progressive Enhancement