There are typically only two types of forms that tend to get squeezed into tight quarters in page layouts: login, and search. For this reason, web designers are often tempted to save space by hiding the labels on these forms and assuming that a user will intuitively know what to type into each textbox. With a simple search form, this is logical because you have a textbox next to a button that says “Search”, “Go”, or perhaps “I’m feeling Lucky”. Login forms are a little trickier. For most of us, seeing two text boxes and a “login” button is all we need to play McGyver, but the average user often needs those “Username:” and “Password:” labels to know what to enter.

A common solution to this problem is to use javascript to show and hide “hints”. This is one of those tasks that has a dozen different (perfectly acceptable) methods, and everyone tends to stand behind their choice as boldly as they do their favorite presidential candidate. I’ve tried a few of these methods, but because I tend to do it a bit differently, I thought I’d share.

Most of the solutions out there either insert a value into the textbox or they move around a label. Inserting a value into a textbox is the most obvious/common solution and has its pros and cons, but the deal breaker is the fact that a value inserted into a password box will still display as dots/asterisks. As far as I know, you can’t dynamically change the type of an input from password to text, so that solution is out. Moving around a label tag is something I first read about on the ALA article: Making Compact Forms More Accessible. It’s an ingenious idea really, but:

1. I usually only need to make compact login forms, so it doesn’t have to be portable across other types of forms.
2. The area for the form typically won’t accommodate leaving the labels in place for users without javascript.
3. Occasionally I like to use a different font for the login box hints to make it jive with a home page design.

With those things in mind, I decided to try using a background image for on the textbox instead of the label. Also, I tend to incorporate jQuery into most projects lately, so it made sense for me to write it in that - although it could just as easily be rewritten as straight Javascript if necessary.

Check out the working demo.

I believe it was Dustin Diaz who first introduced me to the Boagworld podcast back in early 2006. Since then, I’ve been enjoying the intelligent, witty, and entertaining banter between Paul Boag and his co-host Marcus Lillington about all things related to website design and development. Needless to say I was extremely excited when Paul invited me to talk about web design basics and “pimp my book” for the latest episode:
“107. Running to keep up”.

After listening to part of the show, Ames jokingly said “You sound so serious.” Despite my austere demeanor, I had a great time geeking up the air waves with my thoughts on layout, color, texture, typography, and imagery. The entire interview was really just a quick rundown of the key points in each chapter of the book, but it gave me an opportunity to bring up some resources and trends that have developed since the book came out.

Toward the end of the interview, Paul said
The Principles of Beautiful Web Design is:

…a perfect book for a lot people that listen to this show if you are starting out in any form of design and don’t come from a design background.

I’m always happy to hear positive feedback like that about the book, especially from people like Paul who do so much to keep the masses up to date on the latest resources and trends in the industry.

Be sure to check out the show.

I’m usually pretty bad at making long term goals and even worse at keeping up with my own accomplishments. After seeing similar posts from D. Keith, Snook, and Steve, I decided that keeping track of these milestones and resolutions via my blog is a practical way to keep them alive. So here it is, my 2007 highlights and 2008 goals. Better late then never, huh?

2007 Highlights

In no particular order…

• Principles of Beautiful Web Design
  Whenever I wasn’t working during the last 2/3 of 2006, I was writing and editing. Meeting the deadlines I agreed to was quite a task while working full time, but all the effort seemed worthwhile when I had the finished product in my hands.
• Snow
  Being from Florida, Amy and I haven’t seen much snow in our lives. Prior to 2007 we had only seen non-manufactured snow once. It was much more exciting to see it at our home, which provided for some hilarious home video funnery.
• Together for 7, Married for 4
  Ames and I have been friends for a very long time, but we “officially” started dating on July 16th, 2000. I remember that day and the one prior to it pretty vividly, but that’s a story for another time. We got married 3 years later on July 19th, 2003. On July 19th, 2007 I posted a poem I wrote for her that I wrote the year we started dating.
• Cyberwoven
  I started working at Cyberwoven in February of 2007. While I enjoyed my previous telecommuting position, it’s been great to be back in an office atmosphere again. Practical jokes, trips to Starbucks, and lunch breaks just aren’t the same in a home office.
• SXSWi 07
  I’ve long known that the SXSW Interactive Festival is an essential event for many web workers. I had been hoping to attend for several years prior, but I finally made it happen in 2007. The experience was life-changing. I met many of my long-time web design heroes, made tons of new friends, and promoted my book. I am definitely looking forward to making the trek back to Austin again in March.
• Cooper Rive Bridge Run
  Before 2007, the longest distance I had ever run was about 4 miles. In the beginning of the year I started training for the Cooper River Bridge Run 10K (6.2 miles). I finished at a respectable 1 hour and 3 minutes.
• Guest Lecture
  One of the many awesome people I met at SXSW was Aaron Walter. Aaron is an instructor at the Art Institute of Atlanta and the author of the upcoming book: Building Findable Websites. Aaron recently invited me down to Atlanta to speak to his User-Centered Interface Design students about some of the concepts in my book.
• Webmaster Jam Session
  I’ve always been interested in the idea of one day teaching graphic design, but I never really thought about the possibility of speaking at confereces. Regardless, I was excited about being offered a chance to present a panel at last year’s Webmaster Jam Session in September. While I was obviously nervous on stage, I had a great time and would love to speak again in the future.
• Kitchen Remodel
  When Amy and I first moved to SC in 2005, we were looking for a “fixer-upper” of a house. We really couldn’t afford something fancy and new, but most importantly, we wanted a place we could put our own stamp on. We’ve been making cosmetic improvements since we moved into our house, but in June we started on a major kitchen remodel. While there’s still some detail work to do, we’re happy that we were able to transform this into this.
• DIYalogue
  I guess one thing really led to another in 2007. While Ames and I were busy working on our kitchen, I started thinking about the lack of DIY home improvement communities online. I had been interested in the Ning platform for a long time, and it seemed like the perfect tool for setting up a social network for do-it-yourselfers. The result was DIYalogue.

2008 Goals

• Amy Time - Spend more time hanging out with Ames and less time doing demolishing kitchens with her. :) Lately we’ve been avoiding home improvement projects by playing Super Mario Galaxy together on the Wii in the evenings.
• Travel to Italy - We’ve been saving up credit card points since we got married and we finally have enough for 2 tickets to Europe. We haven’t made any specific plans yet, but we’re thinking some time in June.
• 10K in < 1 Hour - Ames and I are already making plans to attend the Cooper River Bridge Run again in April. I’ve seriously slacked off on the long distance running since last year’s 10k, but I’d like to beat my time by at least 3 minutes to get under one hour.
• Workout at least 3 days per week. - Along the same lines as the 10K, I’d like to be/stay in better shape. I sit in front of a computer 8 hours a day, so I really need to make some commitment to staying active.
• Enjoy our Improvements - I think having friends over at least once a month reasonable goal. It’ll be tempting to overhaul the master bath and the yard, but I think both of these can wait a year while we enjoy what we’ve done so far.
• Remodel Jasongraphix - Much of the site you see before you was coded way back in 2004. I did redesign it back in October 2005, but I did so solely with CSS. You can actually still see my original 2004 style if you go back to the homepage and choose 1900s from the dropdown. While that was an amazing feat at the time, the whole site is due for an overhaul from the ground up.
• Blog Posts - The frequency of my blog posting has been on the decline pretty much since I started blogging. Seriously. In 2004 I made 90 posts. In 2005, that dropped down to 80. In 2006 I only posted 44 times. Last year I dropped down to 30. I think getting in 50 posts for this year is a reasonable goal. This would be post number 1.
• Public Speaking - I probably should have submitted a panel idea for SXSW this year. I even talked to a few people last year about presenting with them, but the deadline came and went. I’ll be going as a spectator rather than a speaker, but I’d really like to arrange at least one speaking gig for 2008. I don’t think I could spare enough vacation time for more than one given the goal of traveling to Italy, but I’d love to speak again.
• Become a Happy Webby - To quote one of Jeff Croft’s recent tweets: “I’m not even gonna front: having my own HappyWebby is one of my primary goals in life.”