Existe uma alternativa para CSS?

88

Existe uma alternativa de linguagem de formatação de folha de estilo ao CSS? Ou CSS é a única linguagem atual para fazer coisas de tipo de formatação de folha de estilo?

Eu olhei a escrita de CSS na Wikipedia ( http://en.wikipedia.org/wiki/Cascading_Style_Sheets ) e alguns outros comentários sobre CSS e fiquei desanimado com a falta de suporte completo para CSS nos diferentes mecanismos de layout, então Só estou curioso se existe uma alternativa ou devo aprender a usar filtros CSS também.

Obrigado por quaisquer insights.

JustADude
fonte
10
CSS se estiver bem *, é o IE que está quebrado. (* CWG exceto)
annakata
74
Se ao menos houvesse uma alternativa ... Estremeço ao pensar na quantidade de esforço humano que foi desperdiçado tentando fazer coisas em CSS que deveriam ser simples, mas não são ...
PeterAllenWebb
8
o engraçado é que você tem que digitar style = "text / css" nas tags relacionadas ao estilo ... :)
3
Nem mesmo para programadores. Na programação, você tem uma ordem de execução disposta de cima para baixo em seu documento. Em CSS você nem tem isso. Você tem um monte de propriedades sendo acessadas cegamente e aplicadas a um documento totalmente diferente, uma teia de strings estática e complexa que você não pode começar a analisar até encontrar o front end. Você não pode dizer de onde vêm alguns efeitos, porque as coisas estão em cascata cegamente por todo o documento.
GameKyuubi
1
CSS é declarativo porque a web é fluida (o usuário está em um monitor gigante, um laptop, um smartphone ou um leitor de tela?), Então os designers gráficos não podem usar as técnicas a que estão acostumados, digamos, no Photoshop, onde o tamanho da tela está sob seu controle. Da mesma forma, como diferentes agentes de usuário são renderizados de maneira diferente, você deve dizer "Aqui está o que eu quero" em vez de "aqui está como fazer", como um programador de computador faria. Isso não quer dizer que o CSS não precisaria de muitas melhorias e se tornou mais fácil de usar; apenas que precisa ser de natureza diferente daquela a que os designers e programadores estão acostumados.
Canuck de

Respostas:

64

CSS é a única opção real.

O suporte do navegador para CSS não deve ser uma grande preocupação (na maioria dos casos), uma vez que você aprenda os prós e contras do CSS. A chave para entender sobre CSS é que seu objetivo é definir o estilo de um documento HTML e deve ser separado do conteúdo.

Você precisará de prática para aprender como fazer as coisas degradarem normalmente em navegadores que não oferecem suporte a recursos. A ideia básica aqui é que você deve fazer com que o mínimo denominador comum (geralmente o Internet Explorer) funcione "bem o suficiente" para não prejudicar a experiência do usuário e fornecer as sutilezas para usuários com navegadores melhores. Além disso, não desenvolva primeiro para o Internet Explorer. Deixe para o final, depois corrija seus bugs. Fazer as coisas ao contrário (IE primeiro) é muito mais difícil.

Você também tem a opção de usar JavaScript para definir estilos, mas isso não é recomendado porque você deve evitar a aplicação de estilos dentro de JavaScript, já que o JavaScript se destina à lógica, não a estilos.

Existem 3 (dependendo de como você olha para isso) componentes para uma página da web:

  • HTML - para conteúdo
  • CSS - para estilizar seu conteúdo
  • JavaScript - para aplicar lógica adicional ou dinâmica ao seu conteúdo
