Archive for December, 2009

On Monday past we published the post 49 Most Creative Photoshop Tutorials of 2009, a collection of the best artistic tutorials for Photoshop from this year. As a follow up to that post, today we have The Best 40 Photoshop Text Effects from 2009, a collection of diverse and unique effects and type treatments that will add a little extra to your next design.

You might also like…

There are many elements of blogging that are essential, the most important is the ability to share your posts and information with a wider audience, and we accomplish this via the many social bookmarking services (digg, delicious, twitter…) that are available. Finding a bookmarking iconset that fits into your theme can be difficult or maybe you don’t want the boring or the bland, but you want an iconset that has been designed by a high quality designer and has something distinctive and original. Below you will find such iconsets.

The demand for development icons is huge, and thankfully this year has been a fairly productive year with new icon sets being freely released every other week. As you will see from the list below, they are all of high quality, some do have more flexibility than the others, and some do have limited numbers and options, but all are beautifully designed.
Anyway, all of the icons I have listed below have been designed specifically for web design, web development, web applications and blogging. And I am sure you will agree, they are amazing.

This icon pack comes packaged with 108 gray icons that can be easily customized within Photoshop and Fireworks. This Icon Pack ican be used in your personal and commercial projects, and can be used without attribution.

This free set includes 20 icons that you can use for both personal and commercial projects. Resell and distribution is not allowed. The icons are available in three different sizes: 16px, 32px, and 64px in 32-bits transparent.png format.

There are 25 scalable .aiformat icons in this set, which can be opened with any version above Illustrator 8.0. With earlier versions, you may loose some of the effects.
This set is licenced under Creative Commons License.

The package includes 30.png menu icons plus the additional source files for further customization.
All icons are distributed under a Creative Commons Attribution Share Alike license, so feel free to use them in any form in you projects or even remix them.

The icons are free for personal and commercial use, but the designers do require linking to there web site. The package contains 59 icons, available in four different sizes and are available in Windows, MAC and .png format.

The icons are available in.png, .icon and .icnsformat. They are free to use for both personal and commercial projects, including websites, templates and software. In total there are 100 icons at 64×64px.

There are 128 unique icons for apps, folders, settings, and the desktop. Each icon has two color variants, dark and light and each icon is available as a 128×128 .png or as a Windows .icon. There is also a .psd file included in the set for easy customization.

These iPhone UI icons are 24-bit .png images used as a mask to generate selected and unselected button states. Dimensions should be about 30×30 pixels for tab bar icons and about 20×20 pixels for toolbar and navigation icons.

All icons are completely free for both personal and commercial use. The icons are available in 4 different sizes (32×32 pixels, 48×48 pixels, 64×64 pixel, and 96×96 pixels) and come as 32-bit transparent .pngfiles. The icons are also available in vector format.

There are over 450 icons in this amazing set. The files are transparent .pngs, and the source files (.psd) are also available for download. The set is completely free and may be used for any private or commercial project without any restrictions whatsoever.

This is the fifth part of the Coquette free icon series. The icon set contains 50 high quality, free icons in these sizes: 16×16px, 32×32px, 48×48px, 64×64px and 128×128px and 32-bit transparency.png file format.

The icons are available in 5 different sizes (16×16px, 24×24px, 32×32px, 48×48px and 128×128px) and come as Windows ICO and 32-bit transparent .pngfiles. The icons are also available in vector format (Adobe Illustrator AI format).

The icon set includes 16 flags in two differenct style, normal style and rotated style. The raster icons come in three different sizes (32 pixels, 64 pixels and 128 pixels) and in 32-bit transparent .pngformat. Also the vector source file is included in the free set (Adobe Illustrator CS4 .ai format). The set is completely free for both personal and commercial use.

This set contains 20 icons for popular payment methods such as MasterCard, PayPal, Visa, American Express, Diner’s Club and much more… All icons are in .png format and come in three different sizes: big (130×80), small (80×49) and tiny (50×31).

