Audiovisual content attracts attention and not only pleases the visitors to your website. The search engines also reward the added value that multimedia content offers. Videos, in particular, enable you to make information offers more varied. In addition, products and services can be presented in more detail with videos than with texts and images alone. However, delivering YouTube video content on websites has long been considered difficult.

In order to display multimedia content, appropriate browser plug-ins (e.g. Adobe Flash Player) had to be installed manually on the end device and updated regularly, which often resulted in incompatibilities and security gaps. Providers were also confronted with complicated embed codes and sometimes struggled to convert videos into the appropriate formats (e.g. SWF). But these additional technologies could soon be history. Since the fifth version, the Hypertext Markup Language (HTML for short) has been offering a native element with which videos can be integrated into the website code as full web content . Alternatively, you have the option of outsourcing YouTube video hosting to providers such as YouTube or Vimeo. We'll show you how it works.

HTML5 makes embedding videos child's play. All you need is the native element video , which can be expanded with optional attributes. The following code example shows how to add video resources to the source code of your website.

The YouTube video element in the example contains the URL to the YouTube Embed Code resource ( src = " example.mp4 ") and the optional width , height, controls and poster attributes that define how the YouTube Embed Code will be displayed on the website. Text that appears between the introductory and the closing tag of the YouTube Embed Code element is only displayed if a browser cannot display the YouTube Embed Code. Website operators usually use this function to offer an alternative description and a download link to the resource.

If a resource on the YouTube video element involved, this must be the link to the resource as either src - attribute or a child element source included. In addition, the YouTube video element can be expanded to include the following attributes:

Current versions of the most popular web browsers support HTML5. In order to make video content on your website accessible to those users who are technically not up to date, text links within the video element allow you to offer separate download files for the YouTube Embed Code. If you get the alternative text instead of the YouTube Embed Code, you have the choice of downloading the YouTube Embed Code and viewing it in a local media player.  

The HTML5 specification defines the video element and the associated application programming interface (API), but does not make any specifications for video coding . The choice of video format therefore poses problems for website operators. Each of the popular video formats WebM , OggTheora and H.264 / MPEG4 have advantages and disadvantages. And so the manufacturers of market-leading web browsers have not yet been able to agree on a common standard. While Internet Explorer and Safari primarily use the H.264 / MPEG4 format, which is subject to a fee for the manufacturerset, a format that has been available almost everywhere since 2013, the web browsers Firefox, Chrome and Opera also support free formats such as Ogg Theora and WebM .

In order to prevent incompatibilities, it is advisable to provide videos in different formats. The video element allows for this purpose, various video resources by the child element source to integrate with the type excel attribute for the Web browser.

If alternative source elements with the corresponding type attribute are included in the video element, a browser automatically selects the preferred video format when the website is set up. It should be noted that with this type of video embedding , the video element must not contain an src attribute with a resource.

If you don't want to provide videos via your own server, but want to outsource the video hosting to an external service provider, platforms such as YouTube and Vimeo have the option of uploading video material free of charge and integrating clips into your own website using an embed code .

Since popular video platforms ensure that your content is compatible with the most popular web browsers, the formats of these providers are supported on most end devices. Outsourcing video clips also has the advantage that your own server is not additionally burdened by the streaming. However, website operators should inform themselves in advance about the terms of use for video hosting and adapt the embed code to their own requirements.

For example, if you want to embed a YouTube video, call up the relevant clip on the platform and take the code from the embedding menu. Central settings can also be made here to define the dimensions of the YouTube Embed Code and to activate controls and video titles. To prevent third-party content from appearing on your own page, it is also advisable to deactivate the preview function for alternative videos. Otherwise, the YouTube Embed Code platform will present content from other users in the integrated player who have been assigned similar keywords - in the worst case, videos from a direct competitor.