The Role of Utility Classes in Scalable CSS | David Clark Develops the Web

Every frontend framework includes some utility classes, but none offer substantial advice about when or why to use them. Considering that any given CSS declaration could be transformed into a utility class, is it possible that every declaration should be? If you can build a component, a page, or a whole site with utility classes alone, should you? (In “Challenging CSS Best Practices”, Thierry Koblentz argues for such an approach: “Atmoic CSS,” he calls it.) If not, where do we draw the line; how do we determine if we’ve gone too far? Can reliance on utility classes hurt maintainability? The mind swims.

via The Role of Utility Classes in Scalable CSS | David Clark Develops the Web.

Rotating text with CSS

Many of the browsers support the ability to rotate the text I found but most of all the CSS tricks are really sucks in Opera 😦 even the IE6 support it *god* after i find the site (but this sucks in IE6, I don’t support IE6 but still a some percentages of people using this “Jambavan” Browser) I found an another technique to rotate works in all major browsers

-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
overflow: visible;
-moz-transform: rotate(90deg);
-moz-rotation-point: 0 0;
-webkit-transform: rotate(90deg);
-webkit-rotation-point: 0 0;
-o-transform: rotate(270deg);

Support IE8,7,5 FF, Opera, Chrome, Safari
this will work in all major browsers with some minor spacing issue,

and an another option is forget about the IE6 and let him die

and use this

overflow: visible;
position: absolute;
width: 38px;
-moz-transform: rotate(90deg);
-moz-rotation-point: 0 0;
-webkit-transform: rotate(90deg);
-webkit-rotation-point: 0 0;
-o-transform: rotate(90deg);
-ms-writing-mode: tb-lr;
* html writing-mode: tb-lr;

Why Prefer WordPress over Blogger

I started my first blog with in blogger on 2007 January.  I stuck with “blogger” for quite some time but eventually I switched over to wordpress.  I am much happier with wordpress and whenever I meet a new blogger or someone thinking of starting up a blog  or want to move to wordpress from any blog blog platform (like Blogger, Blogroll, Israblog, etc.) without losing any your posts, comments, and even post Dates also, I tell them why I prefer wordpress.

There are so many options with wordpress to give your blog the look you desire!  It’s also super easy to change your theme anytime you want with just a click of a button.

WordPress is really great and they pretty much make it “idiot proof” for somone who wants to start up a blog of their own.  Some options take time and patience to figure out but like I always tell the potential blogger, “If I can figure it out, anyone can!”

Some people like to keep their blogs open for anyone to comment but I think that’s about as intelligent as no house in the village has doors, only door frames in  the Shingnapur village in the Indian state of Maharashtra 🙂 Villagers never keep their valuables under lock and key. haha! What I LOVE about wordpress is that you can leave it open to anyone but you can have a secret list of words that if anyone puts any of them in their comments, the message is automatically held back from being posting until you “moderate it” and click “accept it”.  Awesome option!

If you already have a blogspot blog don’t worry you can import all the posts, images and comments by using the WordPress Import feature. The automated process also has import functions for LiveJournal, Movable Type and TypePad, Yahoo! 360, Posterous, Blogli, Israblog,, or another WordPress blog hosted elsewhere.

I’ve used this process for Blogger but not the others. Although all the posts and comments get transferred, widgets in the sidebar are ignored. You would have to re-create those from scratch. Blogger ‘Labels’ are preserved as WordPress ‘Categories’.

To start the process go to the WordPress admin area and choose
Tools > Import. Then choose which blogging system you want to import from.

and enjoy… have a happy blogging 🙂

Color Psychology -Do different colors affect your mood?

Like death and taxes, there is no escaping color It is ubiquitous. Yet what does it all mean? Why are people more relaxed in green rooms? Why do weightlifters do their best in blue gyms?

Colors often have different meanings in various cultures. And even in Western societies, the meanings of various colors have changed over the years. But today in the U.S., researchers have generally found the following to be accurate.


Black is the color of authority and power. It is popular in fashion because it makes people appear thinner. It is also stylish and timeless. Black also implies submission. Priests wear black to signify submission to God. Some fashion experts say a woman wearing black implies submission to men. Black outfits can also be overpowering, or make the wearer seem aloof or evil. Villains, such as Dracula, often wear black.


