Everyone seems to be talking about it but no one quite knows the difference. So I would like to break it down nice and easy.
Firstly, what is a mobile website? A mobile website is a website built specifically for the mobile platform. Usually this is a version of a normal website that a user is directed to if they are viewing on a mobile device such as a phone or a tablet. Not only do they have different content and a different layout, they often have a different url than the standard website, such as mobile.yourwebsite.com or yourwebsite.com/mobile.html.
Responsive web design differs from this in a few key points. Let’s define responsive web design. In short, responsive web design is a method of building websites wherein the website responds to the screen size it is viewed on. For example, a 3 column website might become a 2 column website for a tablet or a 1 column website for a mobile phone. It is the same website, but the content is rearranged to fit the screen size. Specific styles are applied to the site, per the screen size, but the content and the code is exactly the same.
The main difference that you need to keep in mind is that responsive websites have the same URL and most, if not all of the same content. This is essential for search engine optimization. Different URLs split the SEO ranking juice, which can lower your rankings in search engines. They can also confuse a user, or cause problems when linking or sharing the content. Responsive website design is the Google recommended method for building websites.
