Muitos já o usam há muito tempo, mas geralmente apenas para editar arquivos CSS. Eu uso isso como meu principal Editor HTML(isso é sobre Versão Pro) ao criar layouts de página.

Ferramenta

Existem muitos editores HTML (profissionais) diferentes na plataforma win, e escolher um "sistema de escolha" não é nada fácil. Eu escrevo o código à mão, então nunca me interessei por editores WYSIWYG. A única exceção é o Dreamweaver mais recente que uso para criar tabelas complexas.

Eu uso o Homesite há muito tempo (em conjunto com o TopStyle Lite), mas ele não se desenvolve há muito tempo - seu autor, Nick Bradbury, está desenvolvendo o TopStyle. Portanto, no devido tempo, decidi tentar sua nova ideia.

O que ele pode fazer

Em primeiro lugar, o editor TopStyle é, obviamente, para edição de CSS. No entanto, sua versão mais antiga (paga) também é perfeita para o layout XHTML.

O editor possui realce personalizado, preenchimento automático de tags (até substituição automática de atributos de classe e id do arquivo de estilo), funções de validação integradas (usando validadores W3C ou um CSE para download). Em geral, quase tudo é como o resto dos editores normais. Mas também possui características próprias que tornam o desenvolvimento de sites com Ajuda CSS muito confortável.

Por exemplo, ele sabe construir relatórios sobre as classes utilizadas, ou seja, mostra quais classes foram utilizadas onde, e quais classes geralmente foram "perdidas" (veja a figura), ou seja, não são utilizadas em nenhum lugar do site .

O TopStyle tem um excelente mecanismo de visualização: você pode personalizá-lo para que as alterações em um arquivo CSS separado sejam mostradas como um exemplo do que você precisa. Arquivo HTML... Ou seja, ao editar um arquivo, veja as alterações em outro! E tudo isso em dois motores (Mozilla e IE), e até mesmo com a capacidade de definir algum tamanho da janela - pelo menos 6.000 × 3.000 pixels.

O editor tem as funções de "combinar" documentos antigos, nos quais o design é renderizado em atributos HTML, bem como exportar regras CSS para diferentes navegadores / versões CSS.

TopStyle constrói uma árvore de seletores muito útil que evita o incômodo de ordenar manualmente os elementos em ordem alfabética. Nessa árvore, primeiro todas as regras para elementos puros são exibidas, depois as classes e, em seguida, o ID.

Claro, não consigo imaginar trabalhar sem o painel Inspetor de estilo, que é muito mais conveniente do que soluções semelhantes em alguns Dreamweaver. Ele permite que você execute operações de rotina muito rapidamente - como a seleção as fontes que você quer, flores, etc.
Ao mesmo tempo, para cada regra, o grau de compatibilidade com diferentes navegadores é mostrado claramente.

Um dos recursos mais legais: paleta de cores baseada em CSS - todas as suas cores em um só lugar. Agora você não precisa mais escrever as cores no início do documento ou rastejar constantemente em busca do que você precisa.
Além disso, a capacidade de classificá-los e substituí-los em massa, por exemplo, torna todas as cores mais escuras (embora pessoalmente eu nunca tenha usado isso).

Além disso, a capacidade de formatar estilos é muito conveniente: por exemplo, esticar todas as regras em uma linha para economizar tráfego e, se precisar encontrar algo, volte ao estado original (com recuos e hífens).

Contudo, funções úteis muito e sem sobrecarregar, como o html-kit, por exemplo. Não há painéis para inserir tags, mas há uma oportunidade de personalizar muito para você. Por exemplo, atribuí teclas de atalho para a quebra de texto em tags H1 ... H4 pressionando Ctrl-1 ... Ctrl-4. E assim você pode definir qualquer combinação.

Conclusão

Em geral, todo mundo que ainda não usa o TopStyle Pro - vá e faça o download no site do fabricante.

O programa não é barato - é vendido por US $ 80, mas vale a pena. O layout de acordo com os padrões se tornará muito mais agradável. Afinal, peça ao seu chefe para comprar uma ferramenta normal para você!