Each icon in this set are in.png format and are supplied in 128px, 64px and 32px heights. There are two versions of each icon, one with curved edges (on a transparent background) and one with straight edges.

The RRZE (Regional Computing Centre Erlangen) has created a new icon set based on the Tango Desktop Project, which consists of an extensive and very uniformly created icon set. It focuses on Identity Management Systems, especially on user administration.
The RRZE Icon Set is licenced under a Creative Commons Licence.

Using illustration in web design gives the designer the opportunity to convey there own personal and unique style, and be able to say “this site is mine, and look what I can do”. Very few web design styles give an artist this opportunity.

What makes the examples below stand out are not just the beautiful illustrative art work nor the carefully crafted web designs, it is the balance between the two that distinguishes them from the rest. They all manage to be unique in there own right, by highlighting the illustration with carefully positioned content. And when this is a achieved successfully, the effect is amazing and memorable.

In a day in age where there are just as many freelancers as there are university educated designers, developers, and all around web gurus, it is amazing to me how much many of us don’t know or have forgot about our trade. As a self-taught designer, I will admit to you upfront that there is a lot I don’t know when it comes to official jargon or certain aspects of things like typography and graphic design. It is these reasons that I call upon glossaries from time to time.

These glossaries are also especially useful for those of you who are just getting started in the online business world. By understanding that basics of the core materials that make up whatever it is you are getting into, you will be able to have a better understanding of what’s going on in your industry, as well as be able to learn faster.

But glossaries aren’t just for brushing up on old terms or for calling upon while you learn new things. They can also make a great reference point for your customers. I am sure we have all had clients who thought they knew what they were talking about when it came to SEO or web design. When you try to explain to these clients that they don’t know what they are talking about, the end result can sometimes turn ugly or at least bring on an unwanted headache. In these situations it is handy to have a glossary at hand to point your clients to. This way they can see that they were mistaken and you get the satisfaction of your own personal “I told you so.”

Last week we presented Web Design Industry Jargon: Glossary and Resources, a general guide to industry terms that should get you well on your way to understanding what web designers are talking about. In this post we go into detail in each single area of web design such as typography, usability, marketing, Photoshop, wordpress, graphic design, CSS, XHTML, DOM, JavaScript, print design, SEO, social media, software development, Twitter and further areas.

Typography Glossaries

You would be surprised how many designers, especially graphic designers, out there don’t know even the most basic of typography terms. I am guilty of this myself. I could probably count the number of typography terms that I know on two hands. I couldn’t tell you what makes one font better than the other aside from the way it looks. If you find yourself in this boat and want to learn more about the basics of typography, these glossaries are a good place to start.

Usability, UX and IA Glossaries

Do yourself a favor and start learning as much as you can about usability and design. You would be surprised how much of a difference a user-friendly landing page can make. Simple things like button shapes, call to action wording, and colors can play a big part in how users interact with your design. Understanding the basics of usability can help you create better designs. Start by learning the basic terms in these glossaries.

Marketing Glossaries

Following closely on the heals of good usability is understanding marketing. I wouldn’t go so far as to say they are one in the same, but they are definitely closely related. Better understanding how marketing works can do loads for your business and your clients business. Start educating your self by studying up on some of the more basic marketing terms. Or if you are already pretty market savvy, but want to brush up, there are a number of more “advanced” glossaries below as well.

CSS, (X)HTML, DOM and JavaScript Glossaries

As designers and coders, we often need to look up the definition and the applying rules for an attribute, selector, tree node, a property or a HTML-tag. Therefore lookup-references may come in handy. Good news – there are many reference resources out there. Below you’ll find some really good ones.

Graphic Design Glossaries

Perhaps it is because many designers are self taught that they only have a limited understanding of professional graphic design terms. Sure, we all know what cropping and justifying are, but there are so many other terms out there that many of us don’t know. While we can probably get away with never knowing them, it can’t hurt to learn. This is especially true for new designers. Why not go ahead and learn these terms early on while you are still in the learning process?

Print Design Glossaries

