<
Menu

Tableless



Imagem post: Prefixos dos browsers: A web precisa de você

Prefixos dos browsers: A web precisa de você

Por uma web mais livre.

Desenvolver apenas para um único browser não é legal. Isso já aconteceu conosco quando o Internet Explorer ganhou a batalha contra a Netscape. Era comum encontrar sites com o aviso “Este site funciona apenas em Internet Explorer”. Este é o motivo pelo qual muitos ainda estão presos ao IE com um legado difícil. Hoje você tem plena certeza de que é necessário manter a compatibilidade crossbrowser dos projetos.

A combinação da grande variação de browsers no mercado com as mais as novas features do CSS resultam em problemas de compatibilidade. Você quer utilizar uma feature que ainda está sendo estudada, e que somente o Firefox, por exemplo, suporta. Se você simplesmente utilizar a propriedade no seu CSS, os browsers que não suportam essa propriedade, ou que suportam mas com uma sintaxe diferente, podem dar problemas. Aí é que entra os prefixos de browsers.

O prefixo é muito útil para podermos experimentar features que ainda estão sendo estudadas e que são rascunhos nos documentos do W3C. Prefixos são úteis por que nos direcionam para um caminho seguro sob as inconsistências entre propriedades e browsers.

Como utilizar um prefixo

Não se assuste, se você utilizará uma propriedade de CSS que ainda está sendo planejada mas ainda assim quer aplicar em seu projeto para que os usuários de novos browsers possam usufruir com uma melhor experiência ao acessar seu site, seu código pode ficar um pouco confuso. Por isso, organize-se melhor ao decidir quais propriedades você gostará de experimentar.
Para exemplo vamos utilizar a propriedade border-radius. Se quisessemos fazer uma borda arredondada com 10px, faríamos assim:

div {
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   -ms-border-radius: 10px;
   -o-border-radius: 10px;
   border-radius: 10px;
}

Note que colocamos por último a propriedade verdadeira, sem nenhum prefixo, essa propriedade cobrirá os browsers que não precisam da utilização de prefixos para renderizar a propriedade, por exemplo o Opera e o Internet Explorer 9.

O problema

Atualmente estamos beirando a mesma situação citada no início do artigo. O Firefox, Opera e Microsoft estão pensando em suportar o prefixo -webkit-. O problema é que os desenvolvedores estão utilizando em seus projetos apenas o prefixo -webkit- para algumas propriedades do CSS3. Isto é muito ruim.

Se todos os browsers suportarem um mesmo prefixo o mercado será “controlado” por apenas um fabricante de browser que poderá ditar as regras sobre quais propriedades do CSS poderão ser implementadas primeiro. Ok, ok, meu sonho era que um browser sob o engine webkit dominasse mesmo. Mas isso foi quando o IE era o browser mais utilizado e a Microsoft não havia aberto os olhos ainda. Mas concorrência é ótimo em qualquer lugar, até na web.

O pessoal está conversando sobre algumas possibilidades de soluções. Uma interessante e na minha opinião mais inteligente, é a criação de um prefixo neutro, utilizado por todos os browsers para indicar novas features. Algo como -alpha- ou -beta- e assim por diante.

Todos os grandes nomes da web estão se mobilizando para que a web não fique em volta de um único browser. Tenha em mente que o pessoal do -webkit- não está fazendo nada de errado, nós estamos.

Daniel Glazman, Co-chairman do W3C CSS Working Group escreveu um post, muito preocupado e chamando toda a comunidade de desenvolvedores a adequarem seus sites e a entenderem o grande problema que isso pode ser tornar. Veja uma parte do post:

Without your help, without a strong reaction, this can lead to one thing only and we’re dangerously not far from there: other browsers will start supporting/implementing themselves the -webkit-* prefix, turning one single implementation into a new world-wide standard. It will turn a market share into a de facto standard, a single implementation into a world-wide monopoly. Again. It will kill our standardization process. That’s not a question of if, that’s a question of when.

Veja o post completo aqui.

O Web Standards Project também se mobilizou.

