So you’ve got a video or two to show on your website, but how do you control how big the display is going to be?
Some of that is determined by the video’s original display size, but you can also override the default size with some settings for the display. For example the video below has been set to display at a width=”1280″ and height=”640″ when your browser is using the full size of your computer monitor. It does resize itself when not using the full size of your computer monitor proportionally.
In this case the code is typed in the post editor in the Text mode as shown below, the link to the video file location has been blurred as a security measure as it is located on a separate website.
Click to view image above larger
video original source: Vimeo
How can you determine what the height and width settings should be and keep things proportional?
In WordPress depending upon how you insert the video into your post or page things are usually automatically set, but if you need to look-up the settings use the table below.
Standard | HD | Cinema Film | Cinemascope | ||||
Aspect ratio 4:3 |
Aspect ratio 6:9 |
Aspect ratio 1.85:1 |
Aspect ratio 2.35:1 |
||||
Width | Height | Width | Height | Width | Height | Width | Height |
240 | 180 | 240 | 135 | 240 | 130 | 240 | 102 |
320 | 240 | 320 | 180 | 320 | 173 | 320 | 136 |
480 | 360 | 480 | 270 | 480 | 259 | 480 | 205 |
640 | 480 | 640 | 360 | 640 | 346 | 640 | 273 |
720 | 540 | 720 | 405 | 720 | 389 | 720 | 307 |
800 | 600 | 800 | 450 | 800 | 432 | 800 | 341 |
1024 | 768 | 1024 | 576 | 1024 | 554 | 1024 | 436 |
1152 | 864 | 1152 | 648 | 1152 | 623 | 1152 | 491 |
1280 | 960 | 1280 | 720 | 1280 | 692 | 1280 | 545 |
1360 | 1020 | 1360 | 765 | 1360 | 735 | 1360 | 579 |
1366 | 1025 | 1366 | 768 | 1366 | 738 | 1366 | 582 |
1440 | 1080 | 1440 | 810 | 1440 | 778 | 1440 | 614 |
1536 | 1152 | 1536 | 864 | 1536 | 830 | 1536 | 654 |
1600 | 1200 | 1600 | 900 | 1600 | 865 | 1600 | 682 |
1680 | 1260 | 1680 | 945 | 1680 | 908 | 1680 | 716 |
1920 | 1440 | 1920 | 1080 | 1920 | 1038 | 1920 | 818 |
Please remember that the larger your display size the higher the resolution should be of the video and that means the larger the file size is going to be. The larger your video file is then more bandwidth is required to play the video for your site visitor without buffering. Larger video file sizes can also use more of your hosting service’s server side resources, but you can most times use a third party service such as YouTube or Vimeo to host the video and just call it up from there to include in your post or page. This does not always work very well and in certain instances the video file must be on your site in the Media Library. Using a third party services also have their own limitations and you should research those as best you can.