Translated by Google Translate

How to Design Responsive Website (Automatic Display Resizing)



Somebody ask me, "could you create a website that the display can auto resize for mobile phone, tablet, or etc?", I said "YES, OF COURSE!". Well, automatic display resizing in website is called Responsive Website. It means that your site have auto respons with screen, it auto resize and fit with the screen. For example, you can open the facebook site. you can compare www.facebook.com with m.facebook.com.

Picture 1. Comparation of CSS Bootstrap Usage in Facebook
In the picture 1, you can see if m.facebook (rightside) can automatic resize the display with google chrome screen. It's not happen in www.facebook.com (leftside), the display doesn't respons with google chrome screen. Another ways to check if the site is responsive that you can open m.facebook in another gadget and see if the display, picture and font is responsive.

To build the website like that, you don't need to modify your html or php code, but you need to add some CSS and JavaScript features. There are many frameworks you can use to build responsive website, included that CSS and JavaScript features, but I suggest this one CSS frameworks. It is called CSS Bootstrap or Twitter Bootstrap.

What is CSS Bootstrap?

CSS Bootstrap or in another name called Twiter Bootsrap is CSS Framework that build by Twiiter and developed by Mark Otto and Jacob Thornton (twitter developer) at Twitter to encourage consistency accross internal tools. And it developed with free and Open Source license. So all web developers in the world can use this for free, thank you twitter, my 100 respect for you!

Features

There are many features that help you build responsive website with css bootsrapt :
1. Understanding the CSS stylesheet.
2. Re-usable components.
3. JavaScript components.
4. Easy to use, and etc.

So, to design responsive website (automatic display resizing) you can use CSS Bootsrap, and how to use it? You can follow my articles about CSS Bootstrap in this blog. Enjoy the coffea!




Share your views...

0 Respones to "How to Design Responsive Website (Automatic Display Resizing)"

Post a Comment

NO SPAM PLEASE!

 

©2013 @namakuherman | Developed by Herman Creative Industry