[Jobetudiant.net] nouvelle mouture

jobetudiant · 11 Avril 2007

Salut a tous!

C'est le printemps, alors hop, je mets un grand coup de balai dans le designe de Jobetudiant.net!

J'aurais aime avoir votre feedback eclaire sur la nouvelle mouture (design, ergonomie, SEO...) et aussi des indications sur le fait que cela passe bien chez vous, ou non, avec vos configs!

Donc, c'est par la : -http://www.jobetudiant.net/?newStyle=OK

Pour la validation, sans les pubs : -http://www.jobetudiant.net/?newStyle=OK-NO-PUB

Pour reswitcher vers l'ancienne version : -http://www.jobetudiant.net/?newStyle=KO

Et une petite copie d'ecran pour que vous voyez ce que cela doit donner :

[img=http://img255.imageshack.us/img255/733/screenke0.th.jpg]

[Edit : Liens desactives]

maximee · 11 Avril 2007

Je trouve le design vraiment très sympa et réussi.

quelques bugs :

- le main n'est pas centré
- les liens rss chevauchent les images rss
- le moteur de recherche ne fonctionne pas
- le lien contact ne fonctionne pas

(firefox 1024/768)

Bonne continuation !

carole heinz · 11 Avril 2007

la police des liens en footer est trop petite, le machin donne carrément mal au crâne et est illisible!

j'aime bien le reste sinon...

jobetudiant · 11 Avril 2007

Merci!

la police des liens en footer est trop petite, le machin donne carrément mal au crâne et est illisible!

Tout a fait, je vais changer cela!

- le main n'est pas centré

Zut! En fait, l'espace des trois colones est centre, donc, effectivmenent, celle de gauche ne l'est pas... C'est grave Doc?

- les liens rss chevauchent les images rss

Mega Oups!

- le moteur de recherche ne fonctionne pas

Oui, c'est normal, je ne l'ai pas encore relie au moteur existant...

- le lien contact ne fonctionne pas

Encore Oups!

Sinon, j'ai 2 problemes sous IE :

- Le menu noir "bouge" lorsque l'on s'approche d'une des colones
- Lorsqu'un message d'erreur s'affiche -pour en voir un, entrez un email et un mot de passe bidon dans la boite de login-, il y a un probleme de transparence (cf copie d'ecran ci-dessous entre IE et FF)

maximee · 11 Avril 2007

Ie6 gère mal la transparence des fichiers png , ça a peut etre un rapport

essai cette solution :
-http://homepage.ntlworld.com/bobosola/pnghowto.htm

:?

zim3 · 12 Avril 2007

Ah bah on en arrive a du 2.0 designed même si il subsiste un poile de top moumoute corporate!

Mais dans l'ensemble ça fait bien plus pro!

david96 · 12 Avril 2007

Exact ! C'est du très bon boulot je trouve !

Voilà comment je le vois sur FireFox :
-http://zea.yoopix.org/1176337423/12332175/85/boulot.png

jobetudiant · 12 Avril 2007

david96 a dit:
Exact ! C'est du très bon boulot je trouve !
Voilà comment je le vois sur FireFox :
-http://zea.yoopix.org/1176337423/12332175/85/boulot.png

Bon, je viens de mettre un 100% pour le menu noir avec le question frequentes qui "wrappe". Pour le reste, avec les petites fleches jaunes qui sont decalées, je bloque! Je ne comprends pas d'ou cela vient

zim3 a dit:
Ah bah on en arrive a du 2.0 designed même si il subsiste un poile de top moumoute corporate!

Mais dans l'ensemble ça fait bien plus pro!

Alors ça! Je retiendrais la formule : "top moumoute corporate"!

Content que cela te plaise ;-)

Sinon, j'ai modifié le footer aussi... Si vous voyez d'autres points à rajouter/ajouter, je suis preneur!

Merci à tous pour votre aide!

jobetudiant · 12 Avril 2007

