You don’t like working for others and wish others worked for you? Are you also attracted to the idea of working with lots of people and multiple personalities? Then going for your own design company is something you might want to look into.

Starting a web design business might seem something anybody can do, but is definitely a difficult task. Note that this discussion is purely theoretical, if you wish to read a real opinion, then find someone who owns such a company and ask him how it was in the beginning.

The difficult part about starting your own company is that you need to be patient – the good stuff comes to those who wait. It is a long-term commitment and results might not come right away. Actually, it might be a bumpy ride up until the results come; or worse, they might not come at all and you will fail miserably.

Image by kristja.

In the beginning it sounds nice. You are your own boss, make lots of money and do pretty much nothing besides sign papers. This might be the life of huge company owners (although I would like the right to disagree), but it will not be yours. You might have to work even more than your own employees, you will not really make that much money and yes, you will be your own boss, but the clients you work with will still decide whether or not to hire you – they have the money, right?

Statistics say 80% of new businesses disappear within their first year. It takes a lot of determination and it is not the path to take for people without drive and stamina. If you’re still reading and think you have a fairly good chance of being one of the 20%, then continue reading, this is for you.

Owning a company

---

Great, are you ready to embark on this journey? Then you need to know things will change for you. Your career will not be a 9-5 job and won’t even be similar to the bits of freelancing you experienced before. Expect to get a feeling of accomplishment when things happen as you wish them to – expect to put your head down and be disappointed when things don’t turn out the way you want. Now you are on the other side of a business. You control what is happening and you give jobs, order people around and decide on wages. Landing a big project will mean much more for you now than if you were working in an agency, where you just get assignments and, when you deliver them, you get new ones. Your life has changed!

Now you can also employ people and let them do your work, while you spend time with your family or doing whatever else you wish to. However, most designers or developers who start their own businesses have no, or a limited, amount of money in the beginning and choose to do some of the work themselves, to save up until they have a bigger budget. You will most definitely have to do this in the beginning, unless you find a partner who is willing to contribute to the finances.

Advantages of owning your business are many. You are able to schedule your own time and have more freedom to experiment; even more freedom to hang out with your friends. You get total control, price up jobs as you think and have a different feeling knowing this time everything you do is for your own purpose. You are in charge of everything. But challenges arise at any minute too…

Get ready for problems

---

The first part of the article was about the nice stuff. Now it comes the ugly. Just because you are a great web designer doesn’t mean you are a great entrepreneur. There is a whole new path for you to learn and there is not much free time for you after you throw yourself out there. As in freelancing, you need to be able to motivate yourself and the ones you work with and be the boss, not just a friend or co-worker.

Unlike in a company, there is no one who takes care of other things for you. Unless you hire people for it, you will need to do the bookkeeping, taxes, client meetings, project presentations, project management and so on. This doesn’t allow too much time for hanging out with your friends.

Image by iprole.

Working on your time and whenever you want is an advantage – like in freelancing. But in both careers you need to be able to motivate yourself and start working right away instead of doing laundry or walking your dog. Also, you need to be good at following a schedule. If you slack off a day, the second day you will find yourself in a lot of trouble. Distractions are also something difficult to deal with, from social media to e-mails and, if you work from home, to kids and family members.

Maybe the most time-consuming task is email. This time you need to create them yourself; from scratch! There are no short answers to your project manager anymore. Now you are also in charge of communicating with the client and there is a reason why every company hires specialized people to do this – because it requires special skills. Now go and ask yourself, will you spend the necessary time to learn them or will you hire someone to handle the external communication? If you prefer to do it alone, get ready for some difficult challenges. Not every client is a joy to work with and you need to learn how to get the best out of them. Your job will be even more stressful if most of the clients are difficult to work with – and you probably already know most of them are difficult to work with.

Some good tips I can give you for when you decide to start your own design company is getting an accountant and focus on smaller tasks. Having an expert to keep control of all the stuff you have no idea about will pay off because it will allow you more time for the things you know how to do. It is not really possible to keep track of everything and doing both administrative and technical tasks will only give you sleepless nights.

If you are out there always looking for clients and you do it well, keep doing it and hire somebody at the office to actually turn the ideas into projects. Chasing clients and doing the work is quite impossible to do at the same time. It is possible for freelancers, as they have more free time than you do, but don’t forget – there is no real free time for you in the following months or even years. On the other hand, if you’re really good at completing the design briefs, then do that and hire someone else on commission to land projects. All big companies have several departments for a reason: keep sales, finance, design and technology apart from each other.

What’s in for you later?

---

Now we talk about the future. What are your opportunities in the future? Well, there are actually only two: success and failure, but we all know failure is never an option. Forcing yourself to be successful is the only way to actually reach your goals. If in the beginning you only run a business, in the future you have the opportunity to own it and hire people to run it – this is the dream, I would say. It is as far as it will go for you.

Image by cobrasoft.

You will pick up business skills along the road that might help you get back in with another agency. If at some point in time you wish to start working again, nobody will reject you – with the experience of leading a small project to running a company everybody will be delighted to have you around.

If you fail, however, the only thing you can do is go back to an agency or freelance. You can still have the company on your CV, but is it really worth? How likely are you to get a job if you state your small business failed? If you disagree with this, you are more than welcome to share your opinion with us; I would love to hear them.

Bottom line

---

Well, now you’ve heard it all. You know what is good about owning your own business and you know what challenges to expect. I would be glad to hear that some of you still want to pursue your dream or maybe start or continue on this path. I can’t wait to hear about your results.

Until next time, let’s hear your opinions on the topic…

There are a whole bunch of CMSes out there ranging from lightweight micro-blogging platforms to huge enterprise packages.

I don’t want to mention any names here or tell you what to use.

Instead, I’m going give you some important points to consider, so that you can make an educated decision on your own.

And hopefully, not invest a huge amount of time and energy into a CMS you will have to abandon a year or two down the road.

The learning curve

Sadly, many designers pick a CMS on this point alone. Don’t get me wrong, choosing a CMS you can actually figure out is important, but you are investing a lot of time and energy into this piece of software. Potentially, years of your life will be spent working with this CMS. Don’t just go with the easiest one to configure without taking in some other considerations. A one-click install is nice, but should not be a deciding factor.

With that said, how fast you can get up-and-running, and building simple sites is important. Every CMS has a learning curve but some are much steeper than other. Consider how much time you have before making a choice. If you are a student, you might consider taking the plunge and digging into a more difficult to learn but feature-rich CMS, because you have the time available to do it. If you are working and need a CMS solution yesterday, you may be forced to go with something you can get up in running in a few days.

Theming

If you are not familiar with the term, by theming I mean creating the skin, the visible part of the front-end of the website. How this is done should be a huge consideration. Remember developers are the people building CMSes and they like to make development easier, sometimes before considering you the designer, and unfortunately, the end user, too. Which means, the way the front-end is put together might have been neglected or made unnecessarily complicated. Some CMSes are much easier to theme than others. Also, how the control panel is set up and how easy it is to use should greatly influence your decision, because you will be spending huge amounts of time working with it.

You need to consider how flexible theming for the CMS is. Are you able to create or import static HTML and CSS or are there a ton of hoops to jump through first? How is the file structure set up and are you required to save separate pieces of your design all over the back-end? A good CMS, once you are proficient with it, will save you time. But there are definitely some CMSes out there where development takes extra time.

How much freedom are you given to build the website you want? Every CMS has some design hurdles you have to jump over. Are you forced to begin with a starter or default template? That can be a big cramp in your design style and it can eat up extra time. Although, some people prefer having templates to start with. Which do you prefer? Do you have to write markup right in the browser or can you use a text editor? Think about how you prefer building static webpages and check to see if you can use the same process or will you be forced to do things differently.

Documentation and resources

A CMS is only as good as its documentation. I’ve played around with a few amazing CMSes that I ended up having to abandon because I got stuck, and realized there wasn’t enough proper documentation to get me out of the jam I was in. So right after looking at the basic specs for a CMS, dig into the documentation. You should be able to start with zero knowledge and build a complete website just from reading the documentation. If it doesn’t look like that is the case, you might want to look into another CMS.

Most CMSes list their features but the documentation is really where you can see exactly what is offered. For example, a CMS will probably offer some sort of shopping cart solution, but what that is exactly, can vary greatly from CMS to CMS. If there are one or two things your CMS must have, be sure to read the documentation about them specifically, and see if they will work for you.

Community

Even the best documentation cannot answer every question you will have. Is there a place to go where people will answer your questions? If there is, how helpful is the community to designers and novices? Some communities can actually be quite hostile or simply ignore beginner’s questions.

If you would like to ask some questions, don’t be that person who gets on the forums or Twitter asking “Is this CMS any good?” Browse around a little bit. Someone has probably already asked the question you have. A good way to gauge the quality of the community is to see what kinds of responses people are getting to their questions, and how many hours/days it takes to get them. Nothing is worse than having a question you cannot answer and not having a resource to turn to.

Another consideration not often thought of is paid support. Do the CMS developers provide support and how much does it cost? If they don’t, are there people in the community that you can trust to get timely support from? Inevitably, there will come a time when you need a custom add-on built or something else comes up that is over your knowledge level. Someone needs to be there to do it for you or walk you through it.

Community also includes the third-party developers. Who and how many people are building add-ons for the CMS? Most CMSes have a central add-on community. Have a look around and see what is available.

Usability

Not every website you build will be for yourself. How easy a client can add and edit their own content is very important. Complicated back-ends and lack of features means more development time and more time training clients. One of the most basic and most important features of any CMS is the text editor. Editing site content should be a primary concern for you and the people you will be building websites for. How easy is the WYSIWYG editor to use and goes it write clean markup? Will clients who are not computer savvy be able to use it?

Also, along the same lines is the file upload system. How easy is it to upload images, video, PDFs, et cetera? Many clients don’t have the software or knowledge to edit and resize images, yet need this functionality on their website. Is there built-in image resizing your clients can take advantage of?

The usability of the control panel should be considered as well. You may have to train people to use the system, which can be many hours of work over the years. Is it simple enough your grandmother could use it? Also, how configurable is the control panel? Can you turn off or hide areas the client doesn’t need access to? It is nice to be able to only let clients edit the areas of the site they need to without having to deal with other parts of the control panel that might confuse them, or worse, allow them to break the website.

Clients need to be able to do these basic things:

• Edit existing page content
• Add new pages easily and have the navigation updated automatically
• Add photos, documents and video content
• Give access to the control panel to other employees