The transition from print design, with its absolute positioning, fixed layouts and grid-structure to more dynamic and flexible web design isn’t an easy task. Therefore if your colleague is just doing the switch from print design to web design, you may need to be able to communicate with him in “his” or “her” language. Therefore general terms from print design may come in handy as well. Do you know what “4 over K”, “semi-gloss finish” or “column rule” mean? OK, let’s dive into the classic print design terms.

Web Design Glossaries

I would think that many professional and full time designers and developers already know just about every term in these web design glossaries. However, I know that when first venturing into web design, many of the terms associated with the industry can be a bit foreign. Thus, I decided to add this collection of web design glossaries to the list for those who are getting into web design and developing and could use a little extra help figuring out what everything means.

SEO Glossaries

Try to do some search engine optimization for your website or your clients? Knowing what you are talking about is always a good idea, for both you and your client. So often clients want some search engine optimization done, but really have no clue what they are asking for or what you are saying. Referring them to some of the search engine optimization glossaries below can do wonders to save you and your client a world of headaches when it comes to SEO work.

Social Media

Because it seems like something new is always popping up on the social media scene, it is only natural that there may be terms we aren’t familiar with from time to time. This is especially true for those who are just venturing into online business and social media for the first time. This also goes back to the comments I made about SEO terms. You can save you and your clients some frustrations by making sure you are both on the same page by understanding what each other is talking about. Using these glossaries to explain yourself better to a client will work wonders in keeping you two on the same page.

Twitter Glossaries

You had to know this list of glossaries was coming! With so much going on in the world today about Twitter, it is only natural that new Twitter users are popping up every day. When one first gets into Twitter the list of associated terminology can be very much like foreign language. For outsiders looking in, I think that is very much the case. I think my local news station needs to read up on these, as every time they talk about Twitter they look deeply confused about the words that are coming out of their mouth.

CMS Glossaries

WordPress, Joomla, Textpattern and other CMS have a lot of its own and unique terms, tags and definitions. Because many people who run blogs don’t know the first things about servers, PHP, or even WordPress for that matter; it can be a bit intimidating. But, as many CMS users know, there isn’t much to it once you know how everything works. The glossaries below can help both developers and new users to WordPress, Joomla and TextPattern.

Software Development

While most web designers do both front-end and back-end-development in their regular work, it may be helpful to have a good understanding not only of front-end (covered above), but also of common software development. A glossary with terms used in agile development, software engineering, prototyping and general software development. Apart from that you may want to understand what your colleagues-coders in Python, Ruby on Rails or Java talk about when throwing around fancy programming terms, right?

Something is missing?

We definitely missed some useful glossaries in this list. Please help us make this list as universal and useful as possible. Please share useful resources with us in the comments to this post! All comments will be considered and useful resources will be added to the post. Thank you.

Unlike raster-based images, vector images are infinitely scalable. From the photo-realistic to the abstract, vector art is as varied as any other medium of expression. The artist featured here have taken their craft to the next level with these inspirational images. In this inspirational post we present 35 beautiful vector illustrations that will certainly inspire you. Do you have further suggestions for beautiful vector illustrations or just some nice ideas for next inspirational posts? Let us know in the comments to this post!

Last Click

We all make mistakes running our websites. However, the nature of those mistakes varies depending on the size of your company. As your organization grows, the mistakes change. This post addresses common mistakes among large organizations.

Most of the clients I work with are large organizations: universities, large charities, public sector institutions and large companies. Over the last 7 years, I have noticed certain recurring misconceptions among these organizations. This post aims to dispel these illusions and encourage people to face the harsh reality.

The problem is that if you are reading this post, you are probably already aware of these things. But hopefully this article will be helpful to you as you convince others within your organization. In any case, here are our 10 harsh truths about websites of large organizations.

1. You Need A Separate Web Division

In many organizations, the website is managed by either the marketing or IT department. However, this inevitably leads to a turf war, with the website becoming the victim of internal politics.

In reality, pursuing a Web strategy is not particularly suited to either group. IT may be excellent at rolling out complex systems, but it is not suited to developing a friendly user experience or establishing an online brand.

The Web is a conversation. Marketing, by contrast, is a monologue… And then there’s all that messy business with semantic markup, CSS, unobtrusive scripting, card-sorting exercises, HTML run-throughs, involving users in accessibility, and the rest of the skills and experience that don’t fall under Marketing’s purview.

Instead, the website should be managed by a single unified team. Again, Zeldman sums it up when he writes:

Put them in a division that recognizes that your website is not a bastard of your brochures, nor a natural outgrowth of your group calendar. Let there be Web divisions.

2. Managing Your Website Is A Full-Time Job

Not only is the website often split between marketing and IT, it is also usually under-resourced. Instead of there being a dedicated Web team, those responsible for the website are often expected to run it alongside their “day job.” When a Web team is in place, it is often over-stretched. The vast majority of its time is spent on day-to-day maintenance rather than longer-term strategic thinking.

This situation is further aggravated by the fact that the people hired to “maintain” the website are junior members of the staff. They do not have the experience or authority to push the website forward. It is time for organizations to seriously invest in their websites by hiring full-time senior Web managers to move their Web strategies forward.

3. Periodic Redesign Is Not Enough

Because corporate websites are under-resourced, they are often neglected for long periods of time. They slowly become out of date with their content, design and technology.

Eventually, the website becomes such an embarrassment that management steps in and demands that it be sorted. This inevitably leads to a complete redesign at considerable expense. As I point out in theWebsite Owners Manual, this a flawed approach. It is a waste of money because when the old website is replaced, the investment put into it is lost, too. It is also tough on finances, with a large expenditure having to be made every few years.

Cameron Moll encourages web designers to realign their website rather than redesign.

A better way is continual investment in your website, allowing it to evolve over time. Not only is this less wasteful, it is also better for users, as pointed out by Cameron Moll in his post Good Designers Redesign, Great Designers Realign.

4. Your Website Cannot Appeal To Everyone

One of the first questions I ask a client is, “Who is your target audience?” I am regularly shocked at the length of the reply. Too often, it includes a long and detailed list of diverse people. Inevitably, my next question is, “Which of those many demographic groups are most important?” Depressingly, the answer is usually that they are all equally important.

The harsh truth is that if you build a website for everyone, it will appeal to no one. It is important to be extremely focused about your audience and cater your design and content to it. Does this mean you should ignore your other users? Not at all. Your website should be accessible by all and not offend or exclude anybody. However, the website does need to be primarily aimed at a clearly defined audience.

5. You Are Wasting Money On Social Networking

I find it encouraging that website managers increasingly recognize that a Web strategy is more than running a website. They are beginning to use tools such as Twitter, Facebook and YouTube to increase their reach and engage with new audiences. However, although they are using these tools, too often they do so ineffectively. Tweeting on a corporate account or posting sales demonstrations on YouTube misses the essence of social networking.

Microsoft dramatically improved its image amoung the development community by allowing Microsoft staff to speak out via the Channel 9 website.

Social networking is about people engaging with people. Individuals do not want to build relationships with brands and corporations. They want to talk to other people. Too many organizations throw millions into Facebook apps and viral videos when they could spend that money on engaging with people in a transparent and open away.

Instead of creating a corporate Twitter account or indeed even a corporate blog, encourage your employees to start Tweeting and blogging themselves. Provide guidelines on acceptable behavior and what tools they need to start engaging directly with the community connected to your products and services. This demonstrates not only your commitment to the community but also the human side of your business.

6. Your Website Is Not All About You

Where some website managers want their website to appeal to everybody, others want it to appeal to themselves and their colleagues. A surprising number of organizations ignore their users entirely and base their websites entirely on an organizational perspective. This typically manifests itself in inappropriate design that caters to the managing director’s personal preferences and contains content full of jargon.

A website should not pander to the preferences of staff but should rather meet the needs of its users. Too many designs are rejected because the boss “doesn’t like green.” Likewise, too much website copy contains acronyms and terms used only within the organization.

7. You’re Not Getting Value From Your Web Team

