That doesn’t mean that the Encrypted Media Extensions proposal will become a standard as is, but it does up the chances that some sort of DRM system will make its way into HTML.

The Encrypted Media Extensions proposal — which is backed by the likes of Google, Microsoft, Netflix and dozens of other media giants — technically does not add DRM to HTML. Instead it defines a framework for bringing a DRM system, or “protected media content” as the current draft puts it, to the web.

If you think the idea of DRM seems antithetical to the inherently open nature of HTML, you’re not alone. Ian Hickson, former editor of the W3C’s HTML spec, has called the Encrypted Media Extensions proposal “unethical.” Hickson is no longer in charge of the W3C’s HTML spec, but HTML WG member Manu Sporny, has already asked the WG not to publish the first working draft because the “specification does not solve the problem the authors are attempting to solve.”

There are numerous problems with the Encrypted Media Extensions proposal, including the basic fact that, historically, DRM doesn’t work.

Other problems specific to the current draft of the proposal include the fact that it might well be impossible for open source web browsers to implement without relying on closed source components. Then there are the gaping security flaws that would make it trivially easy to defeat the currently defined system.

But Sporny raises a far more ominous objection — that the proposal in its current form does not actually define a DRM system. Instead it proposes a common API, which would most likely lead to a proliferation of DRM plugins. Here’s Sporny’s take:

The EME specification does not specify a DRM scheme in the specification, rather it explains the architecture for a DRM plug-in mechanism. This will lead to plug-in proliferation on the Web. Plugins are something that are detrimental to inter-operability because it is inevitable that the DRM plugin vendors will not be able to support all platforms at all times. So, some people will be able to view content, others will not.

That sounds a lot like the bad old days when you needed Flash, Real Player, Windows Media Player and dozens of other little plugins installed just to watch a video.

That’s a web no user wants to return to.

At the same time there continue to be companies which believe DRM is essential to their bottom line and the web offers no solution. That’s why Flash, Silverlight and other DRM-friendly plugins remain the media players of choice for many content providers.

So the question of DRM on the web boils down to this: should the W3C continue to work on a spec that defines some kind of DRM system or should the interested companies go off and do their own work? For its part the W3C clearly wants to be part of the process, though it remains unclear what, if any, value a standards-based DRM system might have for web users.

]]>http://www.webmonkey.com/2013/02/drm-for-the-web-say-it-aint-so/feed/0Learn Typography Basics With ‘On Web Typography’http://www.webmonkey.com/2013/02/learn-typography-basics-with-on-web-typography/
http://www.webmonkey.com/2013/02/learn-typography-basics-with-on-web-typography/#commentsMon, 11 Feb 2013 19:32:19 +0000Scott Gilbertsonhttp://www.webmonkey.com/?p=60895Web typography has come a long way from the days when the only way to get a custom typeface on a page was with images created in Photoshop. These days, thanks to widespread browser support for CSS @font-face and services like Typekit, a couple lines of code will add actual font files to your pages. […]

Web typography has come a long way from the days when the only way to get a custom typeface on a page was with images created in Photoshop. These days, thanks to widespread browser support for CSS @font-face and services like Typekit, a couple lines of code will add actual font files to your pages.

Go back to 2001 with that information and you would blow many a designer’s mind.

Of course if you’re not a designer, today’s overwhelming variety of type possibilities can be overwhelming. For some help deciphering it all and navigating the sometimes complex world of web typography, check out the video above of Typekit’s Jason Santa Maria‘s talk “On Web Typography.” The video comes from An Event Apart Boston in June of last year, but was only recently made available online (note that Santa Maria has since left Typekit).

After a whirlwind tour of the history of online typography, Santa Maria explores typography from a newcomer’s perspective, looking at how typography affects how you read and how to choose and combine typefaces for a better looking, easier to read site. It’s about an hour long, but you’d be hard pressed to find a better intro to and overview of the art of typography.

Mozilla has released Popcorn Maker 1.0, the company’s mashup-creating, video-editing suite for the web. Popcorn Maker makes it easy to pull just about any content on the web into a video container you can then publish back to the web.

Despite the interactive nature of the web, video on the web remains little more than glorified television in your web browser — a passive experience in the midst of the otherwise interactive online world.

It doesn’t have to be that way. HTML5 makes video into just another HTML element — editable, hackable, remixable.

It’s HTML, after all. And that means it can interact with other HTML elements or use JavaScript to augment video in real time — annotating videos with information like location, details about the people and topics in the video, subtitles, Twitter feeds, current weather information, links and much more.

The problem is that there aren’t a lot of tools that make it easy to create interactive web videos, which is where Popcorn Maker comes in.

