Bonjour,

Depuis presque 9 mois maintenant, je travaille sur mon projet de CMS blog (sous licence GNU/GPL) et j'approche de la fin. Mon but est de proposer un CMS simple et facile à prendre en main, pour des utilisateurs voulant avoir leur propre blog.
J'a déjà lancé le projet sur un forum plus ou moins "concurrent" mais qui traite plus des soucis coté PHP.
En ouvrait un topic sur ce forum, je désirerai avoir quelques retours sur la charte graphique, car maitrisant le PHP 5 et la programmation Objet, j'ai pas mal de lacune niveau graphisme.

- Déjà, j'ai tenté d'appliqué au maximum les recommandations du W3C (code xHTML 1.0 transitionnal et CSS 2) mais il y a certainement des choses à améliorer

Un des aspect de mon CMS que j'ai voulu développé : c est la possibilité de créer son propre design en modifiant les fichiers CSS (soit par upload d'un fichier zip contenant les feuilles de styles, soit par copie puis modification des styles CSS par défaut). Si des personnes sont tentés de créé leur propre CSS, je suis interessé mais ce n'est que facultatif Smiley lol

J'ai monté un site "vitrine" s'appuyant sur mon CMS à cette adresse : http://fonfonblog.raknam.fr/

Le CMS est en téléchargement sur mais ce n'est encore qu'une version bêta, et compote encore quelques bugs : https://sourceforge.net/downloads/fonfonblog/

J'attend vos retours pour perfectionner mon bébé ^^.

PS : pour ce qui est coté PHP / Base de données / JQuery (donc tout ce qui ne touche pas le design), je préfère que ça soit abordé sur le forum de PHP France, histoire de ne pas mélanger.

Merci d avance.
Modifié par BaLiSTiK (08 Sep 2010 - 12:19)
Allooo

Tu as sûrement quelques qualités : mais un peu simpliste pour un offre de service (header).
Offrir un CMS comme bagage, nous ne le sentons pas.

Je vois que tu es axé sur le texte, c'est une qualité. Trois colonnes en largeur. c'est ok.
Tu as dans ton box une transparence qui laisse passer le texte : vois la capture

upload/20350-modif01.jpg

Un calendrier ? : sauf si c'est nécessaire. Peut-être as tu des projets à propos du calendrier ? sinon je sais quel date je suis. On n'a pas à me rappeler la date d'ajourd'hui. Sauf exception, évidemment. Smiley biggrin

Je n'ai fréquenter que très légèrement, mais je look le topic pour un suivi. En générale je dirais que tu as la base, reste à savoir comment tu vas mettre en évidence ton produit/service sur la page principale. J'ai pas reçu l'impact des premières nanosecondes.

De plus j'ai vu des icones qui à mon avis restera toujour secondaire au sujet principale. Les Facebook, Twitter et RSS sont en général secondaire vis à vis ton sujet. Cependant leurs icones sont gros.

Ces icones sont si connu que tu n'as pas à les présenter si gros. Fait le toujours plus petit que toi (ton sujet vaut plus que facebook, twitter et rss). En minuscule s.v.p. Leur réputation remplis l'objectif de toute façon. De plus c'est discret et très esthétique.

Évite aussi les émos sur ton site, ceux-ci peuvent cependant être résever sur des zones de commentaires ou forum mais pas dans tes zones d'articles ou des titres de news.

++
Modifié par zardoz (08 Sep 2010 - 10:02)
Bonjour,

Visuellement, il y a des progrès à faire :
* Sur un écran 1024, le site est bien trop large et nécessite un ascenseur horizontal, ça ne donne pas envie.

* Certains portions de textes sont tout simplement illisible dès que l'on scroll (fond dégradé noir + couleur de police noire = contraste insuffisant. Il faut revoir cela.