E aí? Vai mudar sua atitude? O que você pensa sobre isso?
Como você pode ajudar?

Assine essa petição para os fabricantes de browsers não suportarem o prefixo webkit e espalhe para seus colegas a notícia. E claro, ao usar os prefixos para os browsers, utilize todos e não apenas um.

Foto do post

Por Diego Eis

Diego Eis criou o Tableless para disseminar os padrões web no Brasil. Como consultor já treinou equipes de empresas como Nokia, Globo.com, Yahoo! e iG. É palestrante e empreendedor.

http://about.me/diegoeis/

Mais posts do autor

Comentários (25)

  • http://www.udgwebdev.com/ Caio Ribeiro Pereira

    Para os preguiçosos ou esquecidos, vale a pena adicionar esse plugin, que permite você trabalha com CSS sem prefixo, pois o próprio plugin irá adicioná-los para você:

    PrefixFree
    http://leaverou.github.com/prefixfree/

  • Eder Lima

    Semana passada mesmo estava pensando sobre esse assunto.
    Usar um prefixo único ou simplesmente suportar os betas sem prefixo  mesmo, não por preguiça, mas por uma simples questão que ninguém liga né, padronização.
    Assinando! 

  • Fabricio Augusto

    Eu estou confuso… sou só eu ?

  • http://profile.yahoo.com/QNPTKIPOMNRSOOMK33A7SSRJFE Marcio
  • Vitório Ramon

    Acredito que deveríamos ter um padrão de linguagem (CSS) sem tantas “adaptações”. Do jeito que vai daqui há algum tempo teremos:

    e ai vai.

    Se o padrão CSS é “border-radius” que assim seja pra todos.

    –Vitório Ramon

  • Bruno de Jorge

    Ao invés de criar alpha/beta não seria melhor se os prefixos fossem abolidos? Usariamos “border-radius:10px” e pronto, funcionaria em todos os navegadores!

  • André

    O maior problema pra mim é que muitas vezes o sufixo é diferente também. Ai é fogo por que você tem que decorar 3 linhas de código diferentes para fazer a mesma coisa.

  • Lol

    por que essa caralhada de corporações nerds não obedecem a w3c ao pé da letra?
    seria tudo mais facil! virar uma ditadura, cabo problema de compatibilidade, de coisas q não funcionam…. so baixa mão de ferro

  • joao henrique

    Com toda certeza o chrome é o navegador mais rapido e compativel possivel hoje, mas e a respeito daquilo que tanto lutamos por anos contra a microsoft? A web opensource ou toda a técnologia open em geral, por entre os panos todos sabemos que a google não é inteiramente a favor de uma web aberta, muito pelo contrario, ela vem monopolizado e investindo recursos violentos para nos tornar todos alienados.
     
    Paranóia? Pode até ser mais pense bem, você abre um orkut ou youtube e aparece sugestão do chrome, abre um site com adwords aparece a sugestão. Se carregar qualquer sistema da google, como o gmail ou o youtube novamente com o chrome nunca vai ter problemas, o mesmo não acontece com os outros navegadores, quase todos eles apresentam algum tipo de problema vez ou outra ou uma maior lentidão.

    Pra mim a google esta fazendo o caminho inverso da microsoft, essa que uma vez era toda proprietaria e mal se importava com outros padrões, hoje esta mudando aos poucos.

    Se a google realmente se importasse APENAS em uma web livre teria investido em um dos navegadores atuais do mercado.

    Eu fico com o opera(presto) e firefox(mozilla) que nunca precisaram jogar sujo ou induzir a usarem seus navegadores e cumprem com as necessidades.

    PS: Tem o problema da falta de privacidade do chrome que algums dizem ter, mas como não consegui confirm ar nada, não vou comentar…

  • http://twitter.com/ghoren Rafael Martins

    problema é que demora demais. Linguagens proprietárias saem mais rápido, tem mais recursos e funcionam (XAML, por exemplo), por que o HTML e CSS tem tanta frescura?
     
    Parece até que é feito em brasília. 

  • http://twitter.com/RaphaelDDL Raphael DDL

    Bitch please.
    Era só não ter vendor prefix. O prefixo é para uma propriedade beta, de teste ainda certo?

    Por que ninguém colocou -prev- ou -beta- ? E todos usavam. Pronto.
    Mas nãaaao.. Tem que ficar mostrando que seu browser suporta coisas antes dos outros.. Esse pensamento ganancioso que fez tudo ‘ir pro saco’.

    É culpa do webkit sim por ser rápido demais (e implementar css que nem é documentado – coisas para iOS por exemplo) e é MUITA culpa dos outros por serem lerdos demais em implementar.

    O povo ficou com o pensamento ‘Pra que vou colocar prefix se nem suporta mesmo’? Antigamente era assim.

  • http://tcelestino.com.br Tiago Celestino

    O Chorme já roda o border-radius. O grande problema é que os browsers baseados no Webkit estão criando mais funcionalidades “proprietárias”, ou seja, que não estão entrando em homologação na W3C. Em outro blog (sobre Mac inclusive), muita gente condenando a W3C pela lentidão, porém não sabem que para as novas propriedades CSS3, HTML5 etc… é preciso haver um concessão entre as empresas desenvolvedores dos browsers, o que não está acontecendo. No dia que todas se unirem para aprovar um padrão único, homologado pela W3C teremos uma Web sem problemas (para desenvolvedores é claro!!!) rs rs

  • http://twitter.com/msmafra Marcelo dos S. Mafra

    Concordo com o Bruno de Jorge. É só eles manterem o padrão de seletores W3C e somente utilizarem o métodos do webkit e quando (daqui a mil anos) a W3C concluir o HTML5 (batizando-o de HTML20) simplesmente passam a suportar ao padrão dela.

  • Matheus Salmi

    Já que tem de ser utilizado um prefixo para representar propriedades em estudo, então que haja um padrão e esse não seja o nome de um Rendering Engine!

  • Erick Petrucelli

    Existem várias “novidades” que já são interpretadas exatamente da mesma forma entre todos os navegadores de ponta, como a “border-radius”. Como alguns comentaram, porque diabos continuam colocando prefixos em propriedades assim? Tá pronta, tá funcionando, ótimo, remova o prefixo.

  • Glaucia Rezende

    -eu-estudando
    -tu-estudando
    -eles-atrapalhando

    hehe

    Legal acompanhar os comentários, vamos assinar o Petiscão.

    Bjs!

  • Gui Premonsa

    Cara, ótimo post. Muita gente reclama do prefixos, mas eles estão salvando a WEb.

  • Durval Fernandes de Deus

    por isso existem padrões como o w3c que foram criados tanto para os desenvolvedores de site quanto para os  browsers, se todos seguisse estas padrões não haveriam incompatibilidades.Hot Master – Vidros Elétricos
     

  • Pingback: -webkit- dominando tudo | Tableless

  • Disnay

    Cada dia pior para nós designers e desenvolvedores… Será o fim do mundo!!!

  • Pingback: -webkit- dominando tudo | Indoor Digital Billboards

  • http://twitter.com/wileymarques Wiley Marques

    Mas acontece que esses prefixos antecedem propriedades em fase beta, nada que está beta pode ser usado como release por mais que esteja bom.

  • http://twitter.com/wileymarques Wiley Marques

    A Google não fez um navegador novo por acaso, pode ter até sido feito para alavancar a evolução da web e tal, mas o maior motivo é não ter gastos, ou pelo menos diminuir, com a Mozilla e Opera, que ganham com as pesquisas neles incorporadas.

  • http://twitter.com/wileymarques Wiley Marques

    Porque quando você faz um site, alguma propriedade que você usa pode ainda não estar 100% implementada no browser, nesse caso usa-se o prefixo. Com o tempo essa propriedade fica totalmente funcional no browser e não é mais preciso utilizar o prefixo. Poréeem ninguém vai atrás de todos os sites que já fez na vida e sai tirando o prefixo de todas as ocorrências daquela devida propriedade, por isso não se pode simplesmente remover o prefixo.

  • Pingback: Webkit no Opera - Monocultura Webkit