Slideology

Cover of Slide:ology by Nancy Duarte

I've fallen in love with Slide:ology by Nancy Duarte. This book covers just about everything you could want to know about how to design effective slide based presentations. If you have delivered a presentation or ever will deliver one, this book is for you. Whats even better is that even if you'll never deliver a presentation in your life, then this book might still be for you.

While focused on presentations, the concepts and insights in Slide:ology are very easily ported to the world of web design: make your point as clearly and simply as possible; images can speak louder then words; colors, fonts, images, everything contributes to the messages you are conveying to your audience.

Daurte also backs up the guidelines with tons of examples, both in terms of visual ideas to inspire you and in real-world examples of individuals who have employed specific techniques to deliver their message. Give it a spin and see what the world of Power Point can offer web designers.

 

Why You Must Learn to Love <label>

Once you start thinking about usability of internet forms, it starts to really stick in your head. You catch yourself filling out a form and going, "Man, they could probably get more people to fill this out if they just put a line break here, or used a different font color." Even I, a web developer, tend to shy away from forms that aren't easy to use, or ask for things I don't feel like telling them. Maybe thats why I have come to point that I actually get kind of angry when I see people skip out on using the simplest possible usability increaser: the <label> tag.

 

The Quiet Death of the Major Re-Launch

I just saw this cool article on the User Interface Engineering website, called The Quiet Death of the Major Re-Launch. This article calls out the "big relaunch" as being a potential pain point with users, and I have to agree whole heartedly. It doesn't really mention it in the article, but I think incremental role out of new features can also help to make realistic expectations for the results of updates. Its hard to get over hyped about updates to a single navigation menu. It also doesn't say that this is the perfect way to find out what changes are increasing your conversion rate; implementing one change at a time over a period of weeks lets you know which change is having an impact, and how.

 

Designing the Moment

Cover of Designing the Moment by Rober Hoekman, Jr.

I've finished reading Designing the Moment byRobert Hoekman, Jr., and it was an excellent book to follow up Web Design for ROI. I'd read Robert's other book, Designing the Obvious as well, and this book is no less impressive. Since I spend most of my time in back-end developer land, its awesome to read books which offer not only great advice, but great advice that says that the user experience flows from the beginning to the end of the project; its not the job of just a front end developer or designer.

Check it out for great advice on how to analyze your apps to make them more usable, and thus increase conversions.

 

BlogCFC Tweaks: Easier Category Selection

I've talked about it before, but I find classic multi-selects in HTML to be really hard to use. You invariably have to end up putting some explanation text to let a user know how to select more then one, and its easy to clear your selections everything while trying to select an additional item. I put these ideas into practice in BlogCFC to help with category selection. I replaced the following code in admin/entry.cfm starting at line 391:

<cfif allCats.recordCount>
    <select name="categories" multiple size=4 class="txtDropdown">
    <cfloop query="allCats">
        <option value="#categoryID#" <cfif isDefined("form.categories") and listFind(form.categories,categoryID)>selected</cfif>>#categoryName#</option>
    </cfloop>
    </select><br>
</cfif>

With this code:

<cfif allCats.recordCount>
    <ul class="multiselect">
        <cfloop query="allCats">
            <li><input id="cat_#categoryID#" type="checkbox" name="categories" value="#categoryID#"<cfif isDefined("form.categories") and listFind(form.categories,categoryID)> checked="checked"</cfif>/><label for="cat_#categoryID#">#categoryName#</label></li>
        </cfloop>
    </ul>
</cfif>

I also added the following code the admin style sheet ( /includes/admin.css ):


ul.multiselect {
    height: 100px;
    width: 225px;
    border: 1px solid silver;
    list-style-type: none;
    padding-left: 3px;
    overflow: auto;
}
ul.multiselect li label {
    display: inline;
    padding-left: 2px;
}

That makes it a lot easier to keep track of categories without messing something up.

 

My first Webkit and FireFox 3 standards let down

So today I finally found a part of the HTML 4.01 standard that Internet Explorer 6 (and 7) follows better then FireFox 3 and Webkit: <colgroup> and lt;col> tags. Apparently, neither FF3 or Webkit (and thus Chrome) bother to implement these tags. Normally, FF3 and Webkit are on the right side of standards, so its kind of a disappointment, especially when I need the functionality of those tags for a project.

If you aren't familiar with them, browse on over to W3School's XHTML reference and get acquainted. Basically, with column groups you can implement nice things like setting a column's background color without adding classes to each lt;td> in that column.

I hope that FF3 and Webkit see there way to implementing this feature.

 

More Entries

Jon Hartmann, July 2011

I'm Jon Hartmann and I'm a Javascript fanatic, UX/UI evangelist and former ColdFusion master. I blog about mysterious error messages, user interface design questions, and all things baffling and irksome about programming for the web.

Learn more about me on LinkedIn.