Have you ever had a problem where you embedded images to your blog to fit in your posts, but it just didn’t display correctly? Or, have you embedded Flash videos that didn’t show the video correctly? Do you know what method you need to use to solve it? Easy, use basic algebra to figure out what sizes you should choose to display your images and videos correctly.

Display Videos in Proper Ratio
Let’s say you want to display a YouTube video within your blog post but you want to expand the size of the video all the way. You can’t just resize it by extending the width and height of the video size to random sizes. You actually have to use algebra to keep the the right aspect ratio so your video will display correctly.

Let’s look at a sample YouTube embedding code. As you can see from the code below, the width is 425 and the height is 350.

<object width="425" height="350">
<param name="movie" value="http://www.youtube.com/v/B6w9Bo3ihrU"></param>
<param name="wmode" value="transparent"></param><embed
src="http://www.youtube.com/v/B6w9Bo3ihrU" type="application/x-shockwave-flash"
wmode="transparent" width="425" height="350"></embed>
</object>

From the drawing above we want to have the video extended 480 pixels in width from the original 425 pixels. To do this we use basic algebra to get our numbers which is directly proportional to the original sizes.

We use simple math to multiply the the new width we want, 480, by the old height, 350. Then we divide that value by the old width, 425, to get our new and final height of 395.

So your new code should look like the following.

<object width="480" height="395">
<param name="movie" value="http://www.youtube.com/v/B6w9Bo3ihrU"></param>
<param name="wmode" value="transparent"></param><embed
src="http://www.youtube.com/v/B6w9Bo3ihrU" type="application/x-shockwave-flash"
wmode="transparent" width="425" height="350"></embed>
</object>

Same Thing with Images
Don’t be surprised, but you could use this method with images so your images will not look distorted. With basic algebra, in calculating proportions, you can display your images in the right ratio so it’ll be displayed well on your blog.

I hope this helps. What do you guys think?

Like this article? Subscribe to the FULL RSS feed! Or add this site to Technorati Favorites

887 Views