June 26, 2009

Color theory-Basic Level

color and its importance

“One of the most versatile elements of an ad is color. It can attract attention and helps in creating a mood. Depending on the product and the advertising appeal, color can be used for a number of reasons.”

Designs come to life only when we fill it with colors. Color and design always have the strong relationship and they go hand to hand. Color has the great impact on the human behavior and in creating, changing and representing the mood. Color is an attention-getting device with few exceptions people notice a color ad more readily than one in black and white.

Every designer always choose the color that go best with the brand, idea, product and other important features. Every color has a special meaning and associated with the human psychology.

E.g.: -Cool, passive environments are created with blues and pastels, red denotes excitement and warmth and yellow suggests springtime and youth.

Certain products can only be presented realistically in color. Household furnishings, food, many clothing and fashion accessories and cosmetics would lose most of their appeal if advertised in black and white.

Primary Colors

There are three primary colors.All other colors are driven from these primary color.We have the Red, Blue and yellow which are know as the basic or primary color

Complimentary colors

Complimentary colors are those colors which are opposite to the primary colors. These are the colors formed by mixing the primary colors.
eg:- Red-green, Yellow- Violet, Blue- orange

Tertiary Colors

These are the colors formed by mixing a primary and a secondary color. That's why the hue is a two word name, such as blue-green, red-violet, and yellow-orange.
eg:- Yellow-Orange, Red-Orange, Red-Purple, Blue-Purple, Blue-Green and Yellow-Green.

Color what they reflect?

As I said earlier before that color affect the human psychology.So, every color is having its own meaning and every designer should have the good knowledge of the colors and its meaning to make the creative design weather it is print or web.A good sense of color combination can make wonders.So,here are some colors and there meaning

Pink - Softness
Green - Right direction and freshness
Brown – Old
Orange – Future
Violet – Royalty
Blue – Cool, passive environment
Red – Excitement and Warmth
Yellow – Spring time and Youth.

It is just a basic tour to the color theory.I hope it will help you.

Reference websites
color scheme


June 19, 2009

Creative logos using animals and birds

Today I am displaying few logos that have used animals and birds creatively in there logos.

June 16, 2009

Pain with IE - For all designers


This is the nice sketch done by the Robot Johnny representing the pain of all designer with using IE6 from the rough sketch to the final output.Don't miss it.Have a look IE6 Sketch

Must say nice concept and creativity.The best way of representing the pain of all designer all over the world with IE 6.

PS: Catch @ Flickr

June 12, 2009


SEO - Search Engine Optimization is the most important step of every web site. To achieve the good result from the SEO one has to do the SEO job from the starting of the website slicing. How? It's simple but very important too. You can win the half battle of SEO if you will start making your XHTML according to the web crawler. Below are few points that every designer should do while doing XHTML of website.

1) Right and Meaningful Title
Designers should use the title tag properly. Title is the name of the page and every designer should name it properly and very accurate. You can put your keywords too in the title tag to catch the web crawler.

2) Keywords - The Gold Treasure!
The core of the good SEO result in the keywords. Choose the best keywords from the pool of the keywords. Try to get those keywords that is more accurate to your website theme and can get more traffic through the search engine.

3) ALT tag - what is this?
Are you using images? Then NEVER EVER forget to put the ALT tag . ALT tag is the replacement text of the images. So, that when the web crawler is crawling and reaches the images it can read the ALT tag where the description of the images is there. As we all know that Web Crawler just love content and content so the key is that you can put your keywords in alt tags too.

4) Give title tag to links
Yes, you read the right thing. Don't leave your links blank. Just add one title tag in the anchor tag to put your keywords and some little more description of the link in that title tag. The reason is same our Web Crawler.

5) Links,Links and Links
Yes, links are very very useful to catch Web Crawler. Try to put your keywords in the link tag. Look the example:

Put your keyword here

So, replace all "Read more.." or "Find More..." with the keywords.

6) Minimium Flash
Oh ! I love flash...those effects those flashy things but oops!!! Our web crawler hate it as it cannot read it. So, if your aim is the SEO than AVOID flash...use it to the minimal.As, web crawler cannot read the flash and it will be the biggest disadvantage for your website.

7) So many images!!!
Yes, we have ALT tag but that doesn't mean that you will put everything in the ALT tag and make your website full of images. It will make the website heavy and as a result takes lot of time in downloading. Use images but only when require.

8) No Broken Links
Check,check and check again. Always check for the broken images and links. And if you find them, fix them ASAP as web crawler hate broken things.

9) Understand Web Crawler
Yes, go close to web crawler it wont hurt you. Make him your friend and understand his needs..how he walks, what he loves and what he don't and than analyze your XHTML and change it according to the your new friend Web Crawler.

10) Content and Content- Jackpot
Last but not the least.The most important essence of the SEO is the Content. Write original, Accurate and relevant content and see the Magic. Content is the favorite food of web crawler.

June 11, 2009

5 MUST Mozilla add-ons for every Designer

Mozilla Browser gives more than 5000 add–on’s which let us to customize and extend Firefox to meet our needs .There are many add-on's that helps designers to make there work easy, simple to use and to make the things speedy and the best part is they are totally FREE.

Here is the official link of the Mozilla add-ons

Here are the few of the add-on's that are must for every designer
1) Firebug
This is the best add-on ,it is totally MUST to have as it helps designers while browsing they can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.This is the one of the favorite add-on of Mozilla.

2) Web Developer toolbar
Adds a menu and a toolbar with various web developer tools.Containing all the necessary tools that every designer can need from the simple images options to highlighting the DOM structure to display the line guides to validate the CSS and XHTML locally as well as live.So, this one add-on replace many other add-on or plugin.

3) Colorzilla
colorziila gives Advanced Eyedropper, ColorPicker, Page Zoomer and many other colorful goodies.With ColorZilla you can get a color reading from any point in your browser, quickly adjust this color and paste it into another program. You can Zoom the page you are viewing and measure distances between any two points on the page. The built-in palette browser allows choosing colors from pre-defined color sets and saving the most used colors in custom palettes. DOM spying features allow getting various information about DOM elements quickly and easily.

4) Screengrab
Most of the times it happens designers need to take the screen shot of particular website or section for that we have to do print screen and switch to the either Ms Paint or photo shop which becomes time consuming.So,here the Mozilla Screengrab comes for make our job easy. Screengrab will capture what you can see in the window, the entire page, just a selection, a particular frame, basically it saves web pages as images - either to a file, or to the clipboard.

5) Pixel Perfect
When ever designer needs to slice down there PSD into XHTML/CSS the biggest problem came in the spacing and trying to achieve the pixel perfect design through XHTML/CSS. Every time designer needs to measure the space in the photo shop by taking the screen shot.Which is the most frustrating job.Thanks to pixel perfect for making the goal of achieving Pixel Perfect design easy.Pixel Perfect allows web developers and designers to easily overlay a web composition over top of the developed HTML. Pixel Perfect also has an opacity option so that you can view the HTML below the composition. By being able to see both the composition and the HTML you can now simultaneously use Firebug while Pixel Perfect is still in action.

Spread Firefox Affiliate Button

June 10, 2009

Best Photoshop Tutorial website on Web

Tutorial websites are the best help and guide for the all designer all over not only to learn new tricks and effects everyday but also to showcase skills and knowledge.On internet there are many tutorial website from the simple "How to use computer?" to "How to catch mouse?"(LOL...),anyway my point here is to highlight some best of the photo shop tutorial websites that can help every level of designer to learn new things as well as to showcase there skills too.

1) PSD tuts
This is the one of the best website that is publishing great and useful photo shop tutorials from simple effects of text to digital painting in photo shop.One of the worth and useful website for the photo shop lovers.

