Ooh Oui !!

Ooh Non !!...



Sérieusement, c'est déjà le cas. J'ai créé un site en utilisant un effet de transparence pour superposer du texte sur une image... quelle ne fut pas ma surprise de voir la tronche du site sur Internet Explorer ! Le bloc transparent est blanc opaque et masque tout simplement la photo... une horreur.

Ça ne me console pas que les utilisateurs de Safari le voient correctement.

Mon neveu a trouvé la solution pour que les utilisateurs d'Explorer ne soient pas désavantagés :

http://web.mac.com/gaspardmorel/iWeb/Gugus.../Bienvenue.html

Bonjour,

En ce qui concerne la transparence sous IE, il me semble que tous mes projets web, sont maintenant, a peu de choses près, bien gérés par IE7 et sans hack. Après, les utilisateurs qui ne seraient pas à jour, j'ai pris le parti, de ne plus m'en soucier.
Cependant Safari est un très bon navigateur.

Ton neveu est un intellectuel, ça se voit, il aime la reflexion !

OK ->

Oui, mais lui, c'est un vrai ado, pas un ado attardé ;-)

C'est sympa mais il ne faudrait pas non plus que ce soit une nouvelle manière de ne pas être accessible. Le text-shadow qui ne s'affiche pas sur certains navigateurs ne pose aucun problème, mais là, ça gène franchement.

Aujourd'hui je me suis justement fait cette réflexions : Je suis rentré à l'école à 6 ans, je n'en suis jamais ressorti

C'est le format d'image png transparent qui n'est pas reconnu par IE (il a déjà fallu du temps pour que le png tout court le soit !!).

Pour ce qui est des nouvelles fontionnalité de safari, au boulot on en me demande même pas la compatiblité avec safari, Firefox est demandé par mes boss, mais pas toujours par les clients... Il y a encore du chemin a faire...

Je tiens à souligner qu'Opera est aussi un excellent navigateur qui respecte les standards, et camino qui même si il n'a pas les extentions de Firefox est un petit navigateur très rapide et performant (un peu moche, et manque de racourcis...mais bon)



Safari est un navigateur à part

si tu veux faire de l'ajax avec une tartine de javascript, pour le rendre compatible avec le reste y'a du boulot :s

Je confirme, c'est bien la transparence du png qui pose problème à IE (quid de la V7 ?).

Le neveu est un malin

Si Safari se crée des fonctionnalités "propriétaires", il risque de faire la même chose qu'IE : se mettre en marge des standards... sauf que M$ a cru pouvoir s'en moquer avec ses 95% du parc mondial, mais Apple

Si tu veux que ça marche dans IE, il faut utiliser un png transparent en fond de bloc et installer le script IE7 dans tes pages. Je le fais souvent. Ça fonctionne très bien et ça a l'avantage de permettre d'utiliser des transparents en png 24bits beaucoup plus jolis que le gif parfois un peu baveux. Bien lire toute la doc sur le site de Dean Edwards car il faut que le nom des png transparents finisse par "-trans" pour que ce soit pris en charge. Seul hic avec IE, une image png ainsi traitée ne supporte pas le positionnement en fond de bloc. Dommage que tous les brouteurs n'affiche pas les ombres et les transparence. Mais ça devrait venir.

Je vais quand même y aller de mon exemple avec une page dont les images ne sont que des transparents (pour les ombres) sur fond uni. Ça fera monter le pagerank. Oui je suis un vilain spammeur des forums Macplus.

:-))


Ça dépend comment tu l'utilises. On peut très bien faire de l'ombré lisible sans l'ombre.


IE7 fait bien le png transparent et le script dont je parle fait le tri entre les vieux IE et les nouveaux. Safari ne fait pas de trucs proprio ce sont des trucs CSS3 et à chaque fois si le navigateur ne sait pas gérer, c'est moins joli mais pas grave, ça reste lisible puisque les caractères n'ont pas de bordure et c'est tout.

Juste pour l'info, bien avant safari , iCab avait passé avec succés le test CSS Acid2.

C'est bien joli toutes ces ombres sous les textes mais ça reste une fonction propre à un navigateur. Dans la même veine, on peut arrondir les blocs mais ça n'est visible qu'avec les navigateurs utilisant le moteur de Mozilla (Mozilla, Firefox, Camino, etc). Si on commence à mettre du code spécifique à tel ou tel navigateur, on va retomber dans les travers d'antant. Toutes ces fioritures seront un jour intégrées dans CSS 3, en attendant, commençons par écrire du code CSS 2 bien propre, passant sans encombre les tests de validation W3C, et lisible par tous les navigateurs.
En ce qui concerne IE6, c'est une daube ça on le sait déjà, mais cette daube restera encore un moment le navigateur le plus utilisé, vu que IE7 ne tourne pas avec les Windows antérieurs à XP SP2.
Safari est certe en avance sur les autre navigateurs, mais il n'existe que sur Mac soit 5% du marché. Il faut donc se concentrer sur IE6 et Firefox qui sont les navigateurs les plus courants. Si les pages sont bonnes avec ces deux navigateurs,elles seront bonnes avec les autres.

