Rick Sekuloski - Web Design with HTML5 and CSS: Learn how to design, create and built responsive websites using the best HTML5 and CSS practices

Well today our focus is shifted to the use of tablets and mobile. The mobiles and tablets are much faster and capable now then it was years ago, for example we can read the news, we can pay our bills on time and basically, we can do lot of things with these devices so we dont rely on computers and laptops anymore. So that is why we need to understand the needs of the audience or the users, what they expect from our websites to perform and therefore we must build responsive websites according to the user needs. Did you know that if user wait for only 3.0 seconds for a web page to load it will become frustrated and probably never return back to our site? Here's what we will cover in this first chapter: Device screen What is responsive web design Text/Code editors Browser support Device screen As I mentioned before today mobile browsers account for 51.11% of total browser usage, 45.18 goes to desktops and finally, 3.71% is for the tablets. That is how a responsive web design comes into place and with my help by the end of this book you will be ready to build awesome web pages using the HTML and CSS latest and most modern techniques. Our goal is to make our website to work across multiple devices and screen sizes.

What is responsive web design? Well, a responsive web design is a design that incorporates 3 basic things: flexible grid layout flexible images/media and media queries Text/Code editors Personally, it makes no difference witch text editor or tool you choose to write your code. There are many out there that are free so you dont need to pay money, but I will be using VsCode or Visual Studio Code text editor and this one is free. If you have used some other text editors then please you can still use the same on for this book. Other text editors that you might be interested in are: Sublime Text Vim Emacs Notepad Browser support Nowadays, most of the users understand what responsive web design is and why this is super important for business to have. For example, imagine that a user visit website on his computer and found out some interesting things but he/she is not ready to make a purchase yet and instead of purchasing the items the user is saving them as liked items so he can come back the next day and make a purchase. Now imagine that the user is at home and he remembered about the items he saved so he opens his mobile phone and load the same website but now the content that he saved is actually not visible anymore or it does not look the same as on computer.

Why is this happening? Well, the answer is simple, either because the site is not developed to be responsive or the browser on the phone is old and not compatible to support the new standards. That is why when a company wants to develop a product before they start the production, they already know what their target audience is and based on their information they take actions and plan how their app should be built. From the results they have gathered they everything about the age, gender and activity and based on that they will start planning what features will be included because not all of the web browsers will support all of the features. So, this becomes a problem for the companies because the older the browser is the more time is needed for developers to develop the features, because they need to be tested after that if they work properly. This actually can cost a lot of money and the company sometimes needs to decide what features are essential and what features are not so the features that are not that important will be left out and that will drive the costs down.