Responsive design simply means that a web layout adjusts to the size of a device's browser window (including the screen resolution). So no matter if a user is viewing your page on a desktop, laptop, iPad, smart phone or TV, your important information is sized to the screen in a readable form.
Even better for designers, there’s only one layout to create, not one for regular screens and then another for a mobile version.
How does this Work?
Responsive design uses a “media query” to detect the height, width and resolution of the user’s browser and then adjusts the layout accordingly through the Cascading Style Sheet (CSS). Properties such as display width, page orientation, pixel resolution and other device features determine which style sheet is used to render the page for a user.
As the browser window narrows, columns/containers stack one on top of the other so that the page narrows and lengthens to fit the screen. Font size and images are reduced. For larger devices, columns, fonts, images and other features expand to their fullest size into a more horizontal layout.
Rather than a “one-size-fits-all” solution for the size of a web page, a media query allows a designer to target styles based on device properties like screen size or layout orientation.
All of this resides in the default page code, so ECU’s department designers are no longer required to
What do ECU webmasters need to know?