What are the optimal Media Query sizes for effectively targeting tablets, phones, laptops, and desktops?
For instance, considering that both the iPhone and Droid feature a screen size of 320X480, it is important to ensure that your design looks good at these dimensions due to their prevalence among various devices. What other sizes should you aim to optimize for? I am interested in a broad range of sizes beyond just those of iPhone and iPad, taking into account the wide variety of Android device sizes on the market.
@media screen and (max-width: 480px) { /* This would target landscape mode for devices like the Droid, iPhone 3, etc. */ }
@media screen and (max-width: 320px) { /* This would target portrait mode for devices like the Droid, iPhone 3, etc. */ }