There is one simple color rule that has helped me endlessly in my designs, and I learned it in junior-high school. Unless you absolutely need to, never use black. It sounds strange to many, but it is a rule I live by now.

When you see dark things, it is common to assume they are black. It is actually very hard to find things that are pure black. It is possible, but most of the common things you will think of aren’t. Roads, for example, are not black no matter how recently they were paved.

Not even shadows are black. Any good painter knows this. Shadows are tints of a background color, and they are pretty much never actually black. They also reflect what type of light is being cast.

Now the reason it is important to note how hard it is to find a pure black is because pure black always overpowers other colors by comparison. It just does not naturally sit with most color palettes.

This goes double for web design. Even in apps or sites that seem to have black as a prominent part of the color scheme actually use dark grays, which are muted so they sit better in the composition.

Ian Taylor Storm, co-founder of Segment.io, also warns about the importance of saturation. Adding some color to grays helps liven them up a little. If you have a really dark gray, saturate it really heavily. Light grays will only need around 3%-5% usually.

The design for Facebook is a great example of this idea. All of the grays are saturated with the trademark Facebook Blue. The same goes for Facebook’s apps.

There is always a time and place for pure black, but it should be a rare occasion. Usually, a more natural color will suit your needs much better.

 

Multimedia is clearly a popular form of communication online, but classic text is still the standard for effectively communicating with visitors. You would think, with close to a decade of the internet being accessible from most homes, most site creators would know how to handle text, but plenty are still struggling with text presentation.

So how can you make sure your content is readable? Well, there are some things you should know first. For example, reading online is 25 percent slower than when reading printed material, and according to a Nielson study, visitors are only reading between 20 and 28% percent of the words on your page. When reading printed text, readers usually take in every word, but online visitors scan, and hop from place to place.

But, we have eight ways to help you make your content more readable and help you communicate with your visitors.

1) Pick You Fonts Wisely – It hasn’t been this way forever, but thanks to web fonts, designers are able to use any font they want in their designs. This can be a gift and a curse though. While creative use of fonts can improve a page, it often comes at the expense of readability.

You can use more creative headlines because they are shorter and often larger, making them easier to scan. Just make sure the font utilizes both capital and lowercase letters. The height makes scanning more easy. For body texts, always use clear sans-serif fonts. On screen, serifs can blur together, so while serif fonts make printed text easier to read, they actually impede the process online.

2) Font Size & Line Spacing Are Important – As a designer, you should be designing for the huge range of internet capable devices out thereand their widely varying screen sizes. This is why using a fixed font size can work on large desktop screens, but often are far too big for mobile. The modern web design requires a flexible approach and percentages rather than fixed heights adapt to personal browser settings and varying screen resolutions.

When picking font sizes and line spacing, remember that the standard line height is too small. More room equals better readability.

3) Use High Contrasts – You never want your text to bleed in to the background. The more contrast between the background and text, the more readable text will be. It is also true that noisy backgrounds make almost all types of text unreadable. If you are going to place text on top of background images, make sure it is placed in the least busy area of the image, like maybe a blurred out area, or areas lacking texture. Another way to deal with this issue is placing an extra layer between your image and the text. This will help seperate the two.

4) Keep Lines Short – Because readers online tend to only skim, you want to keep your lines of text short. The best length is between 50-60 characters. If your lines are bigger, some readers may not even skim because the text appears overwhelming. They may think it will take too much time or work to read. Long lines also make it harder for your eyes to jump from one line to the next.

One way to get readers engaged is to start each article with short lines. Keeping the intro short and inviting helps hook the reader, and from there, expanding the text is more accessible.

5) Keep Paragraphs Short – 75 percent of readers online are estimated to not read websites word for word. They scan for what is most relevant to them. You want to keep your readers attention, but you also want to make sure anyone skimming your content can find what they are looking for quickly and easily.

6) Cut to the Point – It is common for writers to ramble for a few reasons. It is easy, and in print media, it helps make readers feel like they got their money worth. On the web, readers don’t care about the picture you paint with your words and they will leave if they can’t find what they are looking for.

This also suggests that simple sentences and vocabulary are more attractive to readers than long verbose sentences. If you have a new point, start a new sentence. It may seem weird, but it helps readers scan for what is important.

7) Avoid Jargon – Of course you want to appear to be an expert in your field, but you should also realize most experts are able to explain what they are talking about to the average person. Being able to simplify what you are talking about to the level a child could understand shows a real command over the technical and complicated information you possess.

Trying to use too much technical jargon can intimidate users, or make them feel like they need a dictionary near by to get through your post. This usually results in the user leaving. Instead, try to think like a normal person. Keep your posts accessible, and easy to understand.

8) Use Highlights, Lists, and Images – This also deals with the scanning nature of your visitors. Highlighting relevant keywords can help identify the main points of the paragraph, and lead reader’s eyes to what they are probably looking for. Likewise, structure your content in a way to help readers. Lists lay out specific ideas in an easily searchable format, or lay out step by step guides clearly. Images also help people stay focused on your post, especially when using image captions that act as reference points.

It is easy to see that most web readers are lazy when it comes to reading, and you want to make sure you are catering to their needs. Formatting your posts in a way that accomodates the scanning nature of online readers will actually help make viewers see more of your content. It may seem backwards, but simplifying your page format and structure can help keep readers on your site longer.

For more ways to improve your site’s usability, check out Sabina Adler’s posts at Usabilla.

 

Effective visual communication is as much a part of web design as any other aspect. It is crucial in making a site look appealing, but it also does a much more important task. Effective presentation of information and functionality is an essential aspect of having a good site.

Think of it this way – if a site presents information effectively and has a user-friendly interface, it is still useless if the site is ugly or doesn’t match with the client’s brand image. Conversely, no one will wait to see a nice looking page if it takes forever to load or is a pain to navigate.

Remembering that, here are some simple and short tips to help you build a website with better visual communication.

  1. Don’t make users work – Make sure all your content is well organized and easy to get to. Visitors don’t like to waste their energy trying to find content. Your design should be a helpful conduit between the user and the information, not a hassle they have to work past.
  2. Don’t make them wait – Try to optimize your graphics so that they load quickly. No matter how fancy a feature of your site is, users will be unhappy if they have to wait for it to load.
  3. Make sure your navigation is usable and easy to find – This is similar to point one, in that users don’t like to be forced to work to navigate a site. They want to be able to travel anywhere on your site with just one or two clicks. Having a lot of content isn’t worth anything if users can’t get to it easily.
  4. Keep a consistent theme – Make sure every page looks like it belongs to the same site. you don’t want to confuse your visitors or make them think they accidently left the site.
  5. Remember the basic rules of design – No matter how much you like a design, keep in mind what the client and the audience wants. As much as you want to make sites that are fun to make, the designer is usually not the target audience.
  6. Be aware of emerging technology – There is a bit of conundrum with keeping up to date with the latest web technologies. They tend to make better looking sites and are more fun for designers to play with, but they also tend to not work well with older browsers. However, if you learn them now, you will be prepared to implement these technologies when they finally are made compatible with the wide range of browsers.
  7. Try to make your site as accessible as possible – You never know when visitors may have special needs or disabilities and you never want to make them feel left out. Make your site easy enough that children can operate it. You won’t ever have a customer complain because the site was too easy to use.
  8. The site was made for a purpose – Sites are made to sell products and services, showcase work, distribute news, and a number of other things, but few are made to simply look pleasing. You are trying to appeal to an audience, and your design is supposed to serve that purpose.
  9. Design is all about the user – Try to think like a user and not a designer. Keep it simple, appealing, and most of all, easily usable.

If you remember these rules, your visitors and clients should always be happy.

Spyros Thalassinos has even more great tips at Make Your Ideas Art.

 

In a constantly changing industry, it can be difficult to predict trends for the future. For designers, this means heightened responsibility during transition periods. Designers have to be able to create client pleasing designs based on what has been popular this year, while also constantly learning new tricks to innovate for what is to come. Hopefully, these predictions can help you be prepared for some trends that should become popular within the next year.

  1. Responsive Web Design – At this point, this prediction is more of a foregone conclusion, as new kinds of mobile and desktop devices are constantly being released into the market. Each device has a unique screen size, proportion, and resolution. To create specific websites for each device would cost you a fortune in time and money, and responsive web designs eliminate all of these problems by responding to the size of the device accessing the page. Designers won’t need too make new layouts for different devices, when a single layout will work smoothly with all devices.
  2. Designed Typography – There have never been more fonts and variations for designers to work with than there is today, and choosing what typography to use is always an important decision. In the next year, it seems this will only become more important  and typography may finally cement its place as an essential part of design. Typography is the foundation of any website, and it is time it received recognition.
  3. Vertical Scrolling – Optimizing websites will continue to lead to crucial decisions for layouts. Many websites are still using vertical and horizontal scrolling, but through the next year vertical scrolling will become dominant. Vertical scrolling is convenient and easy. It also allows implementation of vertically scrolling buttons and header menus. All of these features combined make for user friendly navigation across your entire website.
  4. Big Buttons – More and more sites keep optimizing for “touch and tap” on mobile devices, which means buttons are getting bigger. Originally, these large buttons were being used to try to streamline pages and make them more visually pleasing, but they also make using pages on mobile devices infinitely easier. The only drawback is these large buttons require more graphics, which slow down sites. Hopefully designers can find ways around this, or this prediction may never come to full fruition.
  5. Branding Will Take a Hike – All business want their brand to be recognizable, and the year ahead of us seems more likely to focus on designing the brand, rather than trying to build a website based on the newest trends. Designers will choose things that complement the brand rather than choosing features that seem popular at the moment. It will become more important for designers to focus on translating a webpage business through the webpage and represent the brand’s image.
  6. Parallax Scrolling Will Rise – Parallax scrolling has been around for some time now, but it has mainly been used in video games  This year, it seems likely to finally transition to the web. This feature allows designers to control the depth of design objects on the webpage being designed.

