Best way to show & resize on Webpage ?

[paul alford]

I am on version 7.01 and created a 30 sec "commercial" with static JPGs and videos, with background music. I am just testing for now to see how to get the final show and how the quality ends up on the website. I see the 2 options to publish in Facebook or YouTube, but I want to place my show on my own website, not theirs, so I cant use those. I have tried publishing as a preset HD video at 1920x1080 HD Mp4, and that works great (smooth video, good quality) but how do I get this MP4 now to 500 px wide...small enough to add to my webpage ? I changed the pixels in the presets to "custom" and resized to proportional 500x280 and it works, but quality is horrible (video is jerky and not smooth)

I tried to search the forum for this but coouldnt find this so if this has already been discussed, can someone point me to the posts please ?

Thanks in advance

Paul

[Lin Evans]

Hi Paul,

There are several ways to approach this. First, you obviously don't want to post a large HD video on your own website for several reasons. I think you already understand this, but for the other readers of this thread it probably is worthwhile to remind them that there are two issues with which we must contend when "streaming" video. The first issue is the speed of your own internet connect. As consumers with limited budgets we are not fortunate enough to be able to afford the incredibly powerful servers and huge bandwidth of YouTube, Vimeo, etc. A few lucky users have very high speed download, but there are still plenty of users who can't download data at much more than 400kbs or so. So these users would have continually interrupted play unless they stopped the play and waited for an extended period to begin the playback. Second issue is the capacity in terms of download bandwidth of your hosts server. Very few ISP's have super high speed servers and when they do, they are generally being used by large businesses and usually too costly for the average user. So we have two potential bottlenecks which impede download speed. The "safe" way around this is to limit the size of our own output to something around 800x600 pixels or roughly the equivalent of that in the desired aspect ratio. Next to that, the next best, in my opinion is the 1280x720 option. This can be formatted by several types of web creation software as I'll explain shortly.

The next question is how do we output this from PTE? First, we generally do not want to use an AVI format because of the wide range of codecs necessary to support all possible video output. We don't want our viewers to not be able to see our shows. The "safest" way I've found is to output an MP4 h.264 which is the default for PTE. Generally, If our slideshow is in 16:9 format, then probably 1280x720 is the safest output size. On the other hand, if we want to be more certain that the show will play smoothly, 800x450 will maintain the aspect ratio at a greatly reduced file size. Using "custom" we should have no degradation in performance at all.

Next, we need a way to load this on our own website or our own server. My own personal favorite tool for this is Xara Web Designer. Xara is fairly inexpensive and it takes only seconds to drop the MP4 into a Xara page output and format the size we expect our viewers to see and generate all the necessary code to simply upload to our web server. It's fast, very easy to use and works like a charm. It's easy to change the color and placement of the player and we simply provide the viewer with a link to the page or to the "folder" on our website where the "index.html" or equivalent is located to run the show. Anyone needing help with using Xara to do this is welcome to contact me. Other software which allows drop-in media (Dream Weaver, etc.) have similar capabilities. I like Xara because it's possible to take mp4 video output directly from PTE, drop it in and in about 30 seconds have the code generated to upload to my website. It's really easy and very fast.

Best regards,

Lin

[paul alford]

Thanks a million Lin and Tom. I did publish the test show with HD Video for PC - 800 x 448 (preset), 30 fps, Qualtiy 100, Audio 96 Bit Mono. The created MP4 wont import directly into DreamWeaver CS3 (I have) but not sure if the newer version will import directly. I took the new MP4 to zamzar.com to convert it to a FLV (free), which will import into DWeaver and its showing smoothly and nice...at least on my computer/browser. I havent uploaded it yet to see on the server. I will try it again at 500 px wide since I am trying to get it smaller on the webpage.

Getting there.

Paul