Ya du CSS dans la pomme (www.pommedepain.org)

Bonjour à tous !

Quand on réalise un design pour un site, on l'adapte parfois en fonction des possibilités offertes par les langages utilisés (bien que le XHTML + CSS laisse beaucoup de liberté). Cependant, il n'est pas toujours possible de modifier le design. Surtout quand on se colle à un design existant*...

Je viens de terminer la conversion en full CSS du site de Pomme de p'Ain, autrefois géré en table (hé oui...).

Merci aux aficionados du Mac et du CSS de me donner leur avis sur le résultat.

Utilisateurs d'internet explorer s'abstenir, ce n'est pas encore compatible

*le débat n'est pas là et s'est déjà fait par ailleurs

Très sympa le design

Testé avec Firefox (sur mac), on a un petit problème de hauteur avec le dock qui rentre dans la fenêtre lorsque la fenêtre est trop petite. Ainsi, même s'il est théoriquement possible de voir le site en 800 par 600, dans la pratique c'est pas tip-top.

À vue de nez, je suppute que la fenêtre a une dimmension en pourcentage (genre 70%)… du coup, l'espace libéré en bas varie en fonction de la hauteur de la fenêtre.
Je ne sais pas trop s'il y a des moyens de feinter ça (il faudrait pouvoir dire 100%-Npx…).

Et sinon : pourquoi pas une liste pour le dock, et pourquoi les liens sont-ils tous positionnés en relatif ?

Merci pour tes remarques mpop !

mpop a écrit :
Très sympa le design

Faut dire, j'ai travaillé beaucoup pour l'imaginer

a écrit :
Testé avec Firefox (sur mac), on a un petit problème de hauteur avec le dock qui rentre dans la fenêtre lorsque la fenêtre est trop petite. Ainsi, même s'il est théoriquement possible de voir le site en 800 par 600, dans la pratique c'est pas tip-top.

Oui, j'ai remarqué mais je me suis dis, après tout, une fenètre peut tout à fait passer sous le dock sur Mac alors tant pis pour les petits écrans

a écrit :
À vue de nez, je suppute que la fenêtre a une dimmension en pourcentage (genre 70%)… du coup, l'espace libéré en bas varie en fonction de la hauteur de la fenêtre.
Je ne sais pas trop s'il y a des moyens de feinter ça (il faudrait pouvoir dire 100%-Npx…).

Eh oui, c'est exactement ça. Mais à part ajouter du Javascript, je ne voie pas de soluce...

a écrit :
Et sinon : pourquoi pas une liste pour le dock,

Pour avoir un affichage propre sans la feuille de style.

a écrit :
et pourquoi les liens sont-ils tous positionnés en relatif ?

C'est à dire ? J'ai pas bien compris là...

J'utilise IE 7 donc je réponds pas...
Sinon très bon design !! Je n'ai pas trop regardé le code par contre...
Modifié par Shikamaru (29 May 2006 - 17:56)

Je suis sous Firefox 1.5 / Mac os 10.4

Très joli

