Responsibly responsive web app design-responsive framework and my convenience wh

Question

Responsibly responsive web app design-responsive framework and my convenience when creating a modern website. Discuss at least three design options, such as hiding content or layout changes, that would be beneficial for a responsive website on a mobile device or tablet. Responsibly responsive web app design-responsive framework and my convenience when creating a modern website. Discuss at least three design options, such as hiding content or layout changes, that would be beneficial for a responsive website on a mobile device or tablet.

Explanation / Answer

In the field of Web design and development, we’re quickly getting to the point of being unable to keep up with the endless new resolutions and devices. For many websites, creating a website version for each resolution and new device would be impossible, or at least impractical.

Responsive Web design is the approach that suggests that design and development should respond to the user’s behavior and environment based on screen size, platform and orientation.

The practice consists of a mix of flexible grids and layouts, images and an intelligent use of CSS media queries. As the user switches from their laptop to iPad, the website should automatically switch to accommodate for resolution, image size and scripting abilities. In other words, the website should have the technology to automatically respond to the user’s preferences. This would eliminate the need for a different design and development phase for each new gadget on the market.

Designers have it tougher now than before. We not only have to design for stationary devices, but also mobile devices like the tablet and smartphones, and since we are talking about a lot of different screen sizes and resolutions here, it’s a huge task to shoulder. In light of this, responsive web design could be the best solution. It offers more than just a simple mobile template; instead, your entire site layout is designed to be flexible enough to fit into any possible screen resolution.

When I use the word “responsive” in terms of web design I mean that the entire layout responds based on the user’s screen resolution. Imagine this scenario: you’re reading a website on one tablet, then you switch to another device for one reason or another. The browser window is now re-sized. A responsive web design layout will feature schemes and a layout that gracefully breaks down and reinvents itself.

It has become evident that more users are going mobile, and not just for on-the-go web browsing either. Tablet PCs have begun to change in context when users are online in the classroom. Designing for mobile is certainly a requirement in modern day web standards. The only problem is choosing your method of development, and targeting your audience appropriately.

When we start coding for specific screen resolutions we end up with too many stylesheets to deal with. Media queries in CSS3 can be used to build iPhone-specific layouts for both portrait and landscape view. Since we can predetermine the pixel density it’s easy to revamp any HTML template for mobile.

Images are another important facet of practically every website. Mobile users may not be looking to stream videos, but photos are a whole different story. These are also the biggest culprits when it comes to layouts breaking out of the box model.

The standard rule for CSS is to apply a max-width property to all images. Since they’ll always be set at 100% you will never notice distortions. When the user re-sizes their browser window smaller than your image can handle it’ll automatically re-adjust to 100% width scaled down. The problem is that Internet Explorer cannot understand this property, so you’ll need to put together an IE-specific stylesheet using width: 100%;.

Related Questions

Navigate

• Browse (All)
• Browse R
• Subjects

---

---

Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.