While these are only predictions, many of these seem undeniably likely to come true. By studying what looks likely to become popular, you can be on the cutting edge of web design, rather than always playing catch up.

For examples of these predictions, check out Ali Qayyum’s article at Smashing Hub.

 

It is becoming undeniable that responsive websites are becoming the norm. As more people use tablets and smartphones to browse the internet, responsive web designs that easily adapt to different devices are becoming the smartest way to design a site.

The problem, as with any new design method, is getting started when you don’t know much about making your site responsive. Luckily for anyone with this issue, we have a comprehensive infographic from Helen Bailey at Demortalz that covers all of the basics of responsive design, from basic vocabulary and suggested reading to free PDF books and a suggested toolkit. There is even a dynamic version available that is designed like a game.

No matter which version you prefer, this infographic will help you get started making responsive designs which are quickly becoming standard.

 

 

As a web designer or developer, it’s always important to understand what the client wants. That’s why it is strange how few designers and developers understand online marketing.

Understanding and implementing online marketing give any developer or designer a great advantage in the marketplace and promises much more of a long term reward than those that fail to learn about online marketing. This isn’t to say neglecting your designing or developing skills is a wise decision, but by combining your skills with online marketing, you can do three things:

1) Get more clients – When clients post ads for developers or design jobs, they often get responses detailing what features and formats the person could implement. They promise so many pages, or list how they are proficient in HTML5, jQuery, and W4C standards. This may seem like a great approach for contacting potential employers, but it has a great weakness.

Potential employers want to know what you will do for them, and what they want you to do is make more money. Employers want to hear that you will raise the number of subscribers a certain percent, or will raise their revenue. Wether you use HTML5 or jQuery is not of much importance to them.

There are plenty of good web designers that can make nice looking websites, but there are way less designers that know how to increase sales. Those that know online marketing will get the better clients, and higher rates.

2) Build Your Brand – The biggest problem for every freelancer is building a base of clients. It would be great for clients to just come to you ready to pay however much you want, but that is a fantasy. Or is it?

Building a strong personal brand online attracts clients by exhibiting your skills to them beforehand. This can be fairly difficult and requires a lot of perseverance, but there is a basic pattern. First, you build a popular blog, followed by establishing a decent social media following. Then, you participate in outside activities like conferences, and make yourself known about.

This path does two very important things for you. It establishes you as a reputable expert, and gains you tons of publicity many would pay for. When employers need work done, they go to the experts they know first, and if you’ve built a strong brand, they will know about you.

If you want to know more about building a personal brand, I highly recommend watching the TED talk by Jacob Cass.

3) Earn extra income – Freelancing is far from a stable career and anyone should be prepared for unexpected problems. That is why it is important to make yourself as financially secure as possible before the problems arrive.

One of the best options for securing your finances is to diversify your streams of income between client work and passive income. If you are already perceived as an expert in your field, creating a passive income shouldn’t be difficult. There are a slew of monetization options, such as creating and selling your own products or even simply displaying ads on your site.

It does take effort to create a product, and even more to market and sell it, but it could be extremely important in your future.

Think of it this way, if you want to run a local bakery, you have to be as good at business as you are at baking. Otherwise, the business won’t get off the ground. The same goes for creating a business online. If you want to be successful online, learn online marketing.

 

If you want to learn more about online marketing and the mistakes you can make while starting out, read more at 1stwebdesigner.

 

