11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour !!

Alors un rapide descriptif de mon problème.

Lorsqu'on va sur ma page principale avec IE6/7 à cette adresse : www.korx-crew.com , la page se charge correctement et la fonction AJAX fonctionne sur mes articles puisqu'elle me charge le contenu correctement. Seulement une fois avoir utilisé une première fois un des liens situés dans les articles, ces derniers ne fonctionnent plus avec la class="load" et sont chargés en pleine page. Je m'explique.

J'ai un squelette spip sommaire.html dans lequel je fais un include d'un squelette news.html ( c'est ma page principale sur laquelle on arrive ). Quand je clique sur les liens situés dans news.html pour la première fois, ces derniers fonctionnent avec AJAX et me chargent un autre squelette type article.html ou encore rubrique.html en remplacement de news.html. Tout fonctionne bien sous firefox ou opera puisqu'une fois sur un de ces "nouveau" squelettes, je peux revenir en arrière en utilisant les liens et en rechargeant donc uniquement une partie de ma page. Le souci c'est que celà ne fonctionne pas sous IE6/7.

Une fois que j'ai affiché article.html ou rubrique.html, les liens inclus dans ces 2 squelettes ne prennent plus en compte la class="load" permettant l'utilisation d'ajax et le rechargement d'une seule partie de la page, ce qui fait que IE me charge le lien avec le résultat en pleine page. Le mieux est de tester pour voir ce dont je veux parler.

Ca fait comme si IE ne prenait pas en compte le JS chargé dans mes squelettes.

Cdt

Nicolas

PS: désolé si mon explication est confuse Smiley lol , je ne suis pas encore réveillé et dans ma tête celà semble pourtant tellement évident MDR Smiley lol
Modifié par Klesk (30 Jul 2008 - 12:01)
Bonjour,

Ah oui, tiens.

En dehors des questions strictement techniques: pourquoi donc l'accès aux pages complètes (avec l'interface du site et pas juste un contenu nu) est-il conditionné à l'utilisation de Javascript?

Ne faudrait-il pas deux jeux de squelettes:
- des squelettes produisant des pages complètes, vers lesquels les liens pointeront;
- des squelettes produisant un contenu nu, appelés uniquement en Ajax?

Plus généralement, je ne suis pas sûr qu'une utilisation aussi massive d'Ajax soit recommandée pour un site axé contenus.
Le second squelette pour les non utilisateurs de javascript est prévu au programme mais pas encore en ligne. Pour le moment je me familiarise avec AJAX et l'utilisation de JQuery.

J'essai donc de comprendre pourquoi ça ne fonctionne pas correctement sous IE 6/7.

Cdt
Klesk a écrit :
Le second squelette pour les non utilisateurs de javascript est prévu au programme mais pas encore en ligne. Pour le moment je me familiarise avec AJAX et l'utilisation de JQuery.

J'aurais travaillé dans l'ordre inverse mais du moment qu'on y pense... Smiley cligne

Pour le soucis avec IE je laisse les connaisseurs de JQuery se pencher sur la question.
Pour tout dire faire un squelette non AJAX est une simple formalité c'est pour ça que ce n'est pas ma priorité Smiley smile . Mais ton avi m'intéresse aussi car tes posts sont en général bien argumentés et plein de sens.
Alors mon avis sur la question:

Le site en question est un site orienté contenus (texte, images, liens hypertexte vers d'autres contenus, etc.), et non pas une application web. Partant, l'essentiel pour le visiteur est d'avoir accès au contenu de manière efficace et autant que possible agréable.

L'utilisation intensive d'Ajax dans ce cas me semble très largement superflue. Elle peut même être problématique. Par exemple, si le temps de latence avant le chargement d'un nouveau contenu est un peu important (serveur qui met quelques secondes à répondre, ou carrément serveur à la peine...), il n'y a pas d'indice clair et familier qui indiquerait qu'un nouveau contenu est en train d'être chargé. Avec un lien hypertexte simple, on obtient un comportement pas très glamour (mais honnêtement, le visiteur s'en fiche un peu...) mais familier: plusieurs éléments de l'interface indiquent un chargement en cours, voire la page devient blanche en attendant le chargement de la nouvelle page.

Je ne sais pas quel est l'avis des ergonomes du Web sur la question, mais pour le chargement d'un contenu complet (assimilé à un changement de page) on déconseille plutôt l'approche full-Ajax, qui à mon avis n'apporte strictement rien.
Ajax est intéressant essentiellement, sur un site orienté contenus/articles, pour les interactions avec certains éléments périphériques au contenu principal (un calendrier des articles, peut-être la récupération de commentaires, ce genre de choses).

Maintenant, il y a la question de l'accessibilité. Et là, soit on s'en fiche (ce qui serait une erreur, du moins dans une certaine mesure, mais admettons), soit on en tire la conclusion suivante: il faut absolument, à la base, un accès possible sans Javascript aux contenus et fonctionnalités principaux. Un site full-Ajax n'appliquant pas les principes de dégradation gracieuse et surtout d'amélioration progressive ne sera pas accessible, point.

Bref, pour ce genre de site je travaillerais ainsi:
- construire une version accessible sans Javascript (loin d'être indispensable ici pour l'accès aux contenus);
- me poser sérieusement la question de l'utilité de fonctionnalités Ajax, afin de savoir s'il y a un intérêt réel à en utiliser, et pour quelles choses exactement;
- implémenter les fonctionnalités Ajax/javascript en surcouche se dégradant correctement.
Bonjour,

Il me semble que tu as des problèmes également avec Firefox, voila ce que j'ai fait :

clic sur un sujet, le contenu est rafraichi puis retour à l'accueil par le lien du fil d'ariane puis clic le bouton symbolisant la page 2. On a alors une erreur javascript (jQuery n'a pas l'air d'être chargé) et le contenu de la page sans style.
Modifié par dunjl (26 Dec 2007 - 16:02)
@dunjl: j'ai connaissance du problème qui est lié uniquement au fait que je n'ai pas appliqué la classe "load" aux liens de ma pagination, donc rien de bien méchant en soit.

@Florent:

- Ma priorité n°1 est que le site soit accessible à tous et sur tout browser il va donc de soit que je prévois une version non javascript du site, car l'utilisation de javascript rend la navigation trop dépendante de cette technologie.

- Concernant le temps de chargement du contenu via AJAX, il est prévu l'ajout d'un loader symbolisant le chargement et indiquant que le contenu est en cours de chargement.

- Mon envi de m'intéresser à AJAX et plus précisément à la librairie JQuery inclue dans Spip vient du fait que le site sous sa forme non javascript me force à revoir l'affichage du contenu sous un autre angle car mon anim flash à droite se rechargera tout le temps ce qui est non esthétique au possible et très chiant visuellement et surtout pas cohérent avec le principe de cette anim flash qui est de pouvoir visualiser des affiches d'évènements tout en n'en faisant pas un contenu à part entière (donc plus un élément de "déco").

Donc si tu connais un moyen me permettant de ne pas recharger systèmatiquement cette anim à chaque changement de page je suis preneur et je mettrai de coté de suite AJAX dont l'utilisation pour moi n'était liée qu'à cette unique fonction.

PS: Je trouve JQuery très intéressant en tout cas Smiley smile et ça m'aura au moins permis de mettre le pied à l'étrillé concernant AJAX.

Cdt
Hello,

Je n'avais pas pris en compte la contrainte de l'animation Flash (je pensais qu'elle n'était présente que sur la page d'accueil).
Si cette animation est une composante majeure du site, ça vaut le coup de proposer un rendu optimal avec Ajax et moins bon mais toujours correct sans.
Elle n'en est pas une Smiley smile . Mais j'aime bien !! Smiley lol

Je vais suivre tes conseils et faire d'abord la version non javascript. Je ne vais laisser l'anim que sur la page d'accueil ce qui évitera les rechargements.

Je verrai plus tard pour l'utilisation d'ajax à grande échelle Smiley smile . Je garde quand même mon code source sous le coude.

Je suis toujours curieux quand de trouver une solution au problème évoqué plus haut !! Si quelqu'un connaissant JQuery ou ajax passe par là !!
Modifié par Klesk (27 Dec 2007 - 09:18)