Niveau performance :
* 8 fichiers CSS c'est beaucoup trop (et assez ridicule quand l'un deux n'as qu'une ligne...). Je veux bien qu'en développement (=sur ta machine) il soit plus facile de séparer les fichiers ; mais en production, il faut les regrouper en un seul fichier (et supprimer les commentaires de 25 lignes qui n'apportent strictement rien (sauf des octets à télécharger). Optimise tes CSS !

* Pour le JS c'est encore pire... 12 scripts dans le head... Tous ces scripts sont-il absolument nécessaire sur toutes les pages ? Là encore, il faut les rassembler en aussi peu de fichier que possible (1 c'est bien) et les placer en fin de document afin que leur chargement s'effectue après celui du code HTML.

* L'idée dans la réduction du nombre de fichier c'est que 1 fichier de 100ko ou 10 fichier de 10ko représenteront tous deux 100ko, à la différence que dans le cas 2 le serveur doit reçoit 10 appels au lieu d'un. Cela ralenti donc le temps de chargement de la page.

Pour le code :
* Tu ne précise pas la langue du document dans l'élément html.

* Tu utilises plein de meta (que tu appelles communes) totalement inutiles ; par contre tu a oubliée celle qui a de l'importance. Tu peux supprimer : Author (ne sert à rien), language (ne sert à rien), publisher (ne sert à rien), reply-to (ne sert à rien + attrape spam), robots (valeurs par défaut = ne sert à rien), et copyright (ne sert à rien). Et tu peux rajouter Content-Language (sauf si ton serveur renvoi déjà cette information, ce qui est très rarement le cas).

* La meta description est un vecteur de clic : sa seule utilité est d'être utilisé par les moteurs (si jugée pertinente) dans les pages de résultat. Cette meta doit donc être : pertinente et sexy (elle doit donner envie au visiteur potentiel de visiter ton site). Si ta meta rempli vaguement le premier point, c'est loin d'être le cas pour le second.

* Avec 8 feuilles de style externes, il est dommage d'utiliser des styles en ligne.

* La div preInstallation ne devrait pas apparaitre dans le code si le blog est installé, il faut revoir ton code PHP.

* Tu n'as absolument AUCUNE hiérarchie de titres : C'est à revoir absolument !

* Ton formulaire manque de label.

* Il faut revoir tes textes alternatifs :
<div id="banniere"><img src="/images/banniere.png" alt="banniere" /></div><div id="page">
L'image porte le contenu "Fonfonblog le blog à votre image". L'alt doit reprendre ce même contenu. Dans la même idée, les images purement décoratives, n'ont pas besoin d'alt rempli (smile.gif).

* Tu as une très mauvaise utilisation de title. Title n'a rien à faire sur une image (surtout pour reprendre le même contenu que le alt). Title peut (et non doit) être utiliser sur les liens pour apporter une information supplémentaire à l'intitulé du lien et nécessaire à la bonne navigation du visiteur (le title="lien" est particulièrement inutile).
Merci pour vos retours rapides.

