Plutôt que de suivre cette journée sans css qui consiste à désactiver le style css de son site je choisis de faire une présentation du concept d’affichage séparé de la structure.
C’est un langage sémantique réalisé à l’aide de balises. En clair, il structure et ordonne votre page. Lorsque vous lisez un livre son titre est presque toujours en gros sur la couverture, le texte est formaté dans des petits paragraphes et l’index se compose d’une liste de mots.
Comme les ordinateurs ne savent pas lire les images, ils leurs est impossible de comprendre que le mot en gros et placé en haut est le titre de la page et que celui juste en dessous est sous-titre. Il existe donc une balise qui définit le titre d’une page <h1>MON TITRE</h1>, une autre pour le sous titre <h2>sous titre</h2>, une pour les paragraphes <p>paragraphe</p> et ainsi de suite pour les types de contenus qui peuvent exister.
Donner une valeur au contenu permet de le trier, de l’ordonner et donc d’effectuer des recherches. Imaginez le web sans moteurs de recherche ou une bibliothèque sans fiches ni tri des ouvrages : le cauchemar. Le html est à l’heure actuelle le seul langage qui permet cette organisation du contenu sur Internet, certains dirons que c’est vieillot, certes mais il n’y a rien d’autre pour effectuer une tache aussi importante.
Comme le html ou le xhtml (qui n’est autre qu’une version enrichie en balises) c’est laid, il existe un langage qui se superpose au html et permet de lui donner des propriétés graphiques. Images de fond, couleurs, type de police, etc.
Hélas les propriétées css ne sont pas interprétées de la même marnière par tous les navigateurs. Beaucoup d’utilisateurs se servent encore d’Internet Explorer 6 qui est obsolète, (il ne comprend pas bon nombre de propriétés css modernes comme tous les autres navigateurs) et bride beaucoup les graphistes dans leur processus de création. Il rend aussi fou les développeurs lorsqu’il faut bricoler pour compenser les caprices d’Internet Explorer 6.
Je tient a féliciter les visiteurs de ce blog plus de 90% d’entres vous utilisent un navigateur moderne tel que firefox, opéra ou safari.
Gobz.org avec les css
Gobz.org sans les css
Si vous utilisez le navigateur firefox il vous suffit d’aller dans le menu Affichage -> Style de la page -> Aucun style. Vous allez dès lors découvrir gobz sans CSS avec uniquement le html.
Cette journée sans css est faite pour sensibiliser les gens à l’utilité du html et surtout aux respect des standards qui en découlent (html + css). Hélas je ne voit personne à part les propositionnels où les passionnés s’intéresser à ces problématiques. Les standards c’est vulgairement séparer le fond de la forme. Le fond étant un html propre sans aucun indicateur visuel comme une couleur ou un choix de typo. Et la forme est réalisé en css qui contient toutes les informations visuelles.
Si tout le web se “déshabille” aujourd’hui on pourra crier au scandale sur certains sites très connus qui ne respectent pas se principe prôné par tous les professionnels.
Là où cette journée est à mon sens peu utile c’est que toutes le personnes intéressées par cette problématique désactivent régulièrement les css des sites. Chez moi c’est un réflexe sur la plus part des sites que je consulte. Il vaux mieux a mon sens expliquer au grand public l’intérert du html facilement indexable et lisible par tous ainsi que les possibilitées des css que l’on entretient à moindre frais face aux sites en tableaux avec des styles en ligne insérées directement dans la structure.
Un bon site qui sépare le fond de la forme : CSS Zen Garden Vous pourrez visualiser une même page avec différentes feuilles de style et ainsi comprendre le gain de temps réalisé lors d’une refonte par exemple si le site respecte le standard html + css
Une très bonne lecture à propos des css appliqués au html le Zen des css de David Shea. Je le prête volontiers s’il intéresse certains d’entre vous.
Gobz est un blog collectif fondé par les étudiants de multimédia (CRMA) à Gobelins Paris.
Le but étant de rendre compte du multimédia de la façon la plus éclectique possible en exploitant au maximum la diversité qui compose notre promotion. De la tendance, des réflexions, de l'image, encore de l'image, du code, du buzz, du spam, de l'info… :
le melting-pot multimedia.
Qu’il est beau gobz sans ses CSS ^^
Comme dirait le rappeur de l’optimisation du web:
“When you use CSS, you page will load quicker !
client satisfied like they eating on a snicker !”
Et si j’ai envie de faire un site mal codé et mal référencé qu’est-ce que ça peut bien vous faire ???!! le seul handicapé serait moi ! Internet est un espace de liberté, arrêtez par pitié de vouloir formater tout, standardiser, labeliser les chose “web 2.0″ (au passage 9 personnes sur 10 utilisant ce terme n’en connaisse pas le sens, mais il surtout faut le placer dès qu’on peut. YES ! je viens de le faire je suis “In” (à mince! cette expression, elle par contre, n’est plus à la mode… les boules !)
Les boules aussi c’est claqué, faut dire “omg, le seum t’entends” la t’es sûr de percer.
Sinon pourquoi bien coder un site … alors bien sûr on peut faire dans l’éthique et parler accessibilité etc mais j’insisterai pas car visiblement tu te soucies pas trop des personnes possédant un handicap qui souhaitent pouvoir surfer relativement facilement.
Je parlerais pas de web 2.0 qui effectivement est assez galvaudé mais en même temps c’est pas le sujet du post, les standards sont de plus en plus utilisés dans web 2.0 mais mais tu peux faire du web participatif avec des tableaux dénués de CSS.
L’intérêt de bien coder c’est de s’assurer un référencement naturel efficace ! et à mon avis ça vaut le coup de se prendre la tête à moins que tu ne mettent en ligne que des pages à destination de toi et tes potes.
Donc pas d’histoire de mode, pas d’histoire de “in” ou “has been”, juste l’évolution d’une techno et toujours plus de nouvelles opportunités assez kiffantes
Comme quoi ma petite “provoc” était utile, je trouve ta réponse pertinente.
Je n’ai pas changé d’avis sur l’idée de “standard”, cependant tes quelques lignes y donne un sens éventuel (que je connaissais mais que je n’ai pas lu dans l’article) dont le poids est discutable mais bien réel je l’accorde.
Hey bonhome pour commencer il faudrait structurer ta pensée. Ton problème c’est quoi : les normes du w3C ou le concept de web 2.0 qui très tendance ? Pour la seconde sache que je m’en moque éperdument, ce n’est pas l’objet du post. Arrêtez de bien coder et de tout structurer, hey tu vit sur quelle planète, et surtout dans quel monde ? Sans structure on ne peut même pas définir une façon de se parler. Si demain tu te met à parler dans une autre langue on ne te comprendra pas. Avec le web c’est pareil. Il faut des normes, comme t’as l’air d’avoir le cerveau sur off je vais t’aider. Depuis quand l’obligation d’écrire dans une langue correcte a t-il empêché les écrivains de produire des œuvres originales et créatives ? Après, si sur ton site tu veux jouer les boulets sans respecter un minimum d’ordre et de normes (tu remarqueras que je te parle même pas d’un site valide en strict !) sache que personne ne viendra dessus. Il sera mal référencé et illisible par les navigateurs modernes. Bilan toi qui voulais communiquer tu te retrouveras comme un illettré face à une feuille blanche.
Pourquoi tant de haine? L’auteur (semble t’il) de ce site me dit “stupide” dans un post sur 2803, toi tu me parles comme on peut le lire au-dessus… Je ne suis pas ton bonhomme, je n’ai pas de problème, je n’ai pas dit certaine phrase que tu cites d’on ne sait où et je n’ai pas le cerveau sur “off” ni même ne pense être un boulet. Je vis sur quelle planète ? Celle du genre d’individus dont tu sembles faire partie : Ce sont aussi ça les normes du fameux “web 2.0″ qui me font bien marrer et pitié à la fois : parler dans des posts à des gens qu’on ne connait pas avec un ton et un vocabulaire qu’on oserai même pas employer dans un débat de visu. C’est bien mec tu représentes la modernité !
En fait oui j’ai un problème : les donneurs de leçon comme toi.
Je vais débattre ailleurs là ou la critique est constructive et non destinée à satisfaire de petits égo.
Tu écarte le fond problème : Web 2.0 N’EST pas égal aux normes du W3C.
Pourquoi le sens que PRASS donne dans ta réponse est ‘éventuel’ ? Pourquoi un tel poids est il discutable ?
De plus tu évites mon argumentaire sur le fait que la créativité n’est pas bridée par les normes de production.
Oui je fais fait parti des individus qui travaillent en groupe (cf: ce blog collectif) et qui aiment pouvoir produire ensemble et donc avec des NORMES.
Oui cela représente la modernité. T’entêter avec pour seul argument je veux avoir le droit de faire ce que je veux ça m’énerve encore plus quand tu viens ici nous PROVOQUER sur des faits établis pour lesquels une très grosse communauté notamment composée des pères fondateurs du web se battent depuis des années. Tu n’imagine pas a quel point les gens qui se la jouent ’seuls au monde’ font perdre du temps aux autres. CF: Microsoft et sont vieux navigateur obsolète où les gens qui font du web depuis 10 ans.
Plutôt qu’une ‘provoc’ tu aurais mieux fait de demander mais au juste à quoi ça sert les normes ? Là j’aurais répondu la même chose mais calmement.
Si tu souhaite continuer à parler tu es le bienvenu mais argumente au moins. Sinon tu ne sera pas regrétté.
SISI le ton et le vocuabulaire je l’emploie de visu.
Quand à l’égo je n’est pas supprimé ton commentaire…
!GZA +1
moi je dis NON à la séparation du contenu et de la forme
vive le code crade sans impact sur le référencement
et d’ailleurs NON au référencement
vive flash
Etre développeur, ça rend agressif .. :S
Je vois que ca discute passionnément alors je vais rajouter mon petit grain de sable.
Il existe encore à l’heure actuelle une majorité de site qui ne sont pas normées W3C et pourtant ils sont visités et revisités par des millions de visiteurs. Un petit exemple à l’appui : 20minutes.fr qui compte pas moins de 1913 Errors rien que sur la page d’accueil, gobz.com a une soixantaine d’erreurs, etc…
Mais l’important n’est pas dans la validation w3c comme voudrait nous le faire croire tous ces passionnés, l’important est la construction même d’une page, tel que l’utilisation des balises pour entourer du texte, pour les titres, l’attribut alt pour les images, les liste , etc… (comme la expliquer ..::it’s Me::.. dans l’article). Tout ceci aidant au référencement.
De plus, il existe des sites qui sont valides w3c, c’est à dire aucune erreur css + html, mais qui utilise de vulgaires tableaux, donc vaut il mieux un site valide w3c avec des table, ou un site qui essaye d’avoir un css et une structure propre ??
J’aimerais également rajouter que le w3c et l’accessibilité sont deux choses différentes, et que le w3c est un critère de l’accessibilité.
@lénou: super constructif, on te rappelle.
@Kubx: Tester la validité d’un site déja en ligne ça ne vaut pas grand chose dans le sens où le moteur parse le contenu dynamique (posts, billets etc …) or difficile de forcer les rédacteurs et les personnes qui commentent le contenu de respecter tout le w3c. Rien que blogger une vidéo et tu as 3 erreurs. Donc oui c’est important de checker mais il faut le faire sur la structure et ne pas s’attarder aux erreurs de contenus.
Dès lors il y a beaucoup plus de sites “valides” qu’on ne le pense.
Pour ma part, les tableaux c’est très très lourd, je préfère me saouler à faire du css qu’à m’acharner sur une balise dépréciée et absolument inflexible.
Le mieux c’est que chacun fasse comme il veut lol, néanmoins, on nous a fait récemment surfer sur des navigateurs vocaux pour personnes déficientes visuellement et bien rien que pour ça, vive les standards. Car il est évident dans le cadre d’une législation toujours plus enclin à aider les handicapés, les sites administratifs et même commerciaux seront soumis, sous peu je pense, à des règles d’accessibilités très strictes et nous n’aurons plus d’autres choix de réalisation, à mon avis autant s’y mettre dès maintenant à moins bien sûr, comme j’ai dis dans mon 1er commentaire, de faire des sites pour soi et ses potes.
@all: Pour le commentaire de it’s me, merci de pas épiloguer 40ans, on a tous des jours plus durs que d’autres lol. Merci ^^
@PRASSOUILLE :
> la structure de gobz est bonne et la plupart des erreurs que trouvent le checkeur w3c sont archi simple à corriger et font parti de la structure globale :p
Exemple, le logo > end tag for “img” omitted.
Rien de bien méchant !!!
ps : tu dois te dire, putin, il est devenu comme wikiThierry (Reg) ou binj, il veut le dernier mot. niak niak
@Kubx: lol non non mais quand je parlais de sites valides je parlais pas forcément de Gobz, mais de sites à gros traffic.
Par contre le img pas fermé au niveau du logo, la je dois dire on assure à mort xD
@lénou merci pour ton message constructif, c’est précisément qui finit par énerver les gens.
@grégoire : j’ai vraiment hâte que cette notion soit intégré dans flash, ça va surement être très long, et si vive flash. Fred Cavazza disait dans sa conf sur le rich commerce que flash était mieux implanté que le javascript qui est pourtant natif dans les navigateurs. Comprenez ce qu’il y a à comprendre.
@KubX : oui il faudrait que je trouve du temps pour corriger tous ces petits truc dans la structure. Mais au delà de ça ce qui m’a vraiment posé problème avec GZA et qui en fait est en bordure du sujet mais qui pour le coup est vraiment une problématique de développeur. C’est le fait de travailler avec des normes pour bosser ensemble. Gobz est loin d’être parfait mais il respecte la structure de wordpress qui nous permet de le mettre à jour régulièrement. De plus si un développeur externe au projet débarquait il pourrait si retrouver et le faire évoluer. Ce qui est beaucoup plus difficile lorsque l’on utilise des méthodes de plus en plus obsolètes.
Un exemple de ce qui m’a fait sortir de mes gonds. Hier midi je parle avec un ami qui développe dans une agence web. Il a charge le référencement d’un site web qui n’est pas très vieux. Hélas pour lui personne ne peut l’aider pour lui expliquer la structure du site. Et devinez quoi c’est du tableau tout pourrit, une structure non optimisée, etc. Ce problème va au delà du simple css/html, il est générique à tout développement (flash,java,etc.)
Pour l’image elle devrait même pas être en dur mais en backgound, no comment
“Hélas je ne vois personne à part les propositionnels où les passionnés s’intéresser à ces problématiques.” < Tu t'intéresses toi à "comment on procède pour faire une ablation de la vésicule biliaire" ? Pas sur, mais normal. Dans le même registre, je ne vois pas pourquoi ma mère s'intéresserait à la structure d’un site et à le voir sans CSS.
C'est un truc de geek cette affaire de CSS Naked, seuls les gens sensibilisés peuvent comprendre et s'y intéresser. Et encore personnellement je ne vois pas bien l'intérêt. Le public auquel s'adresse cet événement peut tout aussi bien faire un clic droit et afficher la source si elle a vraiment besoin (dépendance XHTML-Strict-w3Consortium-LOL) de voir si ton site est bien structuré.
Et au niveau sensibilisation je ne suis pas sur que ça soit très efficace et utile.
°°°°°°°°°°°°° Interlude °°°°°°°°°°°°°
!
Ca fait franchement bizarre de voir Prass dire "qui effectivement est assez galvaudé" et Damien dire "Hey bonhome".
Je ne sais pas si c'est normal mais je trouve ça plutôt étrange, à la limite de l'échange de personnalité si Romain n'avait pas ajouté "omg, le seum t’entends"... Rassuré
°°°°°°°°°°°°° Fin de l'interlude °°°°°°°°°°°°°
Dans un sens je suis d'accord avec !GZA. D'un côté parce que comme ça je me mets face à tous les autres (bouahaha, j'aime), aussi parce que de son côté il y a moins de fautes et surtout parce que je comprends son point de vue.
En même temps à voir les répliques de certains :
"visiblement tu te soucies pas trop des personnes possédant un handicap" < sur ton site ils font comment les gens handicapés ?
"Microsoft et sont vieux navigateur" < merci pour les fautes mais il faudra un jour arrêter de cracher sur IE qui nous a bien rendu service il y a quelques années. Maintenant quoi ? Tu te sens limité c'est ça ? Réduit même ? Tu voudrais pouvoir déchirer la baraque mais IE6 t'en empêche ? Faut arrêter de se faire des films. Je n'ai jamais vu un connaisseur devoir changer les specs de son site pour qu'il fonctionne AUSSI sous IE. Si ça t'es arrivé (je vois venir de loin l'exemple super spécifique), peut-être est-ce parce que tu n’as pas eu la patience, ou le savoir faire ?
"Pour seul argument je veux avoir le droit de faire ce que je veux" / "Le mieux c’est que chacun fasse comme il veut" < vive la cohérence les mecs. Alors on fait comment ? Les gens font comme ils savent faire et ça s’arrête là. J’ai commencé à faire des sites en tableaux. Puis j’ai évolué en faisant des sites statiques en xhtml / Css. Puis je suis passé au PHP etc. Tout est affaire de connaissances et les connaissances viennent avec le temps. Tu peux pas t’énerver parce que quelqu’un n’a pas l’expérience lui permettant de reconnaître que telle chose est mieux ou parce qu’il n’a simplement pas le même avis que toi.
Il y a 5 ans tu m’aurais dis que les normes du W3C était incontournable avec la conviction que tu y mets dans tes commentaires, je t’aurais répondu que j’en ai rien à carrer du w3c.
Tu as peut-être commencé en apprenant directement le CSS. OK. Ce n’est pas le cas de tout le monde et tout le monde ne peut pas évoluer aussi vite qu’évoluent les technologies (d’ailleurs la plupart des agences sont encore à l’AS2 par exemple).
!
Pas la peine de sortir de tes gonds pour ça mec, c’est que du développement après tout. Léna au moins elle a compris ça
Au passage je suis également d’accord avec !GZA quand il dit qu’Internet est un espace de Liberté. Ou en tout cas l’était. C’est quelque chose qui est entrain d’être perdu et je trouve ça vraiment très con. Bientôt on sera obligés d’avoir des certifications CSS pour créer des sites sans quoi on se prendra des amendes pour non respect d’une loi instaurée par des gens qui n’y connaitront de toute façon rien mais qui voudront juste que tout soit « aux normes ».
Voila je suis content d’avoir dit pleins de trucs inutiles. Maintenant un truc qui peut être utile : va falloir que certains pensent sérieusement à desserrer leur string.
Juste pour finir plus légèrement, un truc (ça fait pleins de trucs ^^) qui m’a fait rire : http://www.prass.com/
!
PS: Votre site ne permet pas de faire plusieurs sauts de ligne pour que je puisse bien STRUCTURER mon commentaire afin qu’il soit lisible. C’est moins important que les normes wc3 ça ? Comprenez ce qu’il y a à comprendre comme dirait l’autre.
Enorme
très bon post. Cependant t’es super chiant j’suis sûr qu’à cause de toi on va se rajouter une bonne quinzaine d’erreurs W3C 
Alors en vrac, mon site est en flash, le jour ou il existe de véritables normes d’accessibilités avec flash, pour sûr que je les implémenterais au maximum.
Je demande des droits sur “déssere ton string” t’entends 
IE6 est une belle merde et implique pas mal de réflexion dans certaines réalisations. Mais bon avec le temps, il disparaitra comme les autres. Néanmoins je rejoins Ad rien fels man dans l’idée que ça freine pas grand monde (du moins professionnellement parlant)
“Pour seul argument je veux avoir le droit de faire ce que je veux” / “Le mieux c’est que chacun fasse comme il veut” < vive la cohérence les mecs. On a jamais dit qu’on était d’accord, donc quelle cohérence devrait-on avoir ?
Bon on a bien rigoler ici mais c’était mon dernier commentaire dans ce billet car les pavés sont illisibles et la vraie place des pavés c’est sur les barricades !
@DeyLonn merci pour l’autre. Tu as raison à propos du saut de ligne. La box de commentaire en ajax est vraiment pas terrible sur le blog.
Pour le vif du sujet :
Si je faisais moins de fautes tu apprécierais mieux mes posts ? Et bien mon argumentaire se base là dessus. Que chacun face ce qu’il souhaite OUI mais dans le respect de certaines règles. Depuis quand écrire dans un français correct nuit-il à la créativité (= faire ce qu’il veut). Depuis quand ne pas mettre une majuscule en début et un point en fin de phrase nuit-il à la créativité. Lorsque l’on veux s’exprimer il vaut mieux se mettre d’accord pour pouvoir communiquer, non ?
Concernant l’utilité du css/naked day tu est visiblement d’accord avec mon post (c’était un peu l’objet quand même).
Et non je n’arrêterait pas de cracher sur IE6, il m’a toujours fait perdre du temps. Quels services à t-il rendu ? Dès sa sortie celui de ne pas respecter des standards naissant et de tuer Netscape à grand coup de trusts ? Il est seul dans son coin à ne pas interpréter le code de la même manière. Certes j’ai besoin de m’améliorer mais reconnaît que n’importe quel intégrateur ou personne faisant de l’ajax a des problème avec ce navigateur. Ils sont connus, c’est “JUSTE” qu’il fait perdre du temps au profit de choses plus agréables. Là je parle même pas des problèmes super spécifiques comme le download de pdf créé à la volée qui m’a encore coûté du temps cette semaine (car IE6 ne réagit pas comme FF, Safari, opéra et IE7 la dessus).
Comme toujours se sont les DA qui choisissent la charte. Tu regardes ce qu’ils ont fait et là tu sais que t’en à pour plus de temps qu’il n’en faudrait c’est tout.
Concernant notre cher GZA il a fournit une remarque sur 2803 des plus enrichissantes : “Ben cela fait 10ans que je fais des sites” Il y a 5 ans moi aussi je m’en moquait, mais revendiquer un tel travail et cracher sur le concept même de standards techniques (et non créatifs ou encore de capacités personnelles) ça me rend fou que ça te plaise ou non, à plus forte raison lorsque tu passe des journées à reprendre un travail bien obsolète en tableaux qui est chiant a mourir et te fait perdre du temps. Pile le jour où notre grand GZA viens faire ses remarques stupides, qui appellent à tout sauf au débat.
Mais vous avez surement raison ce n’est que des journées et des journées et encore des journées de travail, ce n’est pas comme si c’était important.
Pour répondre rapidement a l’affirmation qui m’a le plus touché :
Il faut peut-être s’imposer, nous, développeurs, et faire en sorte de faire la conception avec les DA puisque les deux parties sont concernées. Ou au moins faire en sorte qu’un directeur artistique ET un directeur technique assistent de concert aux réunions et prennent ensemble les décisions principales sur leurs domaines respectifs.
Nous ne sommes pas uniquement des éxécutants (nous en particuliers puisque nous sommes concepteurs réalisateurs) contraiment à ce que beaucoup semblent croire.
Ps : Je ne dis pas que ce n’est pas déjà le cas dans certaines boîtes. Juste qu’il serait bon que cela se démocratise.
Ps2 : Damien, je ne pense pas que tu ai mal pris mon message mais en tout cas ce n’était pas du tout le but. Et pour le “comme dirait l’autre”, c’est une expression donc ça n’avait aucune signification particulière ;).
merci DeyLonn pour le mot de la fin plein d’intelligence et de bon sens.
Je résume ce que j’ai compris : il faut être à la fois directeur artistique ET directeur technique… Yes i am !!! Et être à la pointe de la technologie, tout le temps :p Donc lire tous les jours les nouveaux commentaires sur http://www.gobz.org qui sont plus longs que les articles et donc plus intéressant puisqu’ils nous poussent à une réflexion sur l’avenir du Web donc du monde…. L’avenir est entre nos mains.
Pour Prass et le référencement d’un site Flash, je te conseille ce petit plugin : http://www.korben.info/une-lib.....lashs.html
qui va te permettre de faire comme sur deezer
avec des url précises pour chaque partie de ton site flash, et donc pouvoir indexer plusieurs pages dans google, etc… (ps: j’ai pas encore pu le tester mais ca a l’air sympa)