2) PSD Vibe
If you love to design website than this tutorial website is for you.PSD vibe contains all the useful tutorial that every web designer will need from beginner level to high level.

PS* don't forget to check the freebies section.

3) Tutorial9
This is every young website but promise you to give the best tutorial you can dream.Tutoria9 having every good photo shop tutorial from simple text effects to playing around with images and creating graphics in photo shop.Beside photo shop tutorial it also covers field like web and photography

4) School of Photoshop
This is also the part of the tutorial9.It offers the photoshop tutorial of beginner level absolutely free.The tutorials are easy to understand for newbie and also as per the need of the photoshop newbie.

5) photoshoproadmap
This is the website that I still follow.I learn many tips and tricks from this website and still following and learning.Photoshoproadmap is having thousands of tutorial and very good tutorials for every level you can easily search the tutorial here from the categories.

June 09, 2009

Typography in Designing

Typography plays a vital role in the Print as well as the Web Designing. Good and proper way of presenting Typography helps in boosting the design and also give an attractive look to our simple design.Typography can give simple, sleek look and also funky and grunge look too. But the most important thing is to use it in good and better way.Although most of the web designer complaints that there is only a bunch of hand full web safe fonts only that they can use and put in there website. But if we will try to make those hand full of web-safe font in the more good and presentable way then you will be able to see the difference.

So, here are some guidelines that you can follow to make your dull Typography bright and to boost up your web site.

1) Do not mix too many Fonts
Many designers try to use different types of font in one single home page in order to spice up the page but they forget that too many things can make the page clumsy and cluttered which lead to confusion only.
So, instead of using too many different fonts in single web page try to stick to only 2 fonts. One for headings and one for the body text.By this you are also maintaing the consistency in the design too.

2) Choosing right font-size
This is the one of the very common issue with the web designers.When ever they are declaring the font-size they forget the term “Useability and accessability”.Most of the times the designers don’t follow any pattern and without any thought they randomly declare the links in bigger and bold and rest of the content in 11 px .
But the key is to first see what meesage you want to convey to the users by that particular content and after that decide what is the most important word or phrase in the content.After this,Heading should always be big in size and clear cut..so that it can speak for itself that I am the heading. In body content highlight only those words, links or phrases that you can catch the interest of the user.

3) Right font-color

Whether we are doing designing for web or print we should always follow the terms...“Useability and Accessability”.We should use the font color which is easily readable. Using light font color on light color background would not highlight the text and will not be readable at all. Same in the case if we use the font color that is merging with the background, so always choose the font color that is easily readable and coming out from the background.

4) Alignment

A simple website with good and proper alignment can do wonders in compression to the best design, highly creative but non-aligned website.Aligmeny is the key of the presentation of the design.
Alignment gives the look that the things are well placed rather than just laid off. So try to align each n every thing on the web page with each another and then see the magic of the word “Alignment”

5 )Consistent

Although consistent should be the first key advice to the designer but what I feel is that once you have followed the above 6 rules, the consistency will come by itself.
Consistency in design make wonders and give the user love at first sight with the design.

Typography in Web Design

Hi!! Welcome to my world

Hi frnds,

Welcome to my world,my blog...I am Neha Sharma, web designer from India,New Delhi.I love desiging and playing with XHTMl and CSS.This is my attempt to share my knowledge with all of you and also to learn lotz of things.So,letz start digging the world of creativity and knowledge and enjoy!!

Before moving ahead I would like to say Thanks to many few people who were behind my inspiration of blog and from whom I learn a lot....Smashing Magzine, CSS Tricks, CSS Global, Tutorial9 ,Spoon Graphics and psdtuts.For the inspiration behind my blog is Rames.He is my all time favourtie blogger and he is my inspiration too.So,thanks to all you creative guyz for inspiring me so much.

PS: My blog will keep undergoing the changes.

Enjoy my blog and keep coloring the web!!