They all sound pretty easy but there can actually be a number of problems. Tabular data or heavily styled areas that require HTML and CSS knowledge can be difficult for a client to edit, and some WYSIWYG editors don’t do a very good job here. Some CMSes don’t provide an intuitive way of adding additional pages or easily up-datable navigation. You don’t want to leave these things up to the client if you don’t have to. I like to follow the rule that if a client could break something, they will break it. Some CMSes don’t allow certain file types to be uploaded or have an upload file size limit, which can cause headaches for clients trying to upload large PDFs or PowerPoint presentations.

All things to consider.

Programing knowledge requirements

You chose to be a designer for a reason, right? Some of us might be proficient in a language like PHP but that doesn’t mean we want to spend all of our time doing it. Take a look at the language the CMS is written in and see if it is something you are familiar with and could work in if you had to. Also, see how much scripting is done in the templates. Some CMSes do a really good job of keeping the PHP or whatever language out of the templates, so you can focus just on the HTML and CSS. Other CMSes can have their own templating language to use.

They are all a little bit different and, depending on your comfort level with code, you will have to choose one to live with. Generally, I say don’t go with a CMS where you have to learn a whole new language to get started, unless you really would rather be a developer and not a designer.

How active are the developers?

How good the CMS is now is important, but where it is going in the future is just as important. So find out what the developers are up to. Look at the time it takes for each major release and each dot release to come out. If it has been two years since the last dot release, the CMS might be dead or on hold. There is no perfect CMS but the more the developers are working the better a CMS is going to get. And what may be the best CMS now might not be five years from now. Don’t get stuck with a dying CMS.

Find the bug tracker and see just how long bugs go unfixed. If something is broken on a site you build, clients are going to rely on you to fix it. Telling them the CMS developers haven’t fixed the bug yet, isn’t a very good excuse.

Flexibility and reach

What does the CMS come with out of the box? A CMS with little functionality means you have to rely heavily on 3rd party add-ons. On the other hand a CMS with everything built in may be bloated and difficult to get up and running, especially if you are building a simple website. There needs to be a happy medium between the two. An ideal CMS can be set up quickly without a lot of configuration needing to be done, yet has all the tools required for more complex features.

Just because you are only building simple websites now doesn’t mean you might not be building more complex websites in the future. Think about the types of websites you would like to build or may be asked to build and does the CMS allow for it. How hard is it to add a membership area to the website, multi-language support, or to add a store?

Does it make you better?

Learning how to build website with a CMS is a great thing to know but just how much larger your skill set becomes, can vary. Being able to let clients edit their own content is the central feature of a CMS, but they can offer so much more:

• Ecommerce
• Membership functionality
• Multi-language support
• Dynamic media galleries
• Multi-site installations
• Integrating blogs and forums
• Pagination
• Easy syndication

To name a few. You probably would not have been able to create this type of work without some development knowledge but a good CMS can make that possible.

After working with a good CMS for a while, you should find that you are able to work at the same speed or even faster than if you were building a static website. A good CMS saves you development time, but should also help improve the way you develop the front-end as well, by creating reusable snippets of content, embedding templates inside each other, and displaying content from the database that you would have had to markup yourself in a static site.

Where are you going?

Think about where you are in your career now, and where you want to be five and ten years from now. The CMS you choose will be with you at least that long. Are you going to be working for a big design firm or do you want to work for yourself? Will you be doing freelance work on the side?

Not every firm uses the same CMS but there are some that are used more regularly. If you really fall in love with one CMS in particular, you can always find the firms that use it, too. Less popular CMSes have less job opportunities but the firms that do use them would be much more inclined to hire you, being proficient with the CMS, over someone who has never touched it before. Using a less popular CMS makes you more of a specialist. Using a popular CMS means you have a broader range of opportunities.

If you plan on freelancing full or part time, you will want a CMS where you are comfortable doing every aspect of development. Typically, your projects will be smaller in scope as well, so a huge CMS with a long setup time might not be the best option.

Conclusion

Every person is different and what CMS works for me might not be the best option for you. So take these points into consideration. Take a look at what CMSes are available, and pick the one that will work best for you.

Written exclusively for Webdesigner Depot by Tyler Herman, a web designer and blogger at Couchable.co. You can also follow Tyler on Twitter @couchable to find out what he ate for lunch, see photos of his 24 cats, and read rants about sports teams you don’t care about.

What do you look for when choosing your CMS? Share other tips with us!

SetSeed: A Super-Slick Self Hosted CMS – only $39!

Source

Web design has been with us for a bit longer than 20 years now and sure, it is easy to criticize poorly designed websites nowadays, but few people really know how and where it all started. Things when web design started were really different – actually so different than such a website would be a shame today: weird colors, cluttered information, tables all over the place, Vegas lights and so many other things that everybody despises today. It is never too late to know a bit more about the history of web design, so let’s take a look at the most important changes throughout it.

Twenty years ago nobody knew what they were doing when designing a website. It was all something new and you couldn’t talk about strategies, research, laws, theories and typography. It was all chaotic. And it all started in 1989, when the first browser called World Wide Web was released, in the same time as the first website. However, it is not possible to see the first website ever, as there isn’t much information about it, but a website looked pretty much like this one and was used to give out basic information.

It all continued on a very slow path until 1996, which is considered by many the beginning of a new era in web design. Designers started using background colors – most of them really vibrant and painful to look at – but some of them kept it simple and decided to go for white – and even used some other fonts than the default ones. In this era people started overusing the animated GIFs we all hate today.

In the screenshot below you can see the Yahoo! website back in December 1996. This is one of the good examples of that year, but trust me, not all of them looked this good. You’ll see other websites below from 1996 – I am sure you can’t look at them  for too long and would be able to make a very long list of mistakes. People were not doing this back then, because the web was quite new and they were really happy with the websites they had – these were huge achievements for them back then.

McDonald’s webpage was incredibly hard to look at, although there was not much text. The background red combined with the yellow created a very powerful visual – truth is that everybody associates this color combination with McDonald’s today, so it might be also thanks to their first webpage.

Aligned to the left and with a maximum width of around 600 px, Apple’s website was not very smooth back then – unlike today. However, their design was still one of the best available on the web and looking at it didn’t affect your eye’s health at all, unlike some of the other ones.

Shortly after this era, another one started: the era of Cascading Style Sheets. Although not even half as advanced as today, CSS made a huge difference back then. There were still many wrong colors being used, but the layouts started getting better and you can see in the screenshot below some of them even used a grid system, if you are not so demanding and precise.

Yahoo’s June 1998 website was actually looking good and it was one of the best of its generation. But what would you expect from the king of the web during the 90s?

Google’s 1998 webpage, although the service was still in beta, looked really simple for that period, a trend which the American giant has continued with, right up until today. The main functionality of Google was and still is searching, therefore there was no reason to clutter the site too much.

As you can see in the screenshot below, Apple’s webpage evolved a lot from 1997 to 1998 and already started looking like what was going to be one of the pioneers of the minimalistic approach. Big visuals, not a lot text, no advertising and an interesting layout – this all started shortly after CSS1 and continues to this day.

Even AOL’s website looked better by April 1998. They started to have a grid system, used the colors of their logo and personalized their menu by using buttons.

The colors were becoming even more popular because designers thought they will keep the people on their web pages. They didn’t think the same colors would make it impossible to look at the page for more than a few minutes. However, as said before, the good that came from this was the fact that it associated colors with brands – blue for Microsoft, red and yellow for McDonald’s and so on.

Another problem were the fonts. Times New Roman and Courier New were very popular (Comic Sans was already released and soon to become hugely popular). Although there were many other options, people preferred to use these two typefaces in everything, from web pages and invitations to e-mails and documents. Writing with black was popular and everybody kept it like that. If there was something which needed to stand out, red was the color of choice. Otherwise I am sure you remember the blue underlined links (which you can see in most of the examples shown here until now). Because typography was not an important part of the design, bold and italics were not very used either to make text stand out.  A font that was widely used in the 90s and is still very popular today was Arial, which can even be seen on AOL’s website.

Leaving too much empty space was madness back in the 90s, also because centering a web page was not very popular. You can see Yahoo!’s first website (shown above) and notice how much empty space there was on the right side. People also started using background images, but because the images were not big enough, in many cases they started to repeat them and this created an awful visual.

Buttons also started to appear and become more and more popular, because they allowed designers to further customize the menus and put the focus on the navigation, while icons were also used all the time – it was the first time when visual elements had a use. This was also the period when animated GIFs exploded and everybody used them. There were almost no websites without them and people really appreciated the effect they created.

The year of 1999 was the year of a change. People started to design smarter and thought more about usability, grid systems, layouts and even colors. Most of the websites with vibrant background colors were redesigned and started looking better (McDonald’s got rid of that vibrant red from the background one year before).

Shortly after this, bright colors were on the way out and creating contrast between the background and the font color was critical. Most of the designers started using white as the default background color and it worked really well. Designers started designing in pixels instead of inches like they had been before. Maybe the most important thing was the fact that the content of a page was ordered, with the menu being in focus most of the time.

The importance of typography increased as well during this period, with people thinking a bit more about the target audience. Comic Sans becomes popular for child websites (although for a period it was used for everything) and some other fonts come into focus. There was no option for embedding back then, so designers were constrained, but at least they started to experiment more with what they already had.

Websites were not flexible at all back then and because of the many screen sizes available, it was difficult to design something to look good for everybody – responsive design was just unheard of. The use of buttons started to decrease as well because people learned how to properly play with font and colors – typography’s importance increased even more.

By August 2002, Apple’s website looked a lot like the one they have today. The navigation was a dropdown, they used big images for the featured article/product and four small boxes for other products at the bottom – a lot of similarity with Apple’s current website. The Cupertino-based company showed everybody how they should design a simple, but effective website.

The use of icons and boxes increased. As mentioned earlier, icons were a good way of focusing the users attention (especially on navigation links), while the boxes were used to help the user find his way around the website and also for structuring content. Luckily, the use of animated GIFs decreased by this period and they would never be as popular as they were a couple of years before.

Another era started in 2002, when the so-called web 2.0 concept appeared for the first time. The use of colors became more theoretical and everybody used them to make the websites more appealing, rather than flashy. The use of Flash – right then on its way in – was popular until 2008 when its use decreased dramatically. Flash animations became more and more popular and most of the websites started looking more professional, as we would say today.

Forums were already spread around and most of them had the same look and feel, like in the image below.

Shortly after this, the hover effects started to appear and they were a hit. Everybody was using them because they created focus and helped the user navigate.

Footers were also increasing in popularity and they were always used to display copyright information, privacy policy, terms of use or contact information.

Color palettes started to become harmonious and be used wisely. They started to create impact and designers knew that, if used correctly, colors can make a huge difference, especially then when not everyone had this information. The use of typography increased and, combined with colors and contrast, made the text interesting – for the first time in web history.

