Insérer un script ou une animation flash dans vos pages web

Classé dans : Création de site | 0

Vous pouvez insérer des scripts en langage javascript ou vbscript … au sein même de vos fichiers HTML.
Ces scripts vous permettront de rendre vos pages plus dynamiques et interactives en vous donnant des possibilités qui ne sont pas offertes par le langage HTML.

Pour cela, vous devrez utiliser la balise <script> et son attribut « type« .

Exemple de code javascript inclu dans une page web

<html>
<head><title></title></head>
<body><script type= »text/javascript »>
document.write(« Bonnes visites ! »)
</script>

</body>
</html>

Résultat dans le navigateur :

Bonnes visites !

Rendre les scripts invisibles aux vieux navigateurs qui ne peuvent les exécuter

javascriptCertains (très) vieux navigateurs ne pourront pas comprendre la balise <script>.
Ils afficheront alors le code relatif au script comme un simple texte, ce qui est gênant.
Toutefois, en entourant le script avec les balises de commentaires, vous pouvez éviter ce genre de problèmes.
Les vieux navigateurs n’afficheront pas le code car ils comprendront que c’est un commentaire qui n’est pas destiné à être affiché, et les navigateurs récents exécuteront normalement le script sans être dérangés.

Exemples de codes qui ne seront pas exécutés par les vieux navigateurs

<html>
<head><title></title></head>
<body><script type= »text/javascript »>
<!–
document.write(« Bonnes visites ! »)
//–>
</script>

</body>
</html>

—————————————-

<html>
<head><title></title></head>
<body>

<script type= »text/vbscript »>
<!–
document.write(« Bonnes visites ! »)
//–>
</script>

</body>
</html>

La balise <noscript>

En complément de la technique précédente, vous pouvez utiliser la balise <noscript>, qui vous permettra d’afficher un texte alternatif au cas où votre script ne soit pas exécuté.
Attention, cette balise n’est comprise que par les navigateurs récents capables d’interpréter la balise <script>.
Elle aura donc une utilité uniquement si le navigateur comprend la balise <script> sans pouvoir exécuter votre script, ce qui est le cas si le visiteur a désactivé l’exécution de ceux-ci dans son navigateur.
Notez enfin que si le script est correctement exécuté, la balise <noscript> sera ignorée.

Exemple :

<html>
<head><title></title></head>
<body><script type= »text/javascript »>
<!–
document.write(« Bonnes visites ! »)
//–>
</script>

<noscript>Votre navigateur ne supporte pas le javascript, cette fonction est indisponible.</noscript>

</body>
</html>

—————————————-

<html>
<head><title></title></head>
<body>

<script type= »text/vbscript »>
<!–
document.write(« Bonnes visites ! »)
//–>
</script>

<noscript>Votre navigateur ne supporte pas le vbscript, cette fonction est indisponible.</noscript>

</body>
</html>

Résultat dans un navigateur récent avec le javascript ou vbscript désactivé :

Votre navigateur ne supporte pas le vbscript/javascript, cette fonction est indisponible.

Insérer une animation flash dans vos pages

Voici un exemple de code qui vous permet d’insérer une animation flash dans vos pages web.

<object classid= »clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″
codebase= »http://active.macromedia.com/flash4/cabs/swflash.cab#version=6,0,47,0″ id= »animation » width= »277″ height= »311″>
<param name= »movie » value= »adresse/animation_flash.swf »>
<param name= »quality » value= »high »>
<param name= »bgcolor » value= »#FFFFFF »>
<embed src= »adresse/animation_flash.swf » quality= »high » pluginspage= »http://www.macromedia.com/go/getflashplayer » type= »application/x-shockwave-flash » width= »277″ height= »311″></embed>
<noembed>Texte alternatif pour les navigateurs qui ne peuvent pas afficher le flash</noembed>

</object>

Comme vous pouvez le constater ça fait beaucoup de code !
Car il faut en effet donner deux instructions différentes aux deux principaux navigateurs, internet explorer et netscape.
La balise <object> permet d’insérer un flash et elle est reconnue uniquement par internet explorer.
La balise <embed> donne la même instruction à Netscape et Mozilla.
La balise <noembed> a la même fonction que <noscript>.

En plus, il faut savoir que les balises <embed> et <noembed> ne sont pas reconnues par le W3C.
En d’autres termes, le W3C n’est pas favorable à l’utilisation d’animations flash, vous ne pourrez donc pas valider votre page HTML si vous utilisez la balise <embed>.
Malgré tout, la balise <object> est quant à elle acceptée.
Nous sommes donc face à un sacré problème !

La seule solution que j’ai trouvée pour utiliser du flash tout en validant mes pages est la suivante :

J’ai utilisé normalement la balise <object> qui permet aux utilisateurs d’internet explorer (navigateur le plus largement utilisé) de voir mes flashs (cf. pub page d’accueil) et avec un petit bout de javascript j’affiche le flash aux utilisateurs de netscape et mozilla, ou une simple image aux navigateurs qui ne gérent pas le flash.

Code validé pour l’insertion du flash de ma page d’accueil :

<object classid= »clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″
codebase= »http://active.macromedia.com/flash4/cabs/swflash.cab#version=4,0,0,0″ id= »lien_maison » width= »277″ height= »311″>
<param name= »movie » value= »adresse/fichier.swf » />
<param name= »quality » value= »high » />
<param name= »bgcolor » value= »#FFFFFF » />
<script language= »JavaScript » type= »text/javascript »>
<!–
if (!document.all) {
document.write(‘<embed src= »adresse/fichier.swf » quality= »high » pluginspage= »http://www.macromedia.com/go/getflashplayer » type= »application/x-shockwave-flash » width= »277″ height= »311″></embed>
<noembed><img src= »adresse/image.gif » border= »0″ alt= » » /></noembed>’);
}
//–>
</script>

</object>

Enfin, la balise <param>, utilisée en association avec <object>, permet de paramétrer votre objet multimédia en définissant par exemple la qualité de votre animation flash.

Récapitulatif des principales balises utilisées pour les scripts

Balise Description
<script> Permet d’insérer un script
<noscript> Pour définir un texte alternatif si le script n’est pas exécuté
<object> Pour insérer un objet multimédia (animation flash …) sous internet explorer
<embed> Pour insérer un objet multimédia (animation flash …) sous netscape
<noembed> Pour définir un texte alternatif (ou une image) si le navigateur n’affiche pas l’objet
<param> Pour paramétrer l’objet incorporé

Laissez un commentaire