Payment of ₹ requested by HONEY VIG. Click the link to pay securely via Razorpay: Make 5000 payment Payment of ₹ requested by HONEY VIG. Click the link to pay securely via Razorpay: Make 5000 payment ⭐ If you would like to buy me a coffee, well thank you very much that is mega kind! : https://www.buymeacoffee.com/honeyvig
Hire a web Developer and Designer to upgrade and boost your online presence with cutting edge Technologies
Showing posts with label web designer. Show all posts
Showing posts with label web designer. Show all posts

Tuesday, January 5, 2016

LOL Client Emails That Designers Hate To Receive

We have compiled a funny list of client emails that designers absolutely dread receiving. Most of them are plain old client stupidity, but some (like the payment-related ones) are just pure evil. Check out the compilation below.




















They’re all cringe-worthy but no. 5, 7 and 10 take the cake. Have more to add to this list? What’s the worst/funniest client email you ever received? Share this post and your views in the comments below.

Wednesday, September 3, 2014

Responsive Design: The misunderstood genius

"You know my website supports any platform or screen size. My web designs are completely responsive and we care about our customers".
You might have seen a lot of web development companies flashing similar messages across the world wide web. Claims of responsive web designs and customer satisfaction are neither faulty nor malign, they are simply naive. The responsiveness of a website is so much more than adjusting to a smartphone or a tablet screen. Don't get me wrong, even I harbored a similar notion about responsive web designs for a very long time until recently I was enlightened which now I wish to share with you.
Definitely, the basics are still the same, about a design which is platform independent but when we claim to "understand and care" for our customers I suggest you, pause and introspect whether or not you have understood what makes the crowd tick.
Responsive design takes responsible designing and a knowledge - performance often trumps aesthetics, as seen in case of a particular Finnish mobile company (if you know what I mean). This harsh but true fact should be the lead driving force behind any idea, code or design. Every user craves an optimum performance, a webpage loading on a device within 1second is considered to be the best, good looks would definitely not hurt. The perfect amalgam of beauty and performance can drive your sales beyond imagination.
It is never too late if you wish to tweak the design or code a little bit. Although there is no universal solution to improve the code, some healthy changes can definitely be done -
  • Oh, so haven't started with the design yet? Good, now remember to use mobile first approach, period.
  • In a responsive layout change the structure of the document but never change the content or URL while delivering it to other devices.
  • Performance should be regularly measured and improved upon using optimization tools.
  • Browser resizing is not a legit test. After the resources have been loaded and display:none is applied check it on different devices.
  • Only load the JS (JavaScript) with conditional loading required for the current device or subsequent to onload event.
  • Using srcset attribute to deliver images by JavaScript.
  • Forefront should showcase above-the-fold content in a mobile device while the initial viewing should be inline.
  • Implement smart methods to responsive web design solution like group based responsiveness, adaptive approach (server side layer) and conditional loading.
Once you familiarize the real deal about responsiveness it will seem so much more than what it appeared from its name. It had been there all along we simply failed to recognize it. Now, you may agree or disagree with me but at least we should be in consensus regarding what our end game is. It is not a groundbreaking technology, code or a design. It is simply is user's happiness.

Tuesday, May 6, 2014

How to Fire Bad Clients

We are used to reading advice on how to attract and keep clients, but sometimes things don’t go exactly as planned in a business relationship. The more common scenario of a relationship gone bad is when the hired person (the web professional, in our case) is fired because they didn’t render the services as expected.
It’s more unusual to hear stories of the hired professional walking out on the client. We don’t hear about it because the client is supposed to be king, and we are supposed to keep them satisfied.
But what do you do when the king becomes a tyrant? You may decide that it would be best to fire them.

Under what circumstances should you stop working with a client? Can terminating your business relationship with someone be done gracefully? Most importantly, what can you do to avoid such unfortunate working situations?
In this article, I’ll talk about the sensitive issue of letting go of problematic clients.

How to Recognize Bad Clients (The Usual Suspects)

First off, let’s define what we mean by client. The client is the person you’re already working for, with whom you have some sort of agreement with to work on a project-by-project/contractual basis.
If you haven’t settled on the project’s main terms (such as timetable, communication methods, project outline, payment rate and methods), then the person you’re dealing with is just a potential client.
This, too, is a critical stage; you should try to learn as much as you can about them before they become your client so that you can properly decide whether they are the right person to work with, and whether you’ll avoid trouble later on.
The threshold for firing a client is different for every working professional. However, there are some fundamental things that must be present and maintained in any working collaboration and some things that shouldn’t be tolerated.
Below are a few client types that might sound familiar to you.

The Unreachable Client

A project cannot materialize if the client doesn’t communicate with you. If the client doesn’t return any of your calls or email within a reasonable amount of time (say, five work days — but this duration varies depending on your work style and client agreements), one of the following might have happened:
  • Something unforeseen might have happened (for example, an illness)
  • If you have delivered the project, the client might be avoiding payment
  • The client might be experiencing financial difficulties and wants to discontinue the project, but either wants to avoid the penalty (in case one is stipulated in the contract) or doesn’t know how to tell you (this has happened to me, and it’s usually small businesses that have this issue)

The Procrastinating Client

Another issue is when the client doesn’t communicate with you often enough or according to the project’s timetable. This can prolong the project, sometimes way past the timeframe you set at the beginning. It could also start to eat into the time that you were expecting to devote to other work. Such situations can really mess up your schedule and work efficiency.
Clients who don’t communicate often enough might be experiencing the following:
  • Not consider this project important enough to adhere to the timeframe you’ve agreed on
  • Arranged this project at a bad time, when they’re distracted by other important work
  • Slow in making decisions
  • Does not appreciate the trouble they’re putting you in by slowing down the project

The Absurd Client

There is sometimes a fine line between keeping a client satisfied while maintaining your professional identity versus letting the client behave like a spoiled brat. (The Oatmeal offers an accurate comic depicting an absurd client).
An absurd client usually combines some of these behaviors:
  • Rejects several demos without giving sufficient criticism or suggestions, leaving you to guess what they dislike ("I don’t know what’s wrong. I just don’t like it.")
  • Requests features that were not in the original agreement, and then refuses to pay for extra services rendered
  • Makes unreasonable requests, usually with delivery time ("I would like four different versions of the website by tomorrow night, thank you!")
  • Is unable to make decisions, forcing you to make constant changes to the project. Even if you are being paid for these endless changes, focusing on and delivering a project that doesn’t have a stable foundation is impossible.

The Disrespectful Client

" My teenage kid could do this!" We’ve probably heard something like this before. Frequently, our job isn’t taken seriously, even though we’ve been hired and paid to do something the client is unable to do so by themselves.
In your career, you’ll come across people who don’t quite understand what you do. A disrespectful client does not treat you like a professional and does not understand that you want to collaborate and offer your knowledge to the project.
They will act bossy, insist that they know what’s best for their web presence, assign you tasks without consultation, and neglect to ask your opinion on key matters. Even worse, they might communicate with you disrespectfully.

The Disappearing Client

This one is plain and simple: the client refuses to pay you, whether for the deposit, an extra feature, the remaining balance or the whole thing. And they give no explanation for this delay or refusal. It’s one thing if the client says that they can’t pay you yet because of some unfortunate turn of events and reassures you that you will get your money in a set period of time. It’s quite another if you deliver the project and the client disappears from the face of the earth.
Some client will string you along, always postponing payment, using insufficient excuses, and generally avoiding communication, usually hoping that you’ll get tired of waiting and give up.

How to Avoid Bad Clients (Reducing the Risks)

You can do two things to minimize such conflicts with your clients. First, learn as much as you can about a potential client, and consult with them thoroughly beforehand.
Secondly, be very precise about the project’s terms.

 

Step 1: Education

To learn about a potential client, try to meet with them at least once before agreeing to work on their project. Give them the freedom to ask whatever they want about your work (projects, education, philosophy, style, technical matters), and still cover the areas that you believe are important but weren’t asked by them.
For example, I don’t work with Flash websites. Some of my potential clients have seen Flash websites but didn’t know that’s what they’re called or didn’t know that each website is built on different technologies, and so they didn’t ask about it.
I always inform them right from the start that I don’t do Flash websites, as well as other things that I do and don’t do, so that they know not to request it later on.
The initial meeting is also crucial to identifying how the person views your work and what priority they give to it. They should be interested in knowing about you and how you work, and they should give you the feeling that they trust you and value your opinion and assistance as a professional.
You also ought to ask your own questions of the client, to get a feel for their organization.
Ask about the client’s history, products, philosophy about the market, and current projects.
Be delicate in asking about their financial status; you could make a general inquiry about it when they ask about your pricing. For example, you could mention that you have flexible payment plans in case they are financially constrained; they will usually volunteer some information from this.
Also, don’t forget to ask whether they have worked with other designers or developers on a web project. If so, inquire as to why they are switching service providers, rather than giving this project to them. The reasons could be simple, perhaps they are looking for something more creative or technologically complex, or it could be complicated, such as payment issues, disagreement about pricing or dissatisfaction with the service.
If the client has been fired by a web professional in the past, you should try to learn the reasons why.

Step 2: Precision

After you have decided to work for a client, try to be as accurate as possible about the project’s timeline, services and deliverables you will provide, areas for possible expansion, communication and pricing. Both sides will have to adhere to a schedule in order to maximize efficiency and meet the delivery dates.
To reduce the risk of the client going AWOL, make sure to have more than two contact people for the project, and at least a few ways to contact them (email, phone, physical address, etc).
If the client is self-employed, don’t be embarrassed to ask for the email address and phone number of a close relative or friend. Explain that you need this in case something comes up and you can’t reach them as soon as you need to, or in case of an emergency.
You can reduce the risk of the client procrastinating by clarifying the importance of sticking to the timeframe you’ve set. Both sides should be realistic about the delivery dates. If your client is involved in another project at the same time — make sure to ask them what other things they have going on that might detract them from your project — expect the delivery times to be looser.
If you get the sense that the client is not very decisive, try to guide them in making decisions. If their indecisiveness is really slowing down the project, tell them that you have other projects coming up and that it’s critical that you finish this project on schedule.
Setting financial penalties for timetable changes might sound strict, but it’s a way to convince the client of the importance of following the schedule. Put these financial penalties in the contract before you start working; you cannot add them later, and you cannot oblige a customer to pay a fine unless it’s in the contract.
If you’re working for a small business that doesn’t seem financially stable, try to balance being both precise and flexible with the timetable. Don’t scare them off by making overly strict stipulations. If they will need time to get the money for this project and you can afford to do this, give them wider payment deadlines. Suggest, for example, that they pay the total sum over a few months, rather than in one- or two-time payments.
Having a contract is absolutely necessary. Draw up a document before the project starts that clearly defines the following:
  1. The project’s nature and scope
  2. Approximate timetable and expected deliverables
  3. Agreed-upon features
  4. Approximate total cost, according to the original plan and features
  5. Requests for new features and their cost
  6. Terms in case you or the client cancels the project before final delivery
Be as precise and as realistic as possible with the figures. Instead of telling the client that you’re willing to try several designs to see what fits or that you’re willing to make no more than two designs, you could say that you will deliver, say, two demos, and in case neither works, you’re willing to do a third design. This way, you remain both flexible and specific, and the client knows that you’re willing to try ideas, but to a limit.
The same goes for the timetable. Help the client decide on designs, but not too hastily and not too slowly. Require that they spend a couple of days checking your demo before replying. This way, you avoid hasty enthusiasm or criticism, which could lead to a lot of unnecessary changes.
If the client takes too long to respond, offer to help them make their decision, saying that they can have an extra day or two to think it over but that you will need to move on to the next step according to the schedule.
Last but not least, a reminder about the contract. Having a document that legally proves that you and the client have agreed to a certain payment by a certain date is the only way to protect yourself against a client who is unwilling to meet their financial obligations.
If you don’t have a contract, there is no certainty you will ever get the payment if the client refuses to pay. Also, keep every important email and document that you have exchanged with the client until the project ends.

Ready, Set, Fired!

If, despite your efforts and warnings, you find that you no longer want to work with the client, consider discontinuing your service. Firing the client is a delicate situation, especially if they still owe you partial or full payment or if you don’t have a signed contract. Try steps below.

Be Calm: Don’t Act Rashly Out of Frustration

Take a few hours or a day off work, relax, and consider the situation. Carefully go over every single line of the contract before approaching the client.
If you don’t have a contract, then gather any documents that describe the project’s main terms and that refer to deadlines, deliverables and payment. Make sure you have completely lived up to your responsibilities throughout the collaboration, and don’t demand penalties unless you are certain and can prove that they have violated what was agreed on from the beginning.

Find the Appropriate Time

Timing is everything. Set an appointment with the client on a day when you won’t be stressed by other tasks. The conversation should be serious yet calm, professional and not aggressive.
Inform the client that you would like to discuss the status of your collaboration. Bring the contract and/or the other documents you have gathered (emails, receipts and such).

Let Them Explain

Even if you’re certain that you don’t want to work with this client any longer, do give them a chance to explain their point of view. They might not have been able to pay you because they’re short on money or are overloaded with their own customer issues; perhaps they would like to postpone the project and just didn’t know how to tell you.

Discuss Your Reasons

No matter how delicately you say it, be forthcoming about why you want to discontinue working with them. If the reason is your different views on the project — for example, they want a loud animated website, and you want something more minimalist — suggest a designer who would better suit their style  (after having discussed it with that designer).
Of course, you shouldn’t refer them to a colleague if they have been disrespectful or refuse to pay; you shouldn’t offload that burden onto other web professionals.

Take Care of Loose Ends

Sort out the remaining obligations of both parties. If the client has already paid for certain parts of the project, make sure you have delivered them. Be clear about their financial obligations, and let them know you’ll give them a receipt once you have been paid. A prearranged cancellation policy can save both parties time, effort and misunderstanding.

Possible Issues Resulting from Firing of Clients

Unfortunately, not every client will be cooperative. More than one meeting might be necessary. Some clients might get too emotional. Some might be slow to conclude the process.

If you do have a contract, you can take legal action to secure payment. But before you get to that point, or if you don’t have a contract, you could try some other tricks to put pressure on them.
If you haven’t yet delivered the project, you could refuse to launch until you’re paid. Your client will have to choose between, on the one hand, paying and getting the deliverables and, on the other, refusing to pay and finding someone else to take over. Either way will be a waste of money for them if they have already made partial payment.
If you have already delivered the project and don’t have control over the website, you could try using CSS Killswitch (but many find this sort of tactic to be unethical). Or, if you have access to the control panel, you could put the website in maintenance mode.
You could also go about this much less politely, which you might be tempted to do if you don’t have a contract and the client’s rudeness is pushing you over the edge. You could start publicly rebuking the client on social networks.
I even witnessed a colleague take it one step further. Their client wasn’t computer-savvy, so the designer locked them out of the control panel and then rebuked them on the client’s own home page, ranting about how they were never paid for the project and what a nightmare they were.
But I would personally suggest avoiding this type of behavior, no matter how mean they have been to you. You will be tarnishing your own image, and you will come off as being unable to handle difficult situations.
The same goes for after you have finished with the client: don’t gossip about them. If you want to steer a colleague away from the client, refer to your experience objectively and honestly, and then let them decide for themselves. If someone asks about your work with the client, be concise and explain that you didn’t manage to finish the project due to different perspectives.

Happy Ending?

You can increase the likelihood of a happy ending by properly communicating with the client, planning ahead (to avoid disasters such as cancellations) and focusing on the little details. Try to protect yourself without suffocating the client with excessive or overly strict terms.
If things go wrong, clearly explain to the client the trouble they are causing you, and try to discuss the matter before deciding to terminate the relationship.
Above all, remain calm and maintain your professionalism and integrity (which take time to build, but can fall apart in seconds).
Have you ever had to fire a client? If so, how did you resolve the situation in a way that was fair to you? Have you ever continued a collaboration that you felt just wasn’t worth it? If so, what kept you from firing the person? Share in the comments.

Sunday, June 16, 2013

Beyond The Button: Embracing The Gesture-Driven Interface

As a mobile UI or UX designer, you probably remember the launch of Apple’s first iPhone as if it was yesterday. Among other things, it introduced a completely touchscreen-centered interaction to a individual’s most private and personal device. It was a game-changer.
Today, kids grow up with touchscreen experiences like it’s the most natural thing. Parents are amazed by how fast their children understand how a tablet or smartphone works. This shows that touch and gesture interactions have a lot of potential to make mobile experiences easier and more fun to use.

Challenging Bars And Buttons

The introduction of “Human Interface Guidelines” and Apple’s App Review Board had a great impact on the quality of mobile applications. It helped a lot of designers and developers understand the core mobile UI elements and interactions. One of Apple’s popular suggestions, for instance, is to use UITabBar and UINavigationBar components — a guideline that many of us have followed, including me.
In fact, if you can honestly say that the first iPhone application you designed didn’t have any top or bottom bar elements, get in touch and send over a screenshot. I will buy you a beer and gladly tweet that you were ahead of your time.
My issue with the top and bottom bars is that they fill almost 20% of the screen. When designing for a tiny canvas, we should use every available pixel to focus on the content. In the end, that’s what really matters.
In this innovative industry, mobile designers need some time to explore how to design more creative and original interfaces. Add to that Apple’s frustrating rejection of apps that “think outside the box,” it is no surprise that experimental UI and UX designs such as Clear and Rise took a while to see the light of day. But they are here now. And while they might be quite extreme and focused on high-brow users and early adopters, they show us the great creative potential of gesture-driven interfaces.
Rise and Clear
Pulling to refresh feels very intuitive.

The Power Of Gesture-Driven Interfaces

For over two years now, I’ve been exploring the ways in which gestures add value to the user experience of a mobile application. The most important criterion for me is that these interactions feel very intuitive. This is why creative interactions such as Loren Brichter’s “Pull to Refresh” have become a standard in no time. Brichter’s interaction, introduced in Tweetie for iPhone, feels so intuitive that countless list-based applications suddenly adopted the gesture upon its appearance.

Removing UI Clutter

A great way to start designing a more gesture-driven interface is to use your main screen only as a viewport to the main content. Don’t feel obliged to make important navigation always visible on the main screen. Rather, consider giving it a place of its own. Speaking in terms of a virtual 2-D or 3-D environment, you could design the navigation somewhere next to, below, behind, in front of, above or hidden on top of the main view. A dragging or swiping gesture is a great way to lead the user to this UI element. It’s up to you to define and design the app.
What I like about Facebook and Gmail on iOS, for instance, is their implementation of a “side-swiping” menu. This trending UI concept is very easy to use. Users swipe the viewport to the right to reveal navigation elements. Not only does this make the app very content-focused, but accessing any section of the application takes only two to three touch interactions. A lot of apps do far worse than that!
Sideswipe Menu
Facebook and Gmail’s side-swiping menu
In addition to the UI navigation, your app probably also supports contextual interactions, too. Adding the same two or three buttons below every content item will certainly clutter the UI! While buttons might seem to be useful triggers, gestures have great potential to make interaction with content more intuitive and fun. Don’t hesitate to integrate simple gestures such as tapping, double-tapping and tapping-and-holding to trigger important interactions. Instagram supports a simple double-tap to perform one of its key features, liking and unliking a content item. I would not be surprised to see other apps integrate this shortcut in the near future.

An Interface That Fits

When designing an innovative mobile product, predicting user behavior can be very difficult. When we worked with Belgium’s Public Radio, my team really struggled with the UI balance between music visualization and real-time news. The sheer number of contextual scenarios and preferences made it very hard to come up with the perfect UI. So, we decided to integrate a simple dragging gesture to enable users to adjust the balance themselves.
Radio+
By dragging, users can balance music-related content and live news.
This gesture adds a creative contextual dimension to the application. The dragging gesture does not take the user from one section (news or music) to another. Rather, it enables the user to focus on the type of content they are most interested in, without missing out on the other.

Think in Terms of Time, Dimension and Animation

What action is triggered when the user taps an item? And how do you visualize that it has actually happened? How fast does a particular UI element animate into the viewport? Does it automatically go off-screen after five seconds of no interaction?
The rise of touch and gesture-driven devices dramatically changes the way we design interaction. Instead of thinking in terms of screens and pages, we are thinking more in terms of time, dimension and animation. You’ve probably noticed that fine-tuning user interactions and demonstrating them to colleagues and clients with static wireframe screenshots is not easy. You don’t fully see, understand and feel what will happen when you touch, hold, drag and swipe items.
Certain prototyping tools, including Pop and Invision, can help bring wireframes to life. They are very useful for testing an application’s flow and for pinpointing where and when a user might get stuck. Your application has a lot more going on than simple back-and-forth navigation, so you need to detect interface bugs and potential sources of confusion as soon as possible. You wouldn’t want your development team to point them out to you now, would you?
InvisionApp
Invision enables you to import and link your digital wireframes.
To be more innovative and experimental, get together with your client first and explain that a traditional wireframe is not the UX deliverable that they need. Show the value of interactive wireframes and encourage them to include this in the process. It might increase the timeline and budget, but if they are expecting you to go the extra mile, it shouldn’t be a problem.
I even offer to produce a conceptual interface video for my clients as well, because once they’ve worked with the interactive wireframes and sorted out the details, my clients will often need something sexier to present to their internal stakeholders.

The Learning Curve

When designing gesture-based interactions, be aware that every time you remove UI clutter, the application’s learning curve goes up. Without visual cues, users could get confused about how to interact with the application. A bit of exploration is no problem, but users should know where to begin. Many apps show a UI walkthrough when first launched, and I agree with Max Rudberg that walkthroughs should explain only the most important interactions. Don’t explain everything at once. If it’s too explicit and long, users will skip it.
Why not challenge yourself and gradually introduce creative UI hints as the user uses the application? This pattern is often referred to as progressive disclosure and is a great way to show only the information that is relevant to the user’s current activity. YouTube’s Capture application, for instance, tells the user to rotate the device to landscape orientation just as the user is about to open the camera for the first time.
Visual Hints
Fight the learning curve with a UI walkthrough and/or visual hints.
Adding visual cues to the UI is not the only option. In the Sparrow app, the search bar appears for a few seconds, before animating upwards and going off screen, a subtle way to say that it’s waiting to be pulled down.

Stop Talking, Start Making

The iPhone ushered in a revolution in interactive communication. Only five years later, touchscreen devices are all around us, and interaction designers are redefining the ways people use digital content.
We need to explore and understand the potential of touch and gesture-based interfaces and start thinking more in terms of time, dimension and animation. As demonstrated by several innovative applications, gestures are a great way to make an app more content-focused, original and fun. And many gesture-based interactions that seem too experimental at first come to be seen as very intuitive.
For a complete overview of the opportunities for gestures on all major mobile platforms, check out Luke Wroblewski’s “Touch Gesture Reference Overview.” I hope you’re inspired to explore gesture-based interaction and intensify your adventures in mobile interfaces. Don’t be afraid to go the extra mile. With interactive wireframes, you can iterate your way to the best possible experience. So, let’s stop talking and start making.

Thursday, January 24, 2013

20 Do’s and Don’ts of Effective Web Design

When you are creating a website (or hiring a web/blog designer to create one for you), there are specific items you need to be aware of. Things that normally wouldn’t cross your mind. For the average person who wants a website or blog for their business, they are after one very important thing – sales. Now, they may tell you that they want the big flashy logos, or the overdone textures/gradients, but it is the job of a well skilled web designer to steer their clients in the right direction.
Below are twenty do’s and don’ts of effective web design. Study, read, (re)read and print this page. It will help either make or break your website. And don’t hesitate to let us know of anything we might have left out, in the comments below. We love getting your opinions on things and discussing the articles with you – after all, you’re quite possibly the coolest people in the world.

DO: Keep your page structured

In the recent months we’ve seen an explosion of great grid layouts and css files. The most famous (in my opinion) being 960.gs and one of the cooler, more light weight grid systems being the 1kb grid. Following after the structure and balance of a great magazine/newspaper, these grid systems help lay out information in a structured and easy to follow format.
Example

DONT: Just place boxes everywhere

We’ve all seen these types of websites before – 20+ boxes, all different sizes, nothing lining up properly and not on piece that actually grabs your attention because you’ve just ran into a whirlwind of craziness. if you’re a web designer and you cannot properly place items in a structured environment, well, I would’t really call yourself a web designer.

DO: Focus on what’s important

Are you building a website for a business that sells one specific product? If so, make sure that’s the focus of the home page. Allow yourself space on the inner pages to place calls to action for that specific item. If you’re building a blog that gives out freebies or writes tutorials, make sure they’re getting the proper amount of focus and attention. Websites like WOO Themes do a great job and putting forward what their main focus is – wordpress themes.
Example

DONT: Place irrelevant ads across your page

If you’re going to try and make money from your website/blog, do yourself a favor and lay off the excessive advertisements. If your page loads and has 70% ads and only 30% content, odds are high that people will leave and never come back. Making your ads the #1 priority is a bad idea. Try blending them in and making sure they don’t take away from the content.

DO: Choose the right color scheme

Knowing what your readers emotions are will help you in choosing the proper color scheme. You won’t want a bright and ‘loud’ color scheme if your website is in the meditation niche. You’ll notice that most punk rock bands have CMYK color schemes (pink, yellow, black and blue), while a doctor/medical website will generally stick with a lighter, more ‘open’ color scheme
Example

DONT: Overdo it with 20 different colors

Having every color that is inside the 64 set of crayons on your screen will not only look bad, but it will annoy your readers and drive them away. Your colors should blend well together, not clash. If you’re not good at picking color schemes, I’d suggest a site like Colour Lovers which has user generated color schemes posted. Find the right color scheme (at most, 5 colors) and see how much better your designs turn out.

DO: Make it easy to scan your pages

People will not spend 5 minutes trying to figure out what your website is about and what it has to offer. The best way to ensure you’re getting the right information out to your reader is to make the page easy to scan. Use proper H tags (similar to how this post is using h3 tags) to focus on the important items. You can also use pull quotes, block quotes and images.
Example

DONT: Write one paragraph per page that is 1,000+ words long

If there’s one thing that stops me from subscribing to a blog is that the posts are literally 1,000+ words and have no paragraph breaks. This, and they normally don’t even have blog words or any indication that there’s anything important inside their content. Break your content up and make it easier to read – please, and thank you.

DO: Keep it simple stupid

It’s a proven fact that sign up forms with more than 3 items (usually – name, email & one other item) will have a significantly lower sign up rate than the easier forms. People HATE doing things for too long – so don’t over complicate things. Make things as easy as possible for your readers by pretending a 4 year old will be viewing it. It definitely helps get things out in the open where they need to be.
Example

DONT: Go on and on (and on) about nothing

Rambling, excessive LOL’s, too many smiley faces and random dribble will drop attention spans of your visitors. You want them to stay – act like it. If you have a personal blog where you write about your life, thats one thing, but to randomly post about what you ate, or where you went yesterday on your business website will definitely drive people away.

DO: Focus on killer copywriting

Words matter. Keep them short, sweet and to the point. If you have trouble writing copy that attracts the readers attention to where you need it to go, hire someone. Copy is just as important as the design of your website. Choosing the right words for sign up buttons, page headings, navigation items and calls to action can be the difference between 50% sign up rate and a 90% sign up rate.
Example

DONT: Stuff your pages full of keywords

Google isn’t stupid. Neither are your readers. If your page has the main keyword for your site stuffed into each paragraph 30-40 times, it will not only read very poorly, but you’ll be penalized. Writing should flow naturally and should only mention your keywords where they fit.

DO: Set your navigation up properly

If you’ve got a sign up page on your website, maybe you’ll have your main navigation in a blue color, while the sign up button is in a green color. Regardless, you’ll want to make your navigation easy to spot and easy to use.
Example

DONT: Make your readers search to find something

Your readers shouldn’t spend 30-40 seconds trying to find a contact or about page. They also shouldn’t have to click through three pages just to get to a sign up form. Get the important things out in the open. For the items that aren’t required to have a strong focus on your website, you might want to invest in a search box – I HATE when websites don’t have a search box. Web design 101 maybe?

DO: Optimize your load times

If there’s one recurring theme in this entire article it is the fact that visitors are impatient. You need to build your website with optimal speeds and allow your page to load in around 1-2 seconds. You can do this by making sure your css files are compressed, using the google hosted javascript files and ensure your page is coded and designed with optimal speeds in mind.
Example

DONT: Make everything on your page an image

Text on a website is there to be exactly what it is -text. There is no need to make the text blocks of your site jpg images. Also, making your website background 1MB or more in size will also cause your page to load very slow. I’ve seen websites also use 2 different javascript libraries and load 10+ plugin scripts for them in the headers and their websites took around 20 seconds to fully load.

DO: Choose the right fonts and sizes

I’ve only recently got into typography and have realized that it is a highly important aspect of web design. Making your section titles the right size and making sure the fonts you’re using will greatly effect the experience your visitors have when viewing your websites. Generally speaking, you should use one main font for the content and then you may switch the titles of the pages to a different font.
Example

DONT: Have 5 different fonts in 10 different sizes

Picture this: Page titles are in times new roman, content for those pages are in Arial, navigation links are in comic sans and the sidebar is in impact (yes, that impact). How ugly does that look? Now, remember that vision the next time you want to build a website with 5 different fonts.

DO: Make your page visually appealing

The world may tell you that people don’t judge a book by its cover, but thats a lie. The first thing people see is the web design you’re branded with. That first impression better be a good one. Utilize textures/gradients that give your website depth and draw attention to the beauty of your design. I would strive to ensure each of your website designs are accepted to galleries like css mania.
Example

DONT: Throw a bunch of crap together and think you’ll do well

Animated gif’s are your first no-no. After that comes the marquee scrolling text and the jumbled mess of text and graphics that resemble a 13 year olds myspace page. It isn’t cute and in case you’re not aware of it, it’s no longer 1980. Things have changed and people don’t expect to see something that looks like a 7 year old made it. If you’re a professional, act like it and make sure your designs are up to par.

Here’s where you come in

Below is a comment box. We’d love to have you use it and let us know what you think. I’ll even make sure I respond to any of your questions, because, lets face it – you’re important to us here at Web Design Ledger.