As you would expect from the makers of Firefox, Popcorn Maker is built entirely from web technologies — pure HTML, CSS and Javascript. But more than just being an impressive use of web standards, Popcorn Maker 1.0 is a genuinely easy-to-use video editor and that’s no small feat regardless of which tools you use to build it.

I’ve been playing around with Popcorn Maker for a few days now and it does indeed deliver on its promise to bring video editing to the people. To get started you just need to pull in a video you’d like to annotate or remix. Adding a source video is just a matter of pasting in a link to a YouTube, Vimeo or Soundcloud video. Alternately you can just add a link directly to your video file.

Once you’ve got your base video (or videos) in Popcorn Maker, adding elements to it is as simple as grabbing one of the “events” from the right hand side of the editor and dragging it onto either the video stage itself, or the timeline below. Once your event is in the timeline you can change the settings, resize it, move it around and otherwise tweak it to behave the way you’d like.

Once everything is working the way you want, just click the share link and Popcorn Maker will give you either a link (or an embed code) you can paste anywhere on the web.

The HTML5 video panacea didn't pan out. Instead of proprietary plugins we got video codec disputes, and there's still no one-size-fits-all video solution for the web. But the one-size-fits-all solution is getting a little closer -- Mozilla is working to add support for the H.264 video codec to Firefox. When it arrives in Firefox H.264 will finally be supported in every major web browser, desktop and mobile.

The company’s recently released Firefox for Android already bakes in OS-level support for the H.264 video codec and now Mozilla is adding support to desktop Firefox as well.

Mozilla long opposed supporting the H.264 codec because it’s patent-encumbered and requires licensing fees. It’s also the most popular codec for HTML5 video on the web, which drove Mozilla to swallow its ideals and get practical about adding support to Firefox. Instead of including the codec directly in Firefox, the browser will rely on OS-level tools to play H.264 video.

There’s still no support for H.264 in the current desktop version of Firefox, but as Mozilla CTO, Brendan Eich recently noted on his blog, work is under way and, with the exception of Windows XP, all platforms will get OS-native codec support for H.264 video. Windows XP, which lacks OS-level tools for H.264, will continue to use the Flash plugin to play H.264 movies.

If you’d like to keep track of Mozilla’s progress adding H.264 to the desktop there’s a tracking bug that follows solutions for all the major desktop platforms. Eich does not give an explicit timeline or any hint of when H.264 support might ship with Firefox on the desktop.

The HTML5 video element was supposed to offer a standards-based way to play movies on the web without proprietary plugins like Flash or Silverlight. Unfortunately that dream has failed to pan out. Instead of proprietary plugins, the web ended up with proprietary video codecs, which has created a split in browser support for HTML5 video. Firefox and Opera support the open Ogg and WebM codecs, while Safari and Internet Explorer supported H.264.

Mozilla (and Opera) were against the adoption of H.264 on ideological grounds — H.264 is not an open codec and requires that companies using it pay royalties. But earlier this year the company partially reversed course and said it would support H.264 on devices where the codec is supplied by the platform or implemented in hardware.

In announcing its change of heart with regard to H.264, Eich wrote, “H.264 is absolutely required right now to compete on mobile. I do not believe that we can reject H.264 content in Firefox on Android or in B2G and survive the shift to mobile…. Failure on mobile is too likely to consign Mozilla to decline and irrelevance.”

However, while Mozilla may have abandoned the fight against H.264 in HTML5 video, it has taken up the same banner when it comes to WebRTC. WebRTC is a group of proposed standards that will eventually make web apps capable of many of the same feats that currently require platform-native APIs. In his recent post detailing the progress of H.264 support, Eich says that Mozilla is still focused on “the fight for unencumbered formats” for WebRTC, and promises “more on that front later”.

Popular video-sharing site Vimeo has added a tip jar, which allows Vimeo users to accept payments from anyone who enjoys their movies.

To use the new Tip Jar you’ll need to be a Vimeo Plus or Vimeo Pro member, but provided you’re already set up with a paid account, enabling it is as simple as adding a PayPal account and checking a box on the video’s advanced settings page. Once that’s done a “Tip This Video” button will appear underneath the video player on Vimeo.com, allowing viewers to leave tips in appreciation for your cinéma vérité efforts.

The fine print taketh away a 15 percent service fee and you’ll need to have a verified PayPal account in order to claim your money. Also note that you cannot accept tips on commercial or political videos, nor can you use Tip Jar as a way to raise money for a political cause.

Obviously Tip Jar probably isn’t going to make you a millionaire in most cases, but if your video goes viral to a particularly generous audience — who knows?

For a more reliable way of making money on Vimeo, the company also plans to roll out a pay-per-view service later this year. The pay-per-view offering appears to be limited to Vimeo Pro members. The Vimeo blog offers little in the way of details, saying only that pay-per-view will add “tools to charge for access to your videos, with no coding required.”