Responsive web design still didn’t appear at this point, but at least there were no more problems with background images. Now it was easy to calculate everything in pixels and repeating background images disappeared (they appeared again later on to create what we now refer to as patterns). Also, using background images instead of solid colors went low-key and designers preferred to avoid it.

Probably the first real interactive website was one for Coca-Cola. They showed the world how to use colors smartly and how to integrate them with flashy, visual animations that kept the users on their page for ever, even if there was not really too much going on there.

The web as we know it today started in 2005, when everybody realized cluttered sites are not popular, and started to keep them as simple as possible. Single pages appeared and made a huge impact because they were just what lots of users needed. Single pages gave design a fresh look and simplified the navigation. Designers started playing with font sizes and color and combined them so that text was in focus – integrating multiple fonts was tried for the first time in this period. The “back to top” button was also seen for the first time in this period and many websites adopted it, as it made navigation easier.

In this period websites were becoming more than just a way of supplying basic information. They were part of an identity, soon even a part of a strategy and people visited them not only for information, but also for relaxation and inspiration.

In 2008 another era started, which lasted for only few years (although some signs of it are still online today). This was the retro period, where old fashioned elements started becoming popular. No, not the GIFs and the tables, but retro colors, text, illustrations and other elements could be seen all over the place. This is also when the minimalistic design approach started, but it was nothing more than an idea yet.

The minimalistic approach started to become more than just an idea in 2010. We are currently in the minimalistic era, where it all has to be designed fast, it has to stay simple and still do its job and create an experience for the user. At the same time, although many websites turn to this concept, each one of them has to have something special – so that people will remember it and come back. Now it’s a lot about colors, typography and contrast – the best one being between white and black.

There are things we can notice everywhere. The color palettes are congruent and are not thrown out there just for the sake of it – they are used with a purpose. Hierarchy was introduced as well and it is not only shown through position, but also through font size, font type and colors. Balance is also a key word in today’s web design and creating a positive, attractive atmosphere on the website is the purpose of any designer. Responsive web design is popular today and there is no such thing as not being able to make a website look good on all the screens.

The typography goes beyond limits and being able to embed fonts made it even more challenging and interesting. Although too many fonts can lead to a bad design, if you know how to use them you will learn the key to getting people to read your text. Buttons are still used (think of Twitter, Facebook, LinkedIn and RSS) and are the way to navigate through pages, although they are not widely used anymore in menus. The problems with images and resolutions disappeared as well.

There is also a new style in town for background choices. There can be images, patterns or even solid colors – in today’s web you can integrate them with everything. Animations are not popular anymore, but are still used here and then – however, they do not affect the loading speed of the sites as much as before.

With more than 20 years since the design started to develop, it is easy to see that everything moves fast and that everything keeps improving. It is amazing how you can think that nothing can be better, and then in a few years something new comes and everybody is excited about it. The internet went from rough to beautiful and useful and will most definitely continue on its path upwards. Lots and lots of changes will continue to be made and the question is: are you ready for them? Are you ready for when a crazy designer will see an opportunity to push the web even farther? Will you jump on his bandwagon or will you just continue to do things the way you do already? If the history of web design has taught us something, it is the fact that we always continue to evolve. You should always be ready and willing to do the same when the opportunity arises…

For most of us web design started as a passion or a part-time job. For many of us it started before we turned 18, but most of us ended up working full-time in an agency or as freelance web designers and developers and will probably continue doing so for years and years to come.

But being a designer can take a great deal of time, with multiple clients to please, working in an environment that moves fast and changes even faster, where we have to learn new skills over and over again, market ourselves and even find clients on a monthly basis if we don’t work in an agency.

As with any other career, web design has its own challenges and they arise all the time for us, even if we are experienced or well-known. It can be a difficult client to work with, an impossible deadline or a bad example of outsourcing, it doesn’t really matter. Unfortunately these things can’t be avoided, but to ensure you enjoy a better career anyway I created a list with some tips for all of you.

Success only comes if you work smarter and more efficiently, not necessarily more than you do now. It will not be possible to pull all nighters or work 36 hours straight in 20 years anymore, your body will just not be able to handle it. You will end up burning out and will start hating your job and career choice. Therefore you have to reconsider the way you work; design and development are careers for organized and smart people. Not that we do something incredibly special, but let’s face it, there are more designers that don’t manage it than the ones who do and enjoy success – it is definitely not easy.

1. Be organized

---

This should be the first new rule of your career. You can only work more efficiently and smarter by being organized. Everything from your working hours and sleep to breaks and time for a personal life. Being organized or becoming organized is difficult and requires time and effort. We try to focus more on deadlines and projects (which are short-term) than on improving the way we work (which is long-term and more efficient).

If you just can’t handle both of them, take a break from design for a month and organize your life. Catch up with your bills, see everybody in the family, get out with all your friends and handle anything that has been causing you stress. Then start being organized.

Image by tome213

Create and use a schedule, this will allow you to avoid a chaotic life. It is not important what kind of system you use, the most important thing is to actually have one – and to rigidly respect it no matter what.

Actually, this part of the article is focusing more on freelancers than on agency employees and this is simply because the first have to manage their own schedule, while the second already have a schedule imposed by their companies.

You decide what your schedule going to look like. You know what you want to start with and at what time, although I do not think that starting after 9 is beneficial. On a normal, 8 hour work day  you will finish at 5pm, which might be a bit too late if you need time for other activities such as running, family meetings, working out or seeing a football game. E-mails with new tasks might appear throughout the day, the best way of dealing with them is ignoring and revising them at the end of the day, when the work you planned to do is already done. Otherwise you will end up reading e-mails and not delivering the projects on time.

Image by biewoef

Another tip is to take 30 minutes at the beginning of each day to read e-mails, plan ahead and get rid of everything that might concern you. Then just start working. At the end of the day take another 30 minutes to read and write e-mails, send milestone reports and other work related emails. Sure, you lose an hour a day, but being organized is important and this hour you use for things other than work will pay off long-term. You will notice that you will not be concerned with new e-mails after you get used to only reading your email twice a day. Incoming e-mails are only a distraction. Talking about distractions…

2. Get rid of Social Media

---

Yes, of all of them. From Twitter and Facebook to e-mail and phone. By being surrounded by all of these you only risk getting distracted and doing anything besides your work.

You might not realize it, but your probably use Facebook and Twitter even more than you think. Install one of the activity tracking applications you can find on the internet and you will be amazed at how much you use Facebook and Twitter.

By only checking them from time to time, I spent almost two hours per day on Twitter, Facebook and e-mail combined. Quite a lot thinking I can bill a client $50 for two hours of development here in Denmark. Using this logic I lose around $250 per week by being distracted, which means $1000 per month. Quite a lot, I would say, there are freelancers out there not even earning $1000 per month.

Image source

Even if you think Facebook and Twitter are the biggest distractions, they are not. E-mail is the biggest and I can’t stress enough about how important it is to only check it in the morning and in the afternoon, before and after your working schedule. If you don’t believe me, use one of the tools recommended above and see for yourself.

You might be afraid of missing important e-mail messages, but we all know most of our e-mails end up in spam anyway and very few of the others require immediate attention. You will not miss your dream job or even a big client if you answer at 4.30 instead of 12.30. You can also create filters and only get notices when a specific person sends you an e-mail, so you can act on it immediately if needed.

Cleaning and managing your inbox is important too, because it will turn your one-hour habit of checking e-mails into a 30-minute one – and there’s half an hour more of earning money per day. Make sure your inbox is not cluttered, get rid of anything you don’t need and move all the spam to the spam folder – don’t forget to always block the sender and maybe even the sender’s domain. If spam is sent from there, you might not want to have anything to do with them anyway.

3. Use methods to concentrate

---

Our bodies are not like computers. This means we can’t just inject food and energy drinks into it and expect it to work at its best all the time. Our bodies work according to how much energy we have. Therefore we can aid our schedule by using some well-known methods.

Our energy, however, depends on our natural rhythm. This means some of us work better in the morning, while others are more energetic at night. And even under these circumstances, our concentration increases or decreases throughout the day. These methods I am talking about are ways of properly managing your energy so that you work as effectively as possible.

The Pomodoro Technique is one of the best out there. It means you force yourself to work in short bursts. You set a timer to 25 minutes and during the 25 minutes the only thing you do is work without being distracted at all. Just work. After the 25-minute cycle take a five minute break and continue with another sprint afterwards. After four cycles take a longer break.

If The Pomodoro Technique does not fit your working style, then try something else. Use the morning and the first hours of work for the more demanding jobs – this is when you have the most energy – and then keep the easier tasks for later in the day. You don’t really feel like coding, but would like to read something, save the reading for later since it isn’t as demanding as coding is.

There is nothing wrong with taking naps after lunch either, just don’t take long ones. Half an hour should be enough for your body to rest and to give you enough energy for finishing the work day. We know that once you are done working, the energy just comes back out of the blue.

And if this doesn’t help and you still feel tired, then it’s time for…

4. Working out and exercising

---

Yes, this is always a way to get rid of the tiredness. I am not saying you have to work out until your muscles get sore. Go out and take a short run, do some push-ups (I love this one, that one or the other one) or just move around the house for few minutes. Just moving your muscles for a short amount of time will give you back some energy and will make you active again.

Image by Johhnyberg

In general, having a healthy life style will do much more for your freelance career than you think. Only being healthy and managing to sleep well during the night will give you more energy than others have. Therefore you will be able to work for longer periods of time, avoid naps and be able to concentrate better. I’m not saying you should, but going and talking to a doctor about your situation might be good advice. See if you need some vitamins and if you do, don’t hesitate to take them. You might not feel a difference, but I am sure your body will.

5. Outsource if you can

---

Outsourcing is one of the ways a freelance designer can take on a huge amount of work. Because you can’t do them all, having someone to help you might come in handy. If there are things that you hate doing or are just not good at, think of getting another freelancer to help you. It can be paying bills, invoicing, administrative tasks or even chasing clients. Get somebody who can find clients for you, this way you will never have to spend time on it. Find somebody to market you and the only thing you will have to worry about are your deadlines.

Paying somebody else to handle some of your business is not wrong and is a very common practice these days. You can even charge the client a bit more and use that extra cash to pay someone to help you. There are so many virtual assistants out there that price will not be a problem at all – there are many of them who will do a fantastic administration job for a few dollars an hour.

If you want to get more serious and hire other designers or developers to work with you, this means you are ready to create a small business and as long as it works for you, why not try it?

6. Reuse work

---

Because time is important, it’s smart to “recycle” the products created before and use them again in new projects. You can save some time and stress and get a bit more free time and also get ahead of schedule.

There is nothing wrong with using the same JavaScript snippet again, as long as it is developed by you. If you develop a really good default CSS stylesheet, reuse it every time you start a new project. Moreover, search for work on the internet which is available for free and make use of it. The three hours spared by using something free from the internet can be used for other projects or tasks.

Image by 7rains

Lots of clients come and ask if I can develop a web page with a Content Management System. Well yes I can, WordPress is out there and it also takes only a few minutes to install. Why develop their own, when I can instead use the same amount of time to customize a theme for them? Reusing work you’ve previously done is a smart way of saving time and working more efficiently, and don’t forget, free stuff from the internet can help too.

Conclusion

---

It fascinates me how people choose web design for a career when they are young and so passionate about it, but when they get close to their 30′s start hating their job and are not motivated anymore. Success is one way of staying motivated and if you can follow the rules above, you will most likely achieve it. Pulling all-nighters is something you will have to do often and if your body can’t handle it, then you need to make sure you’re the most organized person you know so that you can complete your work and not need to pull all nighters.

Being organized is one of the most important skills of a web designer in my opinion because I am sure not many of us can afford being otherwise for the following 20 years. Try to have a schedule and stick with it, it is important for short-term, but crucial for long-term. This is the only way you will be able to achieve success, stay motivated and have a better design career and a happier life.

Now it’s your turn. What advice do you have for your fellow freelance web designers / developers?

A lot has changed now and social media is changing rapidly. This article will help you see hidden gold mines you can discover to build a lot of back links, bring huge social media traffic and enjoy the whole process along the way. I participate in social media mainly because I need traffic, but I also enjoy that I am able to communicate with a lot of people, find good articles I would never find otherwise and learn a lot of stuff all the time! And this skill always comes handy whenever you deal with the Internet – everybody needs more traffic, more buyers, more visibility and good brand built online!

In this article you won’t find advanced explanations how to use each of the services, just basic tips, you’ll get a glimpse of everything. I am creating this article for my own one stop place while doing promotion. Work hard on bigger networks and submit your links to small social sharing sites, submit news and in the end you’ll get good back links, good visibility and social traffic! My own 1stWebDesigner success is built through these websites, which allowed me to get 50,000 unique visitors to my site in its first month of existence. Now I have developed my skills and I am giving you tools and sites which work today (however I also added comments on sites, which are popular but are hard to master, be aware of these too).

1. Twitter

Twitter, undoubtedly is the largest source of visitors for many blogs and websites nowadays. Do it the right way and you’ll see how the conversion rate rises. Twitter can be a big waste of time so check out some of the tools I recommend to automate some of the tasks and spend your precious time just on things that really matter and produce the greatest benefit to your company.

There are some great tools to use to effectively automate your account and easily follow up conversations.

My top picks are:

BufferApp

This online application will help you in your daily browsing by allowing you to schedule your posts to Twitter any time you visit a worthy link, article, picture, video – and the best thing is this app will analyze your Twitter followers and will schedule tweets at times when your audience is the most responsive and active. I tried several apps for tweet scheduling, but this is by far the best I’ve found so far!

Dlvr.it

If you own the blog as I do you will want to promote your articles on Twitter, Facebook and more with ease. Dlvr.it automates this process by tweeting and posting articles on Facebook automatically once they are published. Small app is a huge time saver! This site also has a lot more built in features such as analysis, automatically adding a hash tag and more. Irreplaceable tool in your social media promotion toolbox.

Tweetdeck

Since Twitter purchased Tweetdeck they have released a new version together with the new Twitter. The new version of Tweetdeck is stripped down, but for me it still fulfills my needs and if Twitter owns it I am sure they will maintain top quality and fix any bugs it might have. I love Tweetdeck’s multiple columns, the previous version wasn’t running smoothly on Mac, but this one certainly is!

My suggestion is to use Tweetdeck for closer communication with your followers and getting to know more people.  Be sure to also check @ replies to thank you for retweets and engage in conversations you started.

Triberr

This is a lovely ‘invite only’ community which is built all around the concept of tribes. The basic idea is to become a part of a like-minded tribe, where everybody is interested in a particular topic. There you just add your RSS feed and other people in your tribe will see your updates and will tweet your posts if they find them interesting. It’s like a link exchange service, only you choose what to promote, of course you need to be in the right tribe with people who don’t just spam their users, but search for value – and these people actually will help you the most if they choose to tweet your article! Friendly community and it was the most buzzed about Twitter community project a few months ago. Worth a shot.

Ask on Twitter for invites or ask me.

2. Facebook

Facebook, the other social giant, and specifically Facebook pages are definitely a great way to promote your content. Note that FB is different from Twitter, for example, you need to post here just 1-2 times daily and here you need to work much harder to get attention and drive traffic. Focus on high quality – I usually curate Twitter tweets from BufferApp and post the top performing tweets on Facebook.

Also try to mix these updates with questions, ask your visitors opinions about trendy topics, create contests there – provide value! Ah and by the way I am using Dlvr.it for 1WD Facebook page to automatically post new 1WD articles there.

3. StumbleUpon

StumbleUpon was a serious traffic source before Twitter and Facebook flourished and I believe it will be back on track after the redesign.

Here are some quick tips on how to gain friends, get more shares and traffic in result.

You cannot get anywhere with friends that are interested in the same topic you are and would want to exchange stumbles between each other. One way to increase your profile visibility would be just to stumble like crazy, leave reviews on another similar websites and hope you will be noticed, but I suggest you to take the  smarter route. Reach all the people directly, find the ones who are active and are interested in the same niche – approach them, explain how you can both benefit from being friends and if you’re lucky – you’ll get your first SU friend! Repeat this process until you are happy and you have enough people in your circle.

The second step is to actually fulfill your promises – stumble what your friends are sharing from the bookmarklet SU provides and ask the same back! However don’t go crazy, only promote really good stuff and remember that SU people have short attention spans – so focus on images or video instead of long text articles! Sharing is clunky, you need to click one by one to each person you want to share your website with, but you’ll get your rewards. Just be consistent and SU can be beautiful first traffic and ongoing traffic forever!

To let you dig deeper, here is a beautiful SU traffic guide.

4. Digg

Ah, there were good Digg days, when it was possible to get really good traffic easily here, remember the famous Digg effect and traffic spikes? Well, now everything has changed and if you’re super smart and knowledgeable, you can try Digg, but for most of us it is just a big waste of time.

Not recommended anymore for easy traffic – Twitter, Facebook, SU are much better ways to build your brand and together with it, drive traffic. With Digg mostly it was just about traffic, but now even that’s lost – they don’t have much traffic anymore even if you get on the front page, and believe me it’s super hard to get there anyway. I was a Digg power user and still 1WD only made it to the front page a few times where twice it was quickly buried and twice we got really good traffic, but it was very a small amount for the amount of effort we put in to get there in the first place.

Of course, despite all the bad luck with redesigns Digg is still a significant player in the game of social promoting if you really know how to play that game.

5. Designbump

Although it has become a little neglected Designbump still is a useful library to find tons of design related news around the web. I suggest this one especially for building links, you need to get 9-10 votes to get on the front page, but even if you don’t, you still show up in their database.

The traffic building tips on Designbump are the same as SU, write personal messages to like-minded, active people and work on exchanging votes. Do not waste too much here though, because traffic isn’t that great.

6. Google+

Yet not reached it’s potential till now, Google+ is a powerful social network the largest bloggers are already using actively. Google+ is the newest player in the social media field, but it’s been growing quickly and it is predicted it will reach 200 million users in 2012.

Here it’s all about the people and the circles you establish – if you can build up a strong following, you will get great rewards!

7. Reddit

Reddit is tough one, because it is a very strong and private community which neglects outside promoters who just want to build traffic. My suggestion is – if you cannot blend in with the community and mix up your submissions and activity with promotion, don’t even start here. You’ll get burned quickly. But however if you love a geeky community and would enjoy spending free time there anyway, you can get high rewards, most of Digg’s traffic went to Reddit after it’s redesign, remember that!

8. LinkedIn

LinkedIn is changing all the time and actually improving, I’ve tried using their forums and promoted my articles through there and surprisingly got some traffic easily. But basically all you need to do is to provide value, be active and make use of that community! The same way as all other social networks: you need to communicate and approach many people to gain attention, nothing will come if you don’t ask for it and actually initiate the first step.

Here is good article explaining how to use the new LinkedIn company pages.

9. Ffffound

Ffffound is another image bookmarking service where you can submit your inspiration related content.

10. CSS Globe

CSS Globe is a web design magazine where members can submit their news which is then reviewed for approval.

11. Abduzeedo

Abduzeedo is one of the largest design blogs for finding inspiration. They’ve got a separate section where members can submit their articles.

12. Designm.ag

The community news is one of the major sections of DesignM.ag. All submissions will be moderated yet they’re charging a review fee of $2.99 so that may hold lot of people back.

13. Designflavr

14. Fuel network

Fuel network consists of 9 websites. Anyone can submit links with a short description which will then appear in the sidebar.

15. 10steps

16. Dezinerfolio

17. Desizntech

18. Instantshift

19. Fubiz

Fubiz is a superb place to find inspiration and they’ve got a quick link feed in the sidebar where you can submit your links.

20. Speckyboy

21. Design-newz

22. CSS Drive

23. Designrfix

24. Devsnippets

25. Dzone

26. Tipwire Magazine

27. Tutorial9

Tutorial9 used to be a big Photoshop tutorial site, but David Legget decided to change it all and  now it’s more of a design article curation site with a growing community. Submit your best design related content here.

28. Zootool

Bookmarking services with search feature like Zootool can be a great way to attract new readers.

More Link and traffic building resources:

It wouldn’t be fair just to leave you with simple list right? That’s why I found and included several more articles, which I found outstanding and super valuable to read for anybody interested in link building and social media marketing! Here you go..

• Viperchill SEO and Social media categories – SEO, link building and tips how to attract traffic. Learn how to do keyword research, learn powerful link building techniques. On social media page you’ll get a lot of social media traffic building tips and different look on everything – switch on stealth mode and be ready to be educated!
• 30 Link Building/Link Baiting Techniques That Work in 2011 – this is beautiful article showing different techniques you can use to build links and get some traffic, if you think you’re doing a lot to promote your stuff, think again.
• 5 Ways to Use Google+ to Improve Your Search Engine Optimization – behind Google+ is Google which means you will leverage a lot in search results if you use this service, learn how to do it!
• Top 20 Social Media Blogs 2012 – SocialMediaExaminer is searching for top social media blogs and each site here has amazing articles, if you want to be social media guru, you need to improve all the time. Check these blogs and subscribe to your favorites for daily social media tips and inspiration!
• 30 Brilliant Social Media Marketing Tips From 2011 – in this article you’ll discover 30 tips from all the most known websites in this niche! A lot of ideas you should consider in your own social media promotion.

