This will not end well.

(Well, it didn’t but I’m still thinking about it!)

One of the things I love about SASS is how it makes colour so mutable and interactive. Traditionally I’d preset my colours laboriously in Photoshop and transfer them to the CSS file via cut-and-paste, going back and forth to tweak hues and shades. Or I’d stick to basic, easily remembered values such as #ccc (shortcut for #cccccc, a light grey).

SASS’s variables and colour functions change all that.

Take the following code block:

	h2 {
		padding: 0.2em 0.5em;
		background: lighten(rgba($accent_colour, 0.7), 80%);	
		clear: both;
		font-weight: 500;
		text-align: right;
	}

I’ve already defined the accent_colour, so for its background colour I just take the variable, and pass it to the lighten function, and lighten it by 80%. Easy, and useful.

But wait, there’s more! You’ll see I’ve also used the rgba function to set the opacity of the background colour to a value of 0.7, without having to write out the entire rgba(0,0,255,0.7) value. The rgba function even allows me to pass hex colours to be transparentised, like so: rgba(#ccc, 0.6). Almost too easy. The usual caveats about checking the resulting colours for appropriate contrast levels apply (and, usefully, there’s a contrast function that you can use to ensure the colours you generate conform to accessibility standards).

Rounding up the week that was:

• HTML5 Rocks - HTML5 Techniques for Optimizing Mobile Performance
• Why “branding” won’t save the creative class - Salon.com
• Film Fading to Black: ARRI, Panavision, and Aaton ceasing production of traditional film cameras.
• Questions I ask when reviewing a design - (37signals)
• Photorealistic Illustrations Inspired by ‘Angry Birds’
• The Broadcast of Comics
• Kern Type, the kerning game

The "Branding" link at Salon was particularly sobering. Outlets for bread-and-butter, professionally produced, creative labour are drying up fast.

Siri’s social dilemma:

Secondly, voice assistance carries a whole host of privacy issues. Some are basic: How do you prevent others from using your phone with voice commands? What kind of access security is built in to a system like Siri? In some cases, it can become more complex. Consider how much private information is contained in your smartphone. How much of that information would you be comfortable broadcasting around you to strangers and people you know? Would you be willing to have Siri dictate your texts, emails or appointments out loud in your workplace? At home? You can imagine a thousand and one scenarios where that would be undesirable. Would you want a secretary dictating your next appointment out loud into your doctor’s iPhone for everyone in the waiting room to hear?

I have no idea if Siri’s voice control service is as good as the hype claims (let me be uncharacteristically pessimistic and assume not), but if it is — and if becomes widely used — then we’re probably looking at a shift in social norms around communication technology as significant as the shifts following the adoption of the mobile phone. Remember when conspicuous mobile phone usage marked you out as an irredeemable wanker? And how that marking changed almost overnight?

A few notes about the latest redesign.

Markup

• Still XHTML 1.0. It won’t be hard to convert the site to HTML5, but I adjusted the markup only minimally this time around. I do want to improve the site’s semantics, though.
• See if you can find where I’m using an ARTICLE element in the markup, though!
• Future plans include custom styling for code examples. I want to dive into more technical topics in the future.

CSS and graphics

• Reasonably restrained use of CSS3 properties, such as text-shadow and RGBA colour (for semi-tranparent panel backgrounds, etc)
• Fewer gradients!
• For the first time on one of my own sites, I’ve constructed the CSS with SASS, the Syntactically Awesome Stylesheet Language, and Compass, the SASS CSS3 framework. Together, these tools make it easier to write well-structured, scalable, cross-browser-friendly stylesheets. It’s the future, man.
• I’m also experimenting with what’s called a “semi-fluid” layout. Fixed width over 900px wide, narrowing dynamically as you resize your browser window. A Compass plugin called Susy made that possible without me going mad at the maths.
• Next step will be to make it even more dynamic and resize to a mobile-friendly view where appropriate.
• I’m basically not worrying about IE support right now. Feel free to let me know how the site works in your browser of choice, however.

Tech

• Still with Textpattern, though I’ve finally upgraded to TXP 4.4.1. Still does everything I want it to. Still easier to use than any other option.
• I do need to spruce up some of the plugins I use, though.

Type

• Custom fonts delivered through TypeKit.
• I’m using Freight Sans Pro, a rather friendly sans-serif.

I count this as a work-in-progress, but I’m pretty pleased with the outcome so far.