In hindsight, it’s entirely logical that the first version of nascentguruism’s design would turn out to be everything I made it and nothing I wanted it to be: I was learning about design by observing and experimenting, and so would quickly lose focus on the overall design, becoming preoccupied with whatever details I wanted to introduce at that moment in time.

After ten months’ toil, the site launched with a whimper and, because of the shoehorning that had taken place to include all the extra details, I quickly became jaded: the format of the site didn’t appeal to me, and so I was unwilling to write. As time passed, my interest waned.

Lather, Rinse, Repeat

Shortly after SxSW in March–around June, if memory serves–I was inspired to play with some ideas for a redesign of nascentguruism.

Rather than pressuring myself to continue working solidly until it was ready to launch–as I had with the initial ten-month design–I decided simply to get all my ideas down on paper into a PSD before taking time to mull over what I’d come up with. After a while, I’d start anew, creating a design from scratch, building upon–or, in some cases, replacing–what I’d done in the last iteration.

This process continued until mid-October, when I finally felt that the design could go no further without transitioning to markup. Throughout, I refused to do any work–design or markup– unless I was compelled to do so.

I think this relaxed approach to the design and implementation has served me twofold: the design and implementation was less forced, and so the final site has a more relaxed, open feel to it, and this design is something I positively want to work with, to the point that I’m practically itching to post new content to it (and have been for the last month). Further, the iterative, throwaway-prototype approach to designing allowed me to incorporate new ideas effectively, without compromising the design as much as I might before.

Typography

One of my primary focuses in this new design was to experiment with typography, using some of the ideas gleaned from reading Robert Bringhurst’s ‘The Elements of Typographic Style’ and working with Rich on Web Typography. I’ve tried to blend more widely used ideas (like working with vertical rhythm using baselines) and more playful ones (like ornamented indentation), and will continue to experiment and integrate ideas put forth in Web Typography.

Some of these experiments are very reliant on using modern CSS techniques, such as generated content and pseudo-elements and, as such, may not display as expected on all browsers (Internet Explorer, I’m looking at you). Further, most of the font-size-related typography has been optimised for WebKit-based browsers on Mac OS X and, as such, there may be sizing issues with other platforms or browsers. Or maybe not. Everything should be usable, at the very least.

Style

As it stands, the CSS is very clearly showing signs of the hap-hazard approach I took to developing it; in the very near future, I plan to rework it–possibly using YUI reset and fonts.

Support

I couldn’t have achieved everything I have in this redesign if it weren’t for the help of a two notable individuals:

• Anton was a constant source of inspiration and has the patience of a monk, answering all my design questions–no matter how inane–with nary a complaint.
• Ben put up with my badgering for opinions on this or that markup quandary, and seemed to delight in challenging me to get the ideal markup working in whatever layout I was attempting.

These two deserve more gratitude than I can express here–or in beer form–thank-you both.

There are, however, others that have supported me throughout the process, who also deserve thanks:

• Drew
• Faruk
• Fatty
• Fran
• Norm!
• Piotr
• Rich

Fin?

nascentguruism is far from complete–during this redesign, I’ve come up with many, many ideas for future work on the design and implementation. Most importantly, however, I have a renewed excitement for blogging and a few ideas for future posts in mind.

Only time will tell if it lasts, I suppose.

Just as the book itself was beautifully set (as one would expect), well written, entertaining, and generally a joy to behold, the same can be said of Web Typography. From the subtle use of Flash for the logotype to the carefully set table of contents, everything about the site reeks of typographic quality, its own distinct style echoing that of the original Elements.

The purpose of Web Typography, of course, was not to supplant Elements as the definitive resource for typography – the Typographers’ Bible, in the words of Herman Zapf – but rather to supplement it: to act as an unofficial companion for those working with type on the web.

It is with much excitement, then, that I’m announcing what will, hopefully, mark the start of a trend: my first contributions to Web Typography, §2.3.1: Set opening paragraphs flush left and §2.3.2: In continuous text, mark all paragraphs after the first with an indent of at least one en, have been published.

I’d like to thank Rich for the opportunity to be involved: he’s been incredibly supportive of my contributions. Like Rich, I’m not a professional typographer (or, in fact, anything more than ‘a guy who has an interest in typography’) but I’d like to hope that, with my contributions, I can help someone out there fall in love with typography and, more specifically, its applications online. If just one person learns to love typography a little more thanks to something I contribute, I’ll be happy.

So, I hope you enjoy what I hope will be the first of many contributions I make to Web Typography!

• §2.3.1: Set opening paragraphs flush left
• §2.3.2: In continuous text, mark all paragraphs after the first with an indent of at least one en

A while back, Ben was trying to replicate certain keyboard niceties from the wonderful Mac OS X in Windows. As a fellow superhero with an alter egoMac user by night, Windows user by day and utter pedant, I was intrigued, so decided to dig further into the problem.

Microsoft Keyboard Layout Creator

The Microsoft Keyboard Layout Creator seems the most obvious option to start with: it allows re-mapping of all of the standard keys on a keyboard (all the way across to the return key), along with the use of any of the Windows modifiers (Ctrl, Shift, and AltGr – which is the same as pressing Ctrl and Alt together; apparently Alt isn’t considered a Shift state by the Keyboard Layout Creator)

It’s easy enough to get most of the way to Mac OS X keyboard goodness: one can assign whatever characters to keys as one sees fit, assign values for the aforementioned modifiers, and generally make some pretty cool changes to your keyboard layout. This lets us get most of the way towards the dream of proper, nice OS X typography on Windows: you can rearrange the standard keyboard, set up AltGr to behave like the Mac’s Opt with lots of keys, and generally get most of the real niceness in OS X done, and using native Windows functionality.

Warning: the following will almost certainly make the characters shown on your keyboard not match those they produce in Windows (unless you use Windows through Virtual PC on Mac OS X, in which case they will match more). If you have to look at the keys to remember which is which, using this is not advised. I cannot be held responsible for you breaking/being unable to use your computer if you use this.

To save everyone the time and effort, however, I’ve already made a keyboard layout for Windows. To install the new layout, simply unzip the file and run the contained MacOSUK.msi. To then set the layout up for use, go to Control Panel>Regional and Language Options>Languages, click Details…, then click Add…, and set ‘Input Language’ to ‘English (United Kingdom)’ and ‘Keyboard layout/IME’ to ‘United Kingdom (Mac OS X)’. Click Ok, and then Apply.

With this, the Windows language bar should appear on your task bar. You can then switch between United Kingdom (Mac OS X) keyboard and whatever other keyboard layout you so choose. Alternatively, you could remove other keyboard layouts in the ‘Text Service and Input Languages’ (the one where you added the new layout), making the new Mac OS X style layout your default (and hiding the language bar).

Accent chords

The one thing that this doesn’t cover, though, is the neat little tricks you can do in Mac OS X to create characters like ñ: hold Opt and press n followed by n on its own, along with various others of a similar ilk.

Here is where AutoHotKey, that Ben mentioned, comes in: you can specify character replacement strings which are identified as you type (think auto-correct for letters). The observant members of the audience will already be thinking to themselves ‘but didn’t you just link to a homebrew keyboard layout to make our Windows keyboards just like those on the Mac, save a few keys?’

Why yes I did Billy, yes I did.

With a combination of AutoHotKey and our Mac-esque keyboard layout, we can have almost identical input on Mac and Windows, save the need, on Windows, to use AltGr in lieu of the Mac’s Opt.

Once again, because I’ve more time on my hands than is necessarily healthy, I’ve already made an AutoHotKey script for most of the easier accent chords. Notably absent are grave chords (due to what appears to be a bug in AutoHotKey’s Unicode handling, I felt compelled to leave them commented out) and all those chords that create characters with no extended-ASCII value.

To use it, install and run AutoHotKey, right-click the system tray icon and select ‘Edit This Script’. Copy and paste the contents of my script into this script (either overwrite or append it), save, and select ‘Reload This Script’ from the menu of AutoHotKey’s system tray icon.

That’s all, folks!

By this point, you should have Mac OS X style text input on your humble Windows computer. The only thing that’s missing now is switching the modifier keys so that they’re all laid out like the Mac but, thus far, I’ve not found any program that successfully achieves that. I’ll let you know when I do.