Archive: Design

Lead gen pages are often misunderstood as standalone, single-page designs. There’s a science behind A/B testing and optimizing lead gen pages, but there’s also a component of creative user experience that should not be overlooked as you drill deeply into what drives your users through your conversion funnel.

Some user behaviors make clear sense, while others can confound your expectations. Overall, however, designing a complete experience around a conversion page is best understood taking these 3 “Ss” into consideration:

1. Somewhere—Users get to conversion pages from somewhere, so go there first!
2. Superficial—Good looks matter. Users respond to a particular aesthetic, so try different designs!
3. So Much More—Users engage deeper through community, so get them connected to you and each other! (FYI a Facebook Fan Page is a great ecosystem & it’s free)

Okay, so few weeks ago I posted about a redesign I’m working on for a lead generation page. That project began with a single page, but preliminary outcomes further demonstrated that we needed to step backwards and design for an entire experience, which is where Somewhere, Superficial, and So Much More came into play. (more…)

Editors Note: In his first article for Think Vitamin Thierry Koblentz discusses the issue of “resetting” your CSS.

“base.css” versus “reset.css”

For a long time, the very first line in my styles sheets was:

* {padding:0;margin:0;}

This simple rule was very convenient as it leveled margin and padding values of all elements across browsers. This “hard reset” was short and simple and it had the advantage of belonging to the main styles sheet rather than being an external file.

Later, this technique was denounced as bad practice as it makes the rendering agent style (check) every single element in a document. It also triggered issues with form controls, but authors were used to specifying styles for these.

Then came “reset” styles sheets. These files go way beyond resetting margin and padding. The most complete in terms of properties/elements involved has to be Eric Meyer’s. It “unstyles” everything you could think of, from a to var.

Authors start with a clean slate. From there, they most often write rules to style elements that were originally styled by the browser’s styles sheet, but overwritten by the reset file. In short, many elements are styled three times:

1. by the browser’s styles sheet (see User Agent Styles Sheets).
2. by the “reset” file.
3. by the author’s styles sheet.

Criticism of this Approach

Jonathan Snook, Jens Meiert and others have “criticized” this approach, saying more or less that there was no use for a “middle man”. On Jen’s site, “randomCommenter” summarizes the issue pretty well when asking: “Wouldn’t a well written base style sheet render a reset style sheet redundant and therefore useless?”

Actually, I believe Eric Meyer himself hints in that direction when he says:

“I don’t particularly recommend that you just use this in its unaltered state in your own projects. It should be tweaked, edited, extended, and otherwise tuned to match your specific reset baseline. Fill in your preferred colors for the page, links, and so on. In other words, this is a starting point, not a self-contained black box of no-touchiness.”

In any case, people should at least evaluate the rules in these reset files before copying and pasting their content. For example, if one authors documents as HTML 4.01 Strict! one may safely remove from a reset styles sheets any reference to elements like:

• iframe
• applet
• strike
• u
• font
• s
• center

(more…)

Editors Note: Forrst is still in beta and as such you will need an account to view the links referenced below. Kyle, the creator of Forrst, has kindly offered 250 Think Vitamin readers an advanced invite. All you have to do is email kyle@forrst.com with subject “I’d love an invite!”.

A few weeks ago Carsonified’s Mike Kus gave five good great reasons why designers should know how to code. It generated quite a discussion. Around the same time I stumbled upon Forrst, a new platform for short-form sharing between designers and developers.

The Founder

It wasn’t a big surprise to learn that Forrst is a creation of Brooklyn-based developer/designer, Kyle Bragger. I first met Kyle when he was a developer for Huffington Post (back in the early days), more recently he’s CTO of Gary Vaynerchuk’s Cork’d.

Anyone who knows Kyle, however, also knows that he produces a seemingly never-ending stream of special projects. Honestly, I’m almost convinced that the internet actually spat him out as a human a few years ago.

The Feedback

While Forrst is early in it’s release, It’s safe to say that there’s some great long-term ideas in the community features that will have a profound impact on how designers and developers collaborate and learn more about supporting and even trading roles in development cycles. In fact, here is a sample post from a new member. Within moments it was peppered with positive and helpful feedback:

(more…)