La Dofusotheque, encyclopédie sur Dofus

Bonsoir tout le monde!
Ayant réalisé un site sur le jeu DOFUS, et l'ayant assez bien entammé, j'aurais voulu avoir votre avis sur l'accessibilié, l'érgonomie, le design, la navigation.. Le site quoi.
Je me suis basé principalement sur les illustrations du jeu (avec l'aimable autorisation d'Ankama Games ) et sur me CSS (J'ai 8 ou 9 feuilles CSS lol ^^).
Si vous poouviez voir aussi ce qui est du code xHTML, CSS etc, ca m'aiderai, pour savoir si j'ai de bonnes bases ou pas du tout.

Je tiens a dire que j'ai au maximum essayé de rendre compatible mon site : FF, IE 6, 7, Opera, Safari... Presque tous les navigateurs.

Voila voila, j'espère avoir de commentaires instructifs, pour peut-être pouvoir améliorer des choses
Bonne soiré et merci d'avance ^^

--> http://ladofusotheque.net

EDIT: Ah, mon programmeur a lancé une maintenance, je n'était pas au courant, veuillez m'excuser :s Le post retardera du temps de la maintenance. Rlalal je poste au mauvais moment, ca commence bien lol ^^ Désolé :s
Modifié par Jerk (05 Nov 2007 - 21:28)

Bonsoir, vu que le site est de nouveau en ligne, je vous renvoie sur mon site : http://ladofusotheque.net.

J'attends vos commantaires, et excusez moi de ce premier post pas très professionnel ^^
Bonne soirée

Personne pour me conseiller et pour me donner son avis? ^^"

Niveau design : original et c'est vraiment appréciable, couleurs cohérentes. Ce qui est dommage par contre c'est que l'arbre fasse vraiment patchwork (mis là sans lien avec la page), une idée pour corriger ceci pourrait être de coller l'arbre au bas de page (et dans ce cas d'étoffer le feuillage).

Niveau accessibilité : une horreur ! aucun des liens du menu n'est accessible quand la css est désactivée. A noter également l'absence de lien vers l'index lors du clic sur le logo.

Appréciation générale : bonne idée ! code source à rebosser cependant
Modifié par AndL (08 Nov 2007 - 13:34)

Merci de ce commentaire constructif

Tout d'abord, pour l'arbre, il n'existe pas d'arbre dans le jeu que je puisse prendre en Screenshot pour découper, où il y a le haut de l'arbre, donc c'est embettant, sinon je trouve que de le poser en bas serait aussi une bonne idée, mais d'un côté, ca ferait bizarre de voir le haut de l'arbre non collé au bloc texte etc... Je vais y réfléchir quand même.
Je comptait refaire un screen du même arbre a un autre endroit, avec le paysage, ca fera plus cohérent je pense car la j'ai enlevé la verdure au pied, je n'aurais pas du... Une sorte de fondu, ou une vue sur Astrub d'Incarnam (lien 1, lien 2 & lien 3)
Ou alors le paysage dit ci dessus : lien 1, lien 2, lien 3

Il faut que je vois si des bénévoles peuvent me prendre des screens grands et d'assez bonne qualité (je ne joue plus, et je ne vais pas m'abonner pour si peut :s) que je puisse zommer et travailler dessus. Mais le paysage de fond me plait bien, avec un effet de fondu, je m'y vois deja

Sinon niveau accessibilité, a un moment pareil, il n'y a quasiment que du css et le site se base QUE sur le css et les images. S'il n'y a pas d'images ni de css je ne vois pas l'interet du site alors :s

Niveau code, qu'est-ce que je pourrais changer par exemple ? (xHTML/CSS)

Sinon merci de ce commentaire ^^
Modifié par Jerk (08 Nov 2007 - 18:45)

Jerk a écrit :


Sinon niveau accessibilité, a un moment pareil, il n'y a quasiment que du css et le site se base QUE sur le css et les images. S'il n'y a pas d'images ni de css je ne vois pas l'interet du site alors :s

Hum... utiliser le bon vieil élément HTML img, qui permet de doter chaque "image de contenu" d'une alternative textuelle pertinente ?

cadeau (fait sous Photoshop en 15sec) :
http://www.omicronlab.net/upload/upic-0839392001194571024.png
Modifié par AndL (09 Nov 2007 - 02:18)

Mais je l'ai deja ca, en psd même ^^
Ce que je voulais dire par la, c'est le même arbre non détouré avec le paysage au sol, ca tu ne peux pas l'avoir ^^
Merci quand même

J'ai finalement cherché seul sur la zone non abonée et j'ai trouvé un truc vraiment sympa. J'lai incrusté dans mon design et placé un petit effet translucide sur le div texte.
Vous en pensez quoi ?

http://ladofusotheque.net

Salut,

Je trouve que l'image en fond est floue et semble pixellisée par manque de définition. C'est dommage.

Le truc qui serait sympa serait que le baton du mage du dessin passe par dessus le fond marron, ca créerait une petite rupture graphique sympa

Etant donné que j'ai prélevé le screen en 4 fois zoom x2 sur le jeu, je ne peut pas le modifier en terme de pixellisation... Sauf si j'retouche tout sous photoshop ou que je trouve la méthode miracle mais bon... C'est le jeu j'y peut rien

Sinon, le mage, euh ouais, je sais pas comment faire ca mais j'vais voir ^^

J'avais cru comprendre que tu n'avais pas l'arbre en entier, autant pour moi
Modifié par AndL (12 Nov 2007 - 01:29)

Peut être envisager une réduction du poids des images en effectuant certaines dégradations négligeables ? Le poids de l'image de fond par exemple, qui dépasse les 400 Ko...
Modifié par original.defeat (12 Nov 2007 - 13:18)

AndL a écrit :
J'avais cru comprendre que tu n'avais pas l'arbre en entier, autant pour moi

Si, mais j'ai penché vers une autre idée & l'instant ou tu as pensé a l'idée de l'arbre posé en bas^^ En gros tu as compris

Sinon pour le poids des images, un conseil ? Je suis en qualité forte (9/12) sur photshop, si je réduit la qualité j'aurais moins de... qualité ^^

Salut,

Dans photoshop, tu as un lien "enregistrer pour le web, qui te permettra d'optimiser ton image au maximum, avec paramètres de dégradation d'images, multi vignettes de comparaisons et tout le toutim
Modifié par Mikachu (12 Nov 2007 - 16:56)

C'est bien ce que je fais pour créer tout mes png transparents, avant png8. Ca je sais merci, mais après pour réduire encore plus ?

A part bien régler le type d'image et la compression, rien de plus...
ah si, un café steuplé !

Bonsoir,

L'image de fond peut voir son poids se diviser par 7 sans trop de pertes. En partant que c'est une image de fond, vous pouvez faire jouer la dégradation.

En utilisant le bon format d'encodage pour les PNG, et en utilisant l'environnement dans lequel ils sont insérés, il est possible de diviser par 4 le poids de chaque PNG : exemple ci-dessous, "vite-fait" :

Page contenant les fichiers originaux :
457 Ko (468 710 octets)
10,7 Ko (11 056 octets)

Page contenant les fichiers modifiés :
64,8 Ko (66 382 octets)
2,40 Ko (2 467 octets)

[edit 17/11 : meilleure qualité du PNG]
Page contenant les fichiers modifiés (bis) :
64,8 Ko (66 382 octets)
3.36 Ko (3442 octets)
[/edit]

En approfondissant un peu le travail, on peut obtenir un rapport qualité/poids même meilleur. Vous pouvez consulter certains articles sur css-ig, et utiliser mon ScriptPNG qui contient divers programmes d'optimisation.
Modifié par original.defeat (17 Nov 2007 - 18:27)

Je peux te conseiller un logiciel (freeware) qui permet d'optimiser les images PNG au niveau de leur poids d'une part, compense la perte d'intensité des gris sur IE6 d'autre part.

Download : Télécharger PNGOptimizer 1.6 (106Kb)
Site officiel : http://psydk.org/PngOptimizer
Modifié par AndL (15 Nov 2007 - 01:04)