Browsers – Membranophonist’s Ramblings

playbackIRate

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.

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

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.

The SMC

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.

Emprovement

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:

A Fast Company story:

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:

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.

0p3n_s3sam3

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.

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?

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.

SearchKilt

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

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!

Microformats in Flock

Evolutions of the Konqueror microformats plug-in in the context of the Flock browser.

Contacts (hCards)

The browser indicates the presence of hCard markup on a page using an icon in the status bar. The icon provides access to the pop-up menu:
To allow multiple selection without having to repeatedly open the menu, a dialog allows the user to check individual names:

Contacts Service Preferences

Online Contacts Services

Calendar (hCalendars)

A dialog similar to Add Contacts would facilitate multiple event selections.

Calendar Service Preferences

Obviously, the Default Calendar setting would only work with services that allow multiple calendars.

Online Calendar Services

The Konqueror plug-in currently works with Kontact, the KDE PIM. Along those lines, it would also be nice if browsers could pass hCards and hCalendars to external applications like Address Book/iCal on OS X, Outlook on Windows, and Evolution in GNOME.