Dan Herbert
fonte
19
A linha principal aqui é a segunda frase: "O suporte do navegador para CSS não deve ser uma grande preocupação (na maioria dos casos), uma vez que você aprenda os prós e contras do CSS." As pessoas que mais reclamam sobre o CSS estar quebrado sabem menos.
Rob Allen
1
+1: ... para uma resposta excelente. A sugestão de codificar de acordo com os padrões primeiro e, em seguida, corrigir os bugs no mecanismo de renderização do IE é definitivamente a maneira de fazê-lo.
Jon Cage
Quando você conhece bem o CSS, o IE7 realmente se comporta muito bem. @Rob: ouça, ouça +1.
Ryan Florence
1
fazer um aplicativo com css é uma verdadeira tortura para um desenvolvedor de aplicativos. no entanto, exceto Cappuccino.org, houve muito poucas tentativas de resolver este problema tão óbvio. há rumores de que o xcode estará produzindo html5 em breve, se isso acontecer, acabará com esse caos, não porque o xcode seja o melhor, ele guiará outros para implementar SDKs para a web, e os navegadores virão com componentes de interface do usuário ( eles ainda usarão css e html para exibi-lo, mas quem se importa, não os veremos / usaremos / saberemos / aprenderemos)
Devrim
3
@RobAllen Eu digo a mesma coisa sobre Malbolge, minha linguagem de programação favorita. As pessoas que pensam que é impossível simplesmente não sabem bem o suficiente para perceber o quão grande é.
AR
68

Todos vocês estão tentando responder à pergunta do ponto de vista de um programador. Acho que o autor do pôster original estava procurando uma alternativa mais gráfica - uma que oferecesse um conceito diferente.

Mesmo que o CSS3 seja adotado em vários navegadores, acredito que a maneira do CSS de fazer o layout das coisas (caixa embutida, flutuações, margens, etc.) é horrível. Sou programador, mas meu pai é designer gráfico e tenho quase certeza de que o software de layout que eles usaram há 20 anos era em alguns aspectos mais fácil e avançado do que CSS.

Rolf
fonte
9
Exatamente! CSS ee o fluxo de trabalho cognitivo do layout gráfico não estão no mesmo nível de abstração.
Alex
5
IMHO, esta resposta é tão subestimada, mesmo em 2015.
Abhinav Gauniyal
13
"meu pai era editor e designer gráfico, e eu me deleito com design gráfico desde a minha menor idade, e ouso dizer que o software de publicação que eles usavam há 20 anos era mais avançado e amigável do que HTML / CSS hoje em dia." ... A diferença é que seu pai não estava projetando para diferentes tamanhos de tela, leitores de tela, diferentes versões de navegador (com diferentes recursos), etc. Projetar para impressão é muito, muito mais simples do que projetar para exibição na tela e, portanto, CSS é mais complexo do que as linguagens projetadas para distribuir mídia impressa.
J. Taylor
1
Recomendei o Postscript como linguagem e o PDF como meio de entrega. Fui espancado e derrotado de uma maneira viscosa. Os andróides do SO não gostam de opiniões.
ATL_DEV
1
@J Taylor, vai perder. Projetar usando qualquer meio não é fácil. É uma habilidade, arte e ciência tanto quanto escrever CSS e HTML. Por favor, respeite as artes. O PostScript foi projetado para lidar com diferentes tamanhos de mídia e existe há décadas. O objetivo do HTML e CSS é fazer com que o navegador da web renderize algo que o Postscript faz por padrão. HTML e CSS são horríveis!
ATL_DEV
41

Sim , é chamado LESS e realmente resolve a maioria dos problemas de legibilidade do código CSS.

Você tanto pode compilá-lo no servidor ou on-the-fly do lado do cliente com less.js .

Para produção, eu recomendo configurar um script de construção que o compila (em NodeJS isso é fácil com Grunt e grunt-contrib-less ).


Edit: Existem também outras opções que vale a pena mencionar, mesmo se eu estiver usando e recomendando o MENOS.

SASS : O pessoal do Ruby adora esse. Não é um superconjunto de CSS como o LESS, mas usa sua própria sintaxe. Para lidar com isso, eles desenvolveram o SCSS, que é um superconjunto CSS e é semelhante ao LESS.

