[intermédiaire] www.lordfpx.com en pâture

Bonjour à toutes et à tous
Etant autodidacte, j'apprends par la pratique (l'an prochain par une formation) et mon site perso est donc mon terrain de jeu.
Mon nouveau site a pour but de me mettre à l'épreuve niveau PHP/mysql, mais surtout de pratiquer le CSS3 et mootools (ajax, effets...).
Mon défit:
- un index... et plein de requêtes ajax dans le plus pur style Web2.0
- le moins d'images possibles (en dehors des photos et icônes), donc plein de CSS3
- des services proposés aux inscrits
- un design hors normes

Mes difficultés:
- la complexités des multiplications de requêtes ajax (je ne voulais pas de rechargement de ma page) en raison des nombreux "services" (surtout pour les inscrits)
- la compatibilité avec les navigateurs (parfaites pour firefox, safari et chrome, approximative, mais fonctionnelle pour IE7 et 8, problématique pour IE9, mais je n'ai pas encore poussé la question)
- faire un site simple à utiliser... sur un design hors normes
- le SEO ainsi que le référencement google (cela fonctionne toutefois partiellement (galeries photo et articles))

Voilà, n'ayez pas peur de me vexer par vos critiques, mais je ne contenterais pas d'un "ça pu" ou "c'est à chier"

www.lordfpx.com

Merci les gars et gazelles

Coucou,


Tu viens avec une page en transitional comportant 25 erreurs et 40 avertissements, t'es courageux au moins


>>pas de hiérarchie de titres, que des <p>
Ta meta description est à revoir, la montagne de keywords sert à rien, t'utilises des iframe....


J'ai failli me faire un torticolis pour lire ton menu, ça c'est audieux !
Pour les couleurs faut revoir avec le cercle chromatique.

Y a des espaces manquants comme par exemple :

a écrit :
été long parceque j'apprenais

et d'autres coquilles qui donne l'impression d'un site fait à la va-vite alors que paradoxalement tu as du y passer du temps.

T'as du boulot, bon courage
Modifié par jmlapam (18 Oct 2011 - 22:58)

jmlapam a écrit :

Tu viens avec une page en transitional comportant 25 erreurs et 40 avertissements, t'es courageux au moins

Oui, j'ai vérifié avant de soumettre. Les principaux problèmes viennent d'un script mootools qui propose de mettre en title du texte/html pour afficher des "tips"... je vais revoir ça. Les autres viennent aussi des boutons des réseaux sociaux...

jmlapam a écrit :

&gt;&gt;pas de hiérarchie de titres, que des &lt;p&gt;
Ta meta description est à revoir, la montagne de keywords sert à rien, t'utilises des iframe....

Il y a bien un h1, h2 pour le titre des articles, les p sont normaux pour les paragraphes il me semble. Mais je rajouterais un niveau h3 j'imagine pour la rubrique.
Pour les keywords, ça vient d'anciens réflexes, mais c'est vrai qu'il parait que cela ne sert plus à rien, vous me le confirmez ?

Pour les iframes, même google en utilise . Je ne les utilise que dans 3 situations (2 que je vais retirer à l'avenir, mais ce n'est pas prioritaire et 1 qui est liée aux boutons réseaux sociaux daubiques :-p

jmlapam a écrit :

J'ai failli me faire un torticolis pour lire ton menu, ça c'est audieux !
Pour les couleurs faut revoir avec le cercle chromatique.

Il faut faire de la gym . je ne changerais pas le menu, désolé pour le cou.
Pour les couleurs, j'aimerais d'autres avis, je ne vois pas ce qui gène personnellement, la complémentaire du orange est le bleu, le gris est neutre pour structurer.

jmlapam a écrit :

Y a des espaces manquants comme par exemple : été long parceque j'apprenais

et d'autres coquilles qui donne l'impression d'un site fait à la va-vite alors que paradoxalement tu as du y passer du temps.

Oui, j'admet que je n'ai pas porté une grande importance au contenu le temps du développement, cela sera corrigé bien évidemment (le site est en betatest depuis 1 semaine, je corrige les bugs rencontrés en ce moment), mais cela dépend de mes temps libres.

jmlapam a écrit :

T'as du boulot, bon courage

Oui, en effet . Merci en tout cas pour les retours. Et je ne cherche pas à excuser les incorrections du site, je justifie certaines seulement :-p
Modifié par lordfpx (18 Oct 2011 - 23:33)

a écrit :
Il faut faire de la gym . je ne changerais pas le menu, désolé pour le cou.

Désolé pour toi, moi j'y retourne pas...

a écrit :
Mais je rajouterais un niveau h3 j'imagine pour la rubrique

BIngo!

a écrit :
même google en utilise .

Alors dans ce cas...

a écrit :
Pour les couleurs, j'aimerais d'autres avis

je te l'accorde bien volontiers. C'est le titre qui jure d'après moi.



Autre point: sur mon notebook, les textes sont coupés, certaines rubriques inaccessible, peut-être envisager de faire du responsive design après le débogage, je dis cela parce que le partage d'images que tu proposes pourrait en pâtir ou du moins ne pas en profiter...

Je n'ai pas ete voir le code. le visuel m'a suffit.

Je pense que la meilleure école pour progresser sur ce point, c'est de faire une revue des grands sites, des sites a la mode, de voir ce qui se fait dans le milieu d'une manière générale

Reproduire le travail des maîtres à la perfection, avant de créer. C'est tellement vieillot, dépassé suranné, cacochyme, out, ect. Mais c'est TERRIBLEMENT efficace.

Je pourrais argumenter sur les couleurs (oui, orange et bleu, c'est complémentaire, c'est pas une raison pour les collr cote à cote comme ça). ou sur tout un autre tas de point d'ergonomie. Mais la synthèse de ma pensée est faite par les ligne au-dessus. Donc ....

Autre conseil constructif, même si il est douloureux. On en code pas pour coder. On code pour servir un but, une clientèle. Manque de pot, elle est souvent humaine. Ses capteurs sont imparfaits, ses capacités cognitives, limitées et d'une manière globale elle est fortement handicapé par sa condition biologique.

Le moins que l'on puisse faire pour elle, c'est de lui fournir des sites ergonomiques.

Donc lecon 1 : formation en ergonomie pure et ergonomie de l'information.

Question : Comment Steve Jobs est devenu le patron de l'entrprise la plus riche du monde ??? en mettant les techniciens au service des ergonomes, alors que tout ces concurrents faisaient le contraire.

Bon soirée a toi

kolok a écrit :
Je n'ai pas ete voir le code. le visuel m'a suffit.

Je pense que la meilleure école pour progresser sur ce point, c'est de faire une revue des grands sites, des sites a la mode, de voir ce qui se fait dans le milieu d'une manière générale

Oui bien sur, j'adhère totalement avec cela, reste que ma volonté était avant tout de faire quelque chose de hors norme (dans le sens "en dehors des sentiers battus"). J'assume le choix des couleurs, la mise en page. Je vais réétudier certains éléments en écoutant vos critiques, mais l'ensemble ne changera pas. J'ai fait mon propre cahier des charges.

kolok a écrit :

Reproduire le travail des maîtres à la perfection, avant de créer. C'est tellement vieillot, dépassé suranné, cacochyme, out, ect. Mais c'est TERRIBLEMENT efficace.

Reproduire est efficace, je l'ai fais, mais pour ce site, comme je le signalais, je voulais oser.

kolok a écrit :

Je pourrais argumenter sur les couleurs (oui, orange et bleu, c'est complémentaire, c'est pas une raison pour les collr cote à cote comme ça). ou sur tout un autre tas de point d'ergonomie. Mais la synthèse de ma pensée est faite par les ligne au-dessus. Donc ....

Donc ça flash aux yeux oui, c'est un fait. Le orange n'est pas une couleur facile à caser, c'est la touche qui rend le bleu et gris (couleurs froide bien sur) plus "dynamique". Je vais moins l'affirmer pour corriger ce problème d'équilibre.

kolok a écrit :

Autre conseil constructif, même si il est douloureux. On en code pas pour coder. On code pour servir un but, une clientèle. Manque de pot, elle est souvent humaine. Ses capteurs sont imparfaits, ses capacités cognitives, limitées et d'une manière globale elle est fortement handicapé par sa condition biologique.

Le moins que l'on puisse faire pour elle, c'est de lui fournir des sites ergonomiques.

J'ai du mal exposer mon site je pense. En fait, il s'agit d'un terrain de jeu pour développer mes connaissance/compétences et expérimenter des choses qui ne se font certainement pas en production "pro". Je ne répond qu'à mon propre cahier des charges. Je vous rassure que je connais les limites du visiteur, qu'il ne faut pas le contraindre, qu'il ne reste pas plus de quelques secondes avant de repartir d'un site qui ne le rassure pas dans son ergonomie.

kolok a écrit :

Donc lecon 1 : formation en ergonomie pure et ergonomie de l'information.

Question : Comment Steve Jobs est devenu le patron de l'entrprise la plus riche du monde ??? en mettant les techniciens au service des ergonomes, alors que tout ces concurrents faisaient le contraire.

J'en ai conscience. Dans un cadre professionnel je suivrais bien entendu ces conseils. L'utilisateur, et donc l'ergonomie, avant tout.

Merci en tout cas pour ces avis rapides. Petite précision, un site se fait normalement avec une équipe (webmaster, web designer, rédacteur), là, je cherche à faire le tout, mais dans un cadre professionnel cela ne va pas aussi loin en terme de développement. Je me suis placé la barre assez haute volontairement, je suis donc loin de la perfection .
Modifié par lordfpx (22 Oct 2011 - 10:19)

Je respecte profondément le cote expérimental de votre site. J'ai moi même un certain nombre de "frankeinsten" à mon actif et cela a été très formateur.

C'est dans le cadre de cette expérimentation que j'ai répondu (sinon, je ne m'en serais pas donner la peine)

Le code, cela reste fondamentalement "facile", car on peut avoir des normes, des validateurs, des conseils. ON a toujours un réponse binaire (faire ou ne pas faire).

Pour le Look&Feel, c'est autre chose. ca demande de se forger les yeux. C'etait le sens de ma reponse

a écrit :
un terrain de jeu pour développer mes connaissance/compétences et expérimenter des choses qui ne se font certainement pas en production "pro".

Ah bon, bah pourquoi t'as développé toute une partie utilisateur?

kolok a écrit :
Pour le Look&amp;Feel, c'est autre chose. ca demande de se forger les yeux. C'etait le sens de ma reponse

Je suis d'accord avec toi, cela se développe avec l'expérience, l'analyse des travaux des autres et aussi par les critiques de ses propres travaux (la raison pour laquelle je soumettais mon site).

jmlapam a écrit :

Ah bon, bah pourquoi t'as développé toute une partie utilisateur?

Pour résumer, je suis animateur d'un espace informatique où j'aborde la retouche photo, le graphisme, le développement web, la bureautique... ou la découverte de l'informatique dans une association de réinsertion sociale. Avec un adhérent, on a eu l'idée de créer un marque page en ligne pour un usage interne.
J'ai totalement réécrit ce script pour un usage avant tout personnel, mais en le gardant ouvert à mes connaissances. Je n'avait trouvé aucun système de favoris qui me convenait (simple, rapide, accessible de partout).
En parallèle, j'avait développé mon propre système de blog, j'ai mélangé tout ça à la sauce mootools et voilà.
Donc c'est un site perso, mais ouvert à qui le veut (j'ai des utilisateurs réguliers qui profitent du marque pages principalement).

Oups j'ai oublié de dire que le site est fluide, mais il faut au minimum un écran 1024x768. Cela dit, je ne vois pas où le texte est coupé en réduisant la fenêtre. Je développe une version pour mobiles (le popup des membres est déjà adapté au format petits écrans).
Modifié par Julien Royer (19 Oct 2011 - 21:50)

Bonsoir,

Impossible de tester ton site sous Itruc...
Je suis resté moins de 10 secondes...
J'attendrai la version mobile

a écrit :
Oups j'ai oublié de dire que le site est fluide, mais il faut au minimum un écran 1024x768. Cela dit, je ne vois pas où le texte est coupé en réduisant la fenêtre. Je développe une version pour mobiles (le popup des membres est déjà adapté au format petits écrans).

Modifié par jmlapam (19 Oct 2011 - 23:05)

Pour eviter des surprises comme celle là, j'utilise http://browsershots.org/, qui fait des captures sur de nombreux navigateurs/systeme.

Il y a aussi loads.in, qui en plus donne les temps de chargement.

Ca a changer ma vie. Avant j'avais 45 ordinateurs dans le salon pour faire les tests. Je vous dis pas le bruit et la chaleur !

@ kolok: Super lien, je l'ai mis en favori, longtemps que j'en cherchais un dans le genre. Merci.

Salut,

Un petit bug sur ton site : quand je reste appuyée sur la mollette de ma souris et que je scroll, je peux sortir de la "partie visible" de ton site jusqu'à avoir une page blanche.

Une capture d'écran pour illustrer


Pour tester sous différents navigateurs, il y a aussi adobe browserlab, rapide et gratuit pour le moment, mais pas pour longtemps sur ce dernier point
Modifié par LeMuTaLisKFoU (21 Oct 2011 - 11:43)

6l20 a écrit :

Impossible de tester ton site sous Itruc...
Je suis resté moins de 10 secondes...
J'attendrai la version mobile

ITruc 9 ? parce que sur ITruc 7 et 8, cela devrait fonctionner. Sur la version 9, j'ai des soucis de javascript. Je les corrigerai.

@jmlapam: merci pour le screenshot. C'est "normal" ces débordement, c'est propre à mon design fluide limité au 1024x768 (je vais essayer d'optimiser pour du 1024x600...). Pour la liste des résumés d'articles, j'ai une idée pour contourner cela (mais je dois revoir le script de slide horizontal, voire faire le mien).

@kolok: l'idée de loads.in est sympa, mais bon, les résultats assez approximatifs je trouve (au boulot j'ai une connexion assez foireuse, mais ça ne monte pas au niveau de ce que m'indique ce site.

LeMuTaLisKFoU a écrit :

Un petit bug sur ton site : quand je reste appuyée sur la mollette de ma souris et que je scroll, je peux sortir de la "partie visible" de ton site jusqu'à avoir une page blanche.

Mince ayant désactivé le clic du milieu je ne m'était pas rendu compte de cela. un bloc qui doit déborder surement. Merci pour le retour, je vais investiguer.

lordfpx a écrit :
ITruc 9 ? parce que sur ITruc 7 et 8, cela devrait fonctionner. Sur la version 9, j'ai des soucis de javascript. Je les corrigerai.

iTruc = iPhone ou iPod.

J'ai pas capté "Itruc version 8"? Tu voulais parler de quoi lordfpx?

jmlapam a écrit :
J'ai pas capté &quot;Itruc version 8&quot;? Tu voulais parler de quoi lordfpx?

Non, ce n'est rien, j'ai juste interprété trop rapidement le Itruc comme étant Internet "truc"xplorer .

Ah d'accord parce que oui en général Itruc c'est ce qu'à indiqué Laurie-Anne, ok, alors où en es-tu au niveau responsive design?

jmlapam a écrit :
Ah d'accord parce que oui en général Itruc c'est ce qu'à indiqué Laurie-Anne, ok, alors où en es-tu au niveau responsive design?

Pour le moment je retravaille ma charte graphique. Voici un petit test rapide : . Vous en pensez quoi par rapport à la version en ligne ? (le menu du bas est moche, mais je cherche un moyen de le mettre en valeur, idem pour les "menus torticolis".

En ce qui concerne le responsive design, cela m'oblige à totalement revoir mon carrousel d'article (afin qu'il affiche le nombre maximum d'articles possible verticalement bien sur). Mais le minimum sera 1024x600, avant de basculer vers une version "mobile" plus light.

Pour le iTruc, c'est la majuscule qui m'a induit en erreur (Itruc) :-p.
Modifié par lordfpx (22 Oct 2011 - 19:27)