James Oppenheim’s blog

Australian Web Week has been born, this year from October 2 - 9. There is not much on at the moment, however, give it a couple of years and I think it will be a really exciting time for the Australian digital industry. Taken from the Australian Web Week website (http://webweek.com.au) the week involves:

…the best of the Australian web industry - sites and applications, designers and designs, innovative Australians taking it to the world. Over ten days professionals across the industry from around the country and the from around the world will come together to connect, learn and celebrate the strength of the Australian web industry.

Technorati Tags: Australian Web Week, Web

Il buono, il brutto, il cattivo.

I spend most of my daily working hours as a front-end developer creating custom HTML, CSS, JavaScript for the web. However, from time to time I have to dip my toes into HTML emails. Which is not such a stretch as after all they use the same underlying technologies. Making them even more comparable is the pain I have to go through bending, cheating and hacking the code to fit with a Microsoft product:

Internet Explorer 6 is to web development as Outlook 2007 is to HTML email development - A massive time waster!

As outlined back in January 2007 by the Campaign Monitor guys Microsoft Outlook 2007 uses the Word rendering engine to display emails, that means:

1. No background images
2. Poor background colour support
3. No support for float or position
4. Shocking box model support

The Good

Internet Explorer 8 has a high level of CSS 2.1 support, which is a fantastic move in the right direction.

The Bad

Internet Explorer 6 and its additional development time to support it will be with us for a long time to come and Internet Explorer 8 does not support any CSS3.

The Ugly

Just when you though Microsoft was listening to standards bodies and creating a better Internet environment for all they mention that Outlook 2010 will also still use the Word rendering engine.

Hopefully, the Email Standards Project’s latest website http://fixoutlook.org/ will implore Microsoft to do the right thing and stop using Microsoft Word to render emails. Please, please, please. If I say it three times does it become true? I hope so.

Technorati Tags: Microsoft, Outlook, Email Standards, fixoutlook.org

I had a thought the other day when I was doing some CSS image replacement - would it not be really cool if CSS3 were to introduce a foreground-image property?

Normally, I use the Shea Enhancement image replacement method that lets both screen readers see the text, provides a tooltip and also shows the text when images are turned off. However, there is one drawback: the extra span tag.

A foreground-image would sit on top of the text node, rather than behind it, and have the same options as background-image. No more unnecessary span tags - sweet!

Technorati Tags: CSS, foreground-image, Web Standards

It is possible to use multiple CSS classes on one HTML element. For example:

class="first second"

This is fantastic to produce reusable default styles that can be slightly overridden by the use of a second, third or fourth class. However, what becomes more interesting is that you can use both of the CSS classes in combination to create a more specific class.

For example, if the first class was ‘green’:


.first {
background-color: green;
}


and the ’second’ class was red:


.second {
background-color: red;
}


But when an element has both classes together ‘.first.second’ you get yellow.

.first.second {
background-color: yellow;
}

A point to note with the multiple classes is that the order is not important, for example: ‘.first.second’ is the same as ‘.second.first’.

However, there is a problem! In IE6, ‘.first.second’ works exactly the same way as ‘.second’. This is because IE6 doesn’t understand the chain of classes within a CSS selector, but instead only reads the last class in the chain.

Because of this we can’t safely use this technique if we want to support IE6. However, we can use it to create a IE6 CSS hack! To do this we add a random class that does not exist on the element before the real one and only IE6 will still match it. For example:


.ie6.third {
background-color: orange;
}


I have setup a demo page to demonstrate the multiple CSS classes & the IE6 CSS hack.

Technorati Tags: CSS, Examples, Web Standards, IE6, CSS hacks