Pour le PNG dans les CSS (ce qui est mon cas, l'astuce ne marchait pas.... ) Par contre, celle-ci, si : http://www.sarudansei.com/index.php?200 ... nt-sous-ie

Audiofeeline · 12 Avril 2007

maximee a dit:
Ie6 gère mal la transparence des fichiers png , ça a peut etre un rapport

Ie6 c'est du passé. :lol: :lol: :lol:
Je profite de cette boutade pour vous dire qu'il va être interressant de regarder du coté de Ie7 car y'a pas mal de changements niveau affichage (en bien comme en mal)...

zim3 · 12 Avril 2007

jobetudiant a dit:
Alors ça! Je retiendrais la formule : "top moumoute corporate"!

Content que cela te plaise ;-)

Il s'agit en fait d'une expression de Malaiac customisé

Audiofeeline a dit:
Ie6 c'est du passé. :lol: :lol: :lol:
Je profite de cette boutade pour vous dire qu'il va être interressant de regarder du coté de Ie7 car y'a pas mal de changements niveau affichage (en bien comme en mal)...

Merci de la note... de bon matin ça donne envie de retourner au pieux

jobetudiant · 12 Avril 2007

Ou d'y aller... Vous n'avez pas donné votre avis après les modifs!

zim3 · 12 Avril 2007

Le menu du haut est saoulant, en plus il se bloque (je veux dire quand on sors, on a la liste déroulante qui ne se vire pas...)

Bref pas tres pratique...

Le footer j'adore, très "2.0 designed very worldwide top compliant"!

carole heinz · 12 Avril 2007

problème effectivement avec le menu du haut, avec mon petit écran certaines catégories se déroulent un peu n'importe où (à droite puis en bas au lieu que tout se "déroule" en bas)

jobetudiant · 12 Avril 2007

En fait, il ne se ferme pas, car je n'arrive pas à le faire fonctionner avec IE... Si je rajoute le js pour le fermer dès que la souris s'en éloigne, FF le fait bien et IE le ferme intempestivement, de telle manière qu'il est impossible de s'approcher des elements du sous-menu...
Grrr

carole heinz · 12 Avril 2007

je parlais d'un autre problème, dans l'OUVERTURE du menu: les premiers sous-menus s'ouvrent parfois à droite du principal puis en -dessous

jobetudiant · 12 Avril 2007

Ha mince...

Tu peux me faire une copie d'ecran et/ou me dire sur quelle config tu es? OS et Navigateur pour que j'essaie de reproduire cela?

Merci pour ta precieuse aide!

CashAttitude · 12 Avril 2007

A propose des flèches jaunes, j'imagine que tu parle de ceux du menu :?:
-> JOBS ETUDIANTS etc

Ss FF2, elle pointent vers le haut des lettres :roll:
Essaie un coup de vertical-align: -Xpx sur les images des fleches genre un -3px

jobetudiant · 12 Avril 2007

Hum... J'ai encore pas mal de problemes, c'est dur le CSS!

* J'ai un probleme de "wrapping" uniquement sous IE dans ma barre du sommet.

Quand la fenetre est assez grande :

Et si je reduis :

* J'ai aussi un probleme avec mon Menu noir sous IE.

Sous Firefox, c'est ok :

Et sous IE, les "titres" des menu grandissent :evil: :

Si vous avez la moindre idee pour ces deux problemes, je suis preneur

jobetudiant · 12 Avril 2007

Ss FF2, elle pointent vers le haut des lettres Rolling Eyes
Essaie un coup de vertical-align: -Xpx sur les images des fleches genre un -3px

Oki, merci!

CashAttitude · 12 Avril 2007

Pour ton menu, tu devrais laisser tomber le javascript. Je suis surpris que tu ne t'es déja pas fait lynché

Un menu avec des proriétés CSS hover ferait l'affaire.
En tout cas si tu laisse ça en javascript, fais un évenement qui cache le menu quand la souris sort du menu parce que c'est bien agacant sinon

carole heinz · 12 Avril 2007

voici ce que j'obtiens quand je pointe le mulot sur "recruteurs"

(WIN98 / Mozilla-FF / 1024*768 )

jobetudiant · 12 Avril 2007

