Right guys, here’s a bit of a discussion —
I’m creating a website with divs and in HTML5 standards. However, my webpage only fits 1440×900 due to my screen resolution. I have to use CSS Media Queries to resize the page to fit on say, a 800 x 600 desktop resolution, but here’s a thought :
-
Photoshop also does the same resizing, but with slice and diced tables, no other code or CSS tweaks necessary. Are tables really that bad when it helps you automatically resize on every single resolution (even for mobile sites)?
-
What if your CSS Media Query meets someone who has a windowed browser screen, like instead of a full screen 800 x 600 resolution browser, the user has 768 x 560? Does that mean your CSS Media Query will need to define that resolution in order to fit the window size? (What i’m trying to say here is that my Media Query only fits browsers with a defined size of 320px, 480px, 600px, 768px, 1024px, 1400px, nothing else other that these values make the screen display correctly.)
-
I’m currently using CSS3 Media Queries but i have to define a lot of resolution sizes (from widths of 320px, 480px, 600px, 768px, 1024px, 1400px). Is this really necessary?
Photoshop does not help you resize a site design ‘automatically on every single resolution’. In fact, with the way things are going these days – it’s nearly impossible to know what resolution will be on whatever device in the future. I believe the Android OS is now on over 100 different resolutions. Keep in mind too, Photoshop is really a graphics program.
While media queries draw on the idea of breakpoints, they are best coupled with the ideas of fluid design (using percents instead of fixed widths/sizes). You shouldn’t really need to define a media query to suit every single common monitor width. It’s better to use the principals of a fluid design and then when things get too crowded/spaced out at a certain point or width use a media query (breakpoint) to change the layout/design to suit the physical size of the screen/browser window.
It may be necessary, it may not be. Again, it depends on whether you want to change your design at a certain point. Maybe try designing a site with only percentages just to see what’s possible, then when things get ugly or don’t float visually well, put in a few media queries at at those breakpoints and adjust the floats and proportions to suit your needs.