Do you know who Ethan Marcotte is? Have you ever encountered the term, “responsive design”? If you want to make it far or learn more in web development, I suggest continuing to read this article. You might learn a thing or two about the beginnings of responsive web design.
History of Responsive Web Design
Ethan Marcottte was developing websites in an era where people are just starting to browse websites using their phones. There was already concepts of fixed-width design but Ethan felt that they were not enough. Mobile users are annoyed with the differences and problems in website performance on different screens. It was not a pleasurable or comfortable experience back then.
Sure there are developers who can create webpages for specific devices but he understood that this was not sustainable. There has to be a better solution.
Ethan wrote his ideas in an article titled Responsive Web Design and published in A List Apart in May 2010 detailing his ideas on how to solve this issue. That moment Ethan Marcotte became the father of responsive web design — ushering in a new era in web development. The main idea of the article is to allow websites to adapt to varying screen sizes.
After writing the article, Ethan Marcotte was still not satisfied. A year later, he published a book titled “Responsive Web Design (Brief Books for People Who Make Websites)”. Afterward, this became the guideline for web designers and developers in creating websites.
The Revolutionary Book on Responsive Web Design
According to the book, the main principle of responsive design is that webpages should only have one URL. The content is resized and rearranged depending on a device’s specific screen size.
Three main components make this possible, namely flexible layouts, flexible media, and media queries.
This is achieved primarily through grids. Parts of the webpage are organized as different cards. This way they can be easily changed by size and sequence in accordance with the requirements of specific devices.
This is the way of changing the size of an image or video automatically depending on the size of the screen. You can already test this out by changing the window size of your browser.
Through this, the website can change styles based on the device where the content is being viewed. From the height, width, orientation, and resolution, the website adapts to each. This way a page can operate in multiple variations.
Responsive web design affects the layout of web pages greatly. At times, the layout is the first step in developing a website, closely followed by the design. As such, developing and coding responsive pages became a big part of web development. Everywhere in the world, this practice has been adopted and followed. Despite this, Ethan Marcotte didn’t become a household name but his work has been embraced and approved in all standard web development practices. If you ever find yourself developing a website with responsiveness in mind, you now know who to thank.
Your Website Needs Responsive Design
As of January 2020, StatCounter reports that 52% of users worldwide access websites in their mobile phones, 45% of this are in desktop computers, and a meager 3% are in tablets. For resolution sizes, the percentages are more scattered. The biggest are 13% for 360×640, 9% for 1366×768, 8% for 1920×1080, and a few percentages shared within the rest. These numbers prove that responsive web design is sorely needed to provide a satisfying and pleasurable experience for web visitors no matter what device they use.
If you want to show your full appreciation, give Ethan Marcotte his due and let him continue studying and honing web design and practicing public speaking. This way he’ll become more skilled and we can learn more from him. Thanks to him, millions of websites follow responsive design guidelines, and you should too.