Bootstrap 3 Introduced This Week Expediting the Development of Responsive Websites

Bootstrap, the wildly popular front-end framework for web development, launched version 3 this week, promising to make it easier to develop responsive websites that look great whether viewed on a phone, tablet or desktop screen.

For web developers familiar with Bootstrap, version 3 is a fairly major change. They’ve totally revamped the grid system and gone all-responsive. The fixed grid is gone, replaced with four new grids for phones, tablets, desktops and large desktop screens, enabling a seemingly endless variety of layout possibilities as your screen size scales up or down.

Bootstrap 3 has also jumped on the “flat design” bandwagon with a new look and feel for its buttons, navbars and other components. They’ve jettisoned support for the problematic IE7 and Firefox 3.6 as well.

Bootstrap has only been around for two years and originally started as an internal project at Twitter by Mark Otto (@mdo) and Jacob Thornton (@fat), who have since left the social media giant. It has rocketed in popularity to become the most watched/forked open source project on Github. If you’ve visited any “modern” looking responsive websites lately, chances are decent that you’ve been to a site built with Bootstrap. Meanpath actually measured that 1% of the 150 million websites they index use the framework.

Bootstrap has its detractors, many of which lament the “sameness” that it spreads across the web when folks don’t customize it. However, it is hard to deny its utility, and it’s not that hard to customize it to stand out from the crowd.

In a fit of frustration (and cheapness) in trying to find a new web developer, I adopted it for ourreal estate site and ended up being able to do a bunch of web design independently. The last thing I had time for was worrying about CSS for a responsive grid, media queries, breakpoints, menu bars, etc. Looking forward to trying out version 3 for some better layout options for small screens, but unfortunately, this launch has just burned a few of my weekends.

You can check out the latest version at getbootstrap.com.

http://www.geekwire.com/2013/bootstrap-3-launches-easing-development-responsive-websites/
.

Great Tips on Producing a Mobile -Friendly Website

Businesses need to realize that a mobile friendly website is a must to promote their products or services. The trend to mobile devices for consumer usage is high. Web developers need to be ready to update existing website to be mobile friendly. Mobdev has some very helpful tips for developers in this process.



1) Make sure mobile users are automatically redirected to the mobile version of your website.

2) Choose the foremost information to include: direct means of communication (e.g. phone numbers, click-to-call function, online booking); main information about services; locations on a map. Longer bios and other texts of secondary importance should be left solely for a desktop website. Include only the things your visitors are most likely to look for.

3) Remember that the user must access the needed pages as quickly as possible, with minimum actions. That's why the fewer pages stand between the user and the action he/she wants to accomplish, the better. To navigate through the website, the buttons should have enough space to prevent users from tapping the wrong button, or trying to hit a minuscule button to make it work.

4) While reducing the number of pages, avoid placing too much information per page. This will inevitably make navigation aggravating, which is by no means acceptable. Make sure that the design allows users to tap and swipe around your website easily. You should also avoid excessive number of images, avoid popups and Flash.

5) Avoid too much text input for users. Typing too much is not a very convenient option on a smartphone.

6) Essentially include the branding elements of your desktop site (e.g. logo, design style or colors) into the mobile website. It may seem a natural decision, but one must think how to do it in the best way to make the mobile site as recognizable as the desktop one.

7) Keep in sight a link to the desktop website. Many visitors may want to proceed there for the information that is left out in the mobile version.

8) Check how your website works on a number of mobile devices: smartphones and tablets running various platforms. Screen size is a crucial issue in any branch of mobile development.

http://www.pr.com/press-release/479670