Editores Web WYSIWYG

Por Rodolfo Pereira para JavaScript.

Em sistemas para internet, é bastante comum utilizarmos Editores Web WYSIWYG para oferecermos aos nossos clientes uma interface amigável para que ele possa editar seus textos e colocá-los em seus sites.

Os Editores WYSIWYG (acrônimo em inglês para “What You See Is What You Get” e em português para “O que você vê é o que você obtém”) possuem uma interface bastante intuitiva e poderosa, nos dando a opção de formatarmos os nossos textos, realizarmos upload de arquivos, entre outras funções. Antigamente, os Editores WYSIWYG geravam um código não elegante e não validado; hoje em dia, a realidade é bastante diferente, pois eles conseguem gerar um código elegante e quase sempre, validados de acordo com os Padrões Web estabelecidos pelo W3C.

Aqui irei listar alguns dos Editores Web WYSIWYG, que sem dúvidas, irão facilitar o desenvolvimento do seu sistema ou site.

CKEditor

CKEditor

O CKEditor é a nova versão do antigo e conhecido FCKeditor. Particularmente, atualmente o considero o mais poderoso e amigável dos Editores Web WYSIWYG que existem.

Em termos de acessibilidade, o CKEditor possui suporte aos padrões WAI-AA WCAG 1.0 Site Externo e Section 508 Site Externo, contando com suporte total à navegação pelo teclado, leitores de tela e contraste de cores.

A sua compatibilidade com navegadores e sistemas operacionais é grande, funcionando nos navegadores Internet Explorer 6+, Firefox 2+, Safari 3+, Google Chrome e Opera 9.5+, todos em suas versões para Windows, Linux e MAC.

A sua “carta na manga” é o poderoso CKFinder Site Externo, o qual lhe possibilita o upload de arquivos e imagens. Integrando-o ao CKEditor, você possuirá uma solução completa em Editor Web WYSIWYG.

O suporte do CKEditor e CKFinder Site Externo é bastante completo, contando com a documentação Site Externo de ambos os softwares e um Fórum para discussão Site Externo. Dificilmente você ficará na mão, caso você tenha alguma dúvida em relação ao CKEditor ou CKFinder.

Mas caso você não utilize o CKEditor para uso pessoal ou educacional, você terá que comprar uma licença Site Externo, que custa de US $375 a US $1450. Já o CKFinder, você é obrigado a comprar uma licença Site Externo para utilizá-lo, que custa de US $59 a US $1390.

CKEditor
http://ckeditor.com/ Site Externo

CKFinder
http://ckfinder.com/ Site Externo

TinyMCE

TinyMCE

O TinyMCE é um outro grande Editor Web WYSIWYG disponível no mercado. Grandes empresas como Oracle, Microsoft e Apple utilizam o TinyMCE em suas aplicações.

Fácil de ser integrado à sua aplicação, o TinyMCE é compátivel com Mozilla, MSIE, FireFox, Opera, Safari e Chrome.

O suporte do TinyMCE é composto de uma documentação (wiki) Site Externo, um Fórum Site Externo e um suporte pago Site Externo. Assim, o suporte do TinyMCE se mostra bastante completo, não te deixando na mão em relação a dúvidas ou bugs do software.

Assim como CKEditor, se você utilizar o TinyMCE para uso comercial, você deverá comprar uma licença. Infelizmente, o preço da licença não está disponível no site do software, sendo necessário enviar um e-mail para obter maiores informações sobre a licença comercial.

No site do TinyMCE é disponibilizado dois plugins que se integram ao TinyCME, que são o MCImageManager Site Externo e MCFileManager Site Externo. Eles aumentam o poder do TinyMCE, disponibilizando o upload de arquivos e imagens integrados ao TinyMCE. Ambos os plugins necessitam de uma licença para utilizá-los.

TinyMCE
http://tinymce.moxiecode.com/ Site Externo

jWYSIWYG

jwysiwyg

O jWYSIWYG é um plugin em jQuery de Editor Web WYSIWYG, por isso, para utilizá-lo você precisa utilizar a biblioteca jQuery Site Externo.

A vantagem do jWYSIWYG em relação ao CKEditor e TinyMCE, é a sua extrema simplicidade em integrá-lo ao seu sistema ou site, seu pequeno tamanho (26Kb no total, 18Kb de código e 7Kb comprimido) e o melhor: a licença do jWYSIWYG é baseada nas licenças GPL/MIT*.

A sua compatibilidade total limita-se aos navegadores Safari 4, Firefox 3.5, Chrome 4.0 e Internet Explorer 8. Caso for outro navegador ou outra versão dos navegadores citados anteriormente, o jWYSIWYG poderá apresentar alguns erros.

jWYSIWYG
http://code.google.com/p/jwysiwyg/ Site Externo

jHtmlArea

jHtmlArea

jHtmlArea é um plugin em jQuery de Editor Web WYSIWYG.

Os navegadores Internet Explorer 7/8, Firefox 3/3.5 e Safari 4 possuem suporte completo ao editor.

A licença do jHtmlArea é baseada nas licenças GPL/MIT*.

O suporte do jHtmlArea conta com um fórum de discussão Site Externo e uma lista para relato de problemas Site Externo.

jHtmlArea
http://jhtmlarea.codeplex.com/ Site Externo

markItUp!

MarkItUp

markItUp! é um plugin em jQuery de Editor Web de MarkUp. Ele possui suporte a navegação pelo teclado, oferecendo um diferencial em usabilidade em relação aos demais plugins em jQuer. Seu poder de customização é grande e oferece cinco estilos prontos, como por exemplo um do MacOS e outro do Windows Live.

O markItUp! oferece suporte aos navegadores IE6+, Safari 3.1+, Firefox 2+ e Opera 9+. O suporte oferecido pelo plugin é somente a sua documentação Site Externo e infelizmente ele  não possui nenhum fórum de discussão.

A licença do markItUp! é baseada nas licenças GPL/MIT*.

markItUp!
http://markitup.jaysalvat.com/home/ Site Externo

* A licença GPL/MIT possibilita o uso do software em programas livres ou proprietários sem ter que comprar uma licença e também oferece a liberdade de executar o programa para qualquer propósito.

Caso você conhece outro Editor Web WYSIWYG, compartilhe-o conosco comentando logo abaixo!

Rodolfo Pereira

Desenvolvedor Web e Analista Júnior de SEO pela Princi Agência Web e XY2. Siga-me no Twitter @rodolfoprr.

Artigos relacionados

  • Não há artigos relacionados.

Deixe seu comentário

Comentários

1 Comentário em “Editores Web WYSIWYG”.

Ítalo

20-06-2010 às 20:08     

Gostei muito!
Isso que eu precisava!



Sobre

No Blog da Princi Agência Web você fica por dentro das novidades da nossa agência, além de conferir nossos artigos sobre as tecnologias de desenvolvimento web, web design e marketing digital.

XHTML