Whether they have an in-house Web team or use an external agency, many organizations fail to get the most from their Web designers. Web designers are much more than pixel pushers. They have a wealth of knowledge about the Web and how users interact with it. They also understand design techniques, including grid systems, white space, color theory and much more.

Treating designers as pixel pushers wastes their design experience: post from Twitter complaining about being a pixel pusher

It is therefore wasteful to micro-manage by asking them to “make the logo bigger” or to “move that 3 pixels to the left.” By doing so, you are reducing their role to that of a software operator and wasting the wealth of experience they bring.

If you want to get the maximum return on your Web team, present it with problems, not solutions. For example, if you’re targeting your website at teenage girls, and the designer goes for corporate blue, suggest that your audience might not respond well to that color. Do not tell him or her to change it to pink. This way, the designer has the freedom to find a solution that may even be better than your choice. You allow your designer to solve the problem you have presented.

8. Design By Committee Brings Death

The ultimate symbol of a large organization’s approach to website management is the committee. A committee is often formed to tackle the website because internal politics demand that everybody has a say and all considerations be taken into account. To say that all committees are a bad idea is naive, and to suggest that a large corporate website could be developed without consultation is fanciful. However, when it comes to design, committees are often the kiss of death.

Design by committee leads to design on the fly.

Design is subjective. The way we respond to a design can be influenced by culture, gender, age, childhood experience and even physical conditions (such as color blindness). What one person considers great design could be hated by another. This is why it is so important that design decisions be informed by user testing rather than personal experience. Unfortunately, this approach is rarely taken when a committee is involved in design decisions.

Instead, designing by committee becomes about compromise. Because committee members have different opinions about the design, they look for ways to find common ground. One person hates the blue color scheme, while another loves it. This leads to designing on the fly, with the committee instructing the designer to “try a different blue” in the hopes of finding middle ground. Unfortunately, this leads only to bland design that neither appeals to nor excites anyone.

9. A CMS Is Not A Silver Bullet

Many of the clients I work with have amazingly unrealistic expectations of CMS (content management systems). Those without one think it will solve all of their content woes, while those who have one moan about it because it hasn’t!

It is certainly true that a CMS can bring a lot of benefits. These include:

reducing the technical barriers of adding content,

allowing more people to add and edit content,

facilitating faster updates,

and allowing greater control.

However, many CMS are less flexible than their owners would like. They fail to meet the changing demands of the websites they manage. Website managers also complain that their CMS is hard to use. However, in many cases, this is because those using it have not been adequately trained or are not using it regularly enough.

Finally, a CMS may allow content to be easily updated, but it does not ensure that content will be updated or even that the quality of content will be acceptable. Many CMS-based websites still have out-of-date content or poorly written copy. This is because internal processes have not been put in place to support the content contributors.

If you look to a CMS to solve your website maintenance issues, you will be disappointed.

10. You Have Too Much Content

Part of the problem with content maintenance on large corporate websites is that there is too much content in the first place. Most of these websites have “evolved” over years, with more and more content having been added. At no stage has anybody reviewed the content and asked what could be taken away.

Many website managers fill their website with copy that nobody will read. This happens because of:

A fear of missing something: by putting everything online, they believe users will be able to find whatever they want. Unfortunately, with so much information available, it is hard to find anything.

A fear users will not understand: whether from a lack of confidence in their website or in their audience, they feel the need to provide endless instruction to users. Unfortunately, users never read this copy.

A desperate desire to convince: they are desperate to sell their product or communicate their message, and so they bloat the text with sales copy that actually conveys little valuable information.

Steve Krug, in his book Don’t Make Me Think, encourages website managers to “Get rid of half the words on each page, then get rid of half of what’s left.” This will reduce the noise level on each page and make the useful content more prominent.

Conclusions

Large organizations do a lot right in running their websites. However, they also face some unique challenges that can lead to painful mistakes. Resolving these problems means accepting that mistakes have been made, overcoming internal politics and changing the way you control your brand. Doing so will give you a significant competitive advantage and allow your Web strategy to become more effective over the long term.