HOW TO OPTIMIZE VIDEOS FOR WEB STORIES

WHY ADD VIDEOS TO WEB STORIES?

RULES OF THUMB

THAT'S ALL GREAT. BUT HOW DO I DO ALL THAT?

YOU'LL NEED THE RIGHT TOOL

CODEC

Don't confuse the codec with the file extension.

FILE EXTENSION

THE TAKEAWAY

[{"selector":"#anim-2c421148-a878-48ee-9b27-790d4bcaa699","keyframes":{"opacity":[0,1]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-d0684dbf-517b-4cc0-8321-91728b76f0e6","keyframes":{"transform":["translate3d(283.46459%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-46f61c84-c407-4d65-ad9e-9faee8a2a906","keyframes":{"opacity":[0,1]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-8d0280b5-b2ea-4bfb-8d0b-fe62553490f1","keyframes":{"transform":["translate3d(48.04878%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-46c0203d-9ca8-41bf-812f-ae6e23722b74","keyframes":{"opacity":[0,1]},"delay":1000,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-e1d7e7fb-d0c5-4456-bc74-d56581ffe284","keyframes":{"transform":["translate3d(-241.66667%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":1000,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-6d32b844-8f70-43d8-a261-d56a159d3c3f","keyframes":{"opacity":[0,1]},"delay":1000,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-1bce737b-1f0f-461d-a00f-919dbc21f090","keyframes":{"transform":["translate3d(-60.2439%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":1000,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-02f34e68-bdc5-486f-9a46-5570fe92078c","keyframes":{"opacity":[0,1]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-b92ee75a-8ee7-49e5-9389-a43e6a1382d8","keyframes":{"transform":["translate3d(255.20835%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-6488917a-dcc4-442c-8aea-613640bbf81e","keyframes":{"opacity":[0,1]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-53af05eb-fbf6-426c-93b1-c2b70f6b2ca2","keyframes":{"transform":["translate3d(583.33361%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}]

MORE ON YOUTUBE

HOW TO OPTIMIZE VIDEOS FOR WEB STORIES

WHY ADD VIDEOS TO WEB STORIES?

Videos are immersive and dynamic. With a video your story doesnt feel like a simple slideshow.

RULES OF THUMB

Keep video files under 4 MB.

For uploading videos in a Web Story.

Shorter than 10 seconds.

At or under 720p resolution.

If you have longer videos, split them up.

THAT'S ALL GREAT. BUT HOW DO I DO ALL THAT?

YOU'LL NEED THE RIGHT TOOL

To compress or convert a video you'll need the right software. One basic tool is a free sofware called Avidemux.

CODEC

A codec is like an image format, but for multiple images with so called frames.

When you compress videos you need to use the right codec!

Keep in mind:

Don't confuse the codec with the file extension.

CODEC

Be careful:

FILE EXTENSION

The file extension is defined by the container format.

THE TAKEAWAY

If this is confusing to you: Don't worry. Just remember that your best bet is to use a combination of:

H264 Codec

MP4 Container

&

This combination is compatible with all common devices.

MORE ON YOUTUBE

For more detailed information about video optimization watch the full video on YouTube.

HOW TO OPTIMIZE VIDEOS FOR WEB STORIES

WHY ADD VIDEOS TO WEB STORIES?

Videos are immersive and dynamic. With a video your story doesnt feel like a simple slideshow.

RULES OF THUMB

Keep video files under 4 MB.

For uploading videos in a Web Story.

Shorter than 10 seconds.

At or under 720p resolution.

If you have longer videos, split them up.

THAT'S ALL GREAT. BUT HOW DO I DO ALL THAT?

YOU'LL NEED THE RIGHT TOOL

To compress or convert a video you'll need the right software. One basic tool is a free sofware called Avidemux.

CODEC

A codec is like an image format, but for multiple images with so called frames.

When you compress videos you need to use the right codec!

Keep in mind:

Don't confuse the codec with the file extension.

CODEC

Be careful:

FILE EXTENSION

The file extension is defined by the container format.

THE TAKEAWAY

If this is confusing to you: Don't worry. Just remember that your best bet is to use a combination of:

H264 Codec

MP4 Container

&

This combination is compatible with all common devices.

MORE ON YOUTUBE

For more detailed information about video optimization watch the full video on YouTube.

Videos are immersive and dynamic. With a video your story doesnt feel like a simple slideshow.