I just read fellow Scandinavian Roger Johansson post on Forgotten CSS selectors. I wouldn’t go as far as calling them forgotten, but I definitely don’t see them much in the wild. And they’re not even experimental CSS3, they are good old CSS2.1. Well worth a read.
And just as I think “hm, how do I deal with all this n-child stuff?” Chris Coyier of CSS-Tricks tweets about his :nth-child learning tool/tester. Brilliant!
Tags: selectorsNo Comments.
I’ve been thinking of doing a Wordpress theme in HTML5 for a while, and the best way to get inspiration is to look at other people’s work. I haven’t found very much though. So far I’ve found:
Do you know of any others?
A couple of good HTML5 resources:
And finally, a great overview of how to build a Wordpress template from scratch from ThemeShaper.
I hate forms. Always hated them. Hate filling them out. Hate marking them up. And definitely hate styling them.
But that has all changed. It appeared to me that after all, forms are about user experience, and user experience is something I’m quite passionate about. But what really made me get into forms where a combination of events. I finally got hold of Web Form Design by Luke Wroblewski. And I cannot believe I haven’t read it earlier. It’s been out since 2007 for something’s sake!
But it’s clearly a popular book, because I’ve been trying to get it of Amazon before, where it’s been sold out. Then I forgot about it. Then I remembered again as I stumbled across a link to the publishers own website (rosenfeldmedia.com). Enter creditcard details. While I was there I picked up a copy of Donna Spencer’s Card Sorting as well, also recommended. But for now I’ll stick to the forms.
I thought Web Form Design was going to be all about how to get your head around writing semantic HTML and valid CSS for forms without ending up in an asylum in the process. I was wrong. It is much better. There isn’t a single line of code in the book. At least not that I can remember. It puts all it’s emphasis on making forms user-friendly. This is clever, as it makes it almost timeless, something you can’t say about most HTML/CSS trends. And it really makes you think further about what Every. Single. Element does.
Why is there? What does it do? Could it be better? Do I even need it?
And the flow of going through a form. Now I’m aware of how to get a user into a form, through the form, submit the form, and what to do after the form is submitted. This is something most designers never think about. I know I didn’t. And I gotta say, it feels good to make these decisions based on research and facts, rather then a vague feeling. Sure, it takes me a bit longer to make a form now, but damn! – it turns out heaps better.
I usually get the graphic designs handed over from designers who know little or nothing about CSS, HTML, or JavaScript. I’m not sure how many times I’ve had to point out that a link usually has slightly more than one state. So imagine the forms. Now, luckily the people I work with welcome feedback and are happy to learn. But this time I’ve made a clear demand:
Read this book before you ever design another form!
Which means that my book is out on loan at the moment. I have to remember to get it back before I leave Sydney. It is definitely part of my library.
And as it happens, after finishing the book I was cleaning up my email, where among others a few hundred emails from the WSG mailing list needed deleting. And as it turned out, there was a meeting, in Sydney, where Jessica Enders (formulate.com.au) did a presentation on forms. Count me in! At the same time Sitepoint launched another book, Fancy Form Design, which I’m currently reading. In short I’d say it makes a good appendix to Web Form Design. I have learned a lot from all this. And interestingly, nothing of this is new. No HTML5, no AJAX, no social media guerilla branding campaign (sic). Just plain old markup and solid dose of human behavior. I am really happy I’ve been able to improve so much in such a short time.
So now I don’t hate making forms anymore. Instead I hate how horrible some of the forms I’m forced to fill out are. And occasionally I get to love how well it can be done.
Tags: book · forms · rant · Review3 Comments
This is a CSS hack for Firefox.
I know, it’s naughty, dirty, against the rules, and Andy Clarke won’t share his pudding with me. But today I just wanted to style that form element my way!
I used this to target a <input type="submit" class="btn" /> element in Firefox3.5, but it will affect everything from Mozilla1.8 (that is Firefox1.5) and up.
My original CSS had this padding:
.btn {padding: 5px 10px}Bringing out Firefox hack number 1 helped somewhat:
.btn::-moz-focus-inner {
padding: 0;
border: 0;
}But this wasn’t enough, so after digging into the Firefox’ form.css file and some follow-up googling, I ended up abusing Mozilla’s @-moz-document specification, which led me to this:
@-moz-document url-prefix() {
.btn {
padding: 4px 8px;
}
}The latter can obviously be used to target any normal CSS, but please use with care!
Tags: No Comments.
Do a persons books tell you something about him or her? I’d hope so. Looking at the stack of books that I have next to me on my desk, I realised it shows what I’m aiming for. I wish to be better at what I already do well, I want to build and expand so I’m fluent in related areas. I want to be comfortable that I’m good at my job, as it means a lot to me. So this is my list, my wishes, in no specific order other than what they currently are stacked up as on my desk:
Titles link to books. Names link to Twitter.
Tags: books · reading3 Comments
Designing for the Web won’t teach you anything about HTML5, CSS3 or anything else the cool kids are talking about these days. Quite the opposite. And this is why you should read it. Actually, you should buy it for yourself, because Mark Boulton has gone through the extra trouble of creating his own independent publishing house because the big distributors weren’t any fun to play with. But primarly you should buy it so you can read it once, then read it again.
Designing for the Web is a web design book that will still be valid next year, which is a novelty in the genre. This is because it is not about code examples, glossy buttons or Javascript GUI-animations.
Tags: book · Review · webdesignNo Comments.
An 11 minute animation that explains the financial meltdown better than anything else I’ve come across. I realise 11 minutes is a long time in internet time, but it is well worth it. The animations-slash-infographics also reminds me of my other favourite infographics – the Hitchhikers Guide book in the Hitchhikers Guide to the Galaxy film.
Check out The Crisis of Credit Visualized from Jonathan Jarvis in full HD glory on Vimeo.
Tags: credit · crisis · infographicsNo Comments.
Today something amazing happened on the Norwegian interwebs. Finn.no, Norway’s largest classifieds-site, is displaying a tip on their homepage to all IE6 users, encouraging them to upgrade their browser. Not only so, but they have initiated a campaign, prompting several of the most visited Norwegian sites to follow suit. This all started within 140 characters, when Erlend Schei, web-developer for Finn.no challenged everyone in control of mayor Norwegian websites.
To everyone with control of mayor Norwegian sites: What about a spring cleaning to get rid of IE6? One week of encouragement on our homepages?
Tags: IE624 Comments
Having spare time has unexpected consequences. Such as plowing through an entire book in one sitting. Last night I finally picked up my copy of Everything you know about CSS is wrong. A daunting title indeed, but the book is just over 100 pages, so it’s a quick read. And what you learn is basically that there’s a thing called CSS tables, which allows you to layout web-pages in wonderful ways.
[Read more →]
Tags: book · css · Review2 Comments
The other day I was producing a whole lot of pdf’s hitting print as pdf for each page of my Gmail. They off course ended up as a big bunch of separate pdf’s, although having them as one file made more sense.
I don’t have Adobe Acrobat, and don’t want to fill up my hard-drive with something which amounts to bloatware to me. So I fired up Automator. Automator is a handy little app which will make workflows for you by simple drag’n drops. Like making an AppleScript without any coding. It can do a lot of cool stuff, and usually if you think “Wouldn’t it be great if..” then Automator might be the answer for you.
Tags: Automator · osx · pdf · script2 Comments