TopStyle é um editor Cascading Style Sheets (CSS) escrito por Nick Bradbury, o criador do HomeSite. TopStyle contém tudo que você precisa para criar folhas de estilo corretas em todos os navegadores. Pode ser facilmente transferido para o seu editor de HTML e é o padrão do sistema para todos os arquivos .css. Indispensável para a criação e suporte a grandes projetos. Assim, por exemplo, a função Link Wizard permite vincular todas as páginas de um projeto a um arquivo de estilo que o próprio programa criará. Você só precisa especificar o local onde todas as páginas do site estão armazenadas. Dois outros recursos úteis do pacote podem ser observados - Verificador de Estilo e Estilos Órfãos. O primeiro permite que você verifique se há erros em qualquer arquivo css, o segundo verifica as páginas existentes do site em busca de estilos "perdidos". Se você está confuso sobre seus estilos e há uma imposição de várias camadas de diferentes fontes e soluções de cores para links em páginas html, TopStyle pode remover todas as tags de fonte in-page e substituí-las por um único estilo em cascata. E isso é apenas uma pequena parte do que o TopStyle pode fazer.

Disponível em duas versões:
O melhor estilo Leve- versão simplificada e gratuita
O melhor estilo Pró- versão completa () com muitos recursos adicionais.

Seu comentário e discussão sobre o programa TopStyle Pro

Anteriormente, quando ainda não havia CSS, o designer tinha que escrever manualmente cada tag de título ... Foi terrivelmente doloroso, e então o CSS apareceu e tornou a vida muito mais fácil para os web designers. CSS permite que você defina todos os estilos para seu site em um único arquivo (ou vários, a seu critério). Isso economiza tempo e torna seu código mais flexível.

Mas para que precisamos de editores CSS? Cada introdução nova tecnologia tem os dois lados da moeda, em CSS isso se reflete no suporte de algumas propriedades CSS em navegadores IE. E então o web designer precisa encontrar um hack para consertar a exibição nos navegadores IE.

Os editores CSS ajudam você a escrever código mais rápido e evitar muitos erros.

1. ESTILIZADOR

STYLIZER é Editor CSS que permite editar CSS e ver as mudanças em tempo real. Você pode simplesmente inserir o endereço da página da web e você verá a página da web à esquerda, e o código CSS à direita, que pode ser alterado e as alterações serão visíveis à esquerda. Você pode alterar manualmente, escrevendo propriedades e usando os botões WYSIWYG do editor.

Você também pode alterar a cor do texto dinamicamente. Quando você altera a cor, um espectro de cores aparece, semelhante ao encontrado no Adobe Photoshop.

É impossível cometer um erro neste editor, pois aqui o próprio editor verificará os valores que você inserir.

2. TopStyle

TopStyle Editor mostra os estilos suportados Navegadores Firefox, IE, Safari e até iOS 2.0. Essa oportunidade pode ser aplicado no desenvolvimento de design de plataforma cruzada.

Uma das funções úteis deste editor é o Inspetor, que permite adicionar propriedades CSS com um clique, o que economizará tempo e esforço durante uma codificação longa e tediosa.

Além disso, este editor permite que você veja a compatibilidade das propriedades CSS no navegador, o que é muito útil ao escrever código para o navegador IE.

3. Mestre de estilo

Conforme afirmado pelo desenvolvedor, o Style Master é um editor que pode ser usado por qualquer nível de conhecimento de CSS. No programa, você pode usar não apenas um editor WYSIWYG, mas também escrever o código manualmente (seria muito estranho se não fosse assim :)), com destaque de cada propriedade, para desenvolvedores mais experientes.

Talvez a maior vantagem deste editor sejam os modelos de estilo prontos. Possui cerca de 20 templates, bem organizados, que agilizam e facilitam a escrita de estilos para o seu site.

4. Editor de CSS rápido

Rapid CSS Editor é um programa prático e altamente personalizável para editar arquivos CSS. Ele tem editor de texto com destaque de sintaxe, autocompletar de código e outros.

Com este editor, você pode formatar sua folha de estilo como desejar. O validador de código integrado não apenas manterá a folha de estilo limpa, mas também protegerá contra erros CSS.

5. CSSEdit 3

Devo dizer desde já que este editor só suporta MAC OS. O editor tem Lindo design mas não se destina a usuários novatos. Além disso, o editor de dados permite que você veja as mudanças dinamicamente, em tempo real.

Um recurso interessante desse editor é que você pode descrever uma propriedade em inglês simples (o Selector Builder foi criado para isso). Para um iniciante, esta função será bastante interessante.

6. Editor EngInSite CSS

Se você é um web designer sério que se preocupa com o CSS correto e o posicionamento adequado das propriedades, este editor é para você.

Neste editor, você pode adicionar uma classe ou identificador usando as funções embutidas, e também é possível converter uma cor de HEX (formato hexadecimal) para RGB, o que é uma raridade para editores.

O editor também possui uma função de autocompletar código.

7. Fabricante de estilo

Um editor CSS padrão que permite definir fonte, cor, margem, borda e outras propriedades.