I was disappointed to learn that Google had a hand in recent proposals on Internet neutrality.

Google-Verizon proposals: telling tall tales

These proposals purport to underwrite the future of an open internet. To quote the BBC story on the subject:

“The set of seven proposals guarantee equal access to the internet and call for the prohibition of wired broadband providers from discriminating between different kinds of internet traffic to ensure that no-one can pay to have their traffic treated more favourably.”

Ostensibly it all sounds laudable, but given that only wired providers would be affected, it’s only one side of the coin. The future, we are often reminded, is wireless and between them Google and Verizon have everything to gain as the market continues to grow.

56% of Americans have accessed the Internet wirelessly

- Pew Internet & American Life Project (2009) [Source]

I sincerely hope that, with these “compromise proposals” as it calls them, Google has backed a loser.

Self-interest and the public interest

According to the blog post above, Google aimed for these two goals:

1. Users should choose what content, applications, or devices they use, since openness has been central to the explosive innovation that has made the Internet a transformative medium.
2. America must continue to encourage both investment and innovation to support the underlying broadband infrastructure; it is imperative for our global competitiveness.

The only choice guaranteed by the first goal, given the content of the proposal, is Hobson’s choice. Even if access to everything is open, a two-speed wireless internet will dissuade users from consuming information and applications not already sanctioned by wireless providers and their online partners.

The ‘explosive innovation’ of which Google speaks is the fruit of unrestricted choice based on a level playing field of user access, whatever the connection.

Then there’s the second goal. Despite all the WTO-encouraged talk of stamping out protectionism, these proposals seek to bolster American interests in a global economy.

These are words designed to sound sweet to American regulators burned by the Comcast case, the American public whose jobs are threatened by cheap labour, cheap imports and massive offshoring and to Google and Verizon shareholders everywhere, who will no doubt be salivating in anticipation.

Corporations and public policy

We have reached a point in time at which corporations can now define public policy by the front door. Where once lobbyists had to ply their trade in hidden corridors, today the democracy of money and influence is out and proud.

The Apples, the Microsofts and now the Googles of this world are no longer content with telling us what to buy.

These proposals on the future of the internet show us that pervasive product marketing is no longer enough. A corporation now needs to be willing enough to dictate our future, our moral principles and how we should live.

Whilst working for a company obsessed with customer service, I once learned that 95% of customers won’t bother to report a problem, they’ll just go elsewhere.

That figure is probably higher still on the Internet, where anonymity and choice are key aspects of the customer experience.

Support personnel at the Belgian edition of online recruitment website Monster clearly have much to learn about customer service.

Since the last time I updated my profile, Monster has ajaxified, widgetised and fetishised many of its interfaces. Most of them work fine.

However, I wrote to Monster the other day about a problem in Firefox with the tabs in their My Profile page. When I click these tabs, I explained, the content below is supposed to change. Instead, the click event is not being captured by the appropriate script so that the browser is navigating away to an error page.

Here’s an abridged reply from Davide Palaia of Monster Global Customer Services:

Dear Mike Padgett …

First of all, I would like to thank you for putting this to our attention, I will contact the right department and investigate for you.

However I would suggest you to either clear cache and cookies of your FF or eventually, if you still notice some difficulties, download Internet Explorer … [My emphasis]

I rest my case.

In addition to my earlier article on Getting started with a Garmin eTrex H GPS for walking, here’s a brief explanation of how I create routes and transfer them to the eTrex H.

Before we get started, there are a few points to mention:

• We’ll be using proprietary software and map products on Windows XP or above
• When creating a very basic route, we have no real need for waypoints, just via points – so I won’t be discussing waypoints here
• Sometimes the workflow might seem a bit convoluted, but as a routine I’ve gotten used to it and it will probably apply to almost any basic Garmin handheld device, not just the eTrex H!

Using Mapsource

As I explained in my Getting started… article, I use Garmin’s Mapsource software to plan and create routes, which doesn’t ship with the eTrex.