Stylus : como LESS, é codificado em javascript, mas é comumente usado em Node.js. Não posso garantir, já que não experimentei ainda, mas é muito maduro, então se tiver um recurso que você deseja, com certeza vá em frente.

Turbina : esta foi codificada em PHP. Não há muita tração.

Alternar CSS : talvez os hackers do Python queiram examinar isso. Ainda menos tração.

Se você está se sentindo ainda mais alternativo, há também CSS Cacheer , CSScaffold , DtCSS , CSSPP e até mesmo algo da porneL .


Outras coisas que você pode querer verificar:

Compass : Uma estrutura de autoria CSS completa para os caras do Ruby.

WinLESS : um compilador LESS de arrastar e soltar para Windows, é muito legal e você realmente deveria dar uma olhada.

LESS Elements , Preboot , LESSHat e even.less : Bibliotecas de mixins e constantes para LESS.

Bootstrap : uma estrutura desenvolvida pelo Twitter. Também relacionado: HTML5 Boilerplate .

Normalize.css : uma alternativa para redefinições CSS . Existem muitos resets, no entanto, como o desenvolvedor de um, devo dizer: a maioria é uma porcaria. Se você não vai fazer o seu próprio, basta usar este.


Atualização : Desde 1.4 , LESS @extendtambém. Certifique-se de usar 1.4+, se possível! Isso completa as razões para escolher LESS em vez de SASS, eu acho.

Camilo Martin
fonte
25
infelizmente, isso não parece ser uma alternativa ao modelo em si.
n611x007
1
@naxa e por que você quer isso? O modelo é ótimo (folhas de estilo), a implementação é péssima (CSS). Essas ferramentas tratam apenas da implementação, e é por isso que são tão populares.
Camilo Martin,
3
Porque a competição ajuda no progresso. O que você quer dizer com "folhas de estilo"? Eu o associo com cascata e arquivo / seção distinta do texto. Mas há mais, o modelo de caixa, usando rótulos e recipientes mesclados no texto (com html). Existe implementação [na] dependência? - por exemplo. as folhas de estilo podem ser aplicadas a qualquer coisa, exceto html / xml? (E se você escreveu uma folha de estilo e não quer aplicá-la a um texto não baseado em gt / lt ou a um formato binário? Você deveria reutilizar qualquer implementação de folha de estilo ou por conta própria?)
n611x007
@naxa o que eu quis dizer é que o conceito de ter estilo separado do conteúdo é um ótimo modelo, que é o que chamo de "folhas de estilo". E por implementação quero dizer a sintaxe CSS, mas concordo que ter MENOS em vez de CSS é como usar CoffeeScript em vez de Javascript. E bem, existem formatos de marcação binários, então não vejo porque você não poderia ter folhas de estilo binárias, mas se você pensar sobre isso, provavelmente não seriam encontradas com esse nome, porque as folhas de estilo resolvem um problema humano (estilos de escrita para muitos documentos), não é um problema de máquina (ou ainda estaríamos usando <FONT>tags).
Camilo Martin
4
Eu votei contra porque esses são pré-processadores, não alternativas. Eles se baseiam no CSS e geram CSS no final. Portanto, é apenas um nível de abstração acima - mas não uma alternativa.
ProblemsOfSumit
17

Sim.

Como todo mundo disse, CSS é sua única opção real, mas há outra linguagem para "coisas do tipo de formatação de folha de estilo" na web, chamada eXtensible Stylesheet Language (XSL), particularmente o subconjunto da especificação que ficou conhecido como XSL-FO (formatando objetos) .

Em um ponto, dependendo de quem você perguntou, a intenção era competir ou colaborar com CSS .

Patrick McElhaney
fonte
1
O W3C tem um bom resumo da relação entre XSL e CSS: w3.org/Style/CSS-vs-XSL
Patrick McElhaney
8

Folhas de estilo de grade (GSS): GSS

muito melhor