@zardoz :
Mon projet de CMS est avant tout pour moi, pour enrichir mes connaissances en programmation PHP sur des outils que je n'utilise pas forcement dans mon travail : c'est une sorte de complémentarité. Par exemple : à mon travail, j'utilise des frameworks de programmation (CakePHP pour PHP et QooxDoo/Ext/OpenLayers pour le coté JS), et pour le CMS, j'ai appris à utiliser des librairies PEAR, améliorer mes connaissances en POO avec l'utilisation d'interface, mise en place d'une structure MVC, couche Modèle "générique" supportant plusieurs type de SGBD (mysql, postgresql et MySQLi pour le moment mais je compte à l'avenir y inclure Orable, SQLite, DB2...), prise en main du framework JQuery et AJAX etc...
Les 3 colonnes peuvent se réduire en deux selon le choix de l'administrateur : la colonne principale, et le basculement des blocs à gauche, droite ou les deux, ainsi que le choix de faire apparaitre tel ou tel bloc. La mise en place du choix de droite ou gauche étant assez récente, j'ai à améliorer ce côté.
Pour le calendrier, j'ai pris le choix de le faire afficher, mais comme dit au-dessus, il peut être non-affiché. Je voudrai l'utiliser pour indiquer à quels jours des articles sont parus mais je n'ai pas encore réfléchi la dessus.
"je dirais que tu as la base" je en prend pas ça mal Smiley biggrin mais il y a une structure PHP plutôt complexe derrière, ce qui apparait sur le navigateur ne reflète pas l'étendu de ce que j'ai développé : je me suis plus concentré sur la solidité de l'application que sur sa charte graphique car je considère ça prioritaire avant tout !!
De plus, vu que c'est un CMS avant tout, la charte graphique est pauvre, car c'est à la personne qui utilisera le CMS de faire son propre design (des design par défaut seront certainement proposé mais pour l'heure c est encore dans les cartons ^^).


@Laurie-Anne :
Le scroll horizontale est gênant je suis tout à fait d'accord. J'estime la longueur de la colonne du milieu de taille suffisante, donc va falloir réduire les colonnes gauche et droite (de 283px à l'heure actuelle). Mais comme j'ai dis au dessus, une seule colonne peut être affiché, mais dans ce cas là, je n'ai pas encore cherché à régler la taille automatiquement du cadre...

De quelles portions de textes ? Est-ce toujours uniquement en cas de basses résolutions ? Travaillant avec des écrans 22" wide et 19" wide (soit 1920*1680 & 1440*900), je n'ai pas trop pensé aux toutes petites résolutions : méa culpa. Mais là encore : les css sont adaptables, avec un style spéciale "petite résolution" le soucis peut-être réglé je pense.

Concernant le nombre de fichiers CSS, il faut distinguer deux groupes :
- Les CSS pour le site (là je pourrait réduire à 3 voir 2 mais je préfère 3
- Les CSS des outils JQuery (FancyBox, Osido l editeur wysiwyg et JQuery-ui) : ces 3 là je n'y touche pas.

De même concernant les scripts JS, il y a mes propres scripts JS (au nombre de 5) et les scripts JQuery. Il y a un script JQuery que je peux enlever, mais c'est tout. Concernant mes scripts persos, je peux en regrouper 2/3 Smiley cligne

- La balise <html> : j'avoue que je n'ai jamais vu l'attribut langue, j'ignorais simplement cet attribut, je le rajouterai donc.

Les meta : je n'y ai pas franchement accordé d'importance jusqu'à présent car ce n'était pas urgent. Mais je modifierai ça. Par contre, le fichier contenant ces balises a une construction particuliere :
Selon la valeur de ma variable $_GET['page'] (identifiant de la page), j'affiche ou pas certaines balises. Pour ce, j'utilise un switch/case, et selon la valeur dans le case, j'"autoload" une classe si nécéssaire.
exemple :

switch($id_page){
		
	case 4 : 
		$oArticle = new Article();
		$oArticle->__setIdArticle($_GET['id_article']);
		$article = $oArticle->affichArticle();

		$meta .= '<title>' .$article->titre . '</title>';
		$meta .= '<meta name="Description" content="' .$article->titre .'" />';
		$meta .= '<meta name="Keywords" content="fonfonblog,' .$article->tags_article.'" />';

		unset($oArticle); 
		break;

//Etc...
}		

La balise meta description est remplie en PHP, je n'ai donc pas forcement un véritable contrôle sur celle-ci, exceptée dans le cas ou je suis sur la page d'accueil.

Les CSS sont en constantes évolutions, donc c'est normal qu'ils ne soient pas optimisés en ligne : vu que je modifie sans cesse, j'ai besoin d'avoir les lignes une à une. Mais je sais qu'il existe des scripts générant un CSS compressé, limite je tenterai d'en coder un, ça m exercera sur les regex Smiley sweatdrop

L'architecture des titres avec les balises <h*> sont-elles quelques chose de vraiment nécessaire ? A part les placer au titre de chaque article ou en tête de page, j'en voit pas l'utilité.

Idem pour les labels, je ne les utilise pas car je n'en voit pas trop l'utilité.

Oké pour les alt. Par contre, les images insérés dans les articles (BBcode) n'est pas une chose aisée. Car derrière faut parser par regex. Je gère pour l'instant la taille et l'affichage par fancybox et c'est pas forcement simple :


$texte = preg_replace('`\[img\](.+)\[/img\]`iUs','<img src="$1" title="$1" alt="" />', $texte);

$texte = preg_replace('`\[img ([0-9]+)x([0-9]+)\](.+)\[/img\]`iUs','<img src="$3" title="$3" width="$1" height="$2" alt="" />', $texte);

$texte = preg_replace('`\[img fancybox\](.+)\[/img\]`iUs','<a href="$1" class="fancybox"><img src="$1" title="$1" alt="" style="min-width : 100px;" /></a>', $texte);								

$texte = preg_replace('`\[img ([0-9]+)x([0-9]+) fancybox\](.+)\[/img\]`iUs','<a href="$3" class="fancybox"><img src="$3" title="$3" alt="" width="$1" height="$2" /></a>', $texte);										

$texte = preg_replace('`\[img fancybox ([0-9]+)x([0-9]+)\](.+)\[/img\]`iUs','<a href="$3" class="fancybox"><img src="$3" title="$3" alt="" width="$1" height="$2" /></a>', $texte);										


Mais là je vais enlever les balises title, je ne sais pas pourquoi je les ais mises Smiley ohwell ...la prog fatigue beaucoup le cerveau Smiley lol

J'espère avoir bien répondu à vos retours.
Merci Smiley cligne
Modifié par BaLiSTiK (08 Sep 2010 - 12:17)
Pour tous les éléments pour lesquels tu ne vois pas l'intérêt : c'est une question d'accessibilité (clairement, tu n'es pas familier avec le concept (mais tu es au bon endroit pour apprendre).

Faire un back-office robuste est une chose, mais ça ne fait pas tout. Sur le web le front est très important (la première impression est bien souvent celle qui reste).
J'ai commencé quelques modifications :
- ajout de l attribut xml:lang="fr" sur la balise html
- enlèvement de plusieurs title (principalement sur ma methode de parsing de bbcode)
- Modification de quelques meta...

Je vais réorganisé mes scripts JS. Et plus tard les scripts CSS car là, ça demandera aussi des modification dans ma classe de gestion CSS.

Je vais approfondir ton tutorial sur la hiérarchisation des titers, mais j'avoue que je vois qu'à un seul endroit ou le faire : le titre de chaque page.

a écrit :
Faire un back-office robuste est une chose, mais ça ne fait pas tout. Sur le web le front est très important (la première impression est bien souvent celle qui reste).


Tout dépend du contexte Smiley smile . Dans une application comme celle que je fais, le back-office constitue 90%. Le front n'est que la couche la plus haute. De mon côté, je ne fournit que l'outil permettant de faire cette couche, je ne la conçois pas (sauf celle par defaut).
Dans un autre contexte, généralement le cas de sites persos, c'est l'inverse : ça s'appuie sur le front et non le back-office.
Salutation @tous et BaLiSTik plus particulièrement.

Oui je supposais que tu as un développement plus structurer derrière tout ça. On ne le vois pas tout simplement.

C'est bien ainsi et comme toutes les présentations de CMS je crois sincèrement que tu feras quelque chose de bien.

PS : quand je disais « je pense que tu as la base ». C'est au niveau de la présentation des produits/servives. Pas au niveau développement.

++
Modifié par zardoz (08 Sep 2010 - 17:12)
zardoz a écrit :
Salutation @tous et BaLiSTik plus particulièrement.

Oui je supposais que tu as un développement plus structurer derrière tout ça. On ne le vois pas tout simplement.

C'est bien ainsi et comme toutes les présentations de CMS je crois sincèrement que tu feras quelque chose de bien.

++

Merci pour l'encouragement Smiley smile .

J'ai réduit la longueur de l'appli mais c est encore un peu supérieure avec une résolution de 1024.
Donc taille du div principal : 1100px,
taille des colonnes : 250px
Taille colonne milieu : 570px

Si je baisse encore ça risque d'être écrasé.

Il y a un autre point que je voudrai éclairer concernant le div de connexion :
Lors de test chez moi, j ai mis sur mon écran principal le site sous Google Chrome, et sur l'écran secondaire : le site sous Mozilla Firefox.
Au travail, j'utilise aussi les 2. Le truc bizarre c'est que sur mon pc perso avec Fierfox, j ai tous mes champs <input> qui dépassent du cadre.
La seul différence qu'il y a : c est que mon pc perso est sous Linux Ubuntu.

Voila un screen : screen

ps : l'image est assez lourde
Modifié par BaLiSTiK (08 Sep 2010 - 17:05)
Salutation Balistik

Ne me vois pas comme critique s.v.p mais plutôt comme utilisateur de ton produit/service.

Ok donc je plonge pour la première fois dans ton . . . /service.

Page d'accueil : « installation - partie 2 » je scroll pour accéder à la partie 1 : C'est normal ça ? Non je ne crois pas.

Tout simplement que tu fais des espaces blog's - donc normal. Bon d'accord que tu as utilisé ton propre CMS pour invoquer la façon d'installer ton produit. Moi je ne ferais pas ainsi. J'opterais pour une page blanche avec aucun rapport avec ton/tes CMS (produits).

Ta page de vente « produits/services » ne doit pas nécessairement être une extension de ton CMS. Aucun rapport entre ton CMS (produit) et la façon dont tu le présente (produits/services) en XHTML.

Prend ces propos comme réflexion s.v.p, mais surtout ne le prend pas comme étant absolu.

N'oubli surtout pas que PHPBoost 3 est une réalité sur le web en tant que produits/services. Et que d'autres, tout aussi puissant, sont aussi accèssibles. Tu n'es pas en zone vide, il y a d'extrême puissance dans ton domaine.
Mais ose faire et tu auras ta place sur l'étagère.

Je peux très bien parler davantage mais je m'abstiens à cette heure.

++
Modifié par zardoz (08 Sep 2010 - 20:45)
Je te rassure, j'accepte toutes critiques tant qu'elles sont constructives et qu'elles me permettent d'avancer !! Si ça peut te rassurer, j'ai pas été épargné sur PHP France Smiley biggrin .

Pour l'acces : il faut garder à l'esprit que ça reste néanmoins un blog donc ce sont des articles qui apparaissent sur la page d'accueil. J'ai fais le choix d'afficher les articles du plus récent au plus anciens mais l'inverse est possible : j'ai donné la possibilité de choisir.
Dans la section administration : je donne la possibilité à l'administrateur d'agencer au maximum comme il veut son interface graphique.

Je suis d'accord qu'un site vitrine du CMS se doit pas s'appuyer sur le CMS : logique. Mais le produit n'étant pas fini, pour l'instant je reste comme ça.

Je ne connais pas PHP Boost3, et je t'avoue que je ne connais que très peu d'outils qui font pareil que ce que je fait. Mon but n'est pas de concurrencer Wordpress Smiley biggrin , mais comme j'ai dit plus haut, avant tout, c'est pour accroitre mon niveau de programmation, et là c'est un exercice tout à fait adapté , à savoir proposer un produit aux autres utilisateurs et avoir des retours pour sans cesse l'améliorer Smiley cligne .

J'ai encore plein d'idées en tête à proposer mais ce qui me manque le plus reste le temps.
Je penses même à une version 2.0 d'ici 6 mois/ 1 an (et si surtour y a une demande), de le refaire en HTML5 / CSS 3 , parce que j'ai envie d'apprendre Smiley smile
Salut Balistik

heureux de savoir que
a écrit :

Je suis d'accord qu'un site vitrine du CMS se doit pas s'appuyer sur le CMS : logique. Mais le produit n'étant pas fini, pour l'instant je reste comme ça.

Tu es encore en zone d'essais à ce que je vois : normale, je comprend.

Je te jure que c'est comme ça seulement il manque certaine données sur ta situation réelle.
Est-tu seul en work par exemple etc. PHPBoost est une équipe qui work ensemble comme exemple évidemment, mais qu'en est-il de toi ?

Non c'est juste le rapport entre une armée d'un seul homme (développeur) vis à vis une armée de cinquante hommes (développeurs). Tu n'as pas choisi une petite cible. N'oubli pas que ta cible est la totalité des utilisateurs PHPBoost et concurrents. Donc je répète : tu n'as pas choisi une petite cible.

Tu comprend que l'intégration se fait complèment en dehors du CMS ? Ok : tant mieux.

Tu n'as pas été épargné sur PHP France Smiley smile ?. Je comprend aussi.
Bon d'accord je sais que la France vie d'une profonde cruauté Smiley biggrin mais pour le bien de tous j'imagine. Smiley cligne

J'irai faire un tour sur PHP France : par plaisir seulement.
Moi de mon côté sur PHP Québec : pas très actif le site disons. Surtout pas comme en France. Manque de population je pense : ou d'intérêt peut-être.

Puisses-tu offrir le lien PHP France s.v.p : sur ton sujet. Smiley langue ?

D'accord pour l'apprentissage : disons que je pense comme toi à ce niveau. Apprendre avant toute proposition est une qualité. Je t'en félicite. L'apprentissage d'abord et avant tout. Rien ne presse en informatique.

D'ailleurs je te dirais que lorsque je développais en Flash, je développais en fonctions des jeux et surement pas parce que les jeux m'intéresse. Loin de là. Mais surtout parce que les scripts de jeux en Flash sont complet en terme d'apprentissage : voilà pourquoi. Mais les jeux ne m'intéresse pas comme objectif.

Mais de grâce, en apprentissage : Ouff ! un pur délice.

PS : Bon d'accord je t'ai trouvé sur sur PHP France : pour un suivi j'imagine.
Quoiqu'il en soit je te souhaîte bonne chance pour tes développements futurs.

++
Modifié par zardoz (08 Sep 2010 - 23:02)
Je reup le topic, j'ai pas mal avancé depuis mon dernier post. J'ai encore quelques debug à faire.
Mais je me pose une question :
Je suis partie sur un affichage de type :
- colonne gauche
- Contenu
- colonne droite

Le soucis est que pour des très petits écrans (résolution inférieure à 1024*780) ou alors depuis un mobile les trois éléments débordent de l'écran (j'ai tout fait pour réduire les width de ces éléments). N'est-il pas mieux finalement d'avoir un affichage de type
- colonne (gauche ou droite : décidé par l'admin)
- Contenu

La seule chose qui ne me plait pas dans ce type d'affichage est que si un admin décide de placer plusieurs "blocs" dans une colonne, ça risque d'avoir une colonne à rallonge...Si la page contient plusieurs articles (je rapelle que c est un CMS pour faire un blog Smiley biggrin ) cela ne pose pas de soucis au final...

@zardoz : désolé de répondre avec 2 mois de retard Smiley sweatdrop ^^.
Oui je suis tout seul à programmer, j'ai quelques conseils d'amis mais ça en reste là.
Par contre, j'ai commencé à faire un point que tu m'a recommandé : séparer le site de présentation et l'outil.
Le site de présentation (en cours de développement mais le debug du CMS est prioruitaire) est accessible sur www.fonfonland.fr tandis que le CMS de démo (et qui me sert de test) est sur http://blog.fonfonland.fr

Thx
Hello

Ne t'en fait pas : il n'y a pas de retard sur un projet sérieux.
Il n'y a que des dates ultérieurs. Smiley cligne

++

PS : Cependant il est dommage pour ton démo
Modifié par zardoz (03 Nov 2010 - 10:56)
BaLiSTiK a écrit :


Il y a un autre point que je voudrai éclairer concernant le div de connexion :
Lors de test chez moi, j ai mis sur mon écran principal le site sous Google Chrome, et sur l'écran secondaire : le site sous Mozilla Firefox.
Au travail, j'utilise aussi les 2. Le truc bizarre c'est que sur mon pc perso avec Fierfox, j ai tous mes champs &lt;input&gt; qui dépassent du cadre.
La seul différence qu'il y a : c est que mon pc perso est sous Linux Ubuntu.


C'est parce que tes polices sont mal agencées.
Un peu de lecture : http://www.alsacreations.com/article/lire/631-quelles-polices-pour-un-site-web.html

Sinon, je viens de voir la dernière version de ton blog et je constate les points suivants :
- Impossible de se connecter si Javascript est désactivé ! Désactive le JS (avec Web Developer ou Noscript) ou encore teste avec Lynx et tu verras pourquoi je dis ça ! Dans un cas d'élément aussi essentiel à la navigatio que le lien de connexion, JS doit toujours ne servier QUE de surcouche, jamais comme remplacement !
Je te propose plutôt d'opter pour les pop-up intelligents : http://openweb.eu.org/articles/popup
Je te recommande aussi d'apprendre les bonnes pratiques en codage Javascript : http://www.alsacreations.com/article/lire/562-bonnes-pratiques-javascript.html
- Pense à une alternative au recaptcha ! Les non-voyants ne peuvent pas voir le contenu des images et en plus, si JS est désactivé, ils sont encore plus mal barrés ! Je te propose l'idée d'un système de questions/réponses aléatoires paramétrable dans l'administration. C'est plus accessible tout en étant assez solide par le fait qu'on a un énorme choix de possibilités de combinaisons de questions-réponses.

Pour tester l'accessibilité de ton blog, je te recommande les outils suivants :
- l'extension Web Developer pour Firefox -> tu peux ainsi désactiver les images, les Javascripts, redimensionner la fenêtre à la volée, ...
- Lynx -> L'utilisation d'un navigateur texte te donnera un bon aperçu de la façon dont le robot Google voit tes pages.
- Orca (Ubuntu) ou NVDA (Windows) -> pour tester la navigation avec un lecteur d'écran, en combinant avec la navigation au clavier (les non-voyants ne peuvent pas utiliser la souris)
- Naviguer au clavier, avec ou sans lecteur d'écran.

Et je te suggère aussi de te renseigner sur Opquast également, en vue d'un audit : http://www.opquast.com/
Concernant les polices, j'utilise
font-family: Verdana, Arial, Helvetica, sans-serif;

Et bam, justement sur le tutoriel c'est sité comme mauvais exemple Smiley sweatdrop
Le Arial ne me plait pas vraiment comme style, donc je pense que le virer est une bonne solution.
Après, il reste Verdana et Helvetica :
Est-ce que les deux vont ensemble ? je n'en ai pas trop l'impression
et surtout, Verdana est-il une police populaire ? il me semble que oui.
Je serai tenté pour en garder que Verdana, sans-serif.

Je n'utilise aucune popup, ce ne sont que des div qui sont masqué/affiché et positionné en CSS.

Concernant le JS : comment faire de l'AJAX si je me passe du JS Smiley smile ?
Après j'avoue que certains de mes codes JS sont un peu bordélique mais beaucoup de mes fonctions sont basés sur la syntaxe faite pour JQuery, donc je me base déjà sur une certaine structure.

Pour le recaptcha, j'y réfléchirai, c'était une solution pour m'éviter de coder moi-même et qui me paraissait plus solide.

Je regarderai ces différents outils mais sont-ils compatible Ubuntu ?

Merci pour tes indications Smiley cligne .
Sur Ubuntu, tu as déjà Orca qui est installé par défaut et que tu n'as qu'à activer puis à redémarrer Ubuntu pour pouvoir l'utiliser. tu peux consulter la documentation Ubuntu à ce sujet.

J'ai aussi cité NVDA, pour ton poste Windows.

Lynx a été conçu pour les Unix-like donc est compatible Ubuntu et est présent dans les dépôts. Un portage pour Windows existe également.

quant à Web Developer, c'est une extension Firefox et fonctionne sur tous les OS.

Quant à la navigation au clavier... bin... tu mets ta souris loin tout simplement, XD

Pour le bloc de connexion, le problème c'est justement le display:none; Contrairement aux croyances, la majorité des lecteurs d'écran interprètent cette propriété CSS et donc, est inaccessible dans ce cas. Donc pour ce cas de figure, où l'on n'a pas JS (il n'y a pas que ceux qui le désactivent volontairement, mais aussi ceux qui n'ont pas le choix parce que bloqué au boulot), il faut fournir une solution alternative !

Il serait donc bon pour toi de te renseigner davantage sur l'accessibilité, et de ne pas hésiter à poser tes questions dans la rubrique Accessibilité. Il y a un non-voyant ici qui est bien placé pour répondre à tes questions.
J'ai commencé à travailler sur le rendu HTML même si je suis toujours bien occupé avec le debug côté PHP.
J'ai passé en revu tous mes formulaires afin de leur mettre des balises <label for="id"></label>, ça c'est fait. Je lisais à l'instant le tutorial sur l'acceskey, et je me pose la question de savoir est-ce vraiment nécessaire de le faire ?
Je n'ai finalement pas beaucoup de page "statique", hormis dans la section administration, donc si je le faisais, je dirai que j'attribuerai ces numéros :
0 : carte du site ? (page non faite)
1 : page d'accueil
2 : Inscription
3 : Connexion
4 : recherche ? (cette page est encore mal définie dans mon CMS)
7 : Formulaire de contact

Concernant le div de connexion, j ai une page de connexion "statique" mais j avoue que j'ignore comment utiliser la statique si celle en div ne peut être affichée...à réfléchir Smiley smile
Bonsoir Smiley smile

J'ai pas mal avancé sur la partie visible de l'iceberg.
Voila une liste de modification que j ai fait :
- Accessibilité en cas de javascript désactivé (ptete que sur la page "Mon compte", ça bug encore), et ça été du gros taf ^^
- Rajout des accesskey
- Tous les scripts JS sont partis dans des fichiers .js et ont été obfusqués (réducation de la taille de 50%)
- Assemblage des styles CSS en un fichier sur les styles CSS des scripts JQuery (un peu casse-couille à faire n'empêche)

après ça concerne du debug PHP ^^.

J'ai créé un utilisateur de test si des personnes souhaitent tester :
- login : test
- mdp : test-fonfonblog

Ce n'est qu'une version Alpha donc quelques points manquent encore, et par conséquent possibilité de bugs.
Etant sous Linux, je ne sais pas du tout comment ça réagit sous IE et à mon travail, j'ai vaguement testé sous IE8. Donc serait-il possible d'avoir des remontés de bugs sous IE ^^. Merci

Sinon, est ce qu'il y a un sous-forum consacré à la réalisation de projets web me permettant de présenter dans un futur proche, tout mon travail Smiley smile ?
Pour ta dernière question, il n'y a pas de section pour ça à ma connaissance. Mais si tu regardes du côté du Site du Zéro, il y a une section sur le forum pour les projets des Zéros.