Pour ton menu, tu devrais laisser tomber le javascript. Je suis surpris que tu ne t'es déja pas fait lynché Wink
Un menu avec des proriétés CSS hover ferait l'affaire.

J'ai essaye avant le Javascript.. mais j'ai laisse tombe car je n'y arrivais pas! Si une ame charitable veut bien essayer de m'expliquer ce que je dois faire, je lui serais infiniment reconnaissante!

carole heinz > Heu.. tu regardes l'ancienne version.. qui va etre supprimee dans quelques jours, donc je crois que je ne vais pas me prendre le chou! Desole...

Pour le nouveau : http://www.jobetudiant.net/?newStyle

Merci quand meme!

carole heinz · 12 Avril 2007

ok, jme disais bien que c'était bizarre par rapport aux captures précédentes...

bon ben je sors.

CashAttitude · 12 Avril 2007

jobetudiant a dit:
Pour ton menu, tu devrais laisser tomber le javascript. Je suis surpris que tu ne t'es déja pas fait lynché Wink
Un menu avec des proriétés CSS hover ferait l'affaire.

Cliquez pour agrandir...

J'ai essaye avant le Javascript.. mais j'ai laisse tombe car je n'y arrivais pas! Si une ame charitable veut bien essayer de m'expliquer ce que je dois faire, je lui serais infiniment reconnaissante!

Il y a bien de la documentation sur internet

une recherche sur menu css sans javascript devrait te donner beacoup de ressources

Kwaelbi · 12 Avril 2007

Unue petite suggestion :

Sur cette page : -http://www.jobetudiant.net/etudiant/recherche-job-etudiant.php il faudrait que mettre dans le menu déroulant "Choisissez le type de job:" une possibilité de tout afficher je pense

Sinon le design est très beau même si moi personnellement je ne m'y retrouve pas trop et je trouve un peu compliqué enfin ça reste très bien réussi !

jobetudiant · 13 Avril 2007

Il y a bien de la documentation sur internet Smile
une recherche sur menu css sans javascript devrait te donner beacoup de ressources

Bon, je confirme, je viens de passer un moment à chercher, et pour IE6 et avant, la technique du :hover ne marche que si on a affaire à une balise <a>, ce qui n'est pas mon cas. Certains préconisent de passer par un fichier htc, mais cela revient quand même à utiliser du Javascript, donc je ne me prends pas le chou à faire du CSS pour ce menu là, tant que plus de 0,1% utilisent IE6 et en dessous!

Bon, j'ai resolu le probleme des tailles de liens du menu qui changeaient en rajoutant un petit "postion:aboslute"!

Sur cette page : -http://www.jobetudiant.net/etudiant/recherche-job-etudiant.php il faudrait que mettre dans le menu déroulant "Choisissez le type de job:" une possibilité de tout afficher je pense

En fait, si tu veux voir tous les jobs, tu cliques sur "tous les jobs", non? Bon, je vais voir si je rajoute "Indifferent" là aussi!

Tu trouves que le site est compliqué : c'est à dire?

Dans un tout autre sujet, j'ai un autre problème :
Je n'arrive pas à fermer mes message d'erreurs sous IE, alors que cela marche sous FF sans problème.
Pour tester: entrez un email et un mot de passe bidon dans le menu noir et vous verrez un zoli message d'erreur, qui devrait se fermer si vous cliquez sur "fermer"...
Ca le fait sous FF et ca le fait pas sous IE.
Il semblerait que cela soit un "dommage collateral" de AlphaImageLoader que j'ai rajouté pour avoir de la transparence sous mes PNG avec IE. Plusieurs blogs/sites/forums evoquent la solution qui consisterait à mettre un a {position:relative; z-index:1}... Mais dans mon cas, cela ne marche pas. bawling

Merci pour votre aide! Je suis sûr que vous avez la solution, dans un coin ;-)

Je suis même prêt à faire un petit effort financier si l'un de vous m'aide! (MP)

CashAttitude · 13 Avril 2007

Tes flèches sont presques alignés maintenant encore un petit effort ?