Cependant, je trouve les menus un peux trop transparents (mais ça c'est vraiment une question de gout ^^).
Aussi, tes menus ont des ombres sauf spotlight.
L'agenda est tout petit, c'est normal?
http://static.flickr.com/48/155625933_fe26453461_o.jpg

Whisno a écrit :
Cependant, je trouve les menus un peux trop transparents (mais ça c'est vraiment une question de gout ^^).

C'est vrai, je trouvais aussi. J'ai foncé un poil.

a écrit :
Aussi, tes menus ont des ombres sauf spotlight.

J'hésite à le faire... La flegme

a écrit :
L'agenda est tout petit, c'est normal?

Ah oui, j'vais pas fais gaffe sur FF. C'est une inclusion via object. Il est réglé à 100% dans un block lui même réglé en pourcentage. Ce devrait bien aller pourtant...

En tout cas, c'est un joli boulot tout ça !
Le coup du pourcentage et du dock qui passe au dessus de la fenêtre n'est pas tip-top, mais en l'absence de véritable solution, ça ira bien.

Petit truc : quand je clique sur le bouton de fermeture (qui renvoie à l'accueil il me semble), le bloc qui contient le lien double en hauteur, ce qui allonge toue la zone de titre. C'est assez étrange (constaté avec Firefox 1.5).
À propos, dans le title de ce lien, ne vaudrait-il pas mieux indiquer « Revenir à l'accueil » plutôt que « Fermer » ? Il y a des limites au mimétisme, et en l'occurence le comportement lorsqu'on clique sur ce lien est différent.

Ou alors, faire une page avec le bureau vide (voire avec une petite image de fond), comme ça si on reveut l'accueil, il faut cliquer sur le lien du dock, et on retrouve une fenêtre.

Les deux solutions sont intéressantes.

a écrit :
— Et pourquoi les liens sont-ils tous positionnés en relatif ?
— C'est à dire ? J'ai pas bien compris là...

Ah ben non, c'est flottant. Je me suis emmêlé les pinceaux avec les menus de la webdeveloper toolbar. Autant pour moi.

a écrit :
— Et sinon : pourquoi pas une liste pour le dock ?
— Pour avoir un affichage propre sans la feuille de style.

Ah ? Je trouve pourtant que les listes à puces sont plus propres que les simples successions de liens. Mais pourquoi pas, après tout. Faudrait demander à un utilisateur de navigateurs texte ou de lecteur d'écran comment ils préfèrent leurs listes de liens.
Sans feuille de style, le but est d'être fonctionnel, non ?

Salut,
Graphiquement, c'est ce qui s'appelle en faire le minimum. Reprendre l'interface OS X avec les icones c'est crier à la face du monde : je n'ai pas d'imagination...

Cela pose aussi un problème de copyright... les logos et icones, et plus largement l'interface, sont des éléments déposés. Qu'en pense Apple france ? C'est une chose de s'inspirer de l'existant, s'en est une autre de reprendre tel quel.

Bref...

Hors-sujet : alors iXprim sous mac ?
Modifié par fredmac (30 May 2006 - 00:28)

fredmac a écrit :
je n'ai pas d'imagination...

L'imagination, c'est très surfait.

fredmac a écrit :
Cela pose aussi un problème de copyright... les logos et icones, et plus largement l'interface, sont des éléments déposés.

Je pense que tant que ce n'est ni site parodique, ni un site commercial, ça ne devrait pas poser de problèmes.
Ce n'est pas Apple qui diffusait une série de ressources pour les webdesigners des Apple User Groups, dans le but de renforcer sa politique de visibilité, et d'unifier un peu les différentes chartes graphiques ?

Salut mpop

mpop a écrit :

L'imagination, c'est très surfait.

Tout à fait, au même titre que de faire une recherche par ses propres moyens...

Il y a sur ce forum des lecteurs qui s'essaient à la création... même si les résultats sont parfois décevant, la démarche mérite d'être encouragée...
Je ne peut pas encourager (cautionner) la facilité, le pompage et la vue courte...

mpop a écrit :
Je pense que tant que ce n'est ni site parodique, ni un site commercial, ça ne devrait pas poser de problèmes.

Oui et non... reprendre quelques éléments c'est une chose. Reprendre l'intégralité s'en est une autre...il auraient au moins pu personnaliser les icones comme cela ce fait sur mac via candybar et consort ; s'eût été le minimum syndicale graphique

mpop a écrit :
Ce n'est pas Apple qui diffusait une série de ressources pour les webdesigners des Apple User Groups, dans le but de renforcer sa politique de visibilité, et d'unifier un peu les différentes chartes graphiques ?

Non, depuis 6/7 ans les logos on toujours été à disposition des webmaster sur le site de la pomme... mais juste les logos, pas l'intégralité des interfaces...

Je suis surpris par le fait que la reprise intégrale semble ne pas te choquer du double point de vue de l'absence de recherche graphique et des problèmes que cela soulève sur le pompage... l'un et l'autre étant bien évidemment lié...
Modifié par fredmac (30 May 2006 - 09:14)

fredmac a écrit :
Salut,
Graphiquement, c'est ce qui s'appelle en faire le minimum. Reprendre l'interface OS X avec les icones c'est crier à la face du monde : je n'ai pas d'imagination...

Cela pose aussi un problème de copyright... les logos et icones, et plus largement l'interface, sont des éléments déposés. Qu'en pense Apple france ? C'est une chose de s'inspirer de l'existant, s'en est une autre de reprendre tel quel.

Merci pour tes remarques. Je suis d'accord avec toi sur ces deux points mais comme je l'indiquais dans mon message de départ :

a écrit :
*le débat n'est pas là et s'est déjà fait par ailleurs

L'utilisation de l'interface de MacOS X est surtout pour la "performance" de faire coller un design existant et connu à un système de gestion de contenu, ceux-ci n'étant pas toujours très simple à customizer...
Et pour mon manque d'imagination, je t'invite à visiter mon site

a écrit :
Hors-sujet : alors iXprim sous mac ?

iXprim est un CMS écrite PHP/MySQL donc qu'il soit sous Mac, Unix, Windows ou autre ne change pas grand chose

Salut,

Je partage un peu l'avis de Fredmac... Reprendre l'univers existant de mac n'est pas réellement original... Surtout que si tu fais ca il vaudrait mieux le faire parfaitement, or ce n'est pas le cas...

Destiné aux utilisateurs de macs, perso le bureau de mac OS c'est comme le bureau windows, j'en ai marre de le voir, donc répéter ca une fois de plus dans un site est un peu ennuyeux... Surtout que les icones et raccourcis si fidèlement reproduits comme des toutous dociles ne conduisent pas à la même destination que sur un mac, la laisse conduisant à une destination différente...

Bref pas la perfection d'imitation, ni non plus de petite touche perso qui rendrait plus intéressant le thème choisi... Pas réellement d'intérêt donc...
Désolé mais je préfère dire ce que je pense.

fredmac a écrit :
Je ne peut pas encourager (cautionner) la facilité, le pompage et la vue courte...
[...]
Reprendre l'intégralité s'en est une autre...il auraient au moins pu personnaliser les icones comme cela ce fait sur mac via candybar et consort ; s'eût été le minimum syndicale graphique
[...]
Je suis surpris par le fait que la reprise intégrale semble ne pas te choquer du double point de vue de l'absence de recherche graphique et des problèmes que cela soulève sur le pompage... l'un et l'autre étant bien évidemment lié...

Je ne voulais vraiment pas qu'on discute de ça mais bon...
Je sais pertinemment qu'Apple est très difficile avec le pompage de son interface graphique. Je me suis d'ailleurs dit en lançant le site l'année dernière que je serai peut-être confronter à des problèmes relationnels ou juridiques avec les Ulis, voir même Cupertino et que j'aviserai le moment venu. Mais rien ! Pas même une carte postale
Alors je laisse le site comme ça, parce que même si il n'y a pas de recherche graphique, même si le site n'est pas toujours très pratique, il y a un peu d'originalité puisque je n'ai vu nulle part ailleurs un site entièrement interfaçé comme celui-ci

Bref, mon post était plutôt sur la technique que sur mon manque d'imagination et mon talent de plagieur

En tous cas, merci à toi pour tes remarques.

mpop a écrit :
Petit truc : quand je clique sur le bouton de fermeture (qui renvoie à l'accueil il me semble), le bloc qui contient le lien double en hauteur, ce qui allonge toue la zone de titre. C'est assez étrange (constaté avec Firefox 1.5).

Effectivement. J'ai pas testé suffisamment FF car j'avais pas remarqué.
D'une manière générale, j'ai l'impression que Safari réagit quand même mieux que FireFox au niveau des CSS. Ne serait-ce qu'avec text-shadow qui n'est pas pris en compte par FF alors que c'est du CSS2...
Enfin, bref, il faut que je trouve une solution à se problème.

a écrit :
À propos, dans le title de ce lien, ne vaudrait-il pas mieux indiquer « Revenir à l'accueil » plutôt que « Fermer » ? Il y a des limites au mimétisme, et en l'occurence le comportement lorsqu'on clique sur ce lien est différent.

Mouais, effectivement...

a écrit :
Ah ben non, c'est flottant. Je me suis emmêlé les pinceaux avec les menus de la webdeveloper toolbar. Autant pour moi.

Ya pas de mal

a écrit :
Sans feuille de style, le but est d'être fonctionnel, non ?

Ah, les goûts et les couleurs...
Mais tu l'a regardé le site sans style ? Ca reste fonctionnel non ?

Merci pour tes remarques constructives mpop !

pgilbert a écrit :
Mais tu l'a regardé le site sans style ? Ca reste fonctionnel non ?

J'aime bien l'aspect clairement structuré de la liste à puces. On sait où commence l'intitulé d'un lien, et où on passe au suivant. Mais bon, c'est pas capital.

....

Salut à tous , et pour en revenir au CSS , à la ligne 1099 :

padding-left:a95f1; ???? c'est plutot une couleur çà ?

Au niveau graphique , je trouve le menu du bas "décalé" par rapport au
bloc du texte ...
Lors d'un changement de dimension hoizontal de la fenetre l'alignement n'est plus le meme par rapport à la zone texte !!!

sinon bon travail au niveau des "détails"

++
Modifié par kilzon40 (31 May 2006 - 01:46)

fredmac a écrit :
Il y a sur ce forum des lecteurs qui s'essaient à la création... même si les résultats sont parfois décevant, la démarche mérite d'être encouragée...
Je ne peut pas encourager (cautionner) la facilité, le pompage et la vue courte...

Mouais, disons que c'est ta manière de voir les choses.
Pour info, je ne suis pas un grand fan de l'interface d'Aqua, ou des tentatives de skinage qui reprennent un style existant. L'exercice de style est sympa, mais pour moi-même je n'utiliserais pas ce genre de chose (ça vaut pour les sites web, les thèmes Gnome ou KDE, etc).

N'empêche, les jugements de valeur (puisqu'il s'agit de cela) sur fond de « Hou c'est pas original, c'est du plagiat, c'est mal ! » m'énervent au plus haut point.

a écrit :
Je suis surpris par le fait que la reprise intégrale semble ne pas te choquer du double point de vue de l'absence de recherche graphique et des problèmes que cela soulève sur le pompage... l'un et l'autre étant bien évidemment lié...

Hé oui, je suis quelqu'un de surprenant. Mais effectivement, ça ne me choque pas le moins du monde.

Absence de recherche graphique
La recherche graphique n'est pas une vertu en soi. À vrai dire, même si pendant un temps elle m'a captivé, à force de voir des choses "recherchées" j'avoue que ça m'emmerde. À l'opposé, j'estime que le simple copiage est une démarche intéressante. Personnellement et artistiquement.
On se situe ici sur un terrain idéologique houleux, même si le consensus est plutôt à la consécration de l'originalité. Consensus qui coure depuis le 19e siècle, quand on y pense.

Problèmes que ça soulève
Si tu parles de problèmes juridiques, je suis pas mal rencardé sur la question. Contrefaçon de droit d'auteur, contrefaçon de marques, pour l'essentiel.

Si pgilbert avait fait cette feuille de style pour un client ou pour son site personnel, je lui aurais signalé ces risques, ainsi que quelques considérations stratégiques sur le mauvais service qu'il se rendrait à lui-même ou qu'il rendrait au client en brouillant le message sur l'identité. Par contre, pour un Mac User Group, je n'y vois pas de problème de communication ou de problème idéologique particulier. Reste juste le problème juridique, qui est tout de même assez simple : le pire qui puisse arriver, c'est une lettre avec demande expresse de supprimer ce design.
Modifié par mpop (10 Jun 2006 - 01:04)

Niveau design je trouve ça marrant d'avoir fait un style macintosh

Joli boulot ! quoi qu'on dit...
Sous IE PC c'est effectivement la cata, mais ce n'est pas un site qui va beaucoup intéresser les utilisateurs de IE sous PC, non ? Donc pas grave ...
Moi je suis multi-plateformes donc je fais comme je veux na !
Par contre pendant que tu y est colles-y ( ça c'est régional ...) donc des backgrounds transparents à tes icônes dans le dock et comme ça ce sera tout pareil ... ( oh ! c'est rien 11 icônes à refaire avec un px sur 2 )
Bon sans rire, c'est super et je n'ai pas eu le temps de bien décortiquer le code, mais ce que j'en ai vu c'est de la dentelle ... serrée la dentelle !!!

Bon boulot