homepage Welcome to WebmasterWorld Guest from 54.197.215.146
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / WebmasterWorld / Web Video Creation and Optimization
Forum Library, Charter, Moderators: travelin cat

Web Video Creation and Optimization Forum

    
How to keep videos from pixelating in browser
Bruce Siegel




msg:3814415
 11:41 pm on Dec 25, 2008 (gmt 0)

Hi all,

This is my first post here—sorry if it's a bit long.

How do I keep my flash videos from pixelating when viewed in a browser using the zoom feature (as in Opera, Explorer, and Firefox)?

So far, I've been embedding my videos using the Dreamweaver "insert: media: flash video" routine.

The videos look perfectly sharp when viewed in any browser at 100%. They're also acceptable when zoomed OUTSIDE the browser, in RealPlayer or Quicktime.

On other sites, I see videos that zoom without pixelation, or that don't allow zooming (the video keeps the same dimensions as other page elements expand.) I'd be happy with either solution. Any help would be greatly appreciated!

Thanks,
Bruce

 

thecoalman




msg:3814891
 4:00 pm on Dec 27, 2008 (gmt 0)

I'm not familiar with flash video but the same principals apply for any type of video. I'd venture to guess you don't have enough bitrate or the player scales video poorly.

The first thing to understand is how compressed video is created. If for example you start out with format that is only lightly compressed like DV-AVI each frame of video has an individual picture which is lightly compressed. To achieve more compression with codecs like MPEG, WMV etc. Frames are put into what is called a group of pictures (GOP). The first frame of a GOP is called the I-Frame and that is the only one that is full frame, subsequent frames are made up of previous frames. This why you'll see a lot of macroblocking during fast motion on some clips that will look normal when no one is moving. There's not enough bitrate to store all these changes from frame to frame so you get big blocks or macroblocking as it is commonly referred to.

The bitrate required for a given video so these blocks don't occur varies depending on the resolution of the video, the codec used and the content of the video. I'll use MPEG2 as example which is used for DVD. if you use a resolution of 720X480 you can set a bitrate of 8000kbps which should eliminate all but minute macroblocking, anything over 8000kbps and you're just creating a larger file. Once you get down around 4000kbps you'll start to get some real bad macroblocking and at the point you're better off using a lower resolution. You'll lose detail BUT you won't have all those blocks.

Assuming the player scales video well a 320X240 MPEG video encoded at 1000kbps will be superior to a 720X480 video encoded at 2000-3000kbps especially if there is large amount of action in the video.

So the short answer is you need more bitrate or a lower resolution but that's assuming you're encoding from a good source video to start with. You can't take a stepped on video and reencode it to higher bitrate to make it look better. A video should be encoded to compressed format from the highest quality source you have once and only once. Each recompression will degrade the video, how much "depends".

Codecs like WMV or others made for higher compression can use much lower bitrates than the examples I provided.

Bruce Siegel




msg:3815034
 4:43 am on Dec 28, 2008 (gmt 0)

Hi Coalman,

Thanks so much for the detailed response. It'll take me a while to digest it all as I'm not a web professional, but a musician and teacher creating an instructional website.

I do have a question, though. I understand that WW forbids links. But is there some way to attach a .png file? If you saw a picture of the kind of image degradation I'm talking about, it could save a lot of possible misunderstandings. For example, my primary concern has to do with text overlays, so motion is not an issue at all.

I'm considering subscribing to the site, but it would be a lot more useful to me with the ability to share images in some way.

Thanks,
Bruce

thecoalman




msg:3815091
 1:14 pm on Dec 28, 2008 (gmt 0)

No images in posts that I'm aware of.

Is it like a comb effect you're seeing?

One thing I did not mention is video produced on video cams is interlaced on standard models, some will produce progressive. This looks terrible on a monitor except most players will deinterlace it on the fly.

If that's the case try deinterlacing it, any editor/encoder should have this option. One thing to note is this should only be done under these circumstances. Video that is already interlaced should be left as interlaced as it looks fine on a standard TV or software made for playing interlaced footage.

Bruce Siegel




msg:3815278
 12:40 am on Dec 29, 2008 (gmt 0)

Thanks, Coalman. I've managed to solve the problem by using a different player. It's called FlowPlayer. Are you familiar with it?

It turns out there was no problem with my video files at all. They look great on Flowplayer, even when the browser is zoomed 200% and more. Now I just have to learn the ins and outs of this player. It'll cost me $100. But it looks like they have good support, which I'll greatly appreciate!

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / WebmasterWorld / Web Video Creation and Optimization
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved