Search





• Recently Written

  • Matthew Modine video - Bicycle For A Day
  • Thomas D. Mangelsen - Images of Nature, La Jolla California
  • Shooting fireworks
  • The Gliderport at Torrey Pines
  • Great wedding location… if you are looking
  • Torrey Pines Gliderport
  • Model rocket launch
  • La Jolla in 5 frames
  • Throw that peanut again, and I’ll…..
  • Sanyo Xacti HD1000 sample video

• Categories

  • Articles
  • Photo Blog
  • Video Blog

• Archives

  • July 2008
  • June 2008
  • May 2008
  • April 2008
  • March 2008
  • February 2008
  • January 2008
  • December 2007
  • November 2007
  • July 2007

• About

  
  Contact
  
  Subscribe
  
  
  
  

• Admin

  • Login

High def video for the web is at least 960×540 in my opinion. DVD resolution is 720×480, and that is considered standard def.

There are several programs that will encode high def source video for little or no cost. I use VisualHub, and iMovie on Mac OSX to encode most of my video. I use iMovie to edit when necessary, then I compress with VisualHub, I think it does a better job than iMovie.

On Windows there is a free compressing program called MeGui. For editing on Windows, I recommend Adobe Premiere Express.

Here is an example of my current work flow on Mac OSX Leopard 10.5.3:

Computer: MacPro Quad
Software: Quicktime 7.5, iMovie 7.1.1, VisualHub 1.33.1
Camera: Panasonic HDC-SD9

Step 1: Import the raw video from the SD card (I use a card reader, not the camera) into iMovie at full size (it gives you the choice of 540p). iMovie will detect the reader as a camera after a few moments, be patient.

Step 2: Edit in iMovie as needed.

Step 3: Export with the following settings; Share>Export using Quicktime>Movie to Quicktime Movie

Video Settings: Apple Intermediate Codec, current fps, HDV 720p (use whatever size you like), no filters, size set to current.

Audio Settings: Linear PCM, Stereo 44.1, normal quality, sample size 16.

Step 4: Encode with VisualHub set to the settings in the images below:

You can use whatever size in VisualHub you want, but make sure it is the same or smaller than the source video that came out of the edit process.

VisualHub will also encode flash, but here you see h264 settings for mpeg4. Flash is more widely used, but mpeg4 via Quicktime player is higher quality.

I will cover how to write the code to embed all types of video on your site in a few days, stay tuned.

Tags: high definition, SD9, VisualHub, embed

Hosting may not be the first thing that runs through your mind when you think about putting video on your website, but I can assure you it is very important, and that is why I consider it a critical step in the process. Video files can get quite large, and high definition video is even worse in terms of file size.

The two concerns with hosting are storage space and bandwidth. I use Libsyn to solve both of these problems. Libsyn does not have any bandwidth limits, and they only limit storage space to “so much per month”, but no limit to the accumulated storage space. Their servers are also set up as a content delivery network, so the speed is always pretty good. This works fine for me because I don’t upload tons of video every day, and the monthly limit works out well for me. When the file reaches 30 days old, it goes into the archive folder and remains on their servers indefinitely. You might have unlimited bandwidth and storage on your web server, but I guarantee that in your terms of service there is something along the lines of “we reserve the right to shut your site down if it takes up to many resources”. The unlimited bandwidth and storage are just come-ons. If your site is not very busy, then you should be fine, but if one of your videos becomes popular, then you may get shut down regularly. There are other solutions to bandwidth and storage, but I believe that Libsyn is the way to go. Maybe try your own web server first, and just keep an eye on it.

Stay tuned for step two, encoding your video.

I promised to explain how to post high definition video to your blog, or website, so here goes.

There are three basic steps or “pieces to the puzzle”, if you will, to embedding, or posting high definition video to your blog or website:

1. Hosting

The first thing you need to solve is the bandwidth concern. If you have an unlimited bandwidth and storage plan from your webhost, then you are good to go, otherwise you will need to find a place to host the actual file, and be aware of their bandwidth limits, or rules.

2. Encoding the video file

In my opinion the most important thing to video on the web is the quality, and size. Now being a photog, my tolerance for bad video is pretty low, so I have to admit, I am pretty picky, and I will tell you how to be picky, and quality minded.

3. The code itself

Once you have solved the hosting, and have the video ready to go, then you obviously need to post the video to your website. I will be showing you how to do that as well.

I need to break up this article in several steps mostly because I don’t have the time to bite this off in one article, and your attention span is only a couple of paragraphs anyway, so stay tuned over the next week or so, and you will become a high definition video posting expert.

Just as I was messing with a Hi-Def camera I bought on the cheap on Ebay, my email client reported an email from SmugMug. The email read, “SmugMug now offers Hi Def Flash for blog embedding“. I am thrilled about this, because now I can begin to post video that is pleasing to look at, as well as being informative. I plan to get my new video podcast of the ground soon, just as soon as I can determine the format, and get into a groove. I plan on releasing episodic content by late summer 2008.

Many people, myself included love the ease of using youtube, or viddler. I prefer viddler to youtube because of the higher quality. I recently went looking for even higher quality, and I wanted to avoid the user leaving my site by clicking the video again. I was unable to find anything to my satisfaction, so I decided to look into doing it all myself.

I posted a new video the other day that I encoded, and hosted myself, and then re-encoded a video I had posted on viddler of King Tut’s tour. I then decided to write an article how to do this yourself.There are three basic steps to putting video on your website;

1. Encoding
2. Uploading and hosting
3. Embedding

Here are the detailed instructions for each step: (this is for flash video, I will write instructions for high def later)

Encoding:

I use Visual Hub (high setting at 500×376) on OSX to encode my .avi file taken directly from my camera. I save the file as “xxx.flv”. Visual Hub will convert most any format to flash, so this was a good choice for me. If you are a windows user, then this is the only step that you will have to find a different solution. I am sure there are several apps out there that will encode flash, google can probably help.

Hosting:

I then upload the video file to my website in a folder labeled “video-flash”, and a jpg thumbnail to a folder named “video-posters”. The jpg can be any image sized to the same size of the video (I use 500×376). I just grab a frame from the video itself, and use that. I use VLC to grab the frame, and save it as a jpg. The jpg step is necessary only if you don’t want a black frame to show while your video is not playing. The photo serves as a thumbnail preview of your video.I would recommend checking the limits of your bandwidth with the web hosting company you are using before serving video, because this can shut your site down fast if you don’t have an unlimited plan.

Embedding:

I am sure there are many wordpress solutions, but I chose JW flv media player. Just download the zip file, and upload the *.swf file and the *.js file to your website in whatever folder you want. I am using /blog. Once you have all the files uploaded, then use the following code in your page: (be sure to enter your own variables)

<embed src=”/blog/mediaplayer.swf” allowscriptaccess=”always” allowfullscreen=”true” flashvars=”height=396&width=500&file=your-video-file.flv?=your-image-thumbnail.jpg&volume=100″ height=”396″ width=”500″></embed>

Much of the settings can be customized, so have fun playing with it. You can see the settings I chose above, so feel free to choose whatever fits your needs.

Tags:
embed video in blog
embed video in wordpress
embed video on your website

After looking all over the net for a high quality video hosting site, I have only run into bad video, and poor embedding options, so I have decided to host and encode my own flash video. To accomplish this, I needed two things, first , a customizable flash plugin for wordpress, and second, a high quality flash video encoder. I found both solutions, and I will explain how I did it probably by tuesday, so stay tuned. I would do it now, but I need to go to work. In the meantime, here is an example of my own encoded and hosted video. The example is very high quality flash, and after the video, there are no annoying links, and you stay on my page.

Next Page →