Mapsource (v6.15.11 illustrated here but v6.16.x works the same) is surprisingly clunky for a desktop software client. As the main interface between the eTrex H device and the computer, however, it’s pretty much essential and I can live with its limitations.

So with that in mind, let’s start up Mapsource now.

Drawing a route

First we’ll need to select our map product. Assuming it’s properly installed and unlocked, select it.

Select the map product you want to use

We need to find the starting location for our route. I often use Google Earth or Google Maps to do this: a satellite view offers a more human picture of car parking facilities and other features.

Use the Find menu and the Hand tool in Mapsource to drag to the location. The “+” and “-” keys will zoom in and out respectively.

Now select the Route tool and click on the map at the desired starting point.

Click on the map at the desired starting point

Point by point, draw a route out on the map. If you’re walking, you’ll obviously want to stick to paths and trails rather than proper roads. Mapsource isn’t too intuitive when you make mistakes, so try to minimise them wherever possible, making use of Edit > Undo / Ctrl Z. If you do need to go back and edit your points, then you should learn how to do that with the Route tool. Since I need to keep this article simple, I won’t cover it here.

Tip!

When drawing out a route, I again tend to use Google Maps or Google Earth with the pictures layer(s) turned on. This helps me ensure I don’t miss any beauty spots or places of interest (because people tend to take photos of them).

Showing the picture layer in Google Maps

Tip!

Always think of the real world when planning a route:

• Shorter is not necessarily easier or safer
• Map data (especially Garmin’s own topo maps) can be infuriatingly inaccurate, so check for updates and also your paper map
• Little details on the PC can help a lot on the trail – for example, if I’m going straight over a crossroads, I eliminate doubt by placing my next via point after the crossroads

Placing a via point after the crossroads

Caution!

It’s important to remember when drawing that the eTrex H only accepts a maximum of 125 points per route. This limit increases as we go up the food chain of Garmin GPS models. So what can we do with a long and/or complicated walk? The options are limited but I don’t mind. More on that below in the Preflight section.

Once you’ve finished drawing out the route, you might want to save it. The default file format is GDB, a Garmin proprietary format specific to Mapsource and as such not necessarily transferable to other software. Personally, I stick to GPX, which is an XML standard (albeit proprietary itself) and supported by all software and devices I’ve so far encountered.

Preflight

Years ago, I used to do graphic design. After the creative work was finished and in order to send the artwork off to the printer, a final – and sometimes highly technical – workflow would usually be necessary: Preflight.

In the same way, if because of length or complexity the route contains more than 125 via points, we will need to do another workflow before we can transfer our route to the eTrex H. If the route contains 125 or less via points, you can continue to Transferring GPS routes to the eTrex H.

With longer routes, we need to consider one of the following options:

1. Cutting out superfluous via points to get the total down to 125 points – this is easier than it sounds, because a clearly-defined trail rarely needs every kink to be marked with a point
2. Dividing a big route into multiple smaller routes – this in turn triggers another eTrex H-specific constraint, the grand total of points across all routes cannot exceed 500!

If you can’t work around the point limitations of the eTrex H by option 1, then option 2 will work for all but the most complicated routes. You just need to be comfortable with the idea of switching routes on the fly during your walk.

So speaking personally, the only practical inconvenience for me is having to keep an eye on the device when I know we’re nearing the end of one route, because then I’ll need to switch to the next one on the list.

Tip!

Cutting out the flabby via points or splitting a big route into a series of smaller routes could be a big headache. Mapsource certainly won’t help us.

Enter the resourceful Dutchman Edward Sackman and his brilliant WinGDB utility. Alongside Mapsource, I use WinGDB almost as much.

WinGDB is a multitool of functions that the folks at Garmin neglected to include in Mapsource, including facilities for route simplification (based on some excellent mathematics) and splitting. You can output the results to a file or to another instance of Mapsource.

Edward Sackman’s WinGDB (v3.44 shown)

If you’re planning more complex routes and you’re willing to accept the eTrex H’s limitations, then spend some time getting to know WinGDB.

