Mobile app version of vmapp.org
Login or Join
Cofer715

: Designing responsive websites I have three questions: I've read in some places that I should start designing for mobile and then build responsively out for tablet, then laptop, and finally different

@Cofer715

Posted in: #ResponsiveDesign #WebsiteDesign

I have three questions:


I've read in some places that I should start designing for mobile and then build responsively out for tablet, then laptop, and finally different desktop sizes. I've also read the opposite: to design top down, ending in mobile. What should I do?
What are the "traditional", or perhaps the best places to place breakpoints in my design for the website to be optimized for any and all devices?
Related to the previous question: how large should my largest design (breakpoint) be?

10.01% popularity Vote Up Vote Down


Login to follow query

More posts by @Cofer715

1 Comments

Sorted by latest first Latest Oldest Best

 

@Harper654

You start with the smallest screen because that is the simplest, most lightweight version of your website, with only one flowed column. The larger screen versions are enhancements of the smallest screen, where the number of columns typically grows.

Where your break points are depends on your design. The break points are where your design breaks. Where it breaks, you create a media query and modify the design in some way. Some designs are newspaper-like, with many columns. Some are book-like, with text on one side and an image on the other. some are poster-like, with very little text. So there is not one right answer.

How large of a screen you specifically design for also depends on your design. Your tablet design might scale to a 5K iMac, or not. I like to make an HDTV design at 1920x1080 and the 2x resources are 4KTV. So it goes phone, tablet, notebook, desktop, TV. But that suits the sites I make.

You might want to start with Skeleton which is very easy, the most minimal template you can imagine. Bootstrap is very popular but more complicated. Maybe you go to that later.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme