Web Typography

When you visit a website what is the most important thing?  Normally it is the content and many times, text is an important part of the content.  The typography on a site communicates the tone an impact of the content.  Web typography is the art of arrangement, style, appearance, and printing of type.  Web typography has come along way since the web's inception when we were limited to a handful of fonts which could be used.

Understanding the basics

Web typography is anything but easy.  There is a lot more that goes into it other than choosing a font.  The image below, originally found here, shows various typographic definitions.


Confusing isn't it?  As you can imagine, it can be quite frustrating to keep up with all of that.

And that's not all!

There is also, typographic scale, CSS, vertical rhythm, browser design, the list goes on and on!  Web typography is important to remember when designing a site and not every one will have a natural ability for it.  It can be easy to just focus on the content of the site and over look the text itself but you need to make sure you pay some much needed attention to the text itself.
I would by no means consider myself to be an expert in web typography.  However, I can recognize its importance.  How a website looks on a first impression can make or break your site.  Whether you realize it or not typography can have a significant impact on the look and feel of the site.  Being that I work in web development I understand what it means for a site to "feel good" to the users but I'm not always good at making it that way and I will be the first to admit it, I many times will overlook the typography in sites I design.

There's always room for improvement

There is always something you can learn when it comes to web design.  My advice is to make sure you know when to ask for help and don't be ashamed to ask for help.  We all have our strengths and weakness and we should lean on each other and make the Internet a better place for us all.  Below I have listed some resources I have found to be useful on web typography.  Please feel free to make your own additions to my list.

Typography for the Web
6 Ways to Improve Your Web Typography
The Elements of Typographical Style Applied to the Web
50 Useful Design Tools for Beautiful Web Typography
10 Web Typography Rules Every Designer Should Know 

Web Standards and Why You Should Use Them

Web Standards...Just what exactly does that mean?
 
It is generally thought of as guidelines and specifications to follow when developing for the World Wide Web.  These guidelines are issued by the World Wide Web Consortium (W3C) and will help to create websites which will be consistently available on most any browser or internet-enabled device.  Web standards help to improve the maintainability of a site and the overall development process as a whole.


So why doesn’t everybody follow web standards?

 
The obvious answer is that some people simply aren’t aware of web standards.  There is no qualification criterion that must be met before someone can create a web site.  Unfortunately, because of that fact, there are a lot of bad web sites created by people who just don’t know any better. 


However, from my personal experience, I have found that some people are aware of web standards but just don’t care to take the time to learn about them and implement them.  And I’m not talking strictly about personal web sites; I’m talking about large web sites that are created to be the face of an organization.  Getting this particular group to see the importance of web standards is a tall order to fill. 


Well if they don’t do it, why should I?

 
Because you are better than them.  Plain and simple, a good developer will use web standards and will encourage others to do the same.  I’m not saying that a site can’t be created without web standards, but if you want a site that will be accessible, web standards have to have their place.  Even if your are 100% standards compliant there will still be some minor differences between browsers and devices but your site will be accessible in the largest number of browsers and devices possible.  Unless your goal is to annoy users and drive traffic to competitors, you want your site to work in a variety of environments and web standards will help to get you there.


Still not convinced?

 
Check out these resources for some compelling reasons to use web standards:
http://www.webstandards.org/
http://www.w3.org/standards/about.html
http://webstandardsgroup.org/standards/

Information Architecture

Information architecture can sometimes be a difficult topic to explain to other people.  According to the Information Architecture Institute it is defined as:

  • The structural design of shared information environments.
  • The art and science of organizing and labeling web sites, intranets, online communities and software to support usability and findability.
  • An emerging community of practice focused on bringing principles of design and architecture to the digital landscape.
So what exactly does that mean?
Since IA can sometimes be difficult to explain, the Information Architecture Institute has a section of their website for "elevator pitches."  These are essentially a way of defining IA in a way that more people can grasp the concept of it and are worth checking out if you are unsure of what IA really is.   


Examples of IA
  • Content Inventory
  • User Profile
  • Use Case
  • Sitemap
  • Wireframes
  • Paper Prototype
  • Story Board
  • Style Guide
From this list, I found the user profile (persona) to be interesting.  The user profile will help you to understand the target audience.  It will have information such as name, occupation, gender, education, computing and web experience among others.  

So how does a user profile fit in with information architecture?
At first it may seem like it doesn't.  However, you have to understand your users to be able to structure the information to meet their needs.  Having user profiles created can help the information architect to stay focused on the user and their needs.  These profiles are also important for helping make other decisions related to information architecture.  For example, using the profiles the information architect could get an idea of how high a level of Internet skills that most of the users have.  If most of the uses are not very technically skilled then the information architect can design the structure for the site to be easy to use for a non-skilled user.  In this case, complex navigation would not be a best fit for users less technically inclined.