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!

Desenvolvedor Web. Siga-me no Twitter @rodolfoprr.

Artigos relacionados

  • Não há artigos relacionados.

Deixe seu comentário

Comentários

2 Comentários em “Editores Web WYSIWYG”.

Ítalo

20-06-2010 às 20:08     

Gostei muito!
Isso que eu precisava!

Cezar

04-07-2011 às 16:49     

Sempre quis implementar uma funcionalidade assim nos meus sites, inclusive tinha conhecido um bbcode… sei lá talvez esteja viajando, mas esses são bons, vou usar o jWYSIWYG, valeww!!



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