Brides wear white to symbolize innocence and purity. White reflects light and is considered a summer color. White is popular in decorating and in fashion because it is light, neutral, and goes with everything. However, white shows dirt and is therefore more difficult to keep clean than other colors. Doctors and nurses wear white to imply sterility.


The most emotionally intense color, red stimulates a faster heartbeat and breathing. It is also the color of love. Red clothing gets noticed and makes the wearer appear heavier. Since it is an extreme color, red clothing might not help people in negotiations or confrontations. Red cars are popular targets for thieves. In decorating, red is usually used as an accent. Decorators say that red furniture should be perfect since it will attract attention.

The most romantic color, pink, is more tranquilizing. Sports teams sometimes paint the locker rooms used by opposing teams bright pink so their opponents will lose energy.


The color of the sky and the ocean, blue is one of the most popular colors. It causes the opposite reaction as red. Peaceful, tranquil blue causes the body to produce calming chemicals, so it is often used in bedrooms. Blue can also be cold and depressing. Fashion consultants recommend wearing blue to job interviews because it symbolizes loyalty. People are more productive in blue rooms. Studies show weightlifters are able to handle heavier weights in blue gyms.


Currently the most popular decorating color, green symbolizes nature. It is the easiest color on the eye and can improve vision. It is a calming, refreshing color. People waiting to appear on TV sit in “green rooms” to relax. Hospitals often use green because it relaxes patients. Brides in the Middle Ages wore green to symbolize fertility. Dark green is masculine, conservative, and implies wealth. However, seamstresses often refuse to use green thread on the eve of a fashion show for fear it will bring bad luck.


Cheerful sunny yellow is an attention getter. While it is considered an optimistic color, people lose their tempers more often in yellow rooms, and babies will cry more. It is the most difficult color for the eye to take in, so it can be overpowering if overused. Yellow enhances concentration, hence its use for legal pads. It also speeds metabolism.


The color of royalty, purple connotes luxury, wealth, and sophistication. It is also feminine and romantic. However, because it is rare in nature, purple can appear artificial.


Solid, reliable brown is the color of earth and is abundant in nature. Light brown implies genuineness while dark brown is similar to wood or leather. Brown can also be sad and wistful. Men are more apt to say brown is one of their favorite colors.

Graphic Design Branding

To create a “brand” for a company is to create their image, and to promote that image with campaigns and visuals. Working in branding allows a graphic designer or design firm to get involved with many aspects of the industry, from logo design to advertising to copywriting and slogans. The goal of a brand is to make a company unique and recognizable, and to project a desired image. Over time, a brand can make a company a household name, and identifiable by a simple shape or color. To create a brand for a company, a designer needs to fully understand the goals of the organization, the industry as a whole, and working with design to create the appropriate materials to represent that company.

Type of Work

When working in branding, a designer can expect to work in:

  • Logo design
  • Business card design
  • Letterhead design
  • Packaging
  • Copywriting
  • Writing slogans
  • Advertising design
  • Typeface design
  • Research
  • Marketing

Examples of Branding
Examples of branding are all around us. The NBC peacock, the UPS brown truck and Nike’s “just do it” are some of the most famous examples. They are so recognizable that we don’t need to hear a company name to know what they are. Online brands such as MySpace, Facebook and YouTube are more recently developed but now just as recognizable. Logos on your favorite products, the packaging they come in, and the slogans that represent them are all examples of branding.

Alignment – The Design Principle

The principle of alignment is just as seemingly simple as some of the other ones, almost defying the need for definition. And yet, when reflecting on the basic principles one can learn from the simplest of ideas and be reminded of their importance. This process of relearning the basics really helps to refresh our minds and focus us on the basic underlying elements which create great design.

Alignment is quite simply the arrangement of elements in such a way so that the natural lines (borders) created by them match up as closely as possible. By doing so these elements become unified and form a greater whole. With out being aligned these elements tend to fall apart and lack the unification we so often seek out. A perfect example of this is having the tops of two columns line up, or the left edges of a series of stacked elements align with each other. When examined carefully, well aligned pages can present rather complex interactions among the elements of the page.

The primary reason to focus on alignment is for unification. Often times a page which somehow doesn’t feel very sharp simply lacks alignment. Sometimes I get so focused on each section of a page, the header, content and footer, that I forget to look at how they interact in terms of alignment.

