Problème texte Flash sous DW CS3

Bonjour,

Je viens de faire un petit lifting de mon site et c'est la première fois que j'utilise un modèle et pas sans mal. Mon problème urgent c'est que je n'arrive plus à faire apparaitre un de mes onglets "STAGES" qui est un "texte flash". Mes autres liens en texte flash son ok.
Mais là j'ai tout essayé, effacé sur le modèle, en local, en distant, remis, refait etc... là j'ai été obligé de mettre provisoirement le lien en texte normal.

J'ai pourtant dans mon dossier Template le modèle et tout les fichiers .swf qui sont aussi copiés dans le fichier racine du site avec les pages .html

Mon site web : http://www.artango.ch/
Je suis nouveau sur ce forum et c'est mon tout premier post et je me suis déjà présenté dans la rubrique dédiée si jamais.

Qui a une idée ??

Merci

A mon avis le problème est beaucoup plus simple qu'il n'en parait, sur ton site, le lien "stages" est imbriqué dans les autres, ce qui ne devrait pas poser de soucis étant donné qu'il est entouré par d'autres liens similaires.

Essaye de recommencer à zéro, en ajoutant un par un tes liens, et voir à partir de quel moment ça pose problème.

Autre solution, si cette méthode te pose trop de soucis, tu pourrait envisager de le créer en html et css simple, ou en faisant des images, car je ne comprend vraiment pas l'utilité d'un menu flash pour celui qui tu veut, c'est un simple changement de couleurs au survol. Et si tu veux conserver le lien en texte, avec une police autre que celles qui sont proposées, je te donnerait ma méthode qui fonctionne sur tout les navigateurs ( sauf IE )

Salut Artango,
J'espère que tu vas bien.

Je viens de jeter un coup d'oeil sur ton site et en ce qui concerne l'alignement de tes éléments flash, il faut savoir que le fait de mettre des éléments dans un tableau ne garanti en rien un alignement identique.

Si tu veux un alignement identique pour toutes tes cellules, tu dois normalement définir leur position dans la première balise de ton élément cellule <td>

Exemple, si tu as ce genre de structure :

<table>
	<tr>
		<td><!-- Ici mon contenu 1 --></td>
		<td><!-- Ici mon contenu 2 --></td>
		<td><!-- Ici mon contenu 3 --></td>
		<td><!-- Ici mon contenu 4 --></td>
		<td><!-- Ici mon contenu x --></td>
	</tr>
</table>

Et si tu veux que le contenu de tes cellules (td) soit en haut de cellule et centrer (horizontalement) il va falloir que tu rajoute un attribut valign dans ta balise td pour positionner le contenu de ta cellule en haut et un attribut align pour centrer le contenu de ta cellule... ce qui te donnerais :

<table>
	<tr>
		<td valign="top" align="center"><!-- Ici mon contenu 1 --></td>
		<td valign="top" align="center"><!-- Ici mon contenu 2 --></td>
		<td valign="top" align="center"><!-- Ici mon contenu 3 --></td>
		<td valign="top" align="center"><!-- Ici mon contenu 4 --></td>
		<td valign="top" align="center"><!-- Ici mon contenu x --></td>
	</tr>
</table>

Tu peux aussi arriver au même résultat en css avec un code dans le genre :

table tr td {
	text-align: center;
	vertical-align: top;
}

Tu peux en savoir plus sur les tableaux et la manière de les styler en consultant cet article :
http://openweb.eu.org/articles/tableaux_css

Personnellement si je peux te donner un conseil, ce serait de suivre le conseil de Zardoz et de faire ton menu en CSS plutôt qu'en flash car dans ton cas le flash n'apporte pas grand chose à ton menu.

De plus Dreamweaver génère souvent beaucoup de code inutile, et du coup ça devient totalement incohérent.

Par exemple dans ton menu, si tu regarde le code générer sur ta page tantôt ton flash est contenu dans une <div> elle-même contenu dans une cellule <td>, tantôt un autre flash est contenu dans une balise <a> elle-même contenu dans une balise <p> elle même contenu dans une <div> elle-meme contenu dans un <td> etc....

