Font Metrics API – explainer for the (very nascent) Font Metrics API in CSS/ Houdini. anything missing? Raise an issue, do. We need real developer input.
Why I love working with the web by Remy Sharp. “If you sit back for a moment, and think about just how many lives you can touch simply by publishing something, anything, to the web, it’s utterly mind blowing. That’s why I love working with the web”
Literally trillions* of people asked me “Bruce, how do Smart Alerts in Opera Max work?”. So I blew Opera’s video budget on this 2 min explainer, featuring an eggbox and a Where The Wild Things Are puppet.
I’ve had a few tweets, DMs and emails asking about the proposed buy-out of Opera by a Chinese consortium. Here are some answers to your questions (none of this is new; it’s publicly available in Lars’ statements to the press and Opera’s consumer blogs, but I know that many of you are techies who won’t necessarily read those). I apologise for not getting back to you earlier; the news broke on my last day of a press tour of India and I only got back yesterday.
Firstly, it’s not a done deal. An offer has been made, and Opera’s board has recommended that shareholders accept it. But shareholders need to vote and governments need to be consulted.
If the deal goes through, the shareholders change (because current shareholders would sell their shares to the Chinese consortium) but, as Nuno Sitima (Opera’s Lord of Mobile Stuff) wrote,
the people behind Opera remain the same. The same teams will be developing and delivering the [products].
Many of you asked why we’re doing this. It gives Opera access to 500 million Chinese customers of the consortium, and investment to grow bigger. I am not a Biz Guy so I’ll just quote the press release:
The transaction would give Opera access to the extensive internet user base of Kunlun and Qihoo in China as well as the financing and other support of the Consortium that would allow for the full potential of the Company to be realized.
Lastly, and most importantly, I’ve had Opera customers ask about the security and privacy of their data. The answer is simple, and reassuring (I hope):
Assuming the deal goes through (see first point above), Opera plans to continue operating as a stand-alone company (see Nuno’s quote above). We are a Norwegian company subject to Norwegian (EU/EEA) privacy laws. Our shareholders may change but our legal obligations in this respect will not. All data will continue to be handled in accordance with our Norwegian legal obligations — nothing changes in this respect.
(And, yes, I remain employed; thanks to all of you who asked after me personally and offered me other jobs. But, honestly, despite still looking great in a mankini, my pole-dancing days are behind me.)
Subgrids Considered Essential – Eric Meyer on CSS Grids: “If grid layout is released without subgrid support, we’re risking shoving subgrids into the back of the author-practices cupboard for a long time to come. And along with it, potentially, grids themselves.”
Gyrophone: Recognizing Speech From Gyroscope Signals – ” Since iOS and Android require no special permissions to access the gyro, our results show that apps and active web content that cannot access the microphone can nevertheless eavesdrop on speech in the vicinity of the phone.”
Video corner: The Future of the Web Platform: Does It Have One? – Google’s sinister mastermind, Alex Russell, “discusses the impact of new standards-track technologies like Service Workers, Web Manifests, and Web Push which are landing in browsers” (48 mins)
Audio corner: Working Draft – Revision 250: Achtung Baby! – “we managed to get our greedy hands on no one less than Bruce Lawson from Opera. Having barely returned from a trip to Asia and still dizzy from his jetlag, we managed to extract a whole bunch of classified information on CSS Houdini out of him (also thanks to our German interview style)”
China’s Millennials Infographic – There are 318 million Chinese millennials (15-29 year olds). 48% are female. >90% own smartphones. >90 million are graduates. They’re 50% of China’s international travellers. 74% feel they have more in common with global millennials than their Chinese elders. Each expects to spend $4362 on luxury goods this year. 66% choose western brands over Asian brands.
TL;DR, I’m moving from Developer Relations to become Opera’s Deputy Chief Technology Officer. Or maybe Deputy Technology Officer, because “Deputy Chief” is almost oxymoronic. Anyway, call me “Bruce”; it’s more polite than what you usually call me.
Co-father of CSS Håkon Wium Lie continues to be CTO, and I’ll be working with him, the Communications Team, the product teams, and my lovely colleagues in devrel, to continue connecting the unconnected across the world.
In some ways, this is simply an evolution of what I’ve been doing for the last couple of years. In a more profound way it’s a return to basics.
My first real exposure to the Web came about working in Thailand in 1999, when I was convalescing after my diagnosis of Multiple Sclerosis. Because M.S. is very rare in Asia, I could find no English language information to tell me how quickly or painfully I would die.
But I’d read about this new-fangled Web thing, and there was an Internet Café near my apartment, so I typed in “Multiple Sclerosis” into Alta Vista and found something extraordinary: a community of people around the world supporting each other through their shared diagnosis on something called a “website” – and I could participate, too, from a café in Pratunam, Bangkok. All strangers, across the globe, coming together around a common theme and helping each other.
I knew immediately that I’d stumbled upon something amazing, something revolutionary, an undreamed of way to communicate. As an English Literature graduate and ex-programmer, I was fascinated, by both the communicative potential and also the tech that drove it. By 2002, I was Brand Manager for a UK book company publishing on books for web professionals, and our first, flagship book was on Web Accessibility.
From accessibility, I began to advocate the general concept of open web standards on my blog and with various employers, so that everyone could access the web. Then, after being invited to join Opera in 2008, I started advocating HTML5, so people could connect to an open web that could compete with the proprietary silos of Flash and iOS. After that, I began beating the drum for Media Queries and Responsive Design so that the people in developing nations (like I was in ’99), using affordable hand-held devices, could connect and enjoy the full web. Then I proposed the <picture> element (more accurately: a very naive precursor to it) so that people with limited funds for bandwidth could connect economically, too. Then I agitated, inside Opera and outside, for Progressive Web Apps, so people could have a great experience on the open web, not those pesky walled gardens.
The common thread is people and getting them connected to each other. This matters to me because that happened to me, 17 years ago (spoiler: and I didn’t die).
A third of a billion people use Opera’s products to get them online, fast and affordably. I want to be part of making that half a billion, then a billion, then more; not by stealing customers from competitors, but by opening up the web to people and places that currently have no access. That’s a lot of people; there’s a lot to be done. It’s a big job. I’m a n00b and I’m gonna fuck up from time-to-time.
iOS browser update corner: Real-time news and notifications from your iOS browser – Opera Mini squishes pages and videos down so you get more for your data plan, get fewer Buffering Spinners of Ohfuckit™ and pages download quicker. Opera Coast, on the other hand, simply keeps out of your way and shows pages full-screen with gestural controls (swipe to go back, pull to refresh).
Metadata markup – Jeremy Keith on redundancy and competing “standards” to get post previews to appear on Facebook, Twitter and Slack. (In A Little Less Metacrap, Peter Gasston slims down Jeremy’s example somewhat, but his point still stands.)
Flexbox’s Best-Kept Secret “Using auto margins with Flexbox is an effective way to get all of the flexibility of css floats, without the nastiness of breaking elements out of the document’s normal flow.”
From the department of taking credit for other peoples’ work, here’s a list of geek admin calendars running from today (December 1st) to Xmas day, compiled from tweets by Rachel Andrew and Andy Davies.
Seriously, Don’t Use Icon Fonts – “It’s time to let icon fonts pass on to Hack Heaven, where they can frolic with table-based layouts, Bullet-Proof Rounded Corners and Scalable Inman Flash Replacements.”
Fontdeck to close. “Fonts will stop being served on 1 December 2016.” (Note: *next* year!) Migration plan etc in the link. The reason? “As neither OmniTI nor Clearleft have the resources to take Fontdeck to the next level, we had no desire to traipse around the Valley with a begging bowl; instead we took the decision to retire Fontdeck rather than let it wither on the vine.”
Unicorns and Bubbles in which Baldur Bjarnason writes “startups are generally staffed by cowboy coders who stack up lines of technical debt faster than a monkey playing Tetris”
Decommissioning a free public API – “relying on a free service you have no control over means adding a single point of failure on a volunteer basis” (by author of a side-project API that some set-top box manufacturer depended on
Four and a half years ago I was moaning (me!) about the state of Installable web apps and interoperability (TL;DR: laughably crap). Everybody listened to me, and made them better. Well, actually, they didn’t, because I was wrong; I still believed in the notion that it was a good idea to download a static snapshot of a site, thereby losing all the immediacy and linkability of web publishing.
At their simplest, Progressive Web Apps are application-like things hosted on your web server. If you’re as old as me, you might call them “web sites”. They also point to a manifest file, which gives some light metadata about icons, default orientation and the like. In conforming browsers (currently, Opera for Android, Chrome for Android and, forthcoming, Firefox too) you can “save” the app to your homescreen. The relevant icon from the manifest is placed on the device’s homescreen which can then be tickled into life with your digit, indistinguishably from a native app: over HTTPS, if you so define it in the manifest, it can open in a default orientation and with no browser UI; with Service Worker, it can work offline.
Crucially, in browsers that don’t support it, you have a normal website. It’s perfect progressive enhancement.
There are differences in implementation; Opera and Chrome are working closely to see what works best. Opera’s implementation currently differs from Chrome’s in four main ways:
HTTP-hosted sites will only display with browser UI, regardless of what the manifest states, because they’re less secure.
when the user follows a link that takes the user out of the domain of the installed app, a new tab is spawned, with browser chrome. (Chrome shows a small address at the top of a standalone-app. We prefer to make it more obvious to the user that they have gone outside your app.)
Opera doesn’t (yet) support background_color; this will be added in a forthcoming release.
Chrome has a mechanism to suggest to a user that they add a site to Home screen called App Install Banners, depending on certain heuristics — primarily, a Service Worker so they work offline, responsiveness and demonstrated repeated engagement with a site.
Opera is still experimenting with heuristics (and Chrome are tweaking, too). I’m convinced by Stuart Langridge’s argument that requiring “repeated engagememnt” may slow adoption:
Native apps get to say “install our app” without providing a link, a QR code, whatever: people know how to do that… [with Progressive Web Apps] I still can’t say it, because you have to come back twice over two days. How popular would Clash of Clans be if you couldn’t install it until the second day you played it, I wonder?
[Note that since Stuart wrote this, the criteria for “engagement” by a user in a site changed from twice in two days into twice, at least 5 minutes apart.]
I think there should be a mechanism for discreetly — unspammily — alerting a user that a site is a Progressive Web App on first visit. But I’m not King of Opera for Android; however, I know the man who is (Andreas Bovens).
But how good are Progressive Web Apps, anyway? Is it even possible to write a really good app using web technology without the Reactembengular Framework?
I am super excited about this app, because it demonstrates that you can build an offline, 60FPS mobile app using *only* web technologies. Of course it’s offline-first (PouchDB, LocalForage, ServiceWorker, Cloudant), so you can browse all your fav Pokémon without a connection.
I’m super excited, too. Soon, this will be possible on all three cross-platform browsers. It’s also possible to add tell an app to be homescreen-able in iOS. No news from Microsoft, but they’re doing good things with the W3C Manifest in their manifold.js.
Want some web standards retro fun? Go to this Inbox Attack game in Opera for Android, add it to homescreen (the + button in the URL bar) and then tap its homescreen icon. It’s made with manifest, SVG and the vibration API.
If you’re interested in making a Progressive Web App, here are some resources to get you started.
Manifest Generator. It’s very possible that your site already has much of the information that the manifest format needs. This generator that I wrote with Stuart Langridge will spider your site and attempt to construct a manifest file you can download and deploy.