Firefox fait les transparences, coins arrondis et colonnes, mais pas les ombres. Le prochain Safari (Leopard) fera en plus des ombres et des caractères bordurés, les arrondis, les colonnes, le style des formulaires. Safari et Konqueror (qui fait les ombres etc.) font près de 10%, Firefox 20% à 40% suivant les pays voir plus suivant les sites visités… Je ne vois pas pourquoi utiliser les CSS3 ça n'a rien de gênant. D'ailleurs le nouveau validateur prend en charge CSS3 pour peu que l'on clique sur « Options supplémentaires ».

Cela dit, chacun fait, fait, fait… ce qui lui plaît, plaît, plaît…

Tout ceci confirme ce que je dis, chaque navigateur fait sa soupe dans son coin. Ces nouvelles fonctions ne sont pas encore reconnues par tous les navigateurs et la syntaxe n'est pas encore normalisée. Si l'on veut avoir une page au rendu identique d'un navigateur à l'autre, il faut être sûr de l'universalité des fonctions utilisées.
C'est déjà assez compliqué come ça, pas la peine d'ajouter des fonctions non standard.

C'est standard puisque c'est CSS3 Chacun fait, fait, fait… ce qui lui plaît, plaît, plaît…

Eh bien ça me conforte dans ce que je pense, il faut faire simple et puis c'est tout ^^

J'entends par là un document xhtml sémantique et un css qui va droit au but (pas de hack pour réussir tel ou tel petit truc pas forcément utile).

En tout cas, cette techniques porte ses fruits dans mon cas.

C'est ton boulot ou un hobbie ?
Je peux toujours pas me passer de hacks, ne serait-ce que parce que IE et Firefox n'ont pas les mêmes règles pour les tailles de blocs, ou les mêmes réactions au float, et au boulot on développe des grosses appli ajax avec pleins de boites, de colonnes etc... le gros dawa quoi.

Essaie donc IE7 le script. Comme par magie, tout tes ennuis avec IE, de boîtes et autres roll-over, first-letter, enfants, etc. disparaîtront. Je n'utilise plus que cela. Sérieux. Ça va te faire gagner du temps autrefois passé à s'arracher les cheveux à cause de la grosse daube. Il guérit tout, ou presque.

supports the following CSS selectors:
namespace|selector
parent > child
adjacent + sibling
adjacent ~ sibling
[attr], [attr="value"], [attr~="value"] etc
.multiple.classes (fixes bug)
:hover, :active, :focus (for all elements)
:first-child, :last-child, only-child, nth-child, nth-last-child
:check, :disabled, :enabled
:root, :empty, :contains(), :not()
:before/:after/content:
:lang()
works with both HTML and XML documents
supports imported style sheets
preserves the cascade of the style sheet
does not alter the document structure
does not repeatedly query the DOM tree using JavaScript
uses pure CSS to enforce style sheet rules
supports the W3C box model in both standards and quirks mode
supports fixed positioning (flicker free)
supports overflow:visible
supports min/max-width/height
fixes broken (X)HTML elements (abbr, object)
standardies forms behavior
supports PNG alpha transparency
lightweight script (22K)
completely modular (add/remove fixes)
works for Microsoft Internet Explorer 5+ (Windows only)

Sérieux, sérieux, ça marche du tonnerre ce truc. Vaut le détour. Fini les hacks. Et grâce à son installation avec commentaires conditionnels il reconnaît le bon (façon de parler) IE du mauvais.

En attendant, ils feraient mieux d'afficher les sites correctement au lieu de faire du zèle à 2 balles, respecter le "CSS d'acid" pour les geeks de californie, yena rien à f.utre.
Moi je veux pouvoir passer commande sur la SNCF, aller sur EBAY, afficher des dizaines de sites qui marchent sans problèmes avec Firefox (qui lui aussi est MAC) : bref surfer quoi !!!

Nous sommes bien d'accord. Pas de hack. C'est super de faire de l'ombre avec une simple déclaration CSS. Oublié le lourd PNG transparent pour la titraille…


Curieux. Chez moi ça marche aussi sous Safari tout ça. Pas comprendre.

Safari ne crée pas des fonctionnalités propriétaires, au contraire il implémente des fonctionnalités normalisées par la www organaisation :

http://www.w3.org/TR/REC-CSS2/text.html#text-shadow-props


Agree 120%

Cela dit la w3 pond des normes pour permettre justement au navigateurs d'implémenter, dans les normes, les fonctionnalités, prévues, qu'ils veulent. Pourquoi donc se gêner ? Coïtus interruptus ?


Comment veux tu que cela soit reconnu par *tous* les navigateurs si *aucun* ne commence à l'implémenter ?

hé non mais sans blague ! quand est-ce qu'ils s'attaqueront à de vrais trucs sérieux, genre le support du WYSIWYG dans les textareas ? ce serait bien, ça, pas vrai ? ça permettrait d'utiliser Safari pour les back-offices aussi ! mais quelle fatigue...