C'est totalement incohérent et du coup ça n'a plus de sens.

Donc voilà, je pense que c'est préférable de faire ton menu en CSS, ça te prendra 5 minutes à tout casser, et si tu veux un coup de main, on peut toujours t'en filer un...

Voili voilà,
Peace

++
Miister Tii

Hello @tous
Plus spécialement Artango

Un exemple de script avec style. Tout en respectant ton idée de base : les tableaux et les objets Flash.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Style Onglet Flash Texte</title>
<style type="text/css">
body { color:#333; font-family:Arial, sans-serif; font-size:1.0em; margin:0; padding:0; }
div#globale { width:1000px; height:auto; margin:0 auto; border:2px solid #000; padding:5px; margin-top:5px; }
table { border:1px solid #ccc; width:650px; height:auto; }
h1 { color:#660; font-size:1.1em; }
span { color:#660000; font-style:italic; }
hr { color:#fff; width:1000px; }
td { border:2px solid #660000; text-align:center; height:auto; padding-top:9px; }
p { color:#444; font-size:0.8em; width:650px; text-align:justify; }
</style>
</head>

<body>
<div id="globale">
<table>
<tr>
  <td>
  <object type="application/x-shockwave-flash" data="onglet1.swf" width="56" height="19">
    <param name="movie" value="onglet1.swf" />
    <param name="wmode" value="transparent" />
    <param name="quality" value="high" />
  </object>
  </td>

  <td>
  <object type="application/x-shockwave-flash" data="onglet2.swf" width="56" height="19">
    <param name="movie" value="onglet2.swf" />
    <param name="wmode" value="transparent" />
    <param name="quality" value="high" />
  </object>
  </td>

  <td>
  <object type="application/x-shockwave-flash" data="onglet3.swf" width="56" height="19">
    <param name="movie" value="onglet3.swf" />
    <param name="wmode" value="transparent" />
    <param name="quality" value="high" />
  </object>
  </td>
  <td>
  <object type="application/x-shockwave-flash" data="onglet4.swf" width="56" height="19">
    <param name="movie" value="onglet4.swf" />
    <param name="wmode" value="transparent" />
    <param name="quality" value="high" />
  </object>
  </td>
</tr>
</table>
</div>
</body>
</html>

Remarque la définition de « object ». Il n'y a aucun script « AC_FL_RunContent ». Avec les deux attributs « type » et « data ». Ce script est entièrement opérationnelle, valide au w3c et multi-navigateur. De plus celui-ci est mémorisable. Nous pouvons l'écrire de mémoire. Ce qui est rarement le cas avec « classid ». Les liens Flash sont effectif même si le script AC_FL_RunContent n'est pas présent.

Tu n'as pas à te servir de la balise « a href » puisque tu peut le générer en faisant ton flash text avec DW. En effet tu as un champ « liens » que tu peux remplir. Tu renseigne ce champ avec le lien de la page que tu veux atteindre : genre « cours.html ».

Dans ton exemple de code ici en haut tu fais HTML tout court. Il faut styler en CSS. D'ailleurs personnellement je le ferais au complet en CSS, j'oublirais Flash.

Voici une capture plus complète avec quelques propos perso sur le sujet des scripts et du web design.



PS : évidemment on place le CSS en externe.

++
Modifié par zardoz (14 Nov 2010 - 08:23)

Un grand merci c'est magnifique effectivement un cadre apparait mais...

Là je viens d'essayer d'insérer ce code dans ma page et sa à changer tous les style que j'avais défini; couleurs de fond, couleurs de texte tailles et couleurs des textes, et tout les positionnement choisi sont out, il n'y a plus aucune mise en forme ! Pourtant j'ai placé le code que tu m'as donné juste en haut, juste après "title". J'ai dû faire un truc pas très catholique mais lequel ???

Merci à tous !

Re...
Salut Artango,
J'espère que ça va.

En fait Zardoz ne te demandais pas de prendre son code mais plutôt de t'en inspirer pour rectifier le tien....

Tu ne veux pas tenter le menu en CSS pure ?

Bonsoir,

Je ne comprends pas ton choix d'utiliser flash pour la navigation de ton site.

Salut @tous

Avec 26 erreurs à la validation presque toutes rattachées à la balise « embed » de l'objet Flash.

Nous savons par exemple qu'un lien fait en Flash ne permet pas d'être renseigner sur la barre d'état de nos navigateurs. Sauf évidemment si tu utilise « a href » sur les objets Flash. Ça ressemble plus à un astuce pour renseigner la barre d'état.

Pas très légale d'ailleurs. Ce qui à mon avis ne fait pas très propre en écriture de script.
Vaut mieux utilisé CSS. C'est tellement plus simple et plus performant.

Une mise à jour de ton menu, tel qu'il est présentement exigera de lancer ton logiciel DW, générer un autre objet Flash, l'insérer dans la zone HTML et ouf . . . t'assurer que tout est fonctionnelle.

En HTML on change la valeur et/ou : on ajoute/soustrait un élément. Le CSS étant déjà cibler, celui-ci agit directement.

Simple n'est-ce pas ?

++
Modifié par zardoz (15 Nov 2010 - 00:43)

Salut Mister Tii, oui j'ai voulu essayé avec le code que m'a donné Zardoz mais sa n'a effectivement pas fonctionné.

J'avoue être complètement dépassé. J'ai un niveau super -basique- par rapport à vous autres.

Jeanmark m'a posé la question du pourquoi est ce que je veux faire mes onglets en flash ? simplement car je peux choisir une police design que je ne pourrais utiliser autrement, sauf en faisant des fichiers images, c'est possible aussi, c'est vrais.

Mais dans le finalité le plus important pour moi c'est la qualité du référencement, donc si les police-flash et les tableau ne sont pas conseillés, je vais essayer de faire sa en "pur css" comme vous dite, et sa a l'air si simple à vous entendre !? LOL

Zardoz, effectivement il y a des tas d'erreur de validation !

Je viens d'essayer avec le lien que tu m'a donné concernant MaxDesign, sa me plais bien mais sa ne marche pas non plus. Je viens de tester sur une page vierge le code proposé tel quel mais sa ne me donne pas dutout le même rendu que sur le site de MaxDesign ?? est-ce qu'il faut séparé la partie CSS de la partie HTML ?? Je vois que sur DWcs3 on peut créer un fichier CSS, est-ce que c'est là que je dois mettre le code CSS ? et un fichier HTML pour le code HTML ? Mais comment ensuite je fais le lien entre les deux fichiers ???

Merci à tous, Jeanmark, Zardoz et Mister Tii !
Modifié par Artango (15 Nov 2010 - 16:24)

Hello Artango

La façon de cibler un fichier CSS est comme l'exemple suivant

<link rel="stylesheet" type="text/css" href="css/monStyle.css" />

Tu le place sous la balise <title> et </title>

Voici un exemple d'un fichier CSS qui sera cibler en externe

body
{ 
color:#333;
font-family:Arial, sans-serif;
font-size:1.0em;
margin:0;
padding:0;
}
/* Conteneur globale */
div#globale
{ 
width:100%;
height:auto;
overflow:hidden;
}
/* etc . . . */

Comme tu peut le remarquer il n'y a pas de balise <style></style> lorsque nous ciblons un fichier CSS en externe.

Quelques consignes lorsque nous sommes en apprentissage

1 ) Ne pas utilisé l'interface graphique de nos logiciels mais plutôt écrire les scripts en zone de code seulement.

2 ) Ne laissons pas les programmes logiciels décider pour nous. Décidons notre mise en page en placant des instructions que le programme logiciel devra obligatoirement exécuté.

3 ) Ne pas faire de copier/coller. Lorsque nous écrivons le code à partir de modèle pédagogique, nous ouvrons une large part à la compréhension des techniques de bases. Ce principe est d'autant plus important qu'il permet une compréhension profonde et un cheminement personnelle adéquat.

4 ) Établir un répertoire de test : un laboratoire d'expériences en quelque sorte. Ce genre permet de pouvoir échanger des scripts entre-nous et de les exécuter dans un environnement différent sans abimer nos travaux perso.

5 ) Et toutes idées perso pouvant favoriser un apprentissage sérieux.

Pour ce qui est du point No 1 : pensons à tous ceux et celles qui ne pourront pas ce payer un logiciel comme DW. Si ces gens font le choix d'un logiciel gratuit comme « Notepad ++ » ou encore « NetBeans », ils n'auront d'autre choix que d'écrire les scripts car ces logiciels n'ont pas d'interface graphique. Et croyez moi, même en apprentissage c'est beaucoup plus professionnel et favorise un apprentissage sérieux.

Pour ce qui est de tous ceux et celles qui ont des logiciels avec interface graphique n'utiliser que la zone de code. Oublier l'interface graphique, oublier tous les panneaux de configurations.

Tel que j'ai pu te connaitre Artango tu te place sous DW en zone graphique, utilisant les fenêtres de configurations. Mais crois moi qu'un nouveau document doit toujours être une feuille blanche « zone de code ». Et voilà. Nous sommes maître de notre apprentissage et des résultats.

Évidemment les propositions ici sont facultatif : uniquement suggérer.

++

Je te remercie, ce sont de précieuse information. Je suis completement d'accord avec toi. Le seul problème c'est que c'est pas mon métier et que ma profession libérale ne me laisse pas vraiment de temps pour apprendre la conception web (une école de danse), malheureusement car j'aimerais beaucoup avoir du temps et maitriser la conception de mon site de A à Z, pourquoi ? car je n'ai pas les moyen de me payer un webmaster ! alors je me débrouille dans l'urgence avec DW et je suis déjà content d'avoir sa. Je sais pas comment je ferais autrement sans site web, c'est ma plus grosse source de comm., ma vitrine.

Mais je vais essayer de suivre ton conseil, je sais pas si je vais avoir le temps mais j'ai bien envie d'essayer directement depuis un éditeur de texte. Et Joomla c'est bien ?

Encore merci pour ton esprit de synthèse, sa donne envie de s'y mettre AUTREMENT !

A +

Hello

Je ne saurais te parler de Joomla. Il s'agit d'un CMS open-source connu.
Cependant d'autres membres pourront sûrement, et mieux que moi, te conseiller sur les CMS.

L'avantage des CMS est qu'il peuvent diminuer l'impact du travail en développement. Les CMS sont flexible.
Dans ton cas ce serait une bonne idée d'utiliser un CMS. Quelques connaissances sont quand même essentielles avec les CMS : en particulier les bases en HTML et le CSS ( au minimum ) pour une mise en forme.

Les CMS sont aussi ouvert à des fonctionnalités plus pointus que tu comprendras au fur et à mesure de ton apprentissage. Toutefois le concept web ne s'arrête pas à la seule présentation esthétique et fonctionnelle. Chaque sujet exige un style particulier.

Inspire toi des sites qui traite du même sujet que toi ( l'enseignement de la danse ). C'est motivant.

Bonne continuation.

++

Salut Zardoz et merci.

Joomla je suis en train de voir mais c'est le temps qui manque. C'est le gros problème, le temps ! De pouvoir être au claire avec le html et css et surtout d'être capable de les utiliser avec pertience, sa demande beaucoup de temps.

Concernant l'exemple que tu m'a donné juste avant ce que je ne comprends pas comment le fichiers css va être trouvé par le fichier html, dans ton exemple il n'y a pas de chemin d'accès au fichiers, je pige pas... Et donc ce fichiers css est en fait un modèle c'est sa ?? ou uniquement une partie d'un modèle ?

J'ai regardé d'autre site web et j'en ai trouvé un qui me correspond beaucoup : http://www.todaviatango.com/

Peux-tu me dire si c'est la structure de ce site est difficile à faire ? bon ce site comporte du flash mais j'aime beaucoup l'idée d'utiliser des images comme support de fond au site sur un simple fond blanc, le flash n'est pas indispensable.

Merci à tous !