maximee · 13 Avril 2007

Pour ton prob de fermeture de popup tu ne peu pas mettre un onclick="HidePopup('alerte');" pour le div.

Sinon il y a un petit prob sous ie 7 , ton menu (bande noire) est décalé vers la droite.

jobetudiant · 13 Avril 2007

Pour ton prob de fermeture de popup tu ne peu pas mettre un onclick="HidePopup('alerte');" pour le div.

Ben, en fait, j'utilise la meme pop-up pour d'autres messages sur le site et parfois/souventm il y a un lien dans le texte... donc, si je mets le onlick sur le div, je ne peux plus prendre en ccompte ces liens la... Grrr!

Sinon il y a un petit prob sous ie 7 , ton menu (bande noire) est décalé vers la droite.

Je suis desole, je n'ai pas d'IE 7 pour tester sous la main.. Tu aurais moyen de me mettre une copie d'ecran?

Ju

maximee · 13 Avril 2007

Pour les screens ie7 :

http://img131.imageshack.us/img131/9688/screen1vu2.png

http://img131.imageshack.us/img131/826/screen2wa5.png

float ?

:?

jobetudiant · 13 Avril 2007

Screugneugneu!

Bon, je pense que c'est parce que j'ai rajoute un hack CSS pour IE6 et qu'IE 7 le prend en compte alors qu'il ne devrait pas... Quelqu'un sait limiter cela?

Merci pour ton aide!

Les autres, vous en pensez quoi?

maximee · 13 Avril 2007

Pour revenir sur la popup... tu peux peux essayer d' insérer ce lien <a href="javascript:hidePopup('alerte')">fermer</a>

:?

jobetudiant · 13 Avril 2007

Pour revenir sur la popup... tu peux peux essayer d' insérer ce lien <a href="javascript:hidePopup('alerte')">fermer</a>

Ben, c'est ce que j'ai maintenant!

Code:

<a onclick="javascript:hidePopUp('alerte');">
    Fermer
</a>

et

Code:

function hidePopUp(id) {
	var d = document.getElementById(id);
	d.style.visibility='hidden';
}

maximee · 13 Avril 2007

oui

mais je parlais d'essayer le href plutot que le onclick ...

après je suis pas spécialiste ^^ ...

jobetudiant · 13 Avril 2007

J'avais essaye aussi... Cela ne marche pas plus, et pour FF, cela "reload" la page... donc, l'inverse de l'effet voulu!

jobetudiant · 14 Avril 2007

Alors, pas de champion du CSS pour m'aider à résoudre mon problème?

Je n'arrive pas à fermer mes message d'erreurs sous IE, alors que cela narche sous FF sans problème.
Pour tester: allez sur http://www.jobetudiant.net/?newStyle=KO puis entrez un email et un mot de passe bidon dans le menu noir et vous verrez un zoli message d'erreur, qui devrait se fermer si vous cliquez sur "fermer"...

Ca le fait sous FF et ca le fait pas sous IE.

Il semblerait que cela soit un "dommage collateral" de AlphaImageLoader que j'ai rajouté pour avoir de la transparence sous mes PNG avec IE. Plusieurs blogs/sites/forums evoquent la solution qui consisterait à mettre un a {position:relative; z-index:1}... Mais dans mon cas, cela ne marche pas.

Merci pour votre aide! Je suis sûr que vous avez la solution, dans un coin!

Je suis prêt à vous "rémunérer" contre ce petit coup de main si vous trouvez (MP)

jobetudiant · 14 Avril 2007

Wouai!

Cash Atitutde a trouvé une solution : j'afiche un Gif pour IE6-... j'ai pas les ombres, mais c'est apparement ce qu'il y a de plus simple1

Merci à lui!

maximee · 15 Avril 2007

une autre solution trouvée sur le net :

entourer ton lien par un div

jobetudiant · 16 Avril 2007

Bon à savoir effectivement, même si ce n'est pas très propre d'un point de vue "sémantique"! Je vais tester cela aussi!

Merci pour ta persévérance!