Le html est assez récent, donc pour le moment il n'y a pas vraiment eu de divergences, mais sans le W3C, et si beaucoup de développeurs ne s'y mettaient pas, on se retrouverai avec autant de langages html qu'il y a de navigateurs : en gros MS auraient la main mise partout et on serait toujours en tableau, sans onglets etc...

Je vais jetter un oeil au script merki !


ca existe ! ca s'appelle FCK éditor, ca marche en xhtml et html... y'en a plein ! Après, faut voir la taille que ca a dans les BDD !!!!

On parle de navigateurs, pas de logiciels de PAO ça n'est pas la même chose. Ne pas confondre.

Et comme dirait l'autre : ça n'est pas dans les standards W3C

C'est très laid

Exact, jusque là tout va bien

Ma phrase était un conditionnel... et une mise en parallèle avec la question sur Explorer

ca va pas te pondre du code aussi bien qu'un mec qui fait des sites depuis 10ans !
et si tu veux un dreamwaver dans firefox (ou autre), j'aimerai pas être ta barette de Ram :s

Internet Explorer qui a 5 ans de retard, du moins les versions inférieures au 7 qui vient de sortir et qui ne tourne pas sur toutes les versions de Windows. Mais la meilleure est que le texte ombré et la transparence sont des propositions du représentant de Microsoft au W3C qui n'ont jamais été implémentées dans leur navigateur et que c'est le Webkit opensource Safari/KHTML/S60 (Nokia) qui en offrent la primeur.

Patrick a raison, le W3C émet des recommandations, aux développeurs de les implémenter dans leur navigateur au fur et à mesure du développement. C'est ce qu'ils font même si l'un offre telle fonction avant l'autre, et réciproquement (ex. les colonnes pour FF et l'ombre pour le Webkit). Ne pas penser non plus que le Webkit est ultra-minoritaire puisqu'il est utilisé par Nokia donc présent sur beaucoup plus d'écrans que les seuls Macintosh.

Lorsqu'on fait un site web on peut très bien utiliser des CSS3 pour faire plus joli. L'important et de s'assurer que ça ne gène ni l'esthétique, ni l'accessibilité pour les navigateurs qui ne sauront pas interpréter. Ainsi Safari ou Konqueror sous Linux afficheront des pages plus belles sans qu'elles soient totalement moches ou illisibles sous Firefox ou IE. Pour s'en convaincre il suffit d'aller visiter la page d'annonce du texte à contour dans le webkit, puis dans le Safari standard qui ne sait pas faire : rien de choquant ni d'illisible.

Je pense qu'il sagit ici aussi d'un effet d'annonce : IE7 est sorti et a été assez médiatisé, FireFox 2 a également pointé le bout de son nez... Les navigateurs un peu moins connus essaient aussi de faire parler d'eux pour ne pas qu'on les oublie. Le fait d'être "le navigateur le plus avancé du Monde", cela résonne comme une publicité.

Ce que je vois, c'est que j'avais placé beaucoup d'espoirs en IE7 pour avoir un peu moins de boulot chiant (les compatibilités cela m'exaspère), en fait ils ont remplacés les bugs par d'autres, ils ne respecte toujours pas les standards en vigueur, la transition risque d'être longue, ca rajoute juste un deuxième navigateur chiant pour lequel on doit développer... Donc même si je suis un macuser, je ne vais pas m'embeter a créer encore d'autres complications en créant des css pour safari en plus de FF, IE6 et 7. Sauf si je crée un site mac (c'est d'ailleurs un projet que j'ai commencé mais abandonné pour le club mac de ma ville) !

Donc dans cette annonce, c'est bien pour safari, mais côté développement, ca n'a pas une grande valeur.

Le texte avec contour est la seule nouveauté. Le webkit gère le reste (ombre etc.) depuis longtemps. L'effet d'annonce vient plutôt du style de la brève de Macplus.

Et il ne s'agit pas de créer des feuilles de style spéciales puisque les navigateurs ne gérant pas l'affichage se contentent de l'ignorer. D'où l'intérêt de la chose. L'ajouter ne cause pas de nuisance, mieux lorsque le navigateur, à l'occasion d'une mise à jour se met à le gérer, ça marche tout seul sans que tu aies à intervenir. C'est le côté pratique et « malin » des CSS.

Enfin les CSS2 datent de 8 ans ! Faudrait peut-être en user avant de mourir ? Non ?

Exemple. Le site du Web Standard Project. Il y a un petite ombre portée sur les liens. Elle ne s'affiche pas sous Firefox. Pas grave mais le look est un peu plus classe sous Safari ou Konqueror pour les linuxiens avec un peu de relief pour le texte de liens. Pas de feuille de style spéciale Safari avec détection et tout le fourbi comme on faisait du temps de la guerre de brouteurs (une page spéciale par navigateur) mais seulement la tite déclaration suivante ajoutée aux style des liens :

text-shadow: #191919 0 1px 1px;

Et c'est fini.

Jeffrey Zeldman utilise le même procédé pour les titres h2 (colonne de droite) de son blog. Discret et efficace. Ce ne sont que deux exemples.