Affichage des articles dont le libellé est AS2. Afficher tous les articles
Affichage des articles dont le libellé est AS2. Afficher tous les articles

mercredi 25 novembre 2009

Flash et le référencement naturel dans les moteurs de recherche.

Flash et le référencement naturel, comment l'optimiser?

Le référencement est l'ensemble des techniques qui permettent d'inscrire un site dans les moteurs de recherche ou dans les annuaires. Le positionnement, représente l'art d'optimiser la place du site dans les réponses fournies par les moteurs de recherche.

Une animation en Flash (ou un menu ou toute autre interface) placée dans une page web se présente sous le forme d'un fichier « Shockwave Flash » (extension « .swf »). La page web contenant ce fichier est une page HTML avec une balise qui indique au navigateur d'inclure ce fichier Flash.

Le problème lié au référencement est que la plupart des robots d'indexation ne "voient" pas le contenu du fichier Flash, ils n'indexent, pour la plupart, que du contenu textuel au format HTML. Si tout le site est construit en Flash, le robot ne verra que des fichiers HTML quasi vides, ce qui sera catastrophique du point de vue du référencement.

Comment référencer un site en Flash ?

Pour mettre en ligne un projet Flash au moins une page HTML est nécessaire, celle qui "lance" l'animation Flash. Cette page est prise en considération par les moteurs.