Okay and finally I wanted to ask what are your favorite social media and content marketing techniques and back link building tools, you use? Don’t be greedy – share them with us so we all can improve, it won’t hurt anybody!

Web design is such a broad field that mistakes can be spotted all over the place – it is almost impossible to deliver a product without a mistake until you undergo full testing, which not everybody has the financial power or time to do. These mistakes can range from a few pixels of padding missing to using a wrong number of fonts. Today we’ll take a look at some of the problems people make so that next time you deliver or design a product you can avoid these pitfalls. This way your products will be better overall and your design skills will be appreciated even more.

Let’s begin with the typography. With content being arguably the most important element of a webpage, a designer must have knowledge of how to make it work. Reading some typography books or tutorials is recommended, because it will improve your use of fonts and typefaces and will allow you to play with them for better results. With the right font every piece of text can be made interesting and attractive in web design. Modern designers already know the importance of typography and spend lots of hours testing new typefaces and improving their designs before delivery.

Serif – Sans-serif relation

---

Mixing typefaces is popular nowadays and works wonders if you know how to make it work. Mixing two different styles can create results that look very good, but pay attention to mixing serif with sans-serif fonts. While you can try your skills doing it, there is a good idea to ask for a second opinion before you propose your client a design with mixed fonts. Typography always looks good to yourself and always expresses the thing you want it to express, but always ask for another opinion. Remember it is rarely about you, but about the future visitors of your webpage.

Number of fonts

---

There is not much to say here, but the bottom line is don’t mix too many fonts in the same design. Having a couple of fonts to play with is much better than playing with the whole Google Web Fonts suite, because this can, and will,  disrupt the readability of your text. As a rule of thumb it is good to use the same font for content all over the webpage, and only use another one for headings, big titles and other elements. Two fonts should be enough for every matter, and keep in mind: never use more than three at a time.

The Gestalt Law of Similarity shows that people tend to group objects together if they look alike. If you wish your content to be part of the same visual field, then don’t use different typefaces, because this will create the opposite effect. The same font provides good continuation to the content as well, which makes it more readable for the user, improving his experience on your webpage.

On the other side, using the same font all over your webpage might be a bit too boring and might look like a beginners work. This is why I said that two is, as a general rule of thumb, the best number of typefaces you can and should combine in your designs. Now don’t get me wrong, I’m not saying this is how it should always be, but I’ve achieved success and good results with this number all the time, so it might be worth it to give it a shot.

The best way to achieve a good result is testing and playing with fonts. I wrote a small guide on how to improve your website’s typography here, take it as a short read.

Contrast is important

---

Because everybody wants to be different on the internet, some designers develop interfaces using lots of colors – which is not a problem, as long as you use them wisely. Some designers play with too many colors and achieve some nice results at times (at least they think so), that they forget about having a powerful contrast between background and content. This is important because it allows the user to better read the text and doesn’t make his time on your website frustrating.

As you can see in the image below, the text on the left side, written in pure black and white, is easier to read, because it has a high contrast with the background. On the right side you can see that the content is much more difficult to read, although it is the same font type and size as in the left column. Dark grey and red do not have a high contrast with blue, therefore it is not a good choice of colors. Sure, this image shows basic and obvious mistakes and I am sure not many of you thought of using the combinations on the right side, but it is just an image that illustrates what the choice of color can turn your website into.

Now that we settled typography, fonts and colors, let’s move on to spacing. With our screens becoming bigger and bigger, there is a lot of space of play with. We do not surf the web on screens with a low 640 x 800 pixels resolution; we’re doing it on 15″+ screens now and a minimum resolution of 1024 x 768, according to the W3C. Sure, there is still the mobile screen matter, but we will discuss it another time. Right now we focus on design for desktop.

It is always good to give thought to padding, margins and general spacing between elements. This is called “working with negative space”. The best designs out there use a lot of negative space and therefore have a lot of visibility, content is distinguishable from other elements and, with a simple but smart choice of color, they are sustainable and work good on long term for all types of users.

Spacing needs to be kept consistent for it to work well, so always pay attention to the small details when designing or coding – this is a matter of pixels for both internal padding and external margins. The grid layout you decide to build upon in the beginning will help you stick with exact margins, and if you don’t use a grid system, then go and get one from here.

Now I am not saying you should waste a lot of space only because you have it, but having a cluttered design will not help either. If you don’t know where to start from, go out there and visit some webpages you like, I am pretty sure some of them work on a grid system and use a lot of negative space. Take Apple’s website for example (image below). They tend to maximize the use of white space and keep the content on the low side, but without minimizing its importance. There are never problems with hierarchy, everybody knows what is important and what’s less important and all looks organized.

There are more sources out there where you can get a good grid system for every webpage you work on. It’s a very good idea to always build on a framework and keep building on it until you deliver the final product. By using some preset style and elements of margin, padding and spacing, you will make the work easier for you and the final website better in terms of design.

Using old tech

---

This should be punishable by law. Designers who still use tables (like in the beginning of the 2000′s) and still develop using Microsoft Frontpage should be banned for life. Also, old elements like animated GIFs, background music or frames should be avoided at any cost. All these things are not only out of style, but are not up to the standards of the web anymore. This will make the webpage load slower, get indexed worse or not at all and the new browsers might not even interpret your code accordingly. Technologies appear on the web all the time and it is important for every designer or developer to keep up with them. If you still have old webpages built with these elements, go back now and update them, because otherwise they will only make a bad name for yourself. Although you might aim for their past success, you don’t want to have a website like the one below, do you?

Size, placing and proportion

---

Because now you know what a framework is and you’ve probably already tried it, I will go a bit more in depth. Size and proportion are important elements of a grid system because they tend to show the user what is important and what is not very important. The navigation bar should be placed at the top or in worst case in the sidebar, but it always has to be over the fold, because the user needs to surf around your website. It is also important to make the most important elements bigger without making the others too small. When the user loads your webpage for the first time, he shouldn’t use more than three seconds to find out what’s important there, where the navigation is, if there is a grid system, where is the content, is the content easy to read, does he know where he is in that moment and so on. There are, as you can see, many things a user needs to find out by himself in the first few seconds after he lands on a webpage, therefore aid this process by making these elements clearly stand out from each other.

The items and elements on a webpage should be easy to access. The user should not zoom, squint or attempt to work too much for finding the information he needs. He should only take a brief look and already know what and where to do.

If you also heard of Golden Ration or Divine Proportion, you know that most standard designs adhere to it. Although designers deserve some credit for it, the Golden Ratio of 1 to 1.62 in a rounded form is widely used out there in the world. The Divine Proportion helps balance web design in a natural way while keeping everything in balance and make the design feel just right.

Set goals

---

Before starting on a design, it is always a good idea to decide what your goals are, what you want to achieve and why. Don’t ever forget this afterwards, because setting goals is important for the development process. Forgetting what your goals are will make your design hectic and less friendly. Therefore, if you need to, occasionally go back to your original goals while developing and try to see if everything still matches your ideas, otherwise change what needs to be changed. This way you will ensure your designs will always stay clean and you will always focus on the main goal.

Let’s start discussing!

---

With so many things to look out for in the design world, I know it is not an easy task to deliver good products, but making an effort will always pay off in the end. Sure, solving these issues might not be that easy in the beginning if you are inexperienced, but if you work on them they will come with time, trust me.
Have you ever made these mistakes, or at least some of them? Did you ever think of a smart way of solving them? Share your thoughts with us and let’s make the design world better for the more inexperienced of us.

Call-to-action pages are dedicated to prompt visitors to take a desired action, whether an opt-in, a sale or any type of click that brings a user one step closer to a company’s goal. Basically, any website can be classified as a call to action page because virtually every person who creates a website has a specific action he/she wants a visitor to take.

Most websites commit at least one of the top crimes listed below. Do you agree with the choices?

1. Graphic Clutter

---

It’s obvious this website’s purpose was show as much information to visitors as possible above the fold. While this is a valiant effort, too many graphics can work against you.

A great call to action page will send your eye to a specific area. When you look at this page, your eyes are drawn everywhere and if you were looking for a car, you wouldn’t even know where to begin.

Though this page is not a landing page, it is a prime example of why less is more when trying to increase conversions with web page design. A call to action page should include benefits, features, logos, maybe one or two images and a prominent call to action button. Any more and the page will suffer.

A website home page should follow suit while including clear navigation and an easy experience for visitors. Avoid clutter at all costs. White space is your friend!

2. Blended Call to Action

---

Though the call to action button on this page is outlined in yellow, it does not stand out enough from the background. The yellow also matches the font above it so it blends into the background even more. The color scheme of the page is yellow, red and orange and the call to action button follows the same color scheme; therefore, it does not stand out enough. A solid color in contrast to the page would work best.

3. Distracting Background

---

Many businesses want to incorporate their brand colors into their website design. While this is a smart marketing strategy, if the color is overdone or distracting, it can have an adverse effect. The bright yellow background in this web page is very distracting and it draws the eye away from the purpose of the website. If you view this website in its normal size, you will see how truly distracting the bright yellow background is.

It’s good to implement your brand colors in your website design, but not at the expense of distracting visitors away from your purpose. Your background should support your web page and be somewhat neutral.

4. Lost call to action

---

On this page, the call to action button is not only lost, it is nonexistent. One of this website’s desired actions is to urge users to click and find out more information about the Thank You® Premier card. The current call to action is simply text that says “Get Moving”.

If you really want to lead users to an intended action, use buttons in contrasting colors. Text will never be strong enough to get users’ attention. The button should include a contrasted color that screams “click me” without slamming it in user’s faces.

Also consider the call to action button’s proximity to other elements. For example, with an ecommerce site, the “Add to cart” button would be most effective if it were placed right next to the product. You can also place call to action buttons near places of interest like testimonials, feature lists and benefits, etc. Make sure, though, not to clutter your page with too many buttons. Keep them close to your key points and at a  maximum of 2-3 per page for simple landing pages.

5. Too Much Information

---

When people offer us more information than we want to hear we often say it is TMI or Too Much Information. Similar to how you would want that person to be quiet, a web page will suffer this same reproach if it is suffering from TMI.

On this example web page, the call to action is not front and center and your eye is drawn to the articles instead of the “Get a Quote” text. This page, while meant to attract visitors to get a quote, leads them towards reading an article which may be too much information for this page. Content is not necessarily bad; great content outlines the pages of some of the greatest websites. But when it blurs the message of the site or distracts users from a clear call to action, profits will suffer.

For this website, a more prominent call to action in a more effective location would draw the eye there first.

