Menu icon Foundation
Progressive Enhancement and Mobile First

I apologize in advance if this is a stupid question. I keep reading all of this information about the importance of coding for mobile first and progressive enhancement. I am confused though about how this relates to Foundation. Does that mean that I should just create my site with the small css values first? Then when I like that go back and add in the medium and large values?

I had been coding for all three sizes at the same time - small, medium and large.

Maybe the mobile-first approach refers to what is already in Foundation?

Mobile Firstprogressive enhancementResponsive

I apologize in advance if this is a stupid question. I keep reading all of this information about the importance of coding for mobile first and progressive enhancement. I am confused though about how this relates to Foundation. Does that mean that I should just create my site with the small css values first? Then when I like that go back and add in the medium and large values?

I had been coding for all three sizes at the same time - small, medium and large.

Maybe the mobile-first approach refers to what is already in Foundation?

Klevis Miho over 4 years ago

On Foundation that's basically it. Starting with classes from small and up. So for example if you want 6 columns on small, medium, and large, then you have to just put small-6 and it will be appliad to medium screens and up.

Lately, when I want 12 columns(the max columns) then I don't specify any small, medium, large classes at all, just the .columns class. Not sure though if that's a good approach.

James Stone over 4 years ago

Progressive Enhancement generally means to add functionality on devices that support it. In the case of Mobile First, it often means adding functionality on tablet or desktop that does not exist on mobile. It really depends on your target market and if you are already committing to a mobile first workflow / design, perhaps desktop is not a big enough market to justify the expense (in time) to provide an enhanced experience.