Il faut donc utiliser de la façon la plus optimisée possible les balises HTML de cette page:
  • balise TITLE : certainement la plus importante, contenant les mots clés du contenu de l'animation.
  • balise META NAME="DESCRIPTION" CONTENT contentant une description simple du contenu de l'animation, avec des mots clés résumant la page.
  • balise META "Keywords" ne soit quasiment plus prise en compte aujourd'hui, mais un doute subsiste.
  • balise NOEMBED Insérer le plus possible de texte (sans spammer, c'est-à-dire sans répétition abusive de mots clés), mais cette balise n'est pas conforme aux recommandations du W3C. Attention au blacklistage par sa mauvaise utilisation, avec l'utilisation de mots clefs sans rapport au contenu de fichier Flash.
  • balise OBJECT avec du texte alternatif, qui peut aussi inclure des liens,
  • balise ALT du fichier SWF remplie.

Les alternatives pour référencer un site en Flash:

  • Il faut proposer en ligne une version HTML du site avec du contenu texte.
  • Lier des fichiers textes (txt, PDF,...) au site Flash (voir Utilisation du texte dans Flash )
  • Passer par les offres de positionnement publicitaire comme Adwords pour être certain d'être en tête de liste.
  • intégrer l'animation avec swfObject.
  • Utilisation de swfAddres pour l'accès direct. 

Certains moteurs de recherche indexent le Flash

Certains moteurs commencent à s'intéresser au problème de l'indexation des documents Flash d'une part pour se démarquer de leurs concurrents, et d'autre part pour rendre "visibles" tous les sites créés uniquement en Flash. Mais attention de ne pas vectoriser les polices utilisées. Un choix est à faire au moment de la conception.

Fonctionnement texte dans Flash : statique, saisie, dynamique, TXT, XML

Le logiciel Flash peut être utilisé à plusieurs niveaux :

  • on peut créer une animation simple pour une page web. Cette animation peut ou non contenir des éléments interactifs internes,
  • on peut insérer une animation interactive dans une page web et programmer son interactivité pour qu'elle modifie le contenu de la page. C'est le cas des menus interactifs en Flash par exemple,
  • on peut également créer un site entièrement en Flash. Dans ce cas la première animation du projet sera placée dans une page HTML nommée « index.htm ». Cette page - ainsi que l'ensemble des fichiers qui composent le site - seront mis en ligne sur le serveur contenant le projet.

Utilisation du texte dans le logiciel Flash :

Le logiciel Flash propose un outil texte qui permet de créer des textes de 3 natures différentes :
  • texte statique : il s'agit d'affichage de texte standard (éléments « graphiques »),
  • texte de saisie : cela permet à l'utilisateur d'entrer des informations qui pourront être traitées par le programme,
  • texte dynamique : cela permet au programme d'afficher des informations à l'utilisateur.

On peut également travailler le texte de façon beaucoup plus dynamique :

  • on peut lier des fichiers textes.txt externes qui apparaîtront dans des champs textes dynamiques à l'intérieur de l'application Flash,
  • on peut utiliser des langages de programmation et des bases de données qui pourront dialoguer avec le logiciel Flash : XML, php / mysql...
Ces deux dernières techniques facilitent énormément les mises à jour de contenu. On les utilisera pour la gestion de contenu d'un site Flash en CMS.

mardi 24 novembre 2009

Comparatif comparaison Flash et Director

Présentation du logiciel Flash et comparaison avec le logiciel Director


Le logiciel Flash permet de créer des fichiers auto-executable au format PC et Mac . Ces publications principales sont sur Internet. Mais il est aussi maintenant très facile de créer une application off-line avec Flash. Au lieu de créer une page web « index » contenant la première animation du projet, on va créer un fichier auto-exécutable à partir de cette première animation. Sur PC cet « auto-exe » sera très facilement associé à un fichier « autorun » qui permet de lancer automatiquement la lecture de l'application lorsque l'on insère le CD-Rom dans le lecteur. Un projet de CD-Rom en Flash est construit exactement de la même manière qu'un projet on-line.
Un autre logiciel du même éditeur (Macromedia) est dédié à la fabrication de CD-Rom. Il s'agit de Director.
Le logiciel Director est un logiciel auteur qui possède aussi un langage de programmation natif, le « LINGO ». C'est un langage très intuitif, avec une syntaxe beaucoup moins stricte que d'autres langages. Director n'est pas un logiciel d'animation, mais plutôt un assembleur de médias.

Director est dédié aux médias « lourds » : bitmaps plein écran en haute qualité, ce logiciel est particulièrement performant pour la gestion de la vidéo « plein écran ».
Jusqu'aux versions récentes de Flash (à partir de la version 8 essentiellement), Director gardait un avantage certain pour l'utilisation et le pilotage de la vidéo. Depuis que Adobe à racheter Macromedia et depuis les possibilités de lecture de vidéo externe en streaming, Flash tend à supplanter Director sur ce marché.

De plus Director est un outil beaucoup plus couteux que Flash ce qui a également pour conséquence de réduire son implantation. Enfin il y a beaucoup moins de personnes formées sur Director que sur Flash, car Flash s'est beaucoup démocratisé depuis quelques années.

La tendance générale est de plus en plus à développer les applications off-line sous Flash.

dimanche 22 novembre 2009

Flash function(arguments) instructions. Les variables à portée locale et globale en AS2

Créer une fonction ActionScript 2 dans le logiciel Flash

Les fonctions sont des scripts nommés et utilisables en appelant simplement leur nom.
Les fonctions peuvent être créées dans un script de scénario, ou bien dans un script de bouton ou de clip.
Pour déclarer une fonction :
function nomFonction (arguments){
instructions ;
}
Ou bien (équivalent)
nomFonction = function(arguments){
instructions ;
}
Il peut y avoir un grand nombre de lignes d'instructions. Lorsque vous faites ensuite appel à cette fonction par son nom, les instructions définies ici seront exécutées (une fonction n’a pas nécessairement de paramètres à définir).

La portée des variables et des fonctions dans Flash

Comme de nombreux langages de programmation ActionScript propose 2 niveaux de portée des variables et des fonctions.
Une variable est une portion de mémoire « nommée » dans laquelle le programme peut stocker une information. Le nom de la variable permet ensuite d'utiliser la valeur qu'elle contient au moment précis où on l'appelle.
Les variables, aussi bien que les fonctions ont une portée locale ou globale, selon la façon dont on les a déclaré.
  • La portée locale correspond à une reconnaissance réduite à un seul script. Une variable ou une fonction locales seront reconnues seulement au sein du script dans lequel elles ont été créées.
  • La portée globale permet d'étendre cette reconnaissance à l'ensemble d'une animation ou d'un projet, c'est à dire sur plusieurs animations qui dialogueront entre elles (voir « construire un projet dans Flash »).
 Pour déclarer une variable ou une fonction comme globale il faut et il suffit d'ajouter la formule « _globale.» devant son nom (voir ce qui suit).

Créer un fonction globale dans Flash

Pour créer une fonction globale au lieu de la déclarer ainsi :
nomFonction = function(arguments){
instructions ;
}
Il faut la déclarer ainsi :
_global.nomFonction = function(arguments){
instructions ;
}
Les fonctions sont la plupart du temps créées pour être réutilisées dans un autre script, elles sont donc la plupart du temps globales.

samedi 21 novembre 2009

Actionscript AS2 _global.maFonction function(arguments)

Le code externalisé dans le logiciel Flash

Le principe des codes non compilés dans le logiciel Flash est déroutant pour les programmeurs. Il correspond mieux aux utilisateurs de Flash non programmeurs de formation (graphistes, animateurs). Cette philosophie de Flash a permis son succès : un nombre très important d'utilisateurs a pu s'approprier le logiciel, sans posséder nécessairement un niveau de programmation élevé.

Cependant - pour répondre à l'utilisation grandissante de l'outil par les programmeurs de formation, et pour leur offrir des outils de programmation plus proches de leur philosophie - Flash s'est adapté en proposant des possibilités de créer du code « compilé », c'est-à-dire de regrouper le plus possible le code dans des fichiers distincts. On peut ainsi créer des fichiers contenant uniquement des scripts ActionScript et les appeler par insert dans des scripts de scénarios.

Procédure d'un code externe dans le logiciel Flash

  • pour créer le fichier de code : menu nouveau / fichier ActionScript ce qui créé un fichier : monCode.as dans lequel vous allez déclarer les fonctions comme globales. Ce fichier contiendra uniquement du code ActionScript,
  • dans l'autre fichier FLA dans lequel vous voulez inclure le code, vous ajouterez la ligne de commande :
#include "cheminComplet/monCode.as"
  • ensuite, soit une fonction globale déclarée dans ce fichier, vous pourrez la rappeler de n’importe quel endroit du projet.Soit la fonction globale « maFonction » déclarée dans un fichier de code monCode.as :
_global.maFonction= function(arguments){
instructions ;
}
  •  Le fichier monCode.as sera ensuite inclus dans le projet par :
        #include "cheminComplet/monCode.as"
On pourra ensuite appeler et faire exécuter la fonction contenue dans ce code.

mercredi 18 novembre 2009

LoadMovieNum Construire un projet actionscript AS2

Construire un projet dans le logiciel Flash en ActionScript AS2

Il y a plusieurs têtes de lecture dans Flash, au niveau de chaque animation (tête de lecture de la scène principale, des clips...) mais on peut également superposer plusieurs animations (fichiers « swf »). C’est le principe du travail avec les niveaux ou « _level ».
Il est très utile de travailler sur plusieurs niveaux lorsqu’on réalise un projet important dans Flash. Cela permet de morceler le poids global du projet en animations plus légères. De ce fait l’utilisateur peut rapidement visualiser une partie du contenu en attendant le chargement des autres niveaux. Chaque niveau peut comporter une animation de contrôle du chargement de son contenu. Les niveaux peuvent aussi contenir des animations contenant seulement du son ou de la vidéo.
Le projet Flash sera « lancé » par la première animation nommée par exemple « lanceur.swf », qui sera chargée par défaut au niveau 0.
Le niveau 0 est opaque, il a pour couleur de fond la couleur de l'animation qui y est chargée. C’est donc la couleur de fond de la première animation, chargée par défaut au niveau 0, qui détermine la couleur de fond du projet. Les autres niveaux sont des couches dont le fond est transparent. Lorsqu’on travaille avec les niveaux le fond des animations chargées au-dessus du niveau 0 n’existe pas.
Les animations chargées sur des niveaux différents conservent leur interactivité. Ce principe permet d’activer simultanément les interactivités présentes sur toutes les couches chargées.
Principe d'organisation d'un projet Flash
ATTENTION :
On peut charger une seule animation « .swf » par niveau à un instant donné.

On dispose de 16 000 niveaux dans Flash. Il n’est pas nécessaire d’utiliser les niveaux successifs, il est plutôt recommandé de laisser des niveaux libres pour pouvoir intercaler des animations en cas de besoin.

Les éléments placés sur les couches supérieures peuvent masquer des éléments interactifs.

Conduite de projet d'un projet Flash

Pour travailler avec le principe des niveaux il est indispensable de noter par écrit la distribution des niveaux que l’on décide par avance, il s’agit d’un tableau d’affectation des niveaux :

animation

contenu

niveau

lanceur.swf

Code permettant de charger les premières animations du projet

0

fond.swf

rectangle dégradé se fondant partiellement dans le fond, un bouton « quitter », les deux éléments apparaissant en fondu d’apparition

10

contenu.swf

2 textes : chapitre 1 et chapitre 2

20

navigation.swf

2 boutons, chapitre 1 et chapitre 2 pour afficher les 2 textes de « contenu.swf »

10
Il est également indispensable, comme dans tout projet Multimédia ou informatique, de déterminer auparavant l'arborescence des fichiers:
Arborescence d'un projet Flash

Exemple de construction d’un projet de cédérom développé en Flash

Au premier niveau:

  • on trouve, en plus du fichier « lanceur.swf » les éléments pour lancer le projet: « projet.exe » qui est l’auto-exécutable du projet (qui ne nécessite AUCUNE application, lecteur ou plug-in pour fonctionner).
  • « autorun.inf » permet de lancer automatiquement le projet sur PC (à l’insertion du cédérom dans le lecteur)
  • « icone.ico » permet d’afficher une icône sur le bureau de l’utilisateur , personnalisation du raccourci du lecteur cédérom (géré par « autorun.inf »)

Au deuxième niveau on trouve, le contenu du projet.


Le script Level, les différentes instructions ActionScript utilisées :

  • Pour charger une animation sur un niveau (_level), on utilise le script: loadMovieNum(«chemin/mon_anim.swf », n°_niveau);

    Script pour cet exemple

    loadMovieNum("DATA/CONTENU/contenu.swf",20);

  • Pour décharger un niveau :
    unloadmovieNum(n°_niveau);
    « n°_niveau» correspond à un numéro de couche. Il y en a 16 000 disponibles. 
REMARQUES
Pour décharger un niveau, inutile de préciser l'animation qui s'y trouve, mais seulement le numéro du niveau à décharger.

Si vous chargez une animation sur un niveau en comportant déjà une, la nouvelle animation remplace la précédente

CONTENU des ANIMATIONS.fla dans cet exemple.

Le lanceur sert simplement à charger les animations aux niveaux pré-déterminés.
Le fond contient un rectangle sans contour rempli d’un dégradé semi-opaque, et un bouton placé en bas à droite permettant de quitter l’application.
Le contenu contient deux textes différents correspondant à deux chapitres différents. Ces textes sont placés sur des images repérées et nommées. Ce fichier est calé sur une image sans contenu au départ, afin qu’il soit invisible tant que l’utilisateur n’a pas cliqué sur l’un des boutons « chapitres ».
La navigation contient deux boutons permettant de faire varier l’affichage des textes du contenu.

ATTENTION :
Toutes les animations du projet doivent avoir les mêmes caractéristiques : format de scène, cadence et couleur de fond.


Création du fichier Flash lanceur.fla

  • Nouvelle animation, choisir une couleur de fond différente du blanc.
  • Nommez le calque « actions »
  • Script d’image sur la première image :
loadMovieNum("DATA/FOND/fond.swf",10);
loadMovieNum("DATA/CONTENU/contenu.swf",20);
loadMovieNum("DATA/NAVIGATION/navigation.swf",100);
  •  Enregistrez le fichier : lanceur.fla dans le dossier « PROJET ». Publiez l’animation : CTRL + ENTER pour créer le fichier « lanceur.swf ».
  • Un message d’erreur apparaît car Flash ne trouve pas les 3 animations car elles n’existent pas encore, c’est donc normal, n’en tenez pas compte.

ATTENTION : 
  • pour tester le passage entre les différents niveaux il faut impérativement : - publier chaque animation (afin de créer le fichier swf à charger),
  • repartir du lanceur pour tester (puisque c’est l’animation qui affecte les niveaux).

Création du fichier Flash intro.fla 

  • « Enregistrez-sous » lanceur pour créer « fond.fla », dans le dossier DATA/FOND.
  • Remplacez le script de la première image du scénario par l’action « stop() ; ».
  • Ajoutez 2 calques sous le calque « actions ».
  • Nommez le premier calque « fond ». Tracez-y un rectangle sans contour rempli d’un dégradé linéaire blanc/noir.
  • Modifiez le dégradé pour que le blanc soit en partie transparent (panneau mélangeur, diminuez la valeur d’alpha du blanc).
  • Nommez l’autre calque « bouton ». Ouvrez la bibliothèque des boutons flash. Faites-glisser le bouton de votre choix sur la scène. Positionnez-le en bas à droite du rectangle.
  • Sélectionnez le bouton sur la scène et affectez-lui le script suivant :
on (release) {
    fscommand("quit", "");
}
  • ou bien nommez l'occurrence du bouton « bt_quit » (par l'inspecteur de propriétés) et créez un script sur le calque action :
