Fyrdility

Fyrdility has a new design. Hope you like it!

I actually took some time with this one, rather than just incrementally making changes as I had before. I’m likely to still tweak it here and there, but I’m happy with the overall design as it is right now.

The design uses the same basic colors as the last one, while being (hopefully) more visually appealing. There’s also less experimentation (currently no border-radius or SVG background image), since I wanted to keep most features cross-browser compatible. However, IE6 support is gone, as you may have suspected from all the alpha-transparent PNGs. As my IE6 visitor usage is under 2%, it’s a privilege I am thankfully able to afford.

Note that future changes/additions will likely see more SVG/CSS3 features, since I am a big believer these technologies as well as the use of progressive enhancement. I just want to make sure I put them to proper use, and not just for sake of it (as I have been guilty of before).

I’d also like to add more interface improvements, as I love working with jQuery and improving the visitor experience. The biggest challenge I suspect is to find a way to improve things for visitors that are already used to standard blog/website conventions. I myself am not a fan of new features on sites that should make the experience better, but end up just confusing me or that give a sense of disorientation.

Your feedback is appreciated, especially let me know if you notice any accessibility issues or you feel your experience could be improved somehow.

Any minor changes I have made to WCIU so far have been undocumented. They didn’t seem worth blogging about and tweeting about them seemed a bit silly too. Since the information may be useful to people, I’ve decided to create a simple RSS feed that will be updated whenever a change is made to WCIU.

The updates will include bug fixes and any new interface options, but most importantly they will include information on browser releases and their new support for features. Thus by subscribing to the feed, you won’t miss any new developments on support for your favorite features.

Additional options may appear in the future, like only seeing information for news on specific features. Will see.

I have added a new mode of displaying feature support information on “When Can I Use” resulting in the ability to select two browsers and only see what the differences are in feature support.

This allows you to pit two different browsers against each other to see which one outdoes which in what areas, but it is also useful to get a quick overview on which new features can be used in an upcoming release. For example, selecting Chrome 1 and 2 will let you see which new features are now available in Chrome 2.

This new mode will also tell you how much better one browser version is than another, note this is highly unscientific and doesn’t take into account support of features not mentioned on When Can I Use. Still, it’s kind of entertaining. Also, the mode generates URLs from your selection, so feel free to share your results with others.

Currently it only shows differences in support, I plan on also providing the option of displaying support common in both versions, as well as missing support. There may be a few other rough edges that need fixing, please let me know if you see anything that looks odd.

I’m happy to announce the latest project I’ve been working on:

A jQuery plug-in to provide support for the CSS Template Layout Module. For those of you unfamiliar with this specification, it provides a relatively easy way to make a table-like layout using CSS. Until recently it was known as the “CSS Advanced Layout Module”.

The spec is still a “working draft”, so it can still change significantly. But while that status hasn’t stopped browsers from implementing other CSS3 modules, so far none have tried implementing this one.

Inspired by Eric Meyer’s Call for a layout system as well as his suggestion that many CSS features can be made to work using JavaScript, I went to work. Why wait for browsers to implement something when we can have JavaScript take care of it today?

The advantages to using this system include:

• Source independence, so there’s lots of possibilities with the same markup
• All the benefits of a table-like design without the drawbacks
• Instant overview of how the basic layout works just by looking at the CSS
• No need for div-heavy CSS frameworks just to accomplish a simple design
• Easy rearranging for different media (print, mobile)

The disadvantage to using JS rather than native support means of course that those with JavaScript disabled won’t see the intended layout. However, considering the HTML content can me put in almost any order, there is still a lot of flexibility in how it will appear to non-JS users.

The script has been tested and confirmed to work in the following browsers:

• Internet Explorer 7+
• Firefox 2+
• Opera 9.6+
• Safari 3.1+
• Chrome 1+

For download, demos, and usage, see the Project page. Contributions welcome!

My first participation in CSS Naked Day!

Hope you like black on white text.

Some interesting twittering earlier today on the subject of Apple actually being worse than Microsoft for the Open Web. Seems like quite a provocative statement to me, and a concept worth discussing.
Read the rest of this entry »

There may be a better information source, but I just noticed a photo from the Gizmodo iPhone OS 3.0 coverage, which at the top right includes “Audio/Video tags“. Unless I’m very much mistaken, this refers to the HTML5 elements being supported in Safari!

This would be my #1 wish in my recent wish list, so if true and supported properly, it could be awesome.

One of CSS3’s most popular features is border-radius. The ease of just being able to specify your rounded corners in CSS is very appealing compared to using JavaScript or a bunch of bloated HTML to accomplish a simple effect. So here I will describe a CSS-only method we can use today that works in all four major browsers. Sadly, this does not include Internet Explorer, so I will include an alternative solution for it too.

Read the rest of this entry »