Div vs Span

Div

Block Element
Legal to have a span within a DIV

w3c Describes span as follows;

"The div element has no special meaning at all. It represents its children. It can be used with the class, lang, and title attributes to mark up semantics common to a group of consecutive elements."

Span

Inline Element
Illegal to have a DIV within a span

w3c Describes span as follows;

"The span element doesn't mean anything on its own, but can be useful when used together with the global attributes, e.g. class, lang, or dir. It represents its children."

Reference:
http://www.w3.org/TR/html5/grouping-content.html#the-div-element
https://www.w3.org/wiki/HTML/Elements/span

Responsive Web Design is a Perfect Model?

One Mantra to remember in the world of Web Design / Web Development is that "There is No Perfect Model".

The technology and the user experience is always changing. The change is such that it brings about a Evolution in the system that lasts for a while and still Evolves.

There will always be small problems / issues / complaints by the users based on different cases from slower loading to accessibility to quirks.

However this is the best model available to date to improve the user experience across devices and boost user engagement.

Responsive web design model should be considered for any new web development.

Understanding all the internal and external factors of working makes it very difficult. However time invested in learning the same is totally valuable and brings the best return on investment when designing world class websites.

Introduction to Responsive Web Design

Here are a few pointers on to understand on what is responsive web design and clear a few myths.

1. One Code all Screens

This is the real aim is to fit in any screen. From smart phones to Smart TV. One Code Many Screens is the mantra.

2. Typography is Automatically Taken Care

Implementing a library will not take care of all the aspects, the typography needs to be taken care.

3. The Responsive Web Sites "Load Slower"

Negative, there are a lot of websites that give you the best service when designed to be responsive. The reason for a slower page is not the code but the design, so please go back to the drawing board.

4. Will not work on for all websites

False, a good designer can help to identify, clarify and manage the requirements.
5. Retail Companies - Stay away from Responsive Website

False, they work like a charm for retail and over 30% of ecommerce transactions take place over mobile devices.

6. Takes Longer time to implement

True to an extent, but this time can be minimized by using a responsive design framework like jQuery Mobile, Bootstrap, etc

7. Browser Dependence

HTML 5, is the new standard adopted and thus all the web browsers in the industry should comply to the parser standards making responsive web design browser independent.

8. It's Expensive to implement

Not so True now, because the resource crunch is coming down and HTML5 is a standard now.

9. Is not well connected

False, the connections are being improved in a very drastic manner, thanks to Google algorithm update which does have a direct impact on the website rankings if not mobile ready.

10. Transition to Mobile Web

It's relatively easy to move from HTML4.x to HTML 5 with the frameworks in place. However there is a little customization to be done in the design.

12. Mobile Ready

Thinking Mobile Ready means being user friendly and market ready.

14. One Image Many Screens

The same image can be used for various containers but it is recommended to optimize the same for the pages. Smaller images will be skewed on large screens, large images on small screens will nto load.

15. Responsive Web Design is "The Future"

Nope, it is the present. There is a demand for more number of responsive websites today than after 2 or 3 or even 5 years.

In the near future, we can always look towards more seamless accessibility and integration.

To all the people who want to build a website or design one, the only focus should be on "User Experience", the best example can be Gmail or Flipkart where the users learn every feature on their own.