Archive for 'Featured'

Google is Biggest “Disabled” Internet User

googlebot

Image credit: Google Bot by Tyler Jordan

When thinking about website accessibility, what comes to mind is, how many blind, hearing impaired or otherwise disabled people are really going to visit my site? According to World Health Organization (Global Data On Visual Imparement For 2002), there are over 161 million visually impaired people in the world. That makes about 2.4% of the world population. Seems like a small number compared to over 6.5 billion of world’s population, to worry about designing the website to accommodate this particular need, considering that more than half of that 2.4% is in the third world countries and most do not even have access to the Internet to come and visit my site even if they wanted to.

Google is Disabled

What we do need to know is that there actually is a really important reason to make sure that every website addresses the accessibility issue. It is not just to make it easier for the disabled but to get better results in the search engines.


Read more

All The Twitter Apps You Ever Wanted

twapps

This morning I found a large stockpile of Twitter Applications, all in one place. I’ll be on my way to browse through all of them and see if I can use sme of them. While I do that, here is the link to that site…http://www.twapps.com…check it out, you’ll probably find something you’ll like there.

Aah, this one’s cool. I entered my Twitter username on TweetSnap.com and it generated this graphic below and HTML code so I can add it to my website.

Valiik

Ok, going to go keep browsing…

Oh yeah, follow me on Twitter: Valiik

See you there.

3 Practical Ways To Efficient CSS

Most probably already know this but it doesn’t hurt to remind and have it down on “paper”. When writing CSS code and as you adjust things to make it all look good in the browser your CSS file becomes huge with extra lines of unneeded code that can be purged to make the size of the file smaller. All though this is not a complete list, this is practical and easy to remember steps that really make a difference. What I am talking about is Shorthand, Default Values and Multiple Declaration.

Shorthand

There are several elements that you can apply shorthand to font, border, background, padding & margin.

font


 Instead of declaring:

font-family:   Arial;
font-size:        12px;
line-height:   18px;
color:              #333;

You can say all that in one sentence:

font: 12px/18px #333 Arial;

border


 Instead of declaring:

border-color:    #ccc;
border-width:    1px;
border-style:      solid;

You can say all that in one sentence:

border: 1px solid #ccc;

background


 Instead of declaring:

background-color:         #fff;
background-image:        url(images/bg.gif);
background-position:    top;
background-repeat:        no-repeat;

You can say all that in one sentence:

background: #fff url(images/bg.gif) top no-repeat;


Read more

10 More Great Website Navigation Ideas

There are lots of lists of 25 of this and 50 of that and I was going to go ahead and stuff the stack of great navigation ideas I’ve found into a list of my own, but after thinking about it I decided that making a few posts of smaller more comprehendible lists of about 10 will be more productive and usefull.

When I see those large lists I scan through them quickly because there is so much to look at but I don’t slow down to look at, appreciate and comprehend each piece. We are here to get inspired, to get new ideas for web design, and in this post here, to get great ideas for website navigation, so let’s take a look at the examples I have here.

 

Great Navigation - xy-media.de
1. XY-Media.de
Take a look at the button that is highlighted with gray. I like the idea of having that little icon show up next to the gray box as you hover over the button. That adds an interesting element to the navigation instead of just a gray box.

 

Great Navigation - villalaestancia.com
2. VillaLaEstancia.com
Sometimes simple just looks best. This one has just a simple rollover image that turns the link text a lighter color as you hover over it.

 
Read more