Those charged with the task of taking designs and turning them into code should be particularly aware of this principle. As a design is translated into reality it often becomes more tedious and difficult to replicate the alignments established in the original design. Not only is it tedious, but it is often easy to not even notice and perhaps forget about. As developers an awareness of design on this level can really help in the translation process.

The Latest Logo Design Trends

Stationery like business brochures and flyers with logo designs are all important parts of any marketing campaign. However, to maintain uniformity with different types of stationery, it is necessary to use the same logo design in everything that keeps up with the latest trends. , Waves are a famous concept for logo designs today for companies that wish to project quick thinking and rapid movement. The design may not be solely of waves, but its incorporation to create a positive image to customers.* An effective part of logos today is transparency where the customers see the logo, and not necessarily through it. This logo design is beneficial as it can quickly adapt to include other designs and is great for drawing attention from customers. However, too much does depict amateur work. * A very popular logo design of today is Web 2.0 which is a trend where WWW technology is used for coining up creative, innovative and trendy logos. Though this is basically a trend, its popularity has increased tremendously over the years that Web 2.0 is now considered to be trendy idea for logos.

1. Using 3D images in logos has been rather difficult for designers over the years as making them look the same on computer monitors as they do on paper is not an easy task. This is why designers are now adopting organic 3D designs for logos. This concept emphasizes on making images look alive and original, without being overly intensive. Today, this design has become very popular and effective for use in creating effective logos.

3. Sci-fi fonts are used extensively in logo designs to get the right message in through the logo. These fonts basically have straight edges and simple shapes; while some designers tend to make changes on these fonts to create new designs. Once thought to be a passing font, it looks like this font is set to put its foot down in the world of design.

4.  Using color scales or rainbows is another popular concept in logos, because of the long lasting fascination people have over the rainbow. These colors are used in various ways by designers like perhaps use of vivid colors and shifting of shades between colors in a large spectrum of color while using a black background to highlight colors. These logos are best used to depict technology, sophistication and freshness.

5.  Leaves are also the latest additions in trendy logo designs which is why you see them used everywhere. In fact, leaves are also used in logos for companies that are not engaged with nature or environment as because leaves depict originality, creativity and innovative thinking. These logos are usually simple but catchy to attract anyone’s attention.

Though these are the main logo design trends running its rounds, there are quite a few more designs you can consider for implementing in your logo. The secret lies in choosing a logo design that is not only catchy and to the mark, but should convey the right message about the company to the consumer.

5 Great Website Traffic Monitoring Methods

Having a portfolio website is an essential aspect of many designers lives, and optimizing and monitoring your site will benefit you in many ways. If you are seeking freelance work and more recognition then yo will need a to use one or several of these website traffic monitoring methods.

These program will allow you to monitor many different stats such as total visitors, unique visitors, page views, browsers used, location of users, keywords used to find your site, sites that linked to you and much, much more.

All this information is key to growing ones website and freelance career. Most of these programs are very easy to use and install, some are free and the paid ones are still affordable and have great additional features. If you are going to use one or more of these programs, I would recommend at least setting up Google Analytics.

1. Google Analytics

Google Analytics is the industry standard when it comes to website traffic monitoring. It is incredibly easy to set up and will start collecting data soon after you implement it. You can track everything you could dream of with Google Analytics and if you are going to use any stat monitoring program, be sure to use this one!

Read More About Google Analytics

2. AWStats

This is another free way to track a good amount of your server’s stats. Its not as in depth as Google Analytics, but it is free and comes with most web hosting packages so ask your hosting provider how to get this working!

Read More About AWStats

3. Mint

Mint is a cool new way to track stats. It costs money to buy but has cool “peppers” that you can add to the program to show more types of stats. People develop these peppers and then you download and install them on your account. Mint takes a bit more work to set up, but the cool part is there is a desktop widget available for Mac users which can allow you to access your stats with the click of a button!

Read More About Mint

4. Clicky

Clicky is known as the web 2.0 stat monitoring program and has a sleek and clean interface combined with powerful features. Its easy to use and will provide you with all the stats you could possibly dream of, in real time.

Read More About Clicky

5. Site Meter

Site Meter is another popular choice for webmasters. It tracks all kinds of information in real time so you will have a solid idea of who is visiting your site, how they found you, where they came from, what interests them and so on.

Read More About Site Meter

What website traffic monitoring methods do you use? let us know which are your favorites in the comments and how they help you run your portfolio site!