Toluu

456 Berea Street

Roger Johansson is a web professional specialising in web standards, accessibility, and usability.

Make Safari open targeted links in new tabs instead of new windowsYesterday

One of the things I find most annoying when browsing the web is when a link opens a new window. It completely disrupts my workflow when a new window pops up, especially when it does so without warning.

If you’re using Firefox this isn’t such a big problem anymore since it will open targeted links in a new tab instead, which is much more manageable and less intrusive.

For Safari, however, there is no such setting to be found when you look through its preferences window. But the setting does exist (at least in the Mac OS X version), though you have to use Terminal.app to enable it:

1. Quit Safari
2. Open Terminal.app
3. Enter defaults write com.apple.Safari TargetedClicksCreateTabs -bool true and press enter
4. Open Safari
5. Notice that links that used to open in a new window will now open in a new tab

Much better.

Posted in Apple, Browsers, Usability.

Quick Tips for web developers and web designersDecember 2

I spend a fair amount of time doing quality assurance of websites. This includes reviewing code (HTML, CSS, JavaScript), reporting accessibility and usability issues, giving tips and advice, and so on.

In these reviews there are some things that keep coming up. A lot of them are pretty simple and basic things if you ask me. However, there are many people who make the same mistakes, so maybe those things aren’t that simple after all. Or maybe the problem is that they aren’t widely known.

In the hope that it will help some people out I am going to start a new category of posts here called “Quick Tips”. Each Quick Tip will focus on one of the issues that I come across while doing QA work, and will probably be anything from a sentence to a few paragraphs in length.

This is not meant to ridicule the mistakes or the people who make them. My sincere intention is to help people avoid making these mistakes in the first place by attempting to spread the knowledge.

Posted in Accessibility, Quick Tips, Usability, Web Standards.

Making Google Maps more accessibleDecember 1

It has become very popular to use the Google Maps API to add maps to websites. While the maps work fine for most users, unfortunately Google Maps does not by default work without JavaScript – when there is no JavaScript support, you don’t get a map.

Fortunately it is quite easy (but not very common) to provide a fallback for users who do not have JavaScript enabled in their browser by using the Google Static Maps API.

The Google Static Maps API lets you embed a map as a plain image in various formats. The developers guide explains the many options you have when it comes to configuring the static maps.

So next time you use the Google Maps API to put a map on a website, take a couple of minutes to add a static fallback for users without JavaScript.

While we’re on the topic of making Google Maps work for more people, I recommend reading Patrick H. Lauke’s article on creating Keyboard-accessible Google Maps. Making Google Maps usable without a mouse requires a bit of hacking, but the end result is well worth it.

Posted in Accessibility, JavaScript.

Make HTML messages readable in Apple MailNovember 27

Long time readers may have noticed that I dislike receiving email in HTML format. It’s not primarily because HTML email uses HTML instead of plain text that I dislike it though.

No, the main reason is less ideological than that. I dislike HTML email simply because it is often very hard for me to read, since for some reason many HTML-formatted emails use extremely small font sizes.

Luckily there are workarounds. If you use Apple Mail like I do I know of two things you can do that will make HTML messages more readable.

Force Apple Mail to display the plain text alternative if there is one

I’ve been using this for years and can’t understand why it isn’t available in Mail’s GUI. Here’s what to do:

1. Quit Mail.app
2. Open Terminal.app
3. Enter defaults write com.apple.mail PreferPlainText -bool TRUE and press enter (toggle it back by changing TRUE to FALSE)
4. Open Mail.app
5. View an HTML message and marvel at the readable plain text

The catch is that this only works for messages that actually contain a plain text alternative, which far from all HTML email does.

Specify the minimum font size Apple Mail uses for HTML messages

As a fallback for the messages that do not contain a plain text alternative it is useful to make sure that the text at least has a readable size:

1. Quit Mail.app
2. Open Terminal.app
3. Enter defaults write com.apple.

TextMate productivity tipsNovember 25

If you saw my post about the DOMAssistant bundle for TextMate, you will already know that my favourite coding tool at the moment is TextMate. If you missed that post, well, now you know.

For anyone who is new to TextMate or considering trying it out, I thought I’d share a few tips. These tips are nothing revolutionary for many Textmate users, but nevertheless they make my workdays a little easier. Several of these tips may not be all that obvious, so I hope you will find something new here.

1. Insert close tag

When editing an HTML document, press Opt + Cmd + . to make TextMate automatically insert a closing tag for the element the cursor is inside.

2. Move selection

To move text that you have selected, hold down Ctrl + Cmd and use the arrow keys to move the text up and down (or left and right). If you’re moving text up or down, make sure to select the entire last line or the line break will get left behind.

3. Tab triggered snippets

Type a few characters and hit the tab key. Bam! TextMate inserts anything from a simple tag or method to an entire document. And if you’re not satisfied with the snippets that ship with TextMate you can add your own. Do you find yourself typing a similar pattern several times daily? Make a snippet out of it.

4. Code completion

Inste