No other industry has benefited from the internet more than the business industry. The internet has given businesses easy ways to market their products or services to a wider audience, and now the creation of websites that appeal to specific audiences is one of the most important aspects of business marketing.

If you are in charge of creating a website, you want to make it eye-catching, but you also want to avoid simple mistakes that make your audience want to go elsewhere. Lewis Hooker at Graphic Design Junction has a list of 8 things to avoid if you want people to keep coming back.

  1. Do not make the design complex – It’s easy and sometimes fun for a designer to be a little overzealous and include a lot of features in their design without considering if these features are really necessary. Going overboard is never good in the long run. Complex designs with an abundance of features make navigating websites difficult and confusing for many visitors. Even worse, it makes changing and adjusting your site later a real pain.
  2. Do not exaggerate the use of Flash – It is a common mistake for web designers to over-do it when using Flash animation. Flash can certainly be a nice touch on a site to make the page a little more eye catching, but too much is always a bad thing. Too much flash slows down your website’s loading time drastically, and visitors often leave if they get tired of waiting for a page to load. If you want to use Flash, just remember that less is more.
  3. Do not use “fancy” fonts – Some designers like to use highly stylized fonts to class up their pages a little. While a nice font can help grab visitor’s eyes if used right, fonts that are difficult to read frustrate viewers. If you want to use a distinct font, go for it, but if you can’t immediately read the text, go with something else.
  4. Do not use music of audio files without permission – Lately many website designers have been including music players within their sites that automatically play music when the page loads. Many visitors find these annoying, and worse, they can get in the way as well as slowing down load times. If you feel it necessary or relevant to include a music player, always remember to give users control to pause or mute the music.
  5. Do not hide the links – Some designers often forget to highlight links on their websites properly. Links are obviously essential to navigation, and users want to be able to navigate websites as quickly and easily as possible. Therefore, always highlight links properly so users can get around.
  6. Do not use pop ups – I don’t know why any designer would use pop ups anymore. They are annoying, and most browsers have software built in to block them.
  7. Do not ask for registration – There are times when asking users to register before accessing content is necessary, but if it isn’t absolutely required, avoid registration. Most viewers will be put off by having to enter their information to see content that should be readily available.
  8. Do not subscribe the visitors to newsletters without their permission – Doing this will make your visitors angry. Period. No one wants e-mails from a website unless they signed up for them. Just don’t do it.

These tips are simple and to many visitors, they may seem like common sense. However, we still see them everywhere. If you want your website to be a success, just follow these rules. Your visitors will be happy and so will your clients.

 

Neglecting design is unforgivable in the online world. Having a good design is the difference between a good user experience and a frustrating one, which in turn makes the difference between success and failure for your site.

Good design is a main component of what made Facebook and Twitter rise above other social media sites. Using attention grabbing compositions keeps people reading. It also improves your site’s reputation. Hopefully these design tips will help you attract visitors to your web page and keep them there.

  1. Don’t crowd your page With Ads – Advertising may seem like a great money making method, but if you go overboard with ads, your site will look bad and users will be put off. Your sidebars should be places of content, not clutter. You don’t want to distract people into leaving your page, do you? If you decide to go the ad route, remember that less is more. Integrate the ads into your site’s appearance and try to only allow ads that are relevant to your content.
  2. Use Images Strategically and Professionally – Having high quality and professional pictures on your page can be a great boost to your aesthetic. Too many photos, however, and you run into the same problem as with ads. Too many pictures can overwhelm the viewer, and more importantly, they can make the site just look like a mess. Choose images carefully so that they add to your content, and not distract from it.
  3. Use a Professional Header Graphic – Your header graphic is at the top of every page a visitor sees. It affects their interaction with your entire website. So, you could say having a professional header graphic is fairly important to your user’s overall experience. If you aren’t a professional designer, this is one area where hiring someone is for the best. Make it clean and simple. You want to draw in visitors with a stylish and classy header, not bare down on them with clashing graphics and text.
  4. Use a Color Scheme That Highlights Your Content – The best color palettes for web sites are those with a few relatively similar colors. Complementary colors or colors close to each other on the color wheel help make sure nothing clashes, and that you don’t distract from content. You want your design to bring attention to the content in a positive way and not overwhelm.

Making sure you follow these rules for your site’s design can help improve your visitors’ experiences. Happy viewers makes for return visitors and more time spent on your site. By using a design that complements your content, your visitors will feel naturally drawn to it and they’ll be much more likely to stick around.

For more suggestions on web design, look at Sarah Arrow’s article at Sark e-Media.