Webdesigninformer.com

Adactio Go to the source

There’s been quite a brouhaha over the past couple of days around the subject of standardising responsive images. There are two different matters here: the process and the technical details. I’d like to address both of them. Ill communication First of all, there’s a number of very smart developers who feel that they’ve been sidelined by the WHATWG . Tim has put together a timeline of what happened : Developers got involved in trying to standardize a solution to a common and important problem. The WHATWG told them to move the discussion to a community group. … Read the rest here

Eric Meyer Go to the source

I’m working my way through a rewrite of Two Salmon (more on that anon), and I just recently came to the ch unit. Its definition in the latest CSS Values and Units module is as follows: ch unit Equal to the advance measure of the “0″ (ZERO, U+0030) glyph found in the font used to render it. …and that’s it. I had never heard the term “advance measure” before, and a bit of Googling for font “advance measure” only led me to copies of the CSS Values and Units module and some configuration files for the Panda 3D game engine . … Read the rest here

Eric Meyer Go to the source

I recently stumbled over a subtle interaction between cookie policies and localStorage in Firefox. Herewith, I document it for anyone who might run into the same problem (all four of you) as well as for you JS developers who are using, or thinking about using, locally stored data. Also, there’s a Bugzilla report , so either it’ll get fixed and then this won’t be a problem or else it will get resolved WONTFIX and I’ll have to figure out what to do next. The basic problem is, every newfangled “try code out for yourself” site I hit is just failing in Firefox 11 and 12. Dabblet , for example, just returns a big blank page with the toolbar across the top, and none of the top-right buttons work except for the Help (“?”) button. … Read the rest here

Eric Meyer Go to the source

I’ve been messing around with native calculated values in CSS, and there’s something a bit surprising buried in the value format. To quote the CSS3 Values and Units specification : Note that the grammar requires spaces around binary ‘+’ and ‘-’ operators. The ‘*’ and ‘/’ operators do not require spaces. In other words, two out of four calculation operators require whitespace around them, and for the other two it doesn’t matter. … Read the rest here

Eric Meyer Go to the source

So HTML5 allows you (at the moment) to create your own custom elements. Only, not really. Suppose you’re creating a super-sweet JavaScript library to improve text presentation—like, say, TypeButter —and you need to insert a bunch of elements that won’t accidentally pick up pre-existing CSS. That rules span right out the door, and anything else would be either a bad semantic match, likely to pick up CSS by mistake, or both. Assuming you don’t want to spend the hours and lines of code necessary to push ahead with span and a whole lot of dynamic CSS rewriting, the obvious solution is to invent a new element and drop that into place. If you’re doing kerning, then a kern element makes a lot of sense, right? … Read the rest here

Eric Meyer Go to the source

This morning I caught a pointer to TypeButter , which is a jQuery library that does “optical kerning” in an attempt to improve the appearance of type. I’m not going to get into its design utility because I’m not qualified; I only notice kerning either when it’s set insanely wide or when it crosses over into keming . I suppose I’ve been looking at web type for so many years, it looks normal to me now. (Well, almost normal, but I’m not going to get into my personal typographic idiosyncrasies now.) My reason to bring this up is that I’m very interested by how TypeButter accomplishes its kerning: it inserts kern elements with inline style attributes that bear letter-spacing values. Not span elements, kern elements. … Read the rest here

Adactio Go to the source

I’ve been huffduffing talks from this year’s South by Southwest , revisiting some of the ones I saw and catching up with some of the ones I missed. There are some really design and development resources in there that I didn’t get to see in person: Phil ’s talk on Excessive Enhancement: JavaScript’s Dark Side , Samantha ’s talk on Faster Design Decisions with Style Tiles , Josh ’s talk on Tapworthy Touchscreen Design , and Scott ’s talk on Why Mobile Apps Must Die . One talk I did get to see was Andy ’s CSS for Grown Ups: Maturing Best Practices . CSS for Grown Ups: Maturing Best Practices on Huffduffer It was excellent. … Read the rest here

Adactio Go to the source

South by Southwest has become a vast, sprawling festival with a preponderance of panels pitched at marketers, start-ups and people that use the words “social media” in their job title without irony. But there were also some great design and development talks if you looked for them. Samantha gave a presentation on style tiles , which I unfortunately missed but I’ll be eagerly awaiting the release of the audio. I also missed some good meaty JavaScript talks but I did manage to make it along to Jen ’s excellent introduction to HTML5 APIs . Andy ’s talk on CSS best practices was one of the best presentations I’ve ever seen. He did a fantastic job of tackling some really important topics… Read the rest here

Adactio Go to the source

A year and a half ago, Eric wrote a great article in A List Apart called Prefix or Posthack . It’s a balanced look at vendor prefixes in CSS that concludes in their favour: If the history of web standards has shown us anything, it’s that hacks will be necessary. By front-loading the hacks using vendor prefixes and enshrining them in the standards process, we can actually fix some of the potential problems with the process and possibly accelerate CSS development. So the next time you find yourself grumbling about declaring the same thing four times, once for each browser, remember that the pain is temporary. It’s a little like a vaccine—the shot hurts now, true, but it’s really not that bad in comparison to the disease it prevents. … Read the rest here

Eric Meyer Go to the source

Published this morning in A List Apart #344: an interview I conducted with Tantek Çelik , web standards lead at Mozilla, on the subject of Mozilla’s plan to honor -webkit- prefixes on some properties in their mobile browser. Even better: Lea Verou’s Every Time You Call a Proprietary Feature ‘CSS3,’ a Kitten Dies . Please—think of the kittens! My hope is that the interview brings clarity to a situation that has suffered from a number of misconceptions. I do not necessarily hope that you agree with Tantek, nor for that matter do I hope you disagree. While I did press him on certain points, my goal for the interview was to provide him a chance to supply information, and insight into his position. If that job was done, then the reader can fairly evaluate the claims and plans presented… Read the rest here

Eric Meyer Go to the source

Right in the middle of AEA Atlanta—which was awesome , I really must say—there were two announcements that stand to invalidate (or at least greatly alter) portions of the talk I delivered. One, which I believe came out as I was on stage, was the publication of the latest draft of the CSS3 Positioned Layout Module . We’ll see if it triggers change or not; I haven’t read it yet. The other was the publication of the minutes of the CSS Working Group meeting in Paris , where it was revealed that several vendors are about to support the -webkit- vendor prefix in their own very non-WebKit browsers. Thus, to pick but a single random example, Firefox would throw a drop shadow on a heading whose entire author CSS is h1 {-webkit-box-shadow: 2px 5px 3px gray;} . As an author, it sounds good as long as you haven’t really thought about it very hard, or if perhaps you have a very weak sense of the history of web standards and browser development… Read the rest here

SimpleBits Go to the source

Yesterday, on stage at An Event Apart Atlanta , I announced Pears : an open source WordPress theme for creating your own markup & style pattern library. I wanted to create my own database repository of commonly used patterns and figured the tool might be useful for others as well. Breaking interfaces down into patterns has been immensely helpful in learning and re-evaluating the best possible code to implement them. I’ve just gotten started and will be adding more as I create them. But Pears isn’t about how I code these patterns—it’s a tool for creating your own . The theme is available on GitHub for those that want to chip in and make it even better. … Read the rest here

Cameron Moll Go to the source

Of Mice and Markets : Zeldman: In the short run it’s going to be hell, just as the browser wars and their lack of support for common standards were hell. But it is the short run…. When I see fragmentation, I remind myself that it is unsustainable by its very nature, and that standards always emerge, whether through community action, market struggle, or some combination of the two. This is a frustrating time to be a web designer, but it’s also the most exciting time in ten years. We are on the edge of something very new. … Read the rest here

SimpleBits Go to the source

Yesterday, a copy of my latest book arrived in the mail, the Third Edition of Bulletproof Web Design . The first edition came out back in 2005, and I’ve been revising it every few years. This latest edit was a bit larger than the 2nd because so much has changed. HTML5, CSS3, Responsive Web Design—all of these things dovetail nicely into the core bulletproof concepts from the original book. If you have the 2nd edition, the new version is likely not a necessary upgrade (New Riders probably loves me for saying that). Meaning, the guidelines for building flexible websites are still there, but a lot of the code and some of the examples have been brought up to speed. … Read the rest here

Snook Go to the source

Meet Jack the Lumberjack. He’s the new mascot for Scalable and Modular Architecture for CSS . When working on the e-book, I wanted to have something that could provide an identity for the book and for the project. The idea of it being a lumberjack quickly came to mind. I liked the idea of a lumberjack for a number of reasons. For those that aren’t aware, I live in Ottawa, Ontario, Canada… Read the rest here

Adactio Go to the source

Divya Manian , one of the super-smart web warriors behind HTML5 Boilerplate , has published an article on Smashing Magazine called Our Pointless Pursuit Of Semantic Value . I’m afraid I have to agree with Patrick’s comment when he says that the abrasive title, the confrontational tone and strawman arguments at the start of the article make it hard to get to the real message. But if you can get past the blustery tone and get to the kernel of the article, it’s a fairly straightforward message: don’t get too hung up on semantics to the detriment of other important facets of web development. Divya clarifies this in a comment : Amen, this is the message the article gets to. Not semantics are useless but its not worth worrying over minute detail on. The specific example of div s and sectioning content is troublesome though… Read the rest here

Adactio Go to the source

When I first heard that Hixie had removed all traces of the time element from the ongoing HTML spec, my knee-jerk reaction was “This is a really bad idea!” But I decided not to jump in without first evaluating the arguments for and against the element’s removal. That’s what I’ve been doing over the past week and my considered response is: This is a really bad idea! The process by which the element was removed is quite disturbing: Hixie (as a contributer) opens a bug proposing that the time element be replaced with the more general data element. Lots of people respond, almost unanimously pointing out the problems with that proposal. Hixie (as the editor) goes ahead and does what exactly what he wanted anyway. Technically that’s exactly how the WHATWG process works… Read the rest here

Hicksdesign Go to the source

I’ve been following the announcements of the new Windows 8 UI (and particularly ‘Metro’) this week with great interest. I think they’ve done a fantastic job with Metro, it really looks like a fresh start UI wise. One detail stood out in particular. In the screenshots I noticed that they’ve adopted the Open Share Icon in their UI. To fill you in, the Open Share Icon came about after the original share icon was purchased by the company that provides the ShareThis service. While still licensed for public use, some people felt this wasn’t in the spirit of the thing, and decided to create a completely open version instead . … Read the rest here

Adactio Go to the source

I was in Minnesota last week for An Event Apart Minneapolis . A great time was had by all. Not only were the locals living up to their reputation with Amy and Kasia demonstrating that Kristina isn’t an outlier in the super-nice, super-smart Minnesotan data sample, but the conference itself was top-notch too. It even featured some impromptu on-stage acrobatics by Stan . A recurring theme of the conference—right from Zeldman ’s opening talk—was Content First . In Luke ’s talk it was more than a rallying cry; it was a design pattern he recommends for mobile: content first, navigation second. … Read the rest here

Cameron Moll Go to the source

Web Typography for the Lonely : “…aims to excite designers about the possibilities of cutting-edge web standards and javascript through beautiful and inspiring typographic explorations.” Complete with downloadable code, and cleverly written by Christopher Clark. From the Coolinate page: I am very aware that Coolinate is a dumb name for anything ever. Sadly, my other ideas— Line-shadowify, Manystuffify, and Bloginate — all seemed dumber. There weren’t many options really. Putting some lines under text isn’t an activity that conjures epic war-hero-style action verbs… Read the rest here