At the PHP Meetup, we discussed using Bootstrap to build a web app. Here are my notes from Bootstrap 101.

4 Basic Principles of Design

Developers who create web apps should be familiar with the 4 basic principles of design: Proximity, Alignment, Repetition and Contrast.

Proximity

The way elements are grouped together to create a sense of unity

Alignment

Place items in relation to other items; do not place them arbitrarily.
Grid Theory
- Use the Golden Ratio (Divine Proportion)
- Remember the Rule of Thirds You want to place elements in spots where a person is naturally drawn to.
- Use tools like a 12 Column Grid or gridulator.com which makes grids for you

Repetition

Use elements repeatedly in your web app. Users expect consistency in your design.

Contrast

When 2 items are different, they should compliment each other and not conflict. When you do, you have contrast. Such as when you use white text on a black background.

Use Bootstrap to speed up your development

Computer with code Why use Bootstrap? Bootstrap is a front-end framework. It uses CSS and JavaScript. Bootstrap is cross browser and cleans up CSS by using Normalize. CSS is built using LESS. It helps you to speed up web development. You can make good looking apps quickly. Since you can use Bootstrap to build your front-end quickly, you may be tempted to use the defaults. Don’t. You can modify Bootstrap quickly and effectively.

Have you used Bootstrap to build web app?

Computer Coding What is a web app? A web app is an application that uses a web browser and technologies to collect data from a user, do something with the data and then return the results to the user. Some websites are web apps, but not all websites are web apps.

Websites and web apps use some of the same web technologies: HTML, CSS and JavaScript. Many web apps use a database to store and interact with user data. When you build your first or next web app, consider the following tips:

Tips for Building Your First Web App has a list of general tips that both beginners and seasoned developers need to remember when build a web app. Your web app should focus on the data relationship. What data do you take in, how is it presented to your users and what features does it have.
You need to design a good looking web app. Bootstrap is one tool that you can use. Developers can quickly design a web app without having to be a designer too. Vandelay Design has gathered 13 resources to help you design your web app with Bootstrap.
You want your web app to be used by people no matter where they are or how they access it. To do this, your web app must be responsive. Use these tips to make your web app responsive.

Thoughts on programming, web development and design.

Month: July 2013

Bootstrap 101 for Developers