Note that there are some explanatory texts on larger screens.

plurals
  1. POWhat will load first with responsive design?
    primarykey
    data
    text
    <p>I've just finished reading yiibu's slideshow on their responsive site development for nokia, and one of the larger points of it seems to be to focus on mobile first, then desktops and other larger and faster platforms. ( <a href="http://www.slideshare.net/yiibu/pragmatic-responsive-design" rel="nofollow">http://www.slideshare.net/yiibu/pragmatic-responsive-design</a> ) Not just in the planning phase, but literally develop your responsive design in the sense that the innitial styles, with no media queries applied, will be the design for your smallest platform, with the lowest capabilities. (older phones, depending on your audience) Which is backwards from what I've innitially thought to do (and from what I've seen, what others usually do as well).</p> <p>The rationale was that this method would prevent people on mobile devices with lower bandwidth from downloading additional scripts and large images, by innitially downloading only the scripts and images needed for the minimum device, then loading more, and more, depending on the size and predicted capabilities of the device, eventually putting the most burden on the largest devices (laptops and desktop computers). --- This being contrary to what I've been doing, which is designing for the desktop, then adding media queries to optimize for mobile devices.</p> <hr> <p>My question is, do I need to design for mobile first, then add media queries to optimize for larger devices with more capabilities in order to prevent the burden of downloading large images that wont be used on mobile devices?</p> <p>.....Or can I just use sepparate stylesheets and call to a mobile stylesheet before calling to a stylesheet focused on larger browsers/devices?</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload