Apple Chrome Interaction Interface macOS Safari

A Catalina Double Standard

Third-party apps have to be granted explicit permission to display notifications (even if they were already in use on your Mac), but Apple can display a marketing message for their browser when rival Chrome is launched for the first time on Catalina. Cool.

By the way, Firefox is my system default browser. The team has put in a ton of work to make it fast and stable.

Browsers Chrome Firefox iOS JavaScript macOS Programming Safari Technology


A table comparing the range of playback rates that you can set on HTML video and audio elements using JavaScript. Guess which browser was a real pain to deal with on a recent project?

Supported playbackRate in Browsers
OS Browser Minimum Maximum Source Code Link
macOS v10.14.4 Chrome v74 0.0625 16.0 Chromium source code
macOS v10.14.4 Firefox v66 0.0625 16.0 Firefox source code
macOS v10.14.4 Safari v12.1 0.0625 2.0 I looked, but could not find where it’s defined in the WebKit source code. Maybe it’s in the closed Safari code?

Modern hardware can play video smoothly at even very high rates. I guess Apple doesn’t think there are use cases for playing back video beyond double speed. Furthermore, their own documentation about the ability to specify playbackRate on iOS is inaccurate. As with desktop Safari, you can set it to the same maximum of 2.0, at least as of iOS 12.

Apple Browsers CSS Design Interaction Interface macOS Pro Bono Portfolio

Safari Responsive Design Mode Polish

Here's the UI as seen in Safari Technical Preview 41, released October 4, 2017.

Safari Technical Preview 41 Responsive Design Mode

Revised Responsive Design Mode

Revised Safari Responsive Design Mode
Safari Responsive Design Mode - device icon hover showing rotate icon
  • Add a bandwidth throttling menu:
    1. Default Network
    2. High-Speed Cellular
    3. Low-Speed Cellular
    4. Offline
  • Improve the contrast of the selected viewport setting in a style consistent with the Web Inspector
  • Show a rotate icon when hovering on a device icon
  • Align label baselines
  • Add a screen mode menu for iPads that would allow selection from:
    1. Full Screen
    2. Primary
    3. Secondary
    4. Split View

    This provides an explicit UI for using the iPad multi-tasking modes and would allow users to switch between portrait and landscape orientations of different iPad models while staying in a multi-tasking view. In STP 41, you can skip cycling through the iPad multi-tasking modes by Option-clicking the iPad icon.



As James Risen and Nick Wingfield reported yesterday in the New York Times, the interests of tech companies and the NSA have been converging over the past decade in two ways. The first way is fairly prosaic: Lots of Silicon Valley companies are in the business of selling stuff to the NSA: storage hardware, sophisticated communications equipment, data analytics software, and more. But while this may have increased recently, it’s not fundamentally new. It’s just the latest high-tech twist on the good old military-industrial complex.

— Kevin Drum: The Surveillance-Marketing Complex, Coming Soon to a Computer Near You

Before you visit that or any other site, you might want to install Ghostery to block all the tracking beacons.

Browsers Design Typography


If you are responsible for text marked up in HTML, please learn about character entities. Of late, I’ve noticed prominent companies sloppily using two hyphens where they should be using an em dash, which is —. This is particularly irritating when the text comes from a company that purports to know about design.

A Google page about the Nexus 7:

Double hyphens on Google's Nexus 7 product info page

A Fast Company story:

A Fast Company story using double hyphens

An Atlantic post discussing future mobile technology. The Atlantic is not a design publication, but surely they have people on staff who care about typography:

An Atlantic blog post using double hyphens

If you really want to get fancy, the double hyphens can be replaced with an em dash with thin spaces ( ) on either side. The difference between a standard space and thin space is subtle, but it is noticeable in Safari, Firefox, and Opera.

Like many things in typography, there is variation in the use of dashes, but no respectable typographer thinks two hyphens are the way to go. I should figure out how to insert thin spaces around em dashes in my existing posts…

Another common web typography problem is quotation marks. Setting up a regex to enclose quotes properly using “ and ” might be trickier, but it should also be done.

Apple gets these details right. See the press releases for the latest announcements.

NDP Software’s &what; is a nice search-based entity reference lookup.


Right Place, Right Time

I happened to be in the right place at the right time, and I happened to have the right combination of background.

Tim Berners-Lee in an interview with Robert Wright

Berners-Lee is a rare example of altruism and principle among the legends of computing.


Interview: The Omni Group’s Ken Case

One of the apps that has been on hold now for quite a while now, but I use every day, and is in desperate need of a refresh is OmniWeb.

Interview: The Omni Group’s Ken Case

Years after its last major update, OmniWeb is still my default browser.

Browsers Interaction Interface macOS Pro Bono Portfolio Security


I use the Password Assistant in Keychain Access (/Applications/Utilities) to generate passwords for new accounts. The Assistant is pretty handy, but currently not integrated with any browsers, meaning I have to open Keychain Access, create a new Password Item (File > New Password Item), then click on the key to open the Assistant. I might then have to bounce back and forth between my browser and Keychain Access to find a password that complies with the (frequently unexpressed) password rules of the site.

Password Assistant integrated in browser

The Assistant would only appear when two password input fields are detected. What to do when a site doesn’t require confirmation? Maybe check the Keychain for existing accounts at the domain and show the key icon only if none is found?

Browsers Interface macOS Meta-data

Data Detectors in Browsers

Date data detector in a Web browser

I didn’t see anything on the Snow Leopard Enhancements and Refinements page about Detectors being added anywhere but TextEdit.

Browsers Interaction Interface macOS Pro Bono Portfolio


The inline searching seen in the 10.5 Help menu could be used in other menus.

History menu searching in OmniWeb

History menu search results in OmniWeb

Providing searching in the Bookmarks menu in browsers and the menu immediately right of the Application (File/Document/Thingamajig) would also make sense. The default search scope would be filetypes the application can open or import.

This type of inline searching would provide the sort of application-specific search focus that I mocked up earlier, but it doesn’t provide an easy way to move a query between applications.

Yes, jazz bagpipes. That cat could burn!