Tag Cloud Dos and Don’ts

Posted by Nile | Posted in Web Design | Posted on 08-12-2011 | 10

I have been seeing a disturbing number of blogs with some creepy tag clouds. Some have no CSS spacing implemented and others, well, they really are a ‘drag’ on the layout’s load time. I am not going to draw this article out, as I would like feedback from you all on your tag cloud practices.

I get a lot of questions whether if people should use tag clouds on their site or not. I usually ask them if they tried one on their site and made an opinion of its look and whether it fits with their site. Then, I would ask them if they had categories and if it was necessary that they have the tags when they also offer a search form. These are just a few factors I have always considered.

However, I want to focus on the aesthetics of the tag cloud. I have pulled one example of a ‘do’ and one of a don’t. Then I will give you my best advice. Out of respect of the webmasters the screen shots of these tag clouds belong to, I am not naming them.

Tag Cloud Don’t
This tag cloud was actually rotating the tag words. This slowed the load time of the site down and it was annoying as I tried to play catch to click on the tag word. It looked like the big bang theory happened in the sidebar of this person’s page. It was definitely a do not. The tag cloud had no real value except to look like a nifty tool. In fact, the webmaster used it on a Compositio WordPress layout by Design Disease and it severely detracted from the original layout. Also, as a note, the small screen shot was cut down in length from the actual size.

What can be learned from this Don’t:
:arrow: There is no reason to make a tag cloud look like it is a blog all on its own or something you tossed cookies on. Keep your tag clouds simple and relevant to your site.

Tag Cloud Do

This tag cloud is much better than the previous. The tags are spaced well and they are in alphabetical order. Another great example, although the webmaster does not have the tag cloud up anymore. It is a shame as I thought it was one of the best yet. What they did was instead of alphabetical order, they specified the parameter of their tag cloud as largest count to smallest and from that, adjusted the CSS to have a pleasant rainbow type color effect.

The WordPress Codex talks about customizing your tag cloud template by changing the parameters like excluding certain tags, specifying how many should be listed and even the tag order. I recommend taking a look at it and finding out what is best for your blog if you do like to use tag clouds. You may just want to create a tag cloud archive page instead of listing your tags in your sidebar. In fact, it might be a nice addition to your 404 page.

Do you use a tag cloud? Why and what are your suggestions on improving how a tag cloud should be displayed? Any tricks to share?

6 Valuable Site Elements to Add to Your Blog for Better Site Conversion

Posted by Nile | Posted in Web Design | Posted on 01-12-2011 | 24

Converting site visitors is not the easiest in the world. People need convincing all the time, even regulars. How can you do that? What elements of a site might be needed to improve site conversion. Remember, in order to draw people in, you must have something in place so they know what you want them to see, especially if you might even be selling a product.

Here are 6 valuable elements you might want to add to your own blog.

  • Featured Content Slider
    There are so many types of jquery image sliders and many more being introduced daily. However, in general, it if best for you to select the ones that fit your needs. While both of the following have premium versions, for WordPress users, the Easing Slider and Slidedeck are some of the nicest ones I have tested as plugins. They are very easy to use and can make your site look more interesting when added.

    While there are a lot of people who like built in sliders, some of them just fall short of having some pizazz. The ones listed above add that extra oomph. :)

  • Featured Thumbnails in posts
    Since WordPress has made it easier for people to have thumbnail images added to articles, this has appealed greatly to those who love sites that are more visual. Many themes out there do not have this capability, adding the code snippet for featured thumbnails is not difficult.
  • Featured Posts with Thumbnails in sidebar
    Having articles featured will allow you to bring material out from the archive and into the eyes of your visitors. This element will give them something extra to look at and choose if they want to go deeper in your site. One plugin, conveniently named Featured Post with thumbnail is pretty nice about it. It does though take some tweaking to make it look as you want it to me.
  • Related Posts plugin
    This is an older and simpler method. Some people choose related posts with thumbnails and that is great, but if your site is already a little heavy on the graphics, just a simple related post plugin like Yet Another Related Posts Plugin. This plugin can also be displayed as a widget too.

  • Method to automatically share posts on the social networks
    Twitter Tools and Tweet Old Post are both great plugins. While one can pump out your current posts, the other brings up older posts. What an arsenal! While your site alone can only do so much, social networks are a huge source of traffic for some bloggers.
  • Good old fashion method of banners
    Words can go a long way, but images can go even farther. As said above, if you want to convert people, you need to provide a way to lead them there. Banners have been a method used for many years. Your banners do not have to be traditional sizes. They can be enough to say what you need it to say.

Of course, there are other methods, but the above mentioned are not as obtrusive. RSS footer ads, jquery pop ups, and even old pop ups (including DHTML) can become annoying for regular visitors. They do not add much to a blog site, but they are great for sites selling products.

What kind of site conversion elements do you use on your site? Any special ones you suggest that are not annoying or in the way of a user’s overall site experience?

10 Mistakes In Web Design To Look Out For

Posted by Nile | Posted in Web Design | Posted on 28-11-2011 | 12

I thought after I was reading a few websites that I would address some common mistakes I see in web design layouts. I am not too much of a stickler about being valid, but more on the design issues as those are what people catch.

1. Margins. I cannot express the times I have been to websites and the margins between images, the browser itself, or other elements within the layout are either too far apart, over lapping, or way too close. Whitespacing is obviously an art in itself.

2. Bulky site. Too many graphics or too many large graphics.

3. Colors. Some sites, the colors are absolutely atrocious. For those who are unsure of what looks great together, try Colourlovers.com for some great palettes.

4. Too Simple of a design. Sometimes simplicity is great, but too simple and it can detract from the reader’s experience. Remember, a website is like a business card. Sometimes having an interesting one will stick in your reader’s mind more than others that they have gone to.

5. Inability to navigate easily. Some type of navigation should be clearly placed. With WordPress users, WP-PageNavi and Yoast Breadcrumbs are great tools to incorporate into layouts. They allow people to always know where they are on the site and can find a way back.

6. Too many scripts. Like images, too many scripts operating at the same time can be a real drag on load time. Make sure to choose ones you believe are really necessary. This goes for plugins as well.

7. Too many advertisements. Monetizing a site is a great way to make some cash, but too many ads, and your visitors might feel spammed. Your visitors are on your site for the content, not to be blasted by your advertisements.

8. Inconsistent fonts. While making different sections have different fonts, too many can detract from the layout. Keep it consistent and to no more than a couple choices.

9. Header tags are wonky. There are times when I have gone to websites and h1 tags are huge as well as h2, h3, and so on. Keep these varied and tasteful. Also, try not to vary the, no text tranform, uppercase and lowercase on text transforming in your CSS. Plan to choose one.

10. Not a memorable main graphic. Whether it is a logo or a special image, if it is too small, too plain, or sub par on design, you might not be putting your best foot forward. You do not want your logo too small or where next to it is a huge banner. Your visitors may get the idea that your banner is more important than you trying to brand yourself properly.

What mistakes do you often see when you visit websites?

Ideas to Help Get Out of That Design Lull

Posted by Nile | Posted in Web Design | Posted on 25-11-2011 | 4

Web Design, uses your creativity and can run low from time to time, just like a writer can experience ‘writer’s block.’ However as much as that can be an excuse, there really is no such thing as a creative block. It is all in the designer’s mind. Some of this can be spurred on from the following:

  • Physical limitations due to lifestyle choices (ex: stress, sleep problems)
  • Lack of confidence in your own work
  • Too busy or too much on your plate
  • Not enough knowledge in field to complete certain projects
  • Lack of motivation.

These are things that can be changed by taking a positive approach. I love to write as much as I love to design. I design like I write, which means I do the following: make sure I keep focused with the design before doing anything else.

  • 1. Write down in notebook or type in notepad what you do not know in my field. Once this list is made, go out and search for books, and online resources to help teach myself how to do something.
  • 2. Look around the internet for web trends and take notes. A lot of clients like to give example sites for something that they have in mind. These also can help you learn different tools that you can design for websites even if you code it your own way.
  • 3. Keep designing. Do something, even simple stuff. You will find that if you work with one photo, you could discover dozens of ways to change or enhance it. Look for sites that offer graphic challenges. Some might offer a prize (even a small graphic), but the prize is not the goal. The goal is to keep designing and create something. A prompt sometimes helps and these challenges, even ridiculous ones can help. Here is a site called Graphic Competitions that may be handy for helping you get in the design mood.
  • 4. Try joining forums for graphic and web designers to share pointers or visit blogs of these genre to get in touch with your field better.
  • 5. Try drawing offline. Make mockups of layout ideas without the graphics on paper.
  • When designing, try designate a time. Occasional breaks are great, but distractions can be a nuisance. If you are a mother, perhaps during naptime, during school hours, or after the kids go to bed might be the best times to design without being distracted.
  • 6. Be confident in your work. Yes, rejection might hit hard for you, but you can always change the work. Take your client’s constructive criticism seriously and try to apply. You are working with a client which is a partnership. Most of the time, it is communication failure that breaks the partnership. The client chose you because they liked your past work and believe you can do the job because you said you could, so think about your past work and what your client wants. Do not let fear get in the way. You got the job, so you can do it
  • 7. Be honest about your work. In the case that you cannot complete a project for some reason, be up front with your client. However, try to be resourceful and refer them to a possible web design buddy you may have met according to my 4th suggestion.
  • 8. Keep a positive attitude. It is not the end of the world if your first proof is rejected. Persevere and you will definitely come up with something better second time around.

Remember, even if you design professionally, have some fun. It will help keep you motivated.

Understanding How to Use The W3C Markup Validation Service

Posted by Nile | Posted in Web Design | Posted on 18-10-2011 | 21

Having valid coding for your site is important. It could mean the difference of a visitor being able to access and view your site properly. Whether you are just learning HTML, know a little bit, or know quite a few tricks, one of the best tools a designer and developer can use is the W3 Markup Validation Service by the World Wide Consortium.

The World Wide Consortium (also known as W3 or W3C) has been around for quite some time and is the governing body to consult about web accessibility and semantic coding. No matter if you are a novice or a seasoned professional in web design, the validator is a great tool for both learning and also correcting those minor mistakes missed the first time.

From my experience, many people who have used it have asked me how can they tell where to correct a mistake.

Below is a short video run through to help you through understanding how to use the W3C Markup Validation Service.

How To Change Your Blog’s Design Without Alienating Your Visitors

Posted by Nile | Posted in Web Design | Posted on 19-08-2011 | 39

As your site grows older, you have learned a lot of things (at least I hope you have.) In that time you should have played with ideas on what you would like to change in order to improve your website. However, I am sure that you probably think that if you change certain parts of your website, that you might alienate your visitors.

PSST— In a lot of cases, you probably will not alienate your blog visitors unless your site is hard to navigate, your content starts to suck, or your whole brand changes (the design of your site, logo, and even yourself.)

Ease your visitors into the idea of the change.

1. Let them know of your upcoming plans to change your site. You can make this sound like something exciting for your visitors to keep checking the site. You can let them know with a blog post, or perhaps a tweet, through your site’s newsletter, or maybe a message on your Fan page or a message on any other social network you have.

2. As the time comes to unveil the new design, inform your guests of the changes. Involve them with the change by asking them to contribute their opinion or to tell you if they catch any minor design issues.

3. Unveil the site and again, ask for feedback and even ask your visitors to spread the word, especially if they like the new site design.

4. Try to make the re-brand of your new site’s design consistent with your social network handles, like your Twitter background, Youtube channel, or Facebook page.

Now, the above are suggestions that can be used for total blog and website revamps or partial changes. Including your visitors in on the process allows them to feel like they have helped and that you really do like to listen to their feedback.

Trendy Web Design Is Not Always For You

Posted by Nile | Posted in Web Design | Posted on 10-08-2011 | 13

The web has come a LONG way. I am pretty sure in that first sentence alone, all of you can agree and maybe you have heard something similar said from other people. The problem is that there are still a lot of trends floating around that people still want to stick to. However, for branding purposes, trendy web design is not always for you.

When you started your own website, you had something in mind. Maybe it was the colors? Maybe it was a vision for the logo? Maybe it was the format of the website itself? Many of us are influenced by other websites that are doing well, but many have a site design that has become the trend.

Their site is successful so if you have a similar format, you might be successful too… that is probably what you are thinking? However, where is your individuality? What makes you different from that person? Obviously, you want to have some influence and authority, but not be confused with sites you were inspired to emulate.

Here are a few tips to step away from having a trendy web site design.

  • Brainstorm what you believe is really necessary for your website.
  • If you prefer a general format of a trendy website, think of ways in designing it to make it your own.
  • Try not to emulate another company’s or individuals logo. You want to be memorable, so be unique.
  • Be on top of your niche market. Research all sites in your market and see what other website elements are successful. Try those and see how they work for you.

Please note when I say website elements, or site elements, I mean things like featured content sliders, newsletter subscription modules, marketing funnels, how posts are formatted design-wise, and more.

So, in conclusion, whether you are putting together a website for the first time or doing a revamp, think about how you can be unique and memorable, not just another trendy looking website.

How have you broken away from trendy design? What advise do you have for others who may still be struggling with branding their websites to reflect themselves or their business?

Are You Using Images That You Have Permission To Use?

Posted by Nile | Posted in Web Design | Posted on 23-06-2011 | 12

There are so many images online, and so many more being created every day. Some are free, some are royalty free, some have licenses that you have to purchase in order to use the image, and some you just cannot even legally touch.

Are you using images that you have permission to use?

For those who have been in the blogging community for more than a decade, especially the “personal blog” niche, during 2004 through 2007, there were a lot of websites that used celebrity images. Some of these images were “blended” or pics spliced and mixed together in a way that made the image attractive. This was great practice for newbie graphic designers who played with Photoshop or other graphic editors to make their images look great.

Unfortunately, licensing on pictures of celebrities, including actors, musicians, and editors required graphic artists to personally contact the original photographer for permission. Even some artwork, like paintings, and other types of photography were required that the user either ask for permission to use and sometimes even require credit back to the original source/ artist.

Of course, a lot of webmasters were not found of this, but did remove what creative works did not comply.

However, since those years, stock photos, free images, and other types of licensed works have come into play.

For a dollar or more, website owners can use a cool vector image created by another, or perhaps a stock photo of some place relevant to what they are writing about. However, for every person who pays to legally use images that require licensing, there are many more who just take and use on whim.

While the main party to blame is the actual person illegally using an image that requires licensing, Google has also been fairly responsible for this. Think about it.

Go to Google. Click on the images tab. Do a search on an image. When Google displays the results, slowly hover over the first 4 rows and see how many links to stock photo sites come up. It should be a few, especially if you do a search on vector images (any type)…

However, next time you search for an image you need for your website or even graphics… think about it… do you have permission to use it???