The goal with a call to action page is to lead your visitors to click on the call to action button without distracting or boring them with too much information. You should include enough information (features, benefits, guarantees, testimonies) to lead them to take action without overdoing it. If your visitors cannot figure out whether or not your site will be beneficial to them in the first few seconds, they will assume the worst and hightail out of there.

6. Too many Links

---

This page is actually ranking quite well for competitive mortgage related keywords, but the design of the site unfortunately does not follow suit.

Unless your site is product specific (e-commerce) or purely informational, excessive text links can overwhelm users.

The purpose of this website is to guide consumers to get a mortgage quote. While classifying the links by states is a good idea, the clutter and small font does nothing for visitors’ eyeballs. As stated before, text links are ineffective as calls to action on pages like these and the close proximity of these links jumbles everything together to look like one cohesive blue link.

There is no clear call to action here. This webmaster would benefit from making this page a second page and redesigning the home page to include one or two buttons only, leading people to “Get a Quote”.

Here is a trick: Squint your eyes slightly to blur your vision and look at the page. If your call to action doesn’t stand out, adjustments may need to be made.

7. Button Placement & Location

---

Though this website is committing many faux pas, I chose it due to improper placement of the call to action button.

If you look on the far right (it probably took you a few seconds to find it, which is a few seconds too long), you will find a small box with a dropdown menu. This is where the webmaster would like a user to click. The only element standing out is the small red arrow and that is even questionable.

The placement and location of your call to action button is equally as important as its size and color. A great call to action will not be effective if it is surrounded by too much text or not enough whitespace, or if it is located out of sight.

Generally, it’s important to keep call to action buttons above the fold (visitors can see it without scrolling), clearly visible and prominent in relation to all other elements. If you have content that is only visible by scrolling, include a call to action button towards the end so users do not have to scroll back up to click on it.

8. Button Size

---

Your website visitors should know exactly where they need to go the second they land on your website. In this example, though well-designed, this “Buy Now” call to action button seems a bit small for the animation of the site. If you click on the entire website, you will notice a busy background which can distract from the small button as well.

Please note, though, that a bigger button is not always associated with higher conversions. The button should stand out from the other design elements without overwhelming the entire design, which can turn people away as well.

9. Button Text

---

This website used the word “Go” to urge users to click for a quote. While the design does draw your eye to the quote box, I am not sure the word “Go” is the best choice.

Though there are some basic rules for button text to maximize conversions, it is more of a function of the type of website rather than a general consensus. For example, a business offering a free trial may use “Click Here to Get Your Free Trial” while a service-oriented website may use “Get Started Today”.

General rules of thumb for call to action button text:

• Avoid being too wordy
• Keep it simple
• Add urgency
• Limited availability if applicable
• Use action words like “now” or “today”
• Always split test

When it comes to elements such as button text, the only way to determine what works best is to split test. Sometimes, minor changes can increase conversion rates dramatically.

10. No Clear Message

---

Many businesses are not clear on their sales funnel; therefore, their visitors are not led to take a desired action. This dealership is trying to push users to perform too many actions at once along with reading text which can be boring for people looking to buy or lease a car.

TIP: The purpose of your call to action is to get users to the next step only. In the case of the dealership, the final goal would be to sell a car, but that should not be the main goal of the website. That is the car salesperson’s job. The website should only urge visitors to take the next step which is to visit the dealership.

Don’t try to sell a car with your website. Just sell the next step!

Have you seen any call to action crimes? What call-to-action crimes have you committed?

Navigation plays a crucial role in the success or failure of any website. An easy to navigate website is more likely to be explored in more detail as compared to a website with more complex navigation. Regardless of the functionality of the website, the navigation is the first thing that must be taken care of.

Accomplishing matchless navigation that successfully performs its function is almost similar to mounting Mt. Everest. Getting an exceptional navigation with wonderful functionality makes the website easy to navigate and interesting for the visitors, therefore assuring a better user experience.

At this time, we have selected some websites with marvelous and distinctive navigational elements that will not only enthuse you, but will demonstrate to you how to merge novelty with realism. Enjoy!

1. Tvrdek

On this website, you may feel that the website does not have any content but once you explore its navigation, you will love to browse this website more than anything.

2. Racket

Here you will see the navigation menu hanging in the air. The navigation menu looks somewhat off the cuff but at the same time it looks so cool.

3. Iamyuna

Here the navigation may appear minimal and negligible but once you keep your mouse on the option it shows you the complete list of all available choices. The mouse over effect is simply amazing.

4. Kutztown

Kutztown creates a very artistic look with its design and typography, further the navigation adds more beauty to it.

5. Samsung Mobile

Samsung Mobile features an extremely dynamic and animated website with a unique and appealing navigation style.

6. Case Studies

Centrally aligned navigation with some links at the top of the page is truly an extraordinary approach for a navigation menu. Clicking on any centrally aligned option will reveal the detail page.

7. Acko

An artistic representation even through the choice of navigation menu. Acko takes advantage of its bright color combination to make its navigation even more attractive.

8. Helmy Bern

Helmy Bern features a somewhat disorganized top navigation but the side bar and the bottom navigation menu are simply amazing. The use of the right color to create the right impact can be seen here.

9. Cathy Beck

Cathy Beck makes use of a unique approach for her site navigation. Here the navigation is set at the bottom of the page rather than the top of the page, further the mouse over effect is out of the ordinary.

10. TinyTeam

TinyTeam offers a very systematic and pragmatic navigation menu that eliminates any confusion a new visitor may have in browsing the website and finding its desired information.

11. Alexbuga

The sliding effect on mouse over is the key point of navigation plan of this website that makes this navigation extremely classy and elegant. The main navigation reveals when you place your mouse on the logo design at the top of the page.

12. Thibaud

It’s truly fun to browse this website. You can actually arrange and rotate the cards present on the home page by simply dragging and dropping them to your desired location and can see the portfolio by clicking on it.

13. Small Stone

An unusual navigation that matches the website name. Here the designer has successfully imitated a recording device as a navigation menu.

14. Gleis3

The navigation plan used in Gleis3 website looks somewhat like a road map that leads you to your desired location easily and effortlessly. Simply click on an option and you will get the relevant information.

15. Amore

With a horizontal as well as vertical navigation plan, this website holds its own charm. The main navigation menu is placed at the bottom of the page with some cool and beautiful mouse over effects.

16. Yodabaz

Here the navigation is presented with an animated background image sufficient enough to create that attention grabbing first impression. Clicking on the portfolio reveals some of their excellent work.

17. Sensi Soft

The whole navigation is set to be at the center that makes this website extremely well-organized and easy to navigate. The effects that this website uses are beyond the ordinary mouse over effects.

18. Nickad

Nickad brings flash into play to make its navigation menu and overall website design look stunning. This is something that you will never find in any other website navigation plan.

19. Not Forgotten Movie

The navigation options in this website are in the shape of playing cards and when you put your mouse on it, they will give a burning effect suitable with the theme of the website.

20. 75b

75b also has a horizontal and vertical navigation plan. The main options or menu is placed with the vertical navigation while the sub-menus are placed with the horizontal navigation.

21. Dave

This website not only brings an exceptional use of navigation into play but also experiments with unique typography to set it apart from dozens of other similar websites.

22. Vernon Clarke

Here the whole navigation has been summed up within an icon of a film tape with some small icons on it. Besides that the website also features some exceptional work on the main page.

23. Booma Webdesign

Simple and efficient navigation without extra or jumbled up elements. The navigation used here is also easy to understand for the new visitors.

24. Revolution Driving Tuition

Simple and nice navigation with no more classy effects, even a novice can also understand how this website works.

25. Jeremy Levine

An imaginative demonstration of the navigation menu that makes this website fun to browse. Jeremy Levine takes advantage of its dazzling color combination to make its navigation even more eye-catching.

26. Wards Exchange

The whole navigation has been placed at the side of the website design that makes this website tremendously well-ordered and easy to navigate. The effects this website uses are beyond the ordinary mouse over effects.

27. Sideshow Press

The navigation is presented with some cool and appealing effects giving this website a personal and human touch. Clicking on any option will take you horizontally to the relevant section.

28. Bountybev

Bountybev make the most of its bright color combination to make its navigation even more attention-grabbing. The use of bold typography further makes this website design hard to forget.

29. Noonstyle

Here again, the navigation has been set at the sidebar to make this website look well organized and efficient. When clicked, the website also shows the relevant options in the sidebar.

30. Vanity Claire

Easy and on the contrary an artistic approaches to design navigation for Vanity Claire that not only matches with the main concept of the website but also affords regularity.

31. EwingCole

Here, the navigation options are divided into two parts. The top most navigation reveals the content in the customary style while the second navigation is presented in a somewhat trendy style.

32. Custom Tshirts

Here the main links are presented at the top while a portfolio or T-shirt photo are presented with a mouse over effect that enlarge the photo when you place your mouse on it.

33. Hello Goodlooking

When browsing this website, initially you may feel like that this website does not contain any content but once you explore its navigation, you will love to browse this website more than anything.

34. Christian Sparrow

Christian Sparrow makes use of a simple but attractive navigation plan that not only grabs the attention of the visitors but also creates an everlasting first impression.

35. Enila

Enila has a rather jumbled navigation menu but the side bar at the top of the page makes it simple and easy to navigate, and also add an interesting feel to the design.

36. Salt Films

In this navigation menu the thing that stands out is the animated hand which gives the whole website a very unique and appealing look.

37. Blue Bug Digital

Blue Bug Digital makes use of an animated background that revolves 360 degree providing you a complete preview along with the navigation menu.

38. Section Seven

Section Seven also uses its navigation menu in an extremely creative and artistic way making the whole website look and design visually appealing and remarkable.

39. Sq Circle

While the website loads completely, the message says we are creative and pragmatic. That proves true when you explore the site in detail. The navigation truly is out of the box and extraordinary.

40. EyeDraw

EyeDraw presents a very non-fussy and clean website layout giving its visitors an easy to navigate and understand website. The main options slide to give you a complete preview when you place your mouse on it.

41. Light Motion design

Light Motion design also provides a navigation plan or guide for those who are not very internet savvy. On the whole, the navigation is exceptional and has been designed in a very systematic way.

42. Studio Stemmler

Studio Stemmler combines effective navigation, excellent design and a beautiful color combination all in a one to get this visually appealing and attractive website to the surface.

43. Eric johansson

A fun and irreverent site that also give you the option to view the site in a more traditional way.

44. Iipvapi

Innovation at its very best is what that describe this navigation menu perfectly. Simple but effective navigation with some cool effects.

45. Narrow Design

A vertically sliding navigation menu that moves to the left when one item is clicked giving its details on the remaining part of the screen.

46. Organic Grid

