added five points for responsive websites

Author: khan4019

js3.html

@@ -81,7 +81,19 @@ <h2>part -3: intermediate</h2>
 
       <div id="responsiveWebsite">
         <p><strong>Question:</strong> What are the things you would do to make a website responsive</p>
-        <p><strong>Answer:</strong></p>
+        <p><strong>Answer:</strong> There  is a series of stuff you can do. and a summery of them are</p>
+        <ul>
+          <li><strong>layout</strong>, keep it simple. dont use div, absolute position or float unnecessarily. kill inline styles. use HTML5 doctype, reset stylesheet, semantic core layout.</li>
+          <li><strong>media queries</strong>, to load stylesheet based on the size of the media or apply rules based on the orientation of the media</li>
+          <li><strong>breakpoints</strong>, choose the right breakpoints to switch style. common breakpoints are &lt;480px, &lt;768px, &gt;768px. There are three nice to have breakpoints &lt;320px, &gt;769px and &lt;1024px, &gt;1024px.</li>
+          <li><strong>flexible</strong>, don't use fixed width rather use relative to viewport size. like em, %</li>
+          <li><strong>pictures</strong>, pictures are a big of a deal for responsive websites. Right now you can change src attribute of an image based on the media query alone. Hence you can use background-image or use different picture versions and show/hide their parent in media queries.</li>
+          <li><strong></strong></li>
+          <li><strong></strong></li>
+          <li><strong></strong></li>
+          <li><strong></strong></li>
+          <li><strong></strong></li>
+        </ul>
         <p>ref: <a href="http://readwrite.com/2013/04/16/10-developer-tips-to-build-a-responsive-website-infographic#awesm=~ou5vLQZqqXIubV">Read best practices</a></p>
       </div>