Online Shopping is no longer limited to computers or laptops. Increasing number of shoppers prefer to shop from their mobile phones or tablets. In this speech, you can learn how to make an eCommerce website mobile responsive.

1. www.emiprotechnologies.com
Responsive Web Design

2. What is responsive website ?

3. What is responsive website ?

4. What is responsive website ?

5. ● Widescreen desktop monitor
● Smaller desktop (or laptop),
● Tablet, iPad
● Mobile phone.
Screen Sizes
Typically there have been four general screen sizes that responsive design
has been aimed at:

7. How many of you are NOT using mobile for internet use?

8. Statistics showing an Increase of Mobile Usage

9. Importance of the responsive Web
Design

10. #Usage of mobile proved that what is importance of
responsive web design.

11. #Now Google Algorithm for SEO page rank considers
responsiveness of website

12. #You should have a question that now mobile app is
available, so what is need of mobile responsive website?

14. Mobile App V/S Responsive Website
● For which business, mobile app is useful?
● Small Business
● Small Medium Business
● Medium Business
● Large Business
● Extra large Business
● Mobile app is really important for business, but
responsive website has also enough importance.

15. Facebook

16. Myntra

17. How to make website responsive?

18. How to
Key Points of Responsive Web Design
● Viewport
● Flexible layout
● Media queries

19. #Viewport
● The viewport is the user's visible area of a web page.
● <meta name="viewport" content="width=device-width, initial-scale=1.0
maximum-scale=1.0,">

20. #Flexible layout
● Padding
● Margin
● Width in %

21. #CSS Media queries
● It uses the @media rule to include a block of CSS
properties only if a certain condition is true;
@media only screen and (max-width: 500px) {
body {
background-color: lightblue;
}
}

22. Any
Questions?

23. Thank You

24. www.emiprotechnologies.com