Organic Grid holds a visually appealing website navigation that consists of more than 90% of the main page.

47. Smriyaz

An extremely beautiful website design with neat and efficient navigation menu that guides its visitors how to explore the site to make the most of it.

48. Unfold

Simple but a creative approach to design navigation for Unfold that not only matches with the main concept of the website but also provides symmetry. Simply click on the top navigation links to explore the site in detail.

49. Yugop

The navigation is placed at the bottom of the page with some exceptionally animated effects.

50. Vanalen

Vanalen also presents a very unusual and unique navigation menu that is totally different from the ordinary websites. The navigation plan used in this website is rare and exceptionally creative.

Surprising as it may sound, colleges and universities seem to have finally figured out social media. Long berated for giving only the most modest efforts at developing an online presence, higher education is, at long last, taking the Internet seriously.

As a higher and higher percentage of high school students spend more time online (and on social media in particular), colleges have made the realization that they stand a far better chance of attracting new applicants if they come visit them on their own turf.

The big social media sites have all become darlings of academia, and students seem not to mind one bit—the most successful schools rack up thousands of Twitter followers, hundreds of thousands of Facebook likes, and millions of views on YouTube, likely in large part from current, prospective, and former students.

And though a great many academies remain dinosaurs of Web 1.0, a few prestigious institutions have truly evolved into social media mammoths.

This Infographic from Best Education Sites breaks down the academic web space with some hard numbers, calling out the schools that are doing the web better than anyone else.

Created by: Best Education Sites

A former Social Media consultant at AOL, Greg Voakes regularly contributes his written work as well as Data Visualizations (Infographics) to publishers all across the Web. He is a regular contributor to Business Insider, Guyism, and owns a blog called Fork Party.

Which schools do you think are best represented online? Let us know in the comments!

Sell Anything with the WordPress Auctions Plugin – only $39!

Source

Everything changes. The Internet and web design are certainly no exceptions to the rule.

As we move through the days and months ahead, it’s likely that in short time we’ll find ourselves talking about new design developments that haven’t rolled across our lips or screens yet.

We asked some of the leading web and user experience designers in the field for their predictions about what we might expect to see in the web design world in 2012.

Joining us are: Adelle Charles, Whitney Hess, Lis Hubert, Randy J. Hunt, Franz Jeitz, Michael Martin, Eric A. Meyer, Sarah B. Nelson, Jason Pamental, Jon Phillips, Dan Rose, Jared Spool, Nick Walsh, Tim Wright and Jeffrey Zeldman.

After you’ve had a chance to read their prognostications, please take a moment and tell us yours, too.

  Best wishes for a happy, healthy, and well-designed 2012!

Adelle Charles

I believe a few directions in 2012 will include heavy use of handwritten fonts and an even bigger boom in using font replacement technology (eg. Typekit). More and more magazine and newspaper websites will all jump on the HTML5 bandwagon (thank goodness). You’ll also probably get sick of hearing about ‘responsive web design’ this coming year. Focus and innovation will be on reading and writing apps…how you perform these tasks along with the integration of different platforms. Monthly subscriptions (physical products) will blow up this year and daily deal sites will slow down.

From a visual point of view, I think a lot of web design is too trendy, ‘do what’s hot right now’. I’ve even caught myself starting to do the same thing a few times (you get used to looking at the same websites or apps day in and day out). It can be hard to separate your last visual memory when designing…you just have to be original. Keeping on the original point, I’d love to see designers drop the use of fabric as backgrounds, eg. Mimicking Apple’s new cloud apps (fabric, stitching etc.)

I also hope Internet Explorer gets put to death this year. (Just a wish, I know it won’t happen).

Adelle Charles, @adellecharles, is a designer living in NY. Foodie. Coffee lover. Founder and Chief Product Officer at Tinder, a publishing company which provides publisher tools, subscription and user management to web publishers and a premium reading environment for readers. She also co-founded Carbon Ads & Fuel Brand Network.

Whitney Hess

The rallying cry of the web community in 2011 has seemed to be “make stuff.” My prediction for 2012 is that we’ll soon realize that that was rather shortsighted, and instead will encourage one another to “make stuff that matters.”

I have seen so much incredible talent squandered on designing products that only meet the needs of a small, homogenous, insular group of friends. While this can be fun and challenging for a side project, it is a fleeting satisfaction.

In 2012, mastery of the tools and a cool idea will no longer be enough to get attention. I predict that there will be a widespread movement to uncover and understand deep-seeded, life-damaging problems for sizable communities across the globe, and our efforts instead will be put towards improving their lives and work in ways that empower humanity. Productivity and entertainment tools have their place, but I suspect that we won’t continue to pat each other on the back so vigorously for continuing to crowd the market.

Design is the problem. The social, economic and political environments we will find ourselves in in 2012 will push us towards asking questions before devising solutions, equip us with a longer-term vision, and ultimately deepen our greater purpose.

Whitney Hess, @whitneyhess, is an independent user experience designer based in New York City. She helps make stuff that matters and enhances people’s lives.

Lis Hubert

Now that HTML5 and CSS3 have been unpackaged and utilized, and given the emergence and popularity of responsive and adaptive web design, 2012 will bring us back to the future of the web. After years of driving the two apart, 2012 is the year that we will begin to bring mobile and desktop technologies back together by using the web to bridge the gap between the contexts. From that, we will be focused on designing for a holistic product experience.

Expect to see an explosion of mobile/desktop web solutions that can work on many different devices and platforms. Mobile First as a methodology will grow in popularity, and people will also be thinking more about how their product extends across these many different contexts.

Look for an outbreak in designers and product developers wanting to better understand users in order to create appropriate solutions for coherent experiences. We’ll be looking more and more towards psychology and user research to better understand our user base as well as better translate our product into an interface.

From this we’ll see the appearance of new ways to navigate through site content (in order to stay responsive), as well as new patterns for creating delightful and engaging user experiences online.

Lis Hubert, @lishubert, is a New Yorker, user experience designer, researcher, sometimes speaker and blog writer. As an independent UX Consultant who is passionate about her work, Lis sees herself as a definer and solver of complex problems. Her contributions help in making awesome digital products and services for all us users out there.

Randy J. Hunt

Many exiting things will happen with web design in 2012: further adoption of CSS3, HTML5, web fonts, and “mobile first” as a mindset. The specifics, I can’t imagine. I’ll be surprised—many of us will—and we’ll get excited, beat up these ideas, implement them widely, and push things forward.

I’m most interested in how we, as web designers, will change in 2012.

Designers today have come to a new place: they are conceiving, designing, and branding products of their own. This is especially true when we look at web products. In the past, we’ve been designers that operated as storytellers, wrapping businesses and ideas in consistent narratives communicated with visual wit, novelty, and efficiency. We’d implement those ideas on the web, and we’d do some experiments on the side.

We’re on the verge of something special. Designers are creating products and building brands simultaneously. The product becomes the main expression of the brand and the brand itself can be looked at as a product.

Online and offline have merged, where products and brands are inseparable. In this world the product itself is the expression of the brand. The response to a swipe, a unique gesture, or a notification sound can all establish and reinforce the qualities of a brand. Designers who understand interaction design, experience design, and the building of products will emerge to be some of leading brand stewards.

In other words, 2012 is going to be awesome. We’re growing up and moving fast. Fasten your seat belts.

Randy J. Hunt, @randyjhunt, is Creative Director at Etsy, where he leads the team of designers building web products and creating off-line experiences. Hunt feels strongly that designers must be able to build what they design, a perspective that fits naturally with Etsy’s culture of making and its engineering muscle.

Franz Jeitz

I believe that 2012 will be an organic evolution upon the trends of 2011. Mobile browsing on phones and tablets is only gonna increase which will likely result in even more responsive websites. This is a trend that’s really kicked off. At the same time I also predict to be seeing more native mobile apps.

To predict design trends is almost impossible. However, I think that minimal designs will stay popular with a particular focus on UX design. The same applies to the ever popular vintage/retro design. It’ll probably become more subtle, but won’t go away anytime soon.

With more and more web designers & developers trying to make it in these tough economic times there’ll certainly be a select few who will really set new trends and rise above the average creative. I for one can’t wait to see what these innovators will come up with. Overall I believe that the design & development standards will increase a whole lot. Hopefully we can get rid of ugly websites once and for all.

Franz Jeitz, @fudgegraphics, is graphic designer from Luxembourg who lives in London. Good music, a nice cup of tea and beautiful design is all it takes to make him happy.

Michael Martin

In 2012, I think it’s a given that mobile devices will continue to be a focus point. The interesting part to me will be the battle of native apps vs. HTML5 web apps. Native apps have been leaps and bounds ahead so far, but more and more sites are willing to experiment with HTML5/CSS3.

Not everyone can afford the time to develop a project like that though, and so the majority of sites will keep looking for shortcuts. Services that generate simple mobile sites, or standard native apps will become more popular. And for large systems like WordPress, I think we’ll see more and more people entering the arena of mobile plugins/themes.

I also believe that analytics and data mining will become ever more crucial. As the web continues to fan out over so many different devices, and content is consumed via so many different services, it becomes more important than ever to know which devices and services are bringing benefit to your business, and how you can eek even more out of them.

Michael Martin, @problogdesign, is a web designer living in Northern Ireland. He specializes in WordPress and is the owner of Pro Blog Design.

Eric A. Meyer

The newly emerging design trends of responsive and adaptive web design will continue to gain steam, especially as authors come to grips with mobile devices and what it means to design across form factors.  Closely paired to that will be a growing understanding that mobile devices are a core web experience, not a come-lately add-on.

Standards such as CSS and the DOM will be even more strongly influenced by libraries and preprocessors—jQuery, Less, SASS, and so forth.  The capabilities these tools provide to authors show the working groups what is missing from their specifications, and thus what they need to add—and, in many cases, HOW to add them.

Eric A. Meyer, @meyerweb, is an author, speaker, conference co-founder, consultant, innovator, and advocate of open web standards.  He has been working on the web since late 1993 and lives in Cleveland, Ohio, with his wife and three children.

Sarah B. Nelson

Process-heavy documentation dinosaurs will continue to be marginalized. More designers will embrace – and love – agile methods. Which is good news: business leaders will realize that developers now out-pace designers. They’ll expect us to catch up.

If you aren’t familiar with Eric Ries, Business Model Generation, and Steve Blank’s Customer Development Methodology, you should be. The Lean Startup folks build something, test it, evaluate the results and then repeat the cycle. Why mention it? Lean Startup is essentially an agile (with a lower-case ‘a’) approach to user-centered design and product development. At Lean Startup day at SXSW, guess who wasn’t part of the conversation? Yup, designers.

