path: root/files/fr/conflicting/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html

---
title: Ajouter du contenu Flash dans une page web
slug: conflicting/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies
tags:
  - Accessibility
  - Advanced
  - Flash
  - Guide
  - HTML
translation_of: >-
  Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies#The_%3Cembed%3E_and_%3Cobject%3E_elements
translation_of_original: Learn/HTML/Howto/Add_Flash_content_within_a_webpage
original_slug: Apprendre/HTML/Comment/Ajouter_contenu_Flash_dans_page_web
---
<div class="summary">
<p>Cet article illustre pourquoi il est nécessaire que le contenu d'une page web soit accessible sans plugin. Si vous avez besoin de tels plugins (pour un cas bien spécifique ou pour des raisons historiques), nous illustrerons également un cas expliquant comment intégrer du contenu de cette façon.</p>
</div>

<table class="learn-box nostripe standard-table">
 <tbody>
  <tr>
   <th scope="row">Prérequis :</th>
   <td>Vous devez savoir <a href="/fr/Apprendre/HTML/Write_a_simple_page_in_HTML">comment créer un document HTML basique</a>.</td>
  </tr>
  <tr>
   <th scope="row">Objectifs :</th>
   <td>Cet article aborde les méthodes pour insérer du contenu, dépendant d'extensions tierces, dans une page web.</td>
  </tr>
 </tbody>
</table>

<div class="warning">
<p><strong>Résumé :</strong> Des plugins comme Flash représentent une technologie passée, notamment sur les appareils mobiles où ils ne sont pas disponibles. Les navigateurs destinés aux ordinateurs de bureau<a href="http://arstechnica.com/information-technology/2015/04/chrome-starts-pushing-java-off-the-web-by-disabling-plugins/"> vont également abandonner leur support</a>.</p>
</div>

<h2 id="Tourner_son_clavier_sept_fois_sur_son_bureau_avant_de_dépendre_de_plugins_tiers">Tourner son clavier sept fois sur son bureau avant de dépendre de plugins tiers</h2>

<p>Un <a href="/fr/Add-ons/Plugins"><strong>plugin</strong></a> est un logiciel qui permet d'accéder à un contenu que le navigateur ne peut pas lire/décoder nativement. Il était une fois, les plugins étaient indispensables sur le Web. Il y a quelques années, installer Adobe Flash Player était un passage obligé pour regarder un film en ligne. À cette époque, on avait également de (trop) nombreuses alertes pour mettre à jour Flash Player ou Java Runtime Environment.</p>

<p>Depuis, les technologies web ont grandi et aquis une certaine maturité et une certaine robustesse. Pour la plupart des application, il est donc temps d'arrêter de dépendre de ces plugins et de tirer parti des technologies web. Cela permettra :</p>

<ul>
 <li><strong>D'élargir votre audience à toutes les personnes qui ont un navigateur. </strong>Tout le monde a un navigateur, les plugins sont beaucoup plus rare, notamment pour les utilisateurs mobiles. Le Web était devenu largement utilisable sans plugins, les gens iront sans aucun doute sur un autre site web concurrent plutôt que d'installer un plugin supplémentaire.</li>
 <li><strong>De vous épargner <a href="http://webaim.org/techniques/flash/">les maux de tête liés à l'accessibilité</a> et aux plugins comme Flash ou les autres.</strong></li>
 <li><strong>De rester à l'abri de failles de sécurités répétées. </strong>Il est <a href="http://www.cvedetails.com/product/6761/Adobe-Flash-Player.html?vendor_id=53">de notoriété publique qu'Adobe Flash est peu sécurisé</a> et ce malgré les nombreux correctifs apportés au cours du temps. En 2015, Alex Stamos, le responsable de la sécurité informatique de Facebook a même demandé à Adobe <a href="http://www.theverge.com/2015/7/13/8948459/adobe-flash-insecure-says-facebook-cso">d'arrêter le développement de Flash.</a></li>
</ul>

<p>Que faire ? Si vous avez besoin d'une certaine intéractivité sur votre page, {{glossary("JavaScript")}} vous permettra sans aucun doute d'accomplir ce dont vous avez besoin, sans avoir à utiliser d'applets Java ou de composants ActiveX/BHO. Plutôt que d'utiliser Adobe Flash, vous pouvez utiliser <a href="/fr/Apprendre/HTML/Howto/Add_audio_or_video_content_to_a_webpage">la vidéo HTML5</a> pour les cas où vous avez besoin de médias, <a href="/fr/docs/Learn/HTML/Howto/Add_vector_image_to_a_webpage">SVG</a> pour les graphiques vectoriels et <a href="/fr/docs/Web/API/Canvas_API/Tutorial">Canvas</a> pour réaliser des images et animations complexes. <a href="https://plus.google.com/+PeterElst/posts/P5t4pFhptvp">Plusieurs années auparavant, Peter Elst écrivait déjà</a> qu'Adobe Flash était rarement le meilleur outil pour développer sur le Web, notamment pour les jeux et les applications d'entreprises. En ce qui concerne ActiveX, même le navigateur de Microsoft, {{glossary("Microsoft Edge","Edge")}}, ne le supporte plus.</p>

<h2 id="L'histoire_de_deux_balises">L'histoire de deux balises</h2>

<p>Si vous devez dépendre de plugins pour un cas spécifique ou lié au cadre d'une entreprise donnée, HTML fournit deux élément pour intégrer du contenu provenant d'un plugin : {{htmlelement("embed")}} et {{htmlelement('object')}}. Il faut noter qu'<code>&lt;embed&gt;</code> est un élément vide, à la différence de <code>&lt;object&gt;</code>.</p>

<p>Il faudra donc utiliser les attributs pour fournir certaines informations :</p>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col"> </th>
   <th scope="col">{{htmlelement("embed")}}</th>
   <th scope="col">{{htmlelement("object")}}</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>L'{{glossary("URL")}} du contenu à intégrer</td>
   <td>{{htmlattrxref('src','embed')}}</td>
   <td>{{htmlattrxref('data','object')}}</td>
  </tr>
  <tr>
   <td>Le type {{glossary("MIME")}} <em>précis</em> du contenu à intégrer</td>
   <td>{{htmlattrxref('type','embed')}}</td>
   <td>{{htmlattrxref('type','object')}}</td>
  </tr>
  <tr>
   <td>La hauteur et la largeur, exprimées en pixels CSS, de la boîte contrôlée par le plugin</td>
   <td>{{htmlattrxref('height','embed')}}<br>
    {{htmlattrxref('width','embed')}}</td>
   <td>{{htmlattrxref('height','object')}}<br>
    {{htmlattrxref('width','object')}}</td>
  </tr>
  <tr>
   <td>Les noms et valeurs à founir comme paramètres au plugin</td>
   <td>Des attributs <em>ad hoc</em> avec les noms et les valeurs</td>
   <td>Des éléments sur une seule balise {{htmlelement("param")}} contenus dans la balise <code>&lt;object&gt;</code></td>
  </tr>
  <tr>
   <td>Du contenu HTML indépendant à utiliser en secours au cas où la ressource à intégrer n'est pas disponible</td>
   <td>Non supporté (<code>&lt;noembed&gt;</code> est obsolète)</td>
   <td>Contenus dans la balise <code>&lt;object&gt;</code>, après les éléments <code>&lt;param&gt;</code></td>
  </tr>
 </tbody>
</table>

<div class="note">
<p><code>&lt;object&gt;</code> a besoin d'un attribut <code>data</code> ou d'un attribut <code>type</code> ou des deux. SI vous utilisez les deux, il faudra peut être utiliser l'attribut  {{htmlattrxref('typemustmatch','object')}} (uniquement implémenté dans Firefox à l'heure où cet article est écrit). <code>typemustmatch</code> permet au contenu intégré de ne pas être lancé tant que l'attribut <code>type</code> ne correspond pas au type du média. <code>typemustmatch</code> permet ainsi d'apporter beaucoup plus de sécurité lorsqu'on intègre du contenu provenant d'une autre {{glossary("origine")}} (cela peut empêcher des attaquants malveillants de lancer des scripts modifiés au travers du plugin).</p>
</div>

<p>Les deux exemples utilisent chacun <code>&lt;embed&gt;</code> ou <code>&lt;object&gt;</code> pour insérer un film Flash, <code>&lt;object&gt;</code> permet également de gérer un contenu à utiliser en cas de secours :</p>

<pre class="brush: html">&lt;embed
  src="explosion.swf"
  type="application/vnd.adobe.flash-movie"
  width="500"
  height="300"
  bgcolor="#ff7f00"
  allowfullscreen="true"
/&gt;</pre>

<pre class="brush: html">&lt;object
  data="explosion.swf"
  type="application/vnd.adobe.flash-movie"
  width="500"
  height="300"
  typemustmatch&gt;
    &lt;param name="bgcolor" value="#ff7f00" /&gt;
    &lt;param name="allowfullscreen" value="true" /&gt;

    &lt;p&gt;Le film Flash n'a pu être trouvé.&lt;/p&gt;
&lt;/object&gt;
</pre>

<p>Afin d'être tout à fait complet, voici deux exemples supplémentaires. Encore une fois, il est (de loin) préférable d'utiliser JavaScript que des applets Java car le navigateur exécutera directement le code JavaScript sans passer par un environnement tiers, lourd. Ceci étant dit, voilà comment utiliser l'élément <code>&lt;object&gt;</code> pour insérer une applet Java :</p>

<pre class="brush: html">&lt;object
  data="mon_applet.jar"
  type="application/x-java-applet"&gt;
    &lt;param name="code" value="MaClasseJava"&gt;

    &lt;p&gt;Java n'est pas disponible ou est désactive.&lt;/p&gt;
&lt;/object&gt;
</pre>

<p>Un autre cas où on a besoin de faire appel à <code>&lt;object&gt;</code> : les fichiers PDF. Ces fichiers posent de nombreux <a href="http://webaim.org/techniques/acrobat/acrobat">problèmes d'accessibilité</a>, notamment pour les utilisateurs qui utilisent un petit écran. Il ne devrait pas être absolument nécessaire de lire un PDF pour consulter un site web (imaginez si tous les sites web étaient uniquement disponibles en largeur fixe). Toutefois, si vous avez besoin d'intégrer un contenu PDF, voici comment le faire dans votre page web :</p>

<pre class="brush: html">&lt;object
  data="mon_fichier.pdf"
  type="application/pdf"
  width="100%"
  height="100%"
  typemustmatch&gt;
    &lt;p&gt;Vous n'avez pas de plugin pour lire des fichiers PDF mais vous pouvez
    &lt;a href="mon_fichier.pdf"&gt;télécharger le fichier PDF correspondant.&lt;/a&gt;&lt;/p&gt;
&lt;/object&gt;
</pre>

<h2 id="En_savoir_plus">En savoir plus</h2>

<ul>
 <li><a href="http://webaim.org/techniques/flash/">L'accessibilité avec Flash</a></li>
 <li>{{htmlelement('object')}}</li>
 <li>{{htmlelement('embed')}}</li>
 <li><a href="https://en.wikipedia.org/wiki/Comparison_of_HTML5_and_Flash">Comparaison entre HTML5 et Flash</a> sur Wikipédia (en anglais)</li>
 <li><a href="http://www.flashsucks.org">flashsucks.org</a>, <a href="http://www.occupyflash.org">occupyflash.org</a> (en anglais) (pour expliciter, encore plus si besoin, les raisons pour lesquelles Flash est très déconseillé)</li>
</ul>