Nothing grabs a user’s attention like a big, full-window video on a landing page. For example, check out Path.com. However, with all the various screens potentially connecting to your site these days, making sure your movie plays full-window on all of them can be tricky.

That’s where BigVideo.js comes in. Developer John Polacek‘s BigVideo is a jQuery plugin for adding big background videos to your site. The plugin makes it easy to drop in a single video URL and get fit-to-fill background video that takes up the whole window. The script will fall back to displaying an image on devices where video doesn’t work.

BigVideo can also handle playlists, serving up a series of videos, as well as a very cool feature to play videos without the sound. And yes, you can (and should) add a button to allow users to turn the video off altogether. That said, I left BigVideo open, running in a background tab for several days and it didn’t have a noticeable impact on performance.

For more info, head over to the GitHub page where you can see BigVideo in action, get a full list of features and grab the code for your own site.

Humorist and web artist extraordinaire Ze Frank is returning to the internet airwaves with new episodes of The Show. The Show, which Frank wrote, produced and starred in, was a daily video show about, well, everything.

Not only are we happy to see The Show return, the first episode also serves as an inspiration for any who’s is trying to start something. As Frank puts it, “anyone who’s stuck between zero and one.” So enjoy the first episode of the new The Show and then get out there and make something awesome and “enjoy the cheese of accomplishment.”

A webpage doesn’t have to look the same in every browser. In fact, a webpage shouldn’t look the same in every browser, according to former Yahoo developer and JavaScript guru, Nicolas Zakas.

Zakas, who spent five years as the front-end tech lead for the Yahoo homepage, recently spoke at the March BayJax Meetup group about what he calls Progressive Enhancement 2.0 — offering users the best possible experience given the capabilities of their device.

Not the same experience, mind you, but the best possible experience. That means progressively enhancing sites according to the device’s (browser’s) capabilities.

Progressive enhancement is perhaps best summed up by the famous Mitch Hedburg quip, “an escalator can never break, it can only become stairs.” In other words, if you’re building websites well they never break, even if you look at them in Lynx. The site may not look the same in Lynx as it does in, say Chrome, it may not function as smoothly, but the core content is still there and can still serve as a stairway that gets people where they want to go even when the enhanced ease of the escalator is absent.

More practically, progressive enhancement means starting with the least capable devices — an older phone, Lynx running on Windows 95 — and then adding more sophisticated features based on screen size, bandwidth and so on.

Zakas also takes on the common assumption that a web “page” is analogous to the printed page. In fact Zakas argues the web is more like television, which has a similar separation of content and device. In that analogy old browsers are like black and white TVs. No one expects a black and white TV to play HD content, but everyone would be disappointed if you served black and white content to an HD TV. Hence the need for progressive enhancement.

If you’re well versed in the history of the web the beginning of the video may be a bit slow, but stick with it. Also be sure to watch the questions at the end where Zakas addresses how to progressively enhance more application-like web pages.

Inspired by Bret Victor's demo, Chris Granger's live editor helps connect you with what you're building.

Last month we pointed you to a video of Bret Victor’s talk, “Inventing on Principle.” Victor has worked on experimental UI concepts at Apple and also created the interactive data graphics for Al Gore’s book, Our Choice. In the talk Victor showed off a demo of a great real-time game editor that makes your existing coding tools look primitive at best.

If you haven’t watched the video of Victor’s talk, you should start there, but the basic idea behind his real-time editor is to make your code more closely connected to what it creates, in this case a simple game. Granger’s take on the idea is similar — all changes you make to the code are reflected immediately in the running game. You change a line of code and the game immediately changes right with it. Here’s Granger’s video demonstrating the editor:

As Granger writes on his blog, “essentially I learned that Victor was right — there’s unquestionable value in connecting yourself with your creation.”

We just had a moment similar to the time we first saw content-aware scaling in action, but this time it’s even better — we’ve seen the future of programming tools and it looks awesome.

Check out the video above of Bret Victor‘s recent talk, “Inventing on Principle.” Victor has worked on experimental UI concepts at Apple and also created the interactive data graphics for Al Gore’s book, Our Choice. The video above of Victor’s keynote at the Canadian University Software Engineering Conference, captures a wonderful talk on living your life based on principles, but for many developers what’s most arresting are the software development tools demoed.

Do your current tools suddenly feel incredibly outdated? Perhaps you thought you were using a well-tuned coding machine but suddenly realize you’re really just hitting two stones together? Thought so. Sadly, the apps demoed in the video aren’t available. That’s all right, though; it just means someone needs to build them. Be sure to let us know if you do.