Transferring GPS routes to the eTrex H

Without Mapsource or an alternative [1], you cannot transfer routes or tracks to or from the eTrex H because the serial interface cannot be read like a disk in the way that we might do with, say, a digital camera. So you’d otherwise be reduced to entering the points on the device manually, which is no fun at all.

So far we’ve prepared our route using Mapsource, so let’s go back to it now.

If you’ve installed the correct drivers for your eTrex H (see the Getting started… article for more information), transferring routes to it is simple using the Transfer > Send to device... menu:

Be sure not to pull out the cable or stop the operation before it’s finished. Also check the device to confirm that the transfer has completed. If your route contains too many points, the device (not the computer) will truncate it and display a message to that effect.

And finally, as this is serial and not USB, be patient because the transfer process can take a while!

Footnotes

1. “… or an alternative”: alternatives to Mapsource as an interface between a computer and the eTrex H are rare. GPSBabel is one example of which I have no personal experience. Most of Garmin’s other, higher specification devices are more simply managed since they feature removable memory cards ↑

I decided to get a little handheld GPS device for routes and tracks: we’re doing more walking these days and I’m a bit of a maphead.

Many websites out there contain information on GPS devices, few of them seem to properly explain the concepts to a complete beginner.

Buying a GPS device

Of the two kinds of GPS device available – basic (no interactive maps) and mapping (in-device maps) – I chose the basic kind because I don’t need to actually see the maps as I walk. There are two reasons for this:

• I’m not likely to be a ‘power user’
• We’re not quite yet at the stage where the technology can fully replace a map and compass, and
• Reviews of mapping devices have been less than glowing on the issues of display and battery life

This situation will almost certainly improve as time goes by but for now a basic GPS device fits the bill for me. I bought a Garmin eTrex H from AS Adventure at Zaventem. AS Adventure is rarely the cheapest option here in Belgium but J had a discount voucher.

No PC connection cable in the box

The Garmin eTrex H ships without a cable to connect to the PC. Naturally, nobody tells you that. And the manufacturer’s price for this essential piece of kit – without which you can’t send and receive data between the device and your computer – is pretty disgusting. I headed immediately for eBay.

The eTrex H is a new version of the older eTrex but it retains the dinosaur serial connection of the original. Many PCs no longer have a serial port.

So I bought a USB-serial cable (no need for a serial port) from Kawamall’s eBay Store in the United States, sold as USB & PC data Cable for Garmin Etrex H GPS.

That’s not quite the end of the cable story – more on that later!

The abstruse user manual

It could just be me, but I found the manual in the box totally unreadable. A bit of searching on the web brought me to the manual for the older eTrex version. As far as the user is concerned, this older model is pretty much the same as the eTrex H. Most of the updates happened under the hood.

Amazingly, the manual for the older eTrex is much more readable and I recommend it. I downloaded from the otherwise intriguing Vern’s Rocketry website (direct link to the manual).

Would the real USB drivers please stand up?

Once I had the basic functionality mastered, I wanted to connect the Garmin eTrex H to the computer with my new USB-serial cable.

The cable, which contains a Prolific PL2303 chip, arrived with a neat little CD-ROM of drivers (the latest drivers are online at the Prolific website), none of which worked on my pretty standard Windows XP installation. I knew that messing around with COM ports is a painful business and steeled myself for a long process of trial and error!

After a lot of searching, I found a Microsoft Community article concerning support for Windows Vista with a post containing a link to a ZIP file of Prolific PL2303 All-in-One GPS drivers for Windows on an inocuous-looking technology vendor website.

To my astonishment these drivers worked perfectly. My GPS device was hooked up within seconds.

Garmin Mapsource for routes, tracks and management

As well as skipping the PC data cable, the Garmin eTrex H also ships without Mapsource, Garmin’s mapping software. Apparently, Mapsource only ships with posher models these days.

The manual shipped with the eTrex H alludes to the fact that the device will work with Mapsource. So here the Internet is your friend: getting and installing Mapsource without a disc is a worst kept secret!

As you might now expect with Garmin, given the lack of a PC cable in the box, there’s a similar story with Mapsource: the software on its own is not very useful. Mapsource needs to be loaded with (frequently expensive) topographical maps for it to help you plan and manage tracks and routes and most importantly to send and receive them to and from the GPS device.

What’s the difference between GPS routes and tracks?

In GPS-speak, a route is just that: a planned route with a start and an end and in between a collection of “via” waypoints to mark out the path. A track is a more or less accurate reflection of what path the user has actually covered on the ground, including any deviations.

Creating routes and transferring them to the eTrex H

The scope of this article is limited to the basic hardware and software requirements. See Creating routes for a Garmin eTrex H for more on that subject.

Useful tools

Mapsource doesn’t do everything. The budding GPS enthusiast also needs to have a small arsenal of other tools at the ready.

To convert tracks to routes and vice versa, something which Mapsource surprisingly can’t do, I have been using WinGDB. This little program requires an input of tracks and/or routes in the form of Mapsource’s native .GDB file format. Note that the current version of Mapsource creates version 3 .GDB files and WinGDB only accepts version 2, so be sure to specify the older version 2 format when saving a track or route for working with WinGDB.

Other file formats that I’ve come to know and love are GPX – an XML standard for geodata – and KML (or KMZ, a zipped version of the same), Google’s geographic XML standard. I make much use of both Google Maps and Google Earth. Both offer precise geographic browsing with reasonably accurate satellite image overlays.

The GPSVisualizer website is another essential reference. It can convert GPX to KML and KML to GPX. The GPSies.com upload page will also do both.

Carl Spitzweg’s The Poor Poet (1839)

Writing copy for online consumption still seems to be something of a black art. Most web professionals know what works, but figuring out how to achieve it is quite a different matter.

This article brings together a few of the themes that I encounter in my activities around the relationship between information design and editorial policy.

The shock of the new

Often I encounter writers and editors more used to ‘traditional’ communications, raised on a diet of press releases, white papers and speeches. Some may even express impatience with the business of writing online copy: normally this is just a mask for unfamiliarity.

Indeed it’s probably understandable that those who work with such copy will tend to focus almost exclusively on the message rather than the medium, particularly if their subject is highly specialised. If looks could kill, it’d be best not to mention the word ‘Twitter’.

Successful online delivery requires method, usually arrived at through trial and error and a healthy dose of self-restraint. Specifics are beyond the scope of this article but certain characteristics are essential:

• Brevity
• Structure
• Pattern

Writing styles and content management

Therefore when authoring content for online consumption, there tends not to be much room left over for personal style. Sometimes writers and their expectations need to be managed.

Consider a situation I experienced recently: a changeover of editors on a website consisting of 20,000+ units of content. In newspaper journalism the content model is often so strict that editorial changes are barely noticeable but here in public sector policy and statistics, the effect of the swap was both immediate and profound.

The outgoing editor had a fastidious attention to detail. He was concerned to substantiate all assertions very carefully and maintained a subtractive, minimal approach to copy. His replacement took a freer hand and preferred to discuss matters at length.

Both writers were drafting materials essentially on the same subjects, yet the texture of their respective outputs was markedly different: the former produced shorter items peppered with links and endnotes whilst the latter delivered lengthy paragraphs and fewer headings.

Involvement in the content writing process

When should the information architect take a hand? How involved should she be in the editorial process?

The answers to these questions depend on the environment. Some writers and editors will be interested in hearing about information architecture, others may be rather more buffeted by the tides of strong personality.

What seems clear to me is that some guidance is essential for those less familiar with the online domain, but any imposition of strict editorial rulesets will send out the wrong message and will probably be ignored.

Unclaustrophobic guidelines explained by common sense should be adopted more or less silently (not to say gratefully) by most writers and editors and negate the worst excesses of any prima donna. I outlined the seeds of this approach in an earlier article about testing content for relevance: it should just be a matter of turning principles into friendly advice.

Turning good habits into workflow

Here’s a quick reminder of the information design process at its simplest:

Data --> Information --> Communication --> Knowledge

Acronyms and abbreviations might well be the bane of modern communications. Why? Well, only prior knowledge gives access to the information, which is a subversion of the above.

In a technocratic environment, content writers risk making too many assumptions about the prior knowledge of their readers. In an international environment meanwhile, OTAN, PALO and EASS can all mean the same as NATO.

Online content writers should be encouraged to develop good habits and apply them regularly, then editors will ensure they’re kept up. The proper explanation of acronyms and abbreviations is just one example among many others that collectively form a corpus of editorial best practice and produce highly-skilled online writers.

Conclusion

Information design shouldn’t stop at the launch of a content management project or limit itself to technical development.

There is also an important role to play in the creation of institutional best practice and it’s a role that requires considerable sensitivity and lots of teamwork.

Internally, migrating and modelling content is a major task that depends on collective knowledge and must be completed in a collaborative context. Externally, the needs of the end-user must be properly understood and reflected in the published content.

While discussing walking in Wallonie with the generous and prolific enthusiast Gert Sonck, who maintains an excellent website containing many of the routes I describe in English on my own website, I started to think about signage systems.

Signage systems

There are many examples of wonderful signage systems, perhaps nowhere more abundantly than in airports, these being a newer sort of public place into which much time, effort and modern thinking has been invested.

Many of us barely notice the flow between taxi rank and departure gate: it can be a near-unconscious exercise even in unfamiliar countries. Even though we might change a baby’s nappy, look for a wi-fi point or divert our path to a last-minute gate change, we’re more likely to be upset by queues and other ignorant passengers.

In our busy world, good signage is as important as the architecture to which it is attached. So it’s probably obvious that good signage is less easy to do where there is no architecture.

Warning signs for hunting

Out in the Belgian countryside, hunting for sport is still legal (more on that elsewhere) and whole areas of land must be cordoned off to enable the hunters to roam.

And of course, the law demands the proper signage and prescribes how it should be used.

On our walks, we have stumbled upon these signs warning us about hunting in the area. Walkers in Belgium know that when they encounter such signs, they may need to revise their path.

The rules state among other things that these signs need to be posted along all public paths affected by the area designated for hunting.

Sometimes, the paths themselves can be part of the hunting area and are at such times off-limits to the public.

Confusing signage

The real situation: Limited hunting area (centre), public path (blue) and diversion (red)

Imagine this country scene: within a fairly narrow tract of woodland there’s a hunting area in the shape of a rectangle, the top side of which is flanked by a public path (blue line). The hunters post duly their placards all along the path.

A pair of walkers follow the public path for a time but after coming across several of these placards, they decide to turn back and divert their route. They return to the edge of the woodland and skirt around the lower edges of it (red line), now assuming that the public path is off-limits.

The perceived situation with a much larger hunting area overriding public path

Later the walkers learned that the path actually remained open and that the hunting area in fact did not actually cross it but was instead contained within it.

So a failure in communication had occurred between walkers and hunters due to perceptions and assumptions. The hunters knew they had to warn walkers that their designated area was nearby. The walkers thought that they risked danger entering the area.

Perception and assumption

The root of the failure is that the hunters, by not providing any information other than lining the path with warning placards according to their legal obligations, had unwittingly caused the walkers to fall back on learned knowledge and to make false assumptions.

Let’s look at the view on the ground:

Picture 1 shows the tree-lined path as it appears to the walkers. Every so often on the left side, attached to the trees, there are the warning signs.

Picture 2 shows the reality: the warning signs refer to danger on the left side since the hunting area is inside that area. With full knowledge of the coordinates and dimensions of the hunting area, the hunters have made the assumption that their intent will be understood by the walkers.

However, the contrast between pictures 1 and 2 is considerable, since only picture 2 assumes prior knowledge of the exact location of the hunting area. In default of that knowledge, the walkers who see only picture 1 may well fall back on learned assumptions.

Accordingly, for the hunters the woodland is a static space within which they can roam within fixed, legal boundaries. For the walkers, the woodland is a thoroughfare consisting of a set of waypoints marked on a path by which they will enter, traverse, then later emerge from, the trees.

This notion of a thoroughfare causes walkers to unconsciously misapprehend the signs as a warning about what’s up ahead on the path, a function of road markings and signage. Instead of perceiving a warning about the hunting area to their left, the walkers perceive a warning about the hunting area ahead of them, and with a repetition of the placards, they eventually conclude that they have already entered the hunting area, hence the dichotomy between real and perceived situations described and illustrated above.

The final straw

Picture 3 shows the view that finally forced the walkers to turn back and divert completely around the edge of the woodland.

Already concerned about the warnings, the walkers on the thoroughfare have already used learned assumptions to define the boundaries of the path as a line of trees on either side. Of course, the woodland consists of little else but trees; what’s really different from any other line of trees is the trail of the path.

So when the walkers see ahead of them in picture 3 another warning placard with a rope between two trees, for them it’s the last straw and they turn back – the thoroughfare is blocked and the placards have warned them already.

However, looking very closely at the horizon, one can see that the path actually passes to the right of that hanging placard. At any other time during the rest of the year when there’s no hunting season, when there are no warning placards or rope cordons to trouble walkers, they would probably have perceived the path running to the right well enough.

Instead, they fail to notice that in the distance the path runs off to the right. That final warning placard hanging from a rope cordon up ahead all but monopolises the walkers’ attention.

That is, after all, what warning signs are supposed to do.

Conclusion

User-centred design requires information designers to think themselves inside the mind of those who do not already know what they do.

If you’ve come this far, you’ve probably figured out that “the walkers” were of course J and I. Here I am, calling myself an information designer, so how did I come to misjudge the size of the hunting area and fail to notice that the route was accessible?

Well, I just don’t work weekends!

As they grazed there on the fertile page all fat, polychrome and insouciant, I remembered that we need to choose our graphical data models very carefully.

As Wainer (2009) so brilliantly reminds us,¹ some models when incorrectly applied can often hide the statistical message they were designed to communicate.

Source: Wikimedia Commons

The original pie

Consider the “original” pie chart produced by William Playfair, the Scottish pioneer of information graphics.² The pie communicates to us the proportions of the Turkish empire located in the respective continents.

This pie does not communicate the actual figures or percentages other than the area equal to 100%, nor does it represent the Turkish proportion of each continent, for that is obviously a different statistic.

What did Playfair want us to infer from his chart?

1. The Turkish empire covers three continents
2. The overwhelming majority of Turkish empire is in Asia
3. About a quarter of the Turkish empire is in Europe and somewhat less in Africa

What is not immediately inferable from the chart:

1. The total size of the Turkish empire
2. The actual percentage proportions in each continent
3. The size of the Turkish empire relative to other empires or the continents themselves

So the pie is almost purely narrative, communicating the array of values, their proportions to each other and the dominant value. It is this latter dominance that the pie communicates most effectively.

When the eye is bigger than the belly

Corpulent pie charts require a lot of visual digestion. If we pass from Playfair’s example to something more florid, the product is much less eloquent.

Here, the pie’s only real strength – the communication of dominance – is rather wasted in the proximity and plurality of the values.

Indeed the creator of this chart did not want us to infer dominance, he/she merely wanted to communicate the values and when represented all those colours and labels, we have to do a lot of work to digest them.

The next pie takes us to the opposite extreme.

Why do we need a pie at all? Most of us can imagine well enough how dominant a figure like 98% tends to be against the remaining 2%.

And nobody sums up better the rest of what needs to be said than that arch-pie hater Stephen Few of Perceptual Edge, a one-man continent of information design.³

Few appends the arguments against three-dimensional and multicoloured presentations: such ‘innovations’ offer us no solution for pie indigestion. Indeed shading and tilt are merely extra layers of crust to cut through.

Cutting to the chase

Returning to my work, I remembered to put myself in the position of my users: so instead of a pie chart, I employed a horizontal bar chart, much like this one:

The advantages of a horizontal bar are numerous, not least among which are the increased legibility of the horizontal alignment and the muting of any dominant-subordinate relationships.

1. It is pretty much impossible to accurately read a pie chart value unless it is a recognisable fraction (for example, a quarter or a half);
2. Colours and 3D rendering can make values appear confusing or inaccurate
3. Pies only really enable us to infer the dominance of some values over others, such that
4. Pies will often cause us to infer different or unintended meanings.

Footnotes

1. In his fascinating book Picturing the Uncertain World: How to Understand, Communicate, and Control Uncertainty through Graphical Display by Howard Wainer (2009) Princeton University Press. Online review at American Scientist §
2. See the Wikipedia article on William Playfair §
3. Stephen Few’s article at PerceptualEdge.com §

This is only a problem, so far as I can see, when you’re using backgrounds on the unfloated element(s), because thr background image or colour will overrun your floated element.

Want to try it? The situation is as follows:

1. Float an element containing either an image or text
2. Continue with unfloated elements so that under normal circumstances they wrap around the floated element
3. Give the wrapped text a background property, such as a background colour or image

The code so far:

/* CSS */
.floated {float: right;}
p {background: #fc0;}
...
<!-- HTML -->
<div class="floated"><img src="/images/tmp.jpg" /></div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit</p>
<p>Class aptent taciti sociosqu ad litora torquent per conubia nostra per inceptos himenaeos</p>

Up to this point everything’s normal:

So far so good. Now add font-style:italic; to the rule for p.

Here’s Firefox, with no surprises:

But here’s Internet Explorer 7:

The only (il)logical answer seems to be the addition of overflow: auto to the rule with the background.

I was clued in by a slightly different issue with the same fix already discovered long ago. Just to remind you once more, this is IE7 only, folks!

Source: Wikimedia Commons

The virtues of @media print have been explained elsewhere, best of all by Eric Meyer in his seminal A List Apart article Going to Print, whose original publish date (May 2002) makes me feel a bit old!

Yet one of the most annoying aspects of developing CSS for print is testing it.

Now I know that testing print CSS doesn’t take a huge slice of our lives, but it annoys the heck out of me. So if you’re a tolerant sort of person who’s happy to rub along with naff workflows, you might find this article and indeed the fact that there’s a whole article on the subject, just a bit finicky.

Thing is, I hate testing print CSS.

Sure, simple markup and layouts only need buffing to a shine to be ready for print, but an increase in complexity or a requirement for absolute fidelity in printed material can lead to ugly scenes round my way.

Print CSS: browser testing !== Print Preview testing

Developers tend temporarily to substitute their screen CSS for their print CSS, run it in the ordinary browser environment, et voilà. Rinse and repeat.

Yet the actual conversion to the printed page can sometimes lead to unexpected results, as can be seen in the image: different browsers, different Print Preview results – even though in the browser there was nothing obviously objectionable.

Print Preview !== a tool for development

Finding fiddly print CSS issues would be a lot easier if testing tweaks was a smoother process. Every change cycle equates to:

1. Refresh the page
2. Invoke Print Preview
3. Review the change
4. Close Print Preview

Testing print CSS as opposed screen CSS appends two additional steps 2 and 4 – invoke Print Preview (Alt + F + V in Windows for both IE and Firefox) and close Print Preview (correspondingly Alt + F4) . Those two simple steps make the business very laborious, even if you can remember those shortcuts.

Slight workflow improvement: an IE-only trick

A dirty little script in IE only takes care of the task of invoking Print Preview, which slightly shortens the workflow. Yes, it’s IE only, but given that it’s usually IE giving me print CSS grief, every little helps:

<script type="text/javascript">
function printpr()
{
var OLECMDID = 7;
var PROMPT = 1;
var WebBrowser = '<OBJECT ID="WebBrowser1" WIDTH=0 HEIGHT=0 CLASSID="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"></OBJECT>';
document.body.insertAdjacentHTML('beforeEnd', WebBrowser);
WebBrowser1.ExecWB(OLECMDID, PROMPT);
WebBrowser1.outerHTML = "";
}
printpr();
</script>

This script automatically invokes IE’s Print Preview. Dump it just before the </body> and save yourself a shortcut! You could also call printpr() from anywhere else, of course. And here’s the source of the original code snippet, which also shows a few other unrelated options such as Save As.

Why can’t we refresh the Print Preview?

All of which finally begs the question, why can’t we simply refresh the Print Preview with an F5 shortcut, just like we have in the browser itself?

Probably because I’m the only person in the world who gets genuinely annoyed by testing print CSS in Print Preview. More fool me, I guess.

Proper font embedding in a browser is long overdue. We’ve had to put up with the same old Arial, Verdana, Georgia, Helvetica, Times New Roman for years.

Now that browsers have to some extent caught up with the rest of us, thanks in no small part to a bit of healthy competition, Typekit has finally answered the call: you’ll soon be able to choose what fonts drive your website.

Everyone’s favourite glue

We’ve had sIFR, we’ve had MIR and we’ve had RIR. We’ve probably had enough.

None of these solutions proved to be ideal, but how often is anything ever ideal on the client side?

Well, let’s take a look at Typekit. At the time of writing, there isn’t too much to go on, but what we do know is this:

1. Typekit’s solution uses (quite a lot of) Javascript
2. The solution ‘downloads’ a font feed from a predetermined location
3. A ‘modern’ browser will interpret CSS @font-face correctly and render the desired fonts

So Typekit is merely following in the footsteps of jQuery, Prototype and other JS libraries. It’s about using Javascript as a sort of web glue to make things fit together. However, this time around it’s not being used to cover up for browser naffness.

Typekit will count on consistent support of modern browsers for the @font-face at-rule. This at-rule has actually been around since the CSS 2.0 specification, though a better, verbose description appears in CSS 3.0. An orthodox implementation of the at-rule looks like this:

@font-face {
font-family: "Mike Old Face";
src: url("http://www.mikepadgett.com/fonts/mikefont.otf")
}
/* The .TTF (true type format) will also be supported, as would *any* URL */


Once the font is “instantiated”, it can then be utilised (in Hemingway’s Fiesta sense of the word) normally:

h3 {
font: normal 120% "Mike Old Face", "Times New Roman", Times, serif;
}

Browser support for @font-face is still a bit patchy but things are picking up fast and now the browser people have discovered the joy of automatic updating, we can expect a fairly rapid uptake.

On the bright side, it’ll mean that designers can make more beautiful websites. The dark side is that many other websites are going to get a lot uglier!

But glue can get sticky

Microsoft tried and failed to get their Embedded Open Type solution accepted by the world at large (there wasn’t much of anything ‘open’ about it, of course). Redmond ended up handing it over the W3C as a feeble proposal for CSS 3.0.

One of the itchier reasons for all the fumbling was the issue of proprietary rights to the fonts themselves. This same issue may well cause problems for Typekit, though this time in the reverse sense.

You see, whilst the Typekit solution is likely to appease and perhaps even create uncharacteristic interest from type foundries (it appears to properly respect intellectual property rights), it might not sit well with many designers and even less with developers.

Here’s why:

The story goes that the Typekit script is going to be pretty hefty. It needs to be to do all the processing it would need to do and how long is that going to take? In addition, the font pattern will then also need to be downloaded (some fonts are marvellously chunky themselves).

Next, the matter of the rights. One of the first things I learned about business is that the real value is in contracts rather than sales, especially when you’re selling other people’s products. So it goes without saying that Typekit needs to be a subscription service.

On the one hand, some orgs would sell their chairman to properly and faithfully reproduce their branding online. How on the other, as one commenter suggested, do you now square it with your client that your design will actually attract an ongoing cost? Could this be another opportunity for Open Source or are the foundries on the edge of the precipice into which the music industry has already fallen?