Despite the growing understanding that design can make or break a product, designers are still seen as a cost center. We don’t do ourselves any favors. A lot of us insist on lengthy, expensive, start-from-scratch, research-heavy processes. Some of us are testy perfectionists, loners, or just not real collaborators. A lot of us spend precious hours creating heavy documentation that is dated before it is completed. Sometimes this is appropriate, but most times it isn’t.

This year, re-imagine the way you work. Resolve to develop your prototyping skills. Get good at sketching in front of people. Learn to facilitate design conversations. Experiment. Question old methods. Get close to agile developer and learn a thing or two from them. These are exciting times—shape the future!

Sarah B. Nelson, @sarahbeee, is the Chief Instigator and Igniter of Passions at Tapir & Tine. Tapir & Tine helps organizations transform from design followers to design leaders through disruptive training, coaching and facilitation. Sarah has led teams at Adaptive Path, Hot Studio, and holds a Master of Design Methods (MDM) from the Institute of Design in Chicago.

Jason Pamental

Web fonts arrived at the top end of our industry with amazing work done by some of the best designers. But we haven’t reached critical mass in adoption, much less awareness. We’ll see that wave start to crest with greater effort in education, the arrival of books on the topic and marketing efforts on the part of Fontdeck, Monotype and Adobe. We’ll also see an increase in creative use of web fonts and more competent implementation of them. I also expect to see new technologies emerge for faster service and better integration in the design process itself. Typecast looks promising as a ‘design in the browser’ tool for type, plus there’s WebInk for using web fonts in Photoshop.

Second, I think we’ll see Responsive Web Design mature and mean more than ‘a better skinny column’ (usually the ‘first effort’). An important step, but we should start to see more creativity applied at the wider end of the spectrum plus better developments in responsive images. A post from Paul Boag outlined an approach using Media Queries to detect height in addition to width –  coupled with widescreen displays this opens up fascinating potential for editorial design that we weren’t really capable of doing previously.

Finally I think we’ll see more designers get to know a CMS and use them in interesting ways. With mobile-targeted and responsive themes, the possibilities for app design and prototyping within the CMS can radically change what individual designers and small teams can accomplish. Projects that took months, dozens of developers and $500,000+ to build can be done by one or two people with a decent open-source CMS like Drupal or WordPress (or Expression Engine for a small cost). The tools have matured such that opportunities to efficiently do large-scale work is just unprecedented.

Jason Pamental, @jpamental, is a web strategist, designer, technologist, speaker, writer, teacher, and irrepressibly curious about almost everything. Always ready to share unsolicited advice, he’s also working on a book about web typography for O’Reilly due out in 2012.

Jon Phillips

Obviously the whole responsive and adaptive web-design concept will keep growing and gain the interest of more and more web-designers in the years to come. I don’t think it is a trend, and I don’t think it will go away anytime soon. In fact, I think it’s now a standard.

Of course responsive web-design means we need new tools and techniques in order to make our lives easier. jQuery plugins like FitVids and techniques like the Elastislide are excellent examples of what can be achieved and what we can do.

I think that in the next year we’ll see a lot more companies and individuals backing either the use of CSS3 Media Queries and responsive web-design, or backing the idea that mobile sites should be complete separate versions. I’m sure we’ll see a lot of breakthroughs in both clans. I’m certain there will be a lot of heated debates (all to make the web move forward of course).

Speaking of responsive web-design, I’m positive we will see a lot of changes in advertising and how ads are displayed on the web. We may see a shift in how people monetize their sites and develop streams of revenues. Responsive ads is one thing, but I think that adaptive web-design means more than just throwing in some media queries, it means we have to re-think how content is laid out, and that also means we have to think about advertisements.

Another prediction—which isn’t really a prediction but rather stating the obvious seeing what’s already happening out there—is I think we’ll see even more sites using of services like TypeKit and FontDeck to display beautiful typography on the web.

Jon Phillips, @jophillips, is a UX designer, musician & entrepreneur. He’s currently working at BuySellAds on their Yoggrt, AdPacks and FusionAds networks.

Dan Rose

While I do see responsively designed sites continuing to be all the rage in 2012, I can imagine designers finally considering content strategy more consistently as positive fallout. Since we have the tools to build sites front ways and back ways, I think content finally gets it’s time in the limelight next year. We’ll start considering what content needs to be served up to a mobile user instead of just reformatting desktop content. Hopefully.

I wouldn’t be surprised to see a movement of design education, involving sites that detail the fundamentals of design theories, typography, shape, color, and the like. It’s only logical considering how much the design & development community openly contribute to it’s education already. We’ve recently started to see kerning and letterform games from Method to Action that support this.

Conversely, I can see web designers abusing webfonts and style trends by not exercising enough constraint.  We’ve unintentionally been caught up in the visual appeal of work we see on Dribbble and hence, we try to replicate style without purpose, myself included. Foundations and fundamentals of solid design, not style, should propel our projects. A knowledge of the “what” and “why” in typeface choice also needs to be evident–I’m just not sure it’s widely adopted yet, or will be anytime soon.

I’m thrilled to be a part of the design community, and I hope 2012 brings an attention to higher standards and thoughtful purpose in our designs for us all.

Dan Rose, @dblizzy, is a User Interface Designer in Syracuse, NY. He’s the author of the Photoshop Etiquette Manifesto for Web Designers, and he writes and speaks about employing higher standards.

Jared Spool

I predict that demand for designers will grow even stronger. It’s clear that the business world is paying attention to the success of organizations, such as Apple and Cirque du Soleil, that have taken over their industries by providing better designed products and services than everyone else. In the boardroom and amongst the executive team, good design is now desirable and worth investing in.

With this increased appreciation for design, comes an explosion in the demand for good designers. While the current largest demands are in big centers, like Silicon Valley, New York, and Seattle, I predict we’ll see a global explosion for talented designers anywhere products are created and services are delivered.

The most sought-after designer will be the person who can do a bit of everything. The majority of organizations that will be paying big bucks for great designers in 2012 won’t be the usual agencies or big corporations with established design practices. They’ll be organizations hiring their first designers, and they’ll expect them to have a broad set of skills.

This means these designers will need to know how to run a small design shop, structure their work, produce the visuals, do the research, create the interactions, build the prototypes, and communicate their vision to the folks doing the implementation. Designers will be designing every aspect of the product or service, not just putting a glossy sheen or spec’ing out wireframes.

My prediction: 2012 is the year of the designer. Are you ready for it?

Jared M. Spool, @jmspool, is the founder of User Interface Engineering, the largest usability research organization of its kind in the world. Jared spends his time working with the research teams at the company, helps clients understand how to solve their design problems, explains to reporters and industry analysts what the current state of design is all about, and is a top-rated speaker at more than 20 conferences every year. He is also the conference chair and keynote speaker at the annual UI Conference and Web App Masters Tour. You can follow Jared’s musings at @jmspool and his research at @uie along with a wealth of resources at uie.com.

Nick Walsh

Look for continued growth and definition of the front-end specialization to bridge the void between designers and developers – it’s not just for large agencies anymore. The technologies behind the user interaction layer will continue increasing in density, and preprocessors (Sass, LESS, CoffeeScript) will only become more ubiquitous as a means to cover nagging shortcomings. With these tools in hand (especially the color functions found in Sass and LESS), rapid in-browser prototyping and design should become more commonplace.

As entrance barriers fall in the world of Git and Github, the prospect of more designers taking part in open source projects is an exciting one. With competitive interfaces, look for these projects to gain larger layperson audiences – and provide a means for upcoming designers to prove themselves outside of unsolicited redesigns.

Mobile first and responsive design are already well entrenched, but it feels as through we’re about to cross the largest threshold – those terms becoming part of the client vocabulary. Rather than needing to convince clients of the benefits that come with increased costs, they’ll begin asking for these techniques specifically – or, at least, become more attuned to the need as more examples become available.

Nick Walsh, @nickawalsh, is a front-end developer and occasional designer at Envy Labs in Orlando, FL, as well as a significant contributor to the interactive training startup Code School.

Tim Wright

I believe that 2012 will push us even closer to the “One Web” ideal that we have all been talking about since the early inception of Web Standards. Designing for a specific device, screen resolution or even bandwidth will officially be a thing of the past as browsers get more advanced access to devices. This prediction comes in two parts:

First, I predict that the Device API that Mozilla and the W3C are working on right now will be flushed out and completed by mid-year; and strongly supported in most versions of mobile WebKit and mobile Firefox. As we gain fine-grain access to things like the camera, accelerometer, battery life, and detailed system information we will be less inclined to build in anything other than HTML, CSS, and JS. The Device API coupled with, the 2011 monster, responsive design will help us create rich applications in the browser and lead us towards what is truly “One Web.”

Secondly, I think that as we build our applications that scale across all platforms and devices we will hit a performance barrier. The finger will be pointed directly at JavaScript and in many cases we will have to ask our selves if a library the size of jQuery is hurting or helping us in the long run. I think the more advanced applications will shy away from larger libraries and ether lean towards writing native JavaScript or using a small more targeted library for the job.

Tim Wright, @csskarma, is UI and UX designer at Boston University and has been been building weird stuff since 2004. Constantly looking towards the future and what’s next with the Web. “If you never question the status quo, you will never make progress.”

Jeffrey Zeldman

Mobile first, responsive design, and mobile-first responsive design will continue shaking up (and shaping up) the industry as we respond to an ever-changing plethora of always-connected internet devices of varying capabilities and screen sizes, helmed by users at widely varying sophistication levels in disparate, highly specific contexts. As this way of designing and developing is currently a vanguard activity, necessity will make it the norm. And as it becomes the norm, committee-driven turf wars that fill home pages with crap no user wants or needs will go the way of the dinosaur. We will also continue to wrestle with content strategy as it applies to the shifting contexts of mobile, desktop, and netbook. Anyone not using progressive enhancement to put content and the user first will find their apps and sites losing favor with viewers. Smart phones with advanced browsers and small screens will put web standards, accessibility, and usability front and center, where they have always belonged.

Jeffrey Zeldman (@zeldman) founded Happy Cog studios, wrote the industry-changing Designing With Web Standards, founded and publishes A List Apart Magazine, co-founded A Book Apart, co-founded the design conference An Event Apart, has one daughter, and lives in NYC.

Curated exclusively for WDD by Debbie Hemley, @dhemley. Debbie is a blogger and social media aficionado. She works with businesses to develop content and social media strategies. Read her blog posts on All the News. You can also follow Debbie on Google + and LinkedIn.

Thumbnail image by: Steve Dean

Now it’s your turn. What are your Web Design Predictions for 2012? Share your thoughts in the comments below.

Sell Anything with the WordPress Auctions Plugin – only $39!

Source