Sam Adamsh
fonte
2
SIte não existe mais.
ATL_DEV
7

CSS amplamente difundido não tem suporte completo em todos os navegadores ... como uma alternativa (desconhecida) pode atingir esse objetivo?

Scoregraphic
fonte
3
Por ter um modelo de layout previsível, intuitivo e que corrige problemas em novas versões ao invés de deixar erros.
AR
7

Bem, CSS 2.1 é bem suportado por quase todos os navegadores. (exceto IE6) É fácil escrever CSS degradado de forma harmoniosa, uma vez que você conhece o subconjunto seguro. (De forma que mesmo navegadores incompatíveis não bagunçam totalmente a página)

Consulte http://www.quirksmode.org para dicas de compatibilidade do navegador CSS.

EFraim
fonte
4
1 para quirksmode - todo usuário começando com CSS precisa saber sobre isso. Eu acrescentaria que o IE7 também é muito ruim com CSS2 e, infelizmente, a maior parte da web (e quase todas as redes corporativas) são IEs 6 e 7 apenas, portanto, você deve ter cuidado com CSS2.
Keith
6

ficou desanimado com a falta de suporte total para CSS nos diferentes motores de layout

Acho que o jQuery tem algumas maneiras de tornar o css mais compatível entre navegadores, ou seja, se você especificar alguns atributos usando jQuery, ele tentará se certificar de usar uma solução alternativa para navegadores que não suportam determinados recursos.

Há também um projeto chamado CleverCSS , você pode querer dar uma olhada. Não é uma alternativa, apenas uma maneira ligeiramente diferente de defini-lo.

Hassen
fonte
Infelizmente, o link está morto .. :-(
agosto
4

Eu olhei a escrita de CSS na Wikipedia ( http://en.wikipedia.org/wiki/Cascading_Style_Sheets ) e alguns outros comentários sobre CSS e fiquei desanimado com a falta de suporte completo para CSS nos diferentes mecanismos de layout, então Só estou curioso se existe uma alternativa ou devo aprender a usar filtros CSS também.

CSS é o padrão. Não ha alternativa.

Todos os navegadores oferecem suporte aos recursos CSS básicos. Cada nova versão de cada uma das (quatro?) Linhas principais do navegador vem com maior suporte para o padrão, mas os sites que usam esses recursos serão quebrados para qualquer usuário em uma versão anterior. Existem duas respostas para isso:

  1. "Graceful degradation" (ou seu irmão gêmeo, "Progressive enhancement" - google it), em que a página tira proveito de recursos avançados, se estiverem disponíveis, enquanto continua a funcionar caso não estejam.

  2. Quem é seu público? Se você tiver a sorte de saber que 99,8% dos visitantes do seu site usarão pelo menos o IE7, não precisa se preocupar com os recursos CSS que estão corrompidos no IE6. No entanto, isso dependerá do seu próprio negócio, portanto, verifique os fatos primeiro.

A pior coisa que você pode fazer é codificar as peculiaridades de um único navegador específico, porque isso leva a uma página que está quebrada não apenas em outros navegadores, mas até em versões posteriores do mesmo navegador.

Marcus Downing
fonte
4

Uma alternativa, há muito tempo, JavaScript Style Sheets (JSSS) era uma tecnologia de linguagem de folha de estilo proposta pela Netscape. Se alguém estiver interessado, colocarei alguns links http://en.wikipedia.org/wiki/JavaScript_Style_Sheets

aqui está a proposta http://www.w3.org/Submission/1996/1/WD-jsss-960822 acho que foi uma boa ideia mas infelizmente o css ganhou, mas talvez algumas partes tenham se integrado com javascript ??

Além disso, talvez em vez de usar css você possa usar svg para alguns efeitos de texto, veja os exemplos
http://msdn.microsoft.com/en-us/ie/hh410107.aspx
e algumas animações
http://svg-wow.org/ text-effects / text-effects.xhtml
alguns efeitos de botões https://www.svgopen.org/2008/papers/86-Achieving_3D_Effects_with_SVG/
aqui está um exemplo de cooleer para estilizar texto que você deve olhar neste http: //www.hongkiat .com / blog / scalable-vector-graphics-text /

Geomorillo
fonte
3

A única alternativa é o suporte de formatação obsoleto que o próprio HTML tem, como a <font>tag. Mas você não quer fazer isso. 8-)

RichieHindle
fonte
7
Se você usar <font>, também poderá sentir ódio levemente intenso de outros desenvolvedores da web como eu: p (pelo menos se eles tiverem que ler / corrigir seu código ...)
Svish
3

Não, CSS é o caminho a percorrer agora. Não há nada de errado com o formato em si (eu pessoalmente gosto bastante dele, na verdade), mas apenas o suporte do navegador para ele - especialmente em relação ao IE. Assim que tivermos todos os principais navegadores com suporte a CSS3 , as coisas devem ficar bem - embora eu não esteja muito otimista sobre quando isso vai acontecer.

Noldorin
fonte
9
Nada de errado com o formato em si? Para citar Jeff Atwood: "Resumindo, CSS viola a merda viva do princípio DRY. Você está se repetindo constante e inevitavelmente. (Falta de variáveis, então temos que repetir as cores em todos os lugares. Falta de aninhamento, então temos que repita blocos enormes de CSS em todo lugar.) Essa é minha experiência também, você pode se tornar bom nisso, mas não tem nada a ver com seu mérito como linguagem
Peter
3

Não há alternativa para CSS agora e isso é uma coisa boa. Os fornecedores de navegadores, W3C, WHATWG etc, já têm dificuldade em concordar em uma única especificação do jeito que ela é, você pode imaginar o que aconteceria se houvesse mais de uma especificação?

De qualquer forma, descobri que, uma vez que você aprende CSS, você adquire conhecimento de quais coisas particulares quebram o quê e aprende a trabalhar com isso ou evita.

Espero que isto ajude.

Darko Z
fonte
11
"Não há alternativa para CSS agora e isso é uma coisa boa.", Discordo.
Gandalf
É uma coisa boa dentro da estreita especificação de Bom que Darko descreveu.
Dom Vinyard
3

Sim ! atrevimento pode ser uma opção

Jaseem
fonte
Estou surpreso que não tenha mais votos positivos, dada sua popularidade com o pessoal do Ruby on Rails.
BlueRaja - Danny Pflughoeft
2

Não (principalmente)

Se você deseja criar layouts que funcionem no número máximo de máquinas clientes, você terá que aprender CSS.

Se você pode limitar seus usuários ao IE8, Chrome, Safari e Firefox, então provavelmente você pode se safar com CSS2, caso contrário, você terá que aprender todas as diferenças com CSS1, junto com a miríade de coisas quebradas - especialmente em IE5 e 6 .

O HTML 3.2 inclui algumas tags de formatação (como <font>ou <center>), mas você não pode fazer muito com elas.

Por que apenas principalmente? - Se você pode assumir que os usuários têm Flash ou Silverlight e criar aplicativos da web para eles. Então seu layout ficará perfeito, mas precisará de um plugin do lado do cliente (que nem todo mundo tem) para funcionar. Eu só seguiria esse caminho se você realmente precisasse de uma interface de usuário realmente rica.

Keith
fonte
Na verdade, você pode fazer bastante com as tags de formatação HTML 3.2 e o layout baseado em tabela. Por exemplo, este é meu antigo site (cerca de 10 anos): itek.at/alt/ganzneu-eng.html
Erich Kitzmueller
seu site real é feito com tabela de layout também. você perde * acessibilidade, * capacidade de manutenção, * muitos daqueles 30% de usuários de internet com capacitores, * interpretação baseada em máquina (como o google) * ...
vikingosegundo
Nada que você possa fazer com o 3.2 é aceitável no desenvolvimento moderno em termos de largura de banda, acessibilidade ou manutenção. Simplesmente não há propósito em reduzir a escala se você não for obrigado.
annakata
@ammoQ - sim, você pode, mas demora um pouco e é difícil mudar. Volte ao início dos anos 2000 e o design do site consistia em fatiar uma grande imagem e colocar o quebra-cabeça resultante em uma mesa. Eu fiz muito isso e não é tão bom comparado com as coisas modernas. Você pode fazer um site dessa maneira, mas parecerá que foi atualizado pela última vez em 2002.
Keith
2

Eu concordo que o estado atual do suporte a CSS é horrível.

Acho que a melhor abordagem é escrever CSS de acordo com o padrão e, em seguida, adicionar correções para todos os bits onde os vários navegadores não estão em conformidade. Muitas vezes vale a pena evitar alguns bits de CSS, se você pensar (os níveis z, por exemplo, têm níveis realmente mistos de suporte em muitos navegadores).

Jon Cage
fonte
1

Zoli está certo. "xslt é uma alternativa"

XSLT transforma XML em uma página da web renderizada, assim como CSS transforma HTML em uma página da web renderizada. Observe que você não pode misturar XSLT com HTML ou CSS com XML.

Usei CSS + XSLT para criar páginas da web renderizadas.

Brian Kueck
fonte
0

Adobe Postscript é a alternativa mais provável ao CSS. O problema é que ele requer o Acrobat para visualizá-lo na área de trabalho ou na web. É muito superior ao CSS e mantém a intenção do design e escala em todos os dispositivos, incluindo impressoras, plotters, telefones, tablets e praticamente qualquer coisa com um intérprete PostScript.

O postscript tem uma curva de aprendizado ZERO, a menos que você esteja implementando para um dispositivo específico. É programado por milhões de programadores, artistas gráficos, artistas, impressores profissionais e até mesmo o usuário de computador doméstico com menor habilidade. Tudo que você precisa fazer é selecionar imprimir ou salvar no menu de qualquer aplicativo. Ele oferece suporte para links e entradas de campo. É pesquisável? É e os documentos baseados em PS aparecem com frequência nas páginas de pesquisa do Google.

Embora possa ser visualizado em um navegador da web na forma de PDF, não é uma linguagem nativa do navegador como HTML e CSS. Por que não é, se é tão fácil e poderoso? Quando a web estava começando, a Adobe era muito míope e gananciosa para abrir a linguagem. Eles queriam vender licenças para seus motores PS e seus produtos de criação de conteúdo. Para a Adobe, distribuir um navegador PS era como distribuir o Goose e os ovos de ouro.

ATL_DEV
fonte
-6

xslt é uma alternativa

É mais poderoso do que css.

É mais difícil aprender e usar.

libeako
fonte
4
como o XSLT é uma alternativa ao CSS? Eles fazem coisas completamente diferentes.
Mr. Shiny and New 安 宇
Eu acho que eles podem meen XSL-FO, o que é bom, mas AFAIK não funciona em um navegador.
Jeremy French
1
Não, não me refiro a XSL-FO, apenas XSLT. Em XSLT você pode expressar transformações, portanto, com XSLT você pode expressar qualquer tipo de formatação que pode ser expressa em HTML. OK, isso é menos do que o CSS pode fazer, mas eu não disse que o XSLT é uma alternativa perfeita. O material XSLT também está em um arquivo separado, como CSS, e de HTML pode-se referir ao arquivo XSLT. Por causa dessas 2 propriedades, pode-se fazer a formatação de seu documento baseado em HTML sem muita redundância. O XSLT funciona no Firefox, ou seja, não testei outros.
libeako de
4
Não, Zoli. Você não pode fazer a formatação com XSLT. Você pode interferir com o código original, transformá-lo, adicionar ao id, remover dele etc., mas você não pode
estilizá-