Embed high-res Youtube videos

Here's an example of a normal embedded Youtube video, borrowed from Patti Schiendelman's Gakken Mechamo Inchworm post.

Back in march, it was discovered that when you view a video directly on Youtube, you could add a "&fmt=18" to the URL to enable a higher quality, higher resolution stream which is encoded with the H.264 codec.

To make this work in an embedded video, however, you need a slightly different hack. After pasting the embed code into a blog post, adjust the two video URLs (one in a param tag and one as the src parameter in the embed tag) by adding "&ap=%2526fmt%3D18" to the end.

For example, the above video embed becomes:

<object width="600" height="475"><param name="movie" value="http://www.youtube.com/v/iMQBKkDJY2c&hl=en&fs=1&rel=0&ap=%2526fmt%3D18"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/iMQBKkDJY2c&hl=en&fs=1&rel=0&ap=%2526fmt%3D18" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="600" height="475"></embed></object>

And here's the result:

The still frame before the video is played is the exact same over-compressed image, but when a user clicks play, they will get a nice surprise. Instead of 320x240 video encoded with the Sorenson codec, the video will come in at a resolution of 480x360, encoded with the superior H.264 codec.

Embedding High Quality Youtube Videos [via Kottke]
View YouTube in high-res


Recent Entries

Comments

Oldest comments listed first.

Posted by: Patti Schiendelman on November 14, 2008 at 8:06 AM

Aha! Thanks for posting this, Jason; adding the high quality code to the url is easy, adding to the embed is trickier.


Posted by: Dolnor on November 16, 2008 at 3:15 PM

Add "&ap=%2526fmt%3D18#" to any direct link to switch to high-def version.


Posted by: Christian on November 24, 2008 at 5:34 AM

web editor

Has anybody noticed that the nice snippet of code &ap=%2526fmt%3D18 doesn't work in Internet Explorer anymore?

Any tips on a fix?

You may test it yourself (on your own websites or on http://blog.makezine.com/archive/2008/11/embed_highres_youtube_vid.html)


Posted by: dave on December 13, 2008 at 2:18 PM

&ap=%2526fmt%3D18 doesn't work in Internet Explorer

Yes, I noticed that &ap=%2526fmt%3D18 doesn't work in Internet Explorer . More exactly, my customer notice and called me -- pretty fookin irate they were.

Why can't Billy Gates get along with the other children?


Leave a comment


Subscribe to MAKE!Subscribe to MAKE Magazine!

Subscribe today, save 42% and get web access to MAKE free. MAKE Digital Edition is available only to subscribers.

$34.95 / 1 year
(4 Quarterly Issues)

Subscribe now


Void your warranty, violate a user agreement, fry a circuit, blow a fuse, poke an eye out. Make: The risk-takers, the doers, the makers of things... Welcome to Make: Online!


CRAFT Maker Shed Maker Faire MAKE television
Holiday Gift Guides from MAKE

Gifts for Dads
Science and Chemistry
More guides: Gifts Under $20, Santa Claus Machines, Geek Toys for Grown Up Girls & Boys


Check out all of the episodes of Make: television

Alex Rider Dream Gadget Contest
Make: Science Room

Connect with MAKE

Be a MAKE fan on Facebook MAKE on Facebook
Visit our Facebook page and become a fan of MAKE!
MAKE on Twitter MAKE on Twitter
Follow our MAKE tweets!
MAKE Flickr Pool MAKE on Flickr
Join our MAKE Flickr Pool!
    make_tips on Twitter




    Maker SHED

    Advertise here with FM.

    Why advertise on MAKE?
    Read what folks are saying about us!

    Click here to advertise on MAKE!



    Subscribe to MAKE Magazine!

    Make: Online authors!

    Gareth BranwynGareth Branwyn
    Senior Editor


    Phillip TorronePhillip Torrone
    Senior Editor
    | AIM | Twitter


    Becky SternBecky Stern
    Associate Editor
    | AIM | Twitter


    Marc de VinckMarc de Vinck
    Contributing Writer
    | AIM | Twitter


    John ParkJohn Park
    Contributing Writer
    | Twitter


    Sean RaganSean Ragan
    Contributing Writer
    | Twitter


    Matt MetsMatt Mets
    Contributing Writer
    | AIM | Twitter


    Dale DoughertyDale Dougherty
    Editor & Publisher
    | Twitter


    Shawn ConnallyShawn Connally
    Managing Editor
    | Twitter


    Goli MohammadiGoli Mohammadi
    Associate Managing Editor

    Kip KayKip Kay
    Weekend Projects
    | AIM | Twitter


    Collin CunninghamCollin Cunningham
    Contributing Writer
    | AIM | Twitter

    Adam FlahertyAdam Flaherty
    Contributing Writer
    | AIM | Twitter



    More contributors: Mark Frauenfelder (Editor-in-Chief, MAKE magazine), Kipp Bradford (Technical Consultant/Writer), Chris Connors (Education), Diana Eng (Guest Author), Peter Horvath (Intern), Brian Jepson (O'Reilly Media), Robert Bruce Thompson (Science Room)

    Suggest a Site!

    Current Podcast

    itunesdl.gif Weekend Project: Beetlebot Simple robot from your parts bin that avoids obstacles. Thanks go to Jerome Demers for the original article in MAKE, Volume 12. To download the Beetlebot video, click here or subscribe in iTunes. Check out the complete Beetlebot article... More...

    Get the Make: Online sent via email
    Enter your email to receive Make: Online each day:



    MAKE Fascination video series brought to you by Dow

    Make: Education
    MAKE: en EspaƱol MAKE: Japan
    Important please read


    Subscribe to MAKE Magazine!

    Recent Posts from the Craft: Blog