bt_quit.onRelease = function(){
    fscommand("quit", "");
}
  • Revenez dans « lanceur » et testez, votre fond doit apparaître. Un message d’erreur signale que 2 animations n’ont toujours pas été trouvées, ce qui est normal, elles n’existent pas encore, par contre « fond.swf » a été trouvée.
ATTENTION
Vous ne pouvez pas tester le bouton quitter (il faut pour cela créer l’auto-exécutable).
Tapez CTRL + ENTER pour publier l’animation.

Création du fichier Flash contenu.fla

  • Repartez du lanceur, enregistrez-sous « contenu.fla » dans le dossier DATA/CONTENU.
  • Remplacez le script de la première image du scénario par une action « stop() ; ».
  • Créez 2 nouveaux calques, placés en-dessous du précédent.
  • Nommez le second « label », il servira à nommer vos images.
  • Nommez le troisième (placé en-dessous) : « textes ».
  • Ne placez aucun contenu sur la première image-clé de ces calques.
  • Ajoutez une image-clé à la seconde image du scénario (touche F6), sur les 3 calques simultanément. La première image-clé restant vide.
A cette image 2 :
  • Ajoutez une action « stop() ; » sur le calque « actions »
  • Sur le calque « label » nommez l’image « C1 », elle servira de repère au texte du chapitre 1.
  • Sélectionnez l’image-clé du calque « texte » (toujours à l’image 2) et tapez sur la scène un texte de repérage « chapitre 1 ».
  • Sélectionnez simultanément les images des 3 calques à l’image 10, créez une image-clé (F6).
A cette image 10 :
  • Ajoutez une action « stop() ; » sur le calque « actions »
  • Sur le calque « label » nommez l’ image « C2 », elle servira de repère au texte du chapitre 2.
  • Sélectionnez l’image-clé du calque « texte » (toujours à l’image 10) et tapez sur la scène un texte de repérage « chapitre 2 ».
  • CTRL + ENTER pour publier.

Création du fichier Flash navigation.fla

  • « Enregistrez-sous » lanceur pour créer « navigation.fla », dans le dossier DATA/NAVIGATION.
  • Remplacez le script de la première image du scénario par une action « stop() ; ».
  • Ajoutez 2 calques sous le calque « actions ».
  • Nommez le premier calque «chap 1 », et le second «chap 2 ».
  • Sélectionnez le calque chap1, ouvrez la bibliothèque des boutons flash. Faites glisser le bouton de votre choix sur la scène.
  • Répétez l’opération pour l’autre calque avec un autre bouton (d’une autre couleur), et placez-le à droite du précédent.
  • Ajoutez le script suivant sur le bouton du calque chap1 :
on (release) {
    _level20.gotoAndStop("C1");
}
ou bien nommez l'occurrence du bouton « bt_chap1» (par l'inspecteur de propriétés) et créez un script sur le calque action :
bt_chap1.onRelease = function(){
    _level20.gotoAndStop("C1");
}
Ajoutez le script suivant sur le bouton du calque chap2 :Copiez-collez le script précédent pour aller plus vite.

on (release) {
    _level20.gotoAndStop("C2");
}
ou bien nommez l'occurrence du bouton « bt_chap2» (par l'inspecteur de propriétés) et créez un script sur le calque action :
bt_chap2.onRelease = function(){
    _level20.gotoAndStop("C2");
}
 CTRL + ENTER pour publier. 
Remarque :
Pour piloter un autre niveau on utilise le principe du chemin absolu, mais en remplaçant « _root », la racine ou scène principale de l’animation, par « _levelX », représentant la racine du niveau à piloter.

Repartez du lanceur et testez. Seul le bouton « quitter » ne fonctionne pas.

Création de l’auto-executable

  • Repartez du lanceur.
  • Dans paramètres de publication cochez seulement « projection windows ». Publiez (vous pouvez modifier le nom du fichier si vous décochez « utiliser les noms par défaut »).
  • Quittez Flash et ouvrez l’auto-exécutable (qui se trouve dans « PROJET », au même niveau que « lanceur »).
  • Tout doit fonctionner, y compris le bouton « quitter ».
  • Dans votre projet final vous enlèverez tous les fichiers « .fla » Ainsi que le « lanceur.swf ».