Como ser um WebDesigner [no Linux]: Extensões para o Firefox
[ da série
Como ser um WebDesigner no Linux ]
Existem ótimas - e eu diria até imprescindíveis - extensões para o Firefox para quem é WebDesigner. Como o Firefox é multi-plataforma, este artigo se aplica aos usuários de Windows e Mac também; mas meu enfoque é mostrar ainda que o Linux é uma excelente plataforma para Webdesigners.
WebDeveloper, o carro-chefeEssa extensão é simplesmente fantástica! É aquela que todos concordam que é
necessário ter. É uma barra de ferramentas com opções diversas voltadas para os desenvolvedores Web. São tantas opções que seria necessário um artigo só pra falar disso.
Eu destacaria a opção de edição de CSS na Sidebar. É fantástico: você abre o CSS da página na Sidebar e edita em real-time; as modificações vão sendo aplicadas na hora.
Há trocentas outras opções, como validação do código, desabilitar recursos como JavaScript ou Java, informações sobre a página, recursos de manipulação de formulários e imagens e etc.
http://chrispederick.com/work/firefox/webdeveloper/ColorZilla, ajudando nas coresTambém considero a ColorZilla indispensável. Ela permite você pegar a cor de
qualquer coisa numa página, dar zoom na página inteira, tem paleta de cores, um inspetor DOM voltado pra cores e algumas opçõezinhas.
http://www.iosart.com/firefox/colorzilla/Aardvak, uma novidade interessanteEsse extensão de nome difícil também é bem nova mas bastante útil. Permite selecionar elementos ao apontá-los, mostrando a tag, o id e o class. Selecionado, esse elemento pode ser retirado, pintado; ainda é possível selecionar o elemento que o contém, ver seu código-fonte, e muitas outras coisas. Os planos para as próximas versões prometem muitas funcionalidades bem interessantes.
Uma coisa legal é que no
site deles, você pode rodar a extensão direto antes de instalá-la, através de uma demonstração em JavaScript. Vale a pena uma conferida pra entender dir
http://karmatics.com/aardvark/MeasureIt para medir qualquer coisaUma extensãozinha nova e simples mas bem legal: disponibiliza uma régua com a qual você pode medir qualquer coisa no navegador. É bem útil pra ajudar a posicionar as coisas no seu Site quando elas mão estão encaixando.
http://www.kevinfreitas.net/extensions/measureit/Venkman, Javascript DebuggerEsse debugger existe há muito tempo, antes do Firefox. É extremamente completo e utilíssimo pra quem desenvolve aplicações complexas com JavaScript. Só um porém: ela é bastante pesada, motivo pelo qual eu não a uso e não sei muitos detalhes :-P
http://www.hacksrus.com/~ginda/venkman/Javascript ConsoleNão é uma extensão, já vem com o Firefox, só tenha o cuidado de instalar junto. Mostra os erros de JavaScript de forma bastante detalhada, informando com exatidão qual é o erro e até a linha onde ela está. Pra quem tentava desenvolver no IE, é um grande avanço frente àqueles erros bizarros, incompreensíveis e inexatos.
DOM InspectorTambém faz parte do Firefox. Exibe toda a árvore DOM do documento, com os valores dos atributos e tudo mais. Você pode inspecionar cada elemento daquele momento; ou seja, se você usa um JavaScript que altera a sua página, essas alterações estão no DOM Inspector (diferente do "Ver código-fonte" que não exibe essas modificações).
Atualização 30/04:Não sei como fui me esquecer do
JavaScript Shell (só fui lembrar dele quando fui usá-lo hoje). Na verdade nem é uma extensão, é um bookmarklet. Mas é absolutamente fantástico. Abre um shell onde você pode fazer qualquer coisa em JavaScript praquela página. O shell é tão completo que tem até auto-completar com a tecla tab!
Se você faz qualquer coisa com JavaScript, é um bookmarklet essencial!
IEs4Linux - Instalação AUTOMÁTICA dos Internet Explorers no Linux
Ok, eu realmente me empolguei! O sucesso (pra mim) do
artigo sobre como instalar os Internet Explorer 6, 5.5 e 5 no Linux foi tanto que criei um projeto chamado
IEs4Linux!
É um programinha que faz tudo aquilo
automaticamente e você precisa de
apenas 2 cliques para instalar os 3 IEs!
A primeira versão já
está disponível aqui e, se você puder me ajudar a testá-la, serei eternamente grato. Quero aperfeiçoar esse negócio pra fazê-lo funcionar no maior número de versões do Wine possíveis e sem a menor interferência do usuário.
Por enquanto, só testei na versão 20041019 do Wine no Gentoo. Teste e me conte os resultados!
Atualização: o programa foi atualizado! Contém melhorias e tem suporte para [possivelmente] mais versões do Wine. Foi testado com sucesso no Wine 20050111 no Gentoo e no Wine 20050301 no Kurumin (baseado no Debian).
Se você testou ou vai testar o programa, por favor me conte os resultados (coloque um comentário aqui, mande um e-mail, icq, msn etc).
There is an English version of IEs4Linux too.
Como ser um WebDesigner no Linux: Editores HTML
[ da série
Como ser um WebDesigner no Linux ]
Resolvido o problema dos IEs no Linux, um WebDesigner recém chegado do Windows pergunta:
e o Dreamweaver? como sobreviver no Linux sem ele?Antes de responder a isso (e adianto que há
ótimas opções para Linux), já vou dizendo: eu não gosto de Dreamweavers da vida que geram código pra mim. Vejo o WebDesign como uma arte e um belo código só sai das mãos de um bom WebDesigner. Gosto de código limpo, bem estruturado, semântico e legível; logo, gosto de escrevê-lo.
Mas, como muita gente curte um bom editor WYSIWYG, vou apresentar algumas boas opções:
- NVU - É o editor do Mozilla, baseado no Gecko. Está quase na versão 1.0 final e é muito bom. É extremamente completo, com FTP, editor CSS e até Tags Technorati. A grande vantagem é rodar em cima do Gecko, o motor de renderização do Firefox.
- Quanta - É o editor do KDE e, portanto, usa o motor KHTML (do Konqueror e do Safari da Apple). Também é muito bom.
- Amaya - É o editor "oficial" do W3C. Pessoalmente não gosto dele, mas tem suas vantagens, como implementar extremamente à risca os padrões. [Eu tive dificuldades em compilá-lo; só consegui instalar pelo rpm]
Baixe os 3 e teste-os! É a melhor forma de escolher e ver qual se encaixa melhor no seu gosto e nas suas necessidades. Eu pessoalmente ficaria com o NVU; ele é excelente e usa o Gecko o que é uma tremenda vantagem.
Editores sem WYSIWYGPara os que curtem o bom e velho HTML sem WYSIWYG como eu, boas opções são:
Minha escolha pessoal é o Eclipse com alguns plugins; em especial, o
phpeclipse, pois programo muitos sites em PHP. Reforço o
link do blog do Diego que conta como ele escolheu o Eclipse e tem
muitas informações pra quem quiser adotar essa forma de desenvolvimento.
FlashE, aproveitando o ensejo, podemos falar da outra pergunta muito comentada:
e Flash?Bom, isso já é mais complicado. Ainda não há um bom programa para animações Flash no Linux. Muitos estão em desenvolvimento, como o
Flash4Linux - F4L (http://f4l.sf.net/), mas nada chega aos pés da suíte de desenvolvimento que é o Flash MX 2004 com seu ActionScript 2.0.
Devo dizer que nada disso é problema pra mim. Eu, como já disse, adoro HTML e códigos elegantes, limpos e semânticos. Odeio sites em Flash. Acho que Flash deve ser usado para Aplicações como o mal-sucedido Applet Java. Nada de Sites. Portanto, tecnicamente, um WebDesigner não deve usar Flash na minha concepção; apenas programadores dessas Aplicaçoezinhas.
Mas, devo dizer que o Macromedia Flash roda no Linux usando o CodeWeaver. Aliás, o Dreamweaver também.
------
PS: Se você está curioso como eu estava, o Dreamweaver MX 2004 usa o engine do Opera; portanto, temos Gecko no NVU, KHTML no Quanta e Opera no Dreamweaver. O Trident (motor do IE) ficou de fora; deve ser usado apenas no Visual Studio :-P
Sucesso e continuação
Estou muito feliz com a repercussão do
meu artigo sobre instalação dos IEs no Linux. Os acessos no blog quintuplicaram por causa dele!
Fui linkado em diversos lugares. No
NoticiasLinux, no
Br-Linux, no
VivaLinux (argentino), no
LinuxHispano e em mais alguns sites e blogs. Por causa desse relativo sucesso (novidade pra mim),
traduzi o artigo para o inglês, já que estava sendo linkado de sites estrangeiros.
E agora que o Google achou o
artigo em inglês, muita gente tem chegado.
Se você leu o artigo e fez alguma das instalações com sucesso, me conte! E, se teve algum problema, também pode entrar em contato comigo e eu posso tentar te ajudar.
Na série sobre WebDesign no Linux, há um
artigo sobre Navegadores; quais você deve instalar e porque o Linux é a melhor plataforma para testar Sites. Os próximos artigos serão: um sobre Editores HTML e outro sobre ferramentas de desenho.
E aproveito pra falar pro pessoal que tem chegado aqui pela primeira vez que, se gostarem do blog, podem assinar o
feed xml (atom)! Além disso, tenho um
linkblog no del.icio.us.
Como ser um WebDesigner no Linux: Navegadores
[ da série
Como ser um WebDesigner no Linux ]
Um ponto fundamental para os WebDesigners é testar seu Site nos mais variados navegadores. No Linux, isso é
muito mais fácil que no Windows.
Hoje, pode-se dizer que você cobrirá todo o mercado de navegadores se levar em conta:
Gecko (Firefox, Mozilla),
KHTML (Konqueror,
Safari/Mac,
OmniWeb/Mac) ,
Opera,
Internet Explorer (Win/5+, Mac/5+) e navegadores
modo texto (lynx, links); a navegação por outros dispositivos (celulares, PDAs) geralmente implica num navegador (X)HTML, portanto, um navegador modo texto te dará uma boa impressão de como eles ficarão nesses dispositivos [*].
No Linux, você pode instalar um browser Gecko, um KHTML, o Opera, os 3 IEs para Windows e o lynx/links. E pode rodá-los
todos simultaneamente para testar seus Sites! No Windows, você não rodaria um KHTML e ainda teria muita dificuldade em rodar 3 IEs.
Ou seja, você pode testar seu Site no Linux usando os navegadores de
99% do mundo!! [**]
Navegadores Gecko, você tem o
Firefox, o Mozillão, o Netscape, o Galeon, o Epiphany, o Kazehakase e o SkipStone.
Para KHTML, temos o
Konqueror do KDE.
Os IEs 6, 5.5 e 5 você aprende a instalar no Linux através
desse outro artigo da série.
Para o
Opera, recomendo ter duas versões: a 7.0 e a novíssima 8.0.
E os navegadores modo texto mais usados:
lynx,
links,
links2 e
elinks.
Se você for bem chato e quiser o
máximo de compatibilidade, rode algumas versões do Gecko. Em especial, algum
Netscape 4, e algum Firefox (e talvez uma versão do Mozilla anterior à 1.0 ou o Netscape 6). Você pode ver também
essa lista de browsers, com comentários sobre a atividade de cada um ainda hoje. E não deixe de visitar o
Arquivo de Browsers do Evolt; lá você pode encontrar versões antigas de praticamente qualquer browser que existe.
Ah, se você quiser ser bastante chato, pode testar também seu site no
Amaya, que é o Navegador e Editor HTML do W3C. Mas ninguém usa isso pra navegar, garanto... ;-)
-----
[*] Há navegadores mais espertos rodando nos bolsos por aí. O
Opera roda no PocketPC e o Firefox possui uma versão em desenvolvimento para esse fim, o
Minimo. Mas ambos os navegadores no desktop possuem possuem visualizações de como funcionariam nesses dispositivos.
[**] A única lacuna que fica são os pouquíssimo usuários do IE no Mac. Infelizmente, o IE no Mac roda um motor que difere em muitas coisas do IE do Windows. Portanto, para testar, só usando um Mac mesmo. Mas fique tranquilo, muito pouca gente usa o IE no Mac. Os browsers mais usados no Mac hoje são Safari (KHTML), Firefox (Gecko), Opera e Camino (Gecko).
E, por falar em poquíssimos, podemos lembrar dos raríssimos IE 4 e IE 3. Se procurar muito, talvez chegue a dez pessoas no mundo usando-os ainda; mas tem gente que usa...
[***] Curioso pra saber o que eu tenho aqui na minha máquina? Bom, hoje, tenho:
Firefox 1.0.3, Mozilla, Konqueror, Opera 7.54, Opera 8, Netscape 4.8, IE 6, IE5.5, IE 5, lynx, links, links2, elinks
Como ser um WebDesigner no Linux: Instalando os Internet Explorer 6, 5.5 e 5
english version[ da série
Como ser um WebDesigner no Linux ]
Um bom WebDesigner, além de programar dentro dos padrões, não pode estar alheio aos usuários que infelizmente estão contaminados com o IE. É preciso fazer Sites que, além de respeitarem os padrões, sejam compatíveis com o IE 5+ (no mínimo).
Isso costuma ser um grande problema aos WebDesigners que trabalham com o Linux. Porém, é possível ter o Internet Explorer rodando perfeitamente no Linux com o auxílio do Wine. Este artigo apresenta o
IEs4Linux, um projeto pessoal meu que instala as 3 versões principais do IE (5, 5.5 e 6) no Linux automaticamente.
É muito simples: basta abrir o
Site do Projeto e baixar o arquivo. É um simples Bash Script. Execute-o , escolha o tipo de instalação, dê 2 cliques, espere um pouco e pronto; os 3 IEs estão instalados e funcionando!
Depois, por favor, venha aqui e coloque um comentário me avisando se funcionou pra você e colocando sua versão do Wine e sua distro.
--------------------
Atualizado em 3 de maio de 2005O original deste post mostrava uma passo-a-passo de como instalar manualmente os IEs. Esse post deu origem ao IEs4Linux e portanto não há mais necessidade de fazer nada na mão. Mas se, mesmo assim, você quiser ver,
o passo-a-passo está aqui em inglês.
A volta do sumiço repentino
Pois é, sumi. Várias coisas aconteceram e sumi um tempão do blog. Mas, calma, estou de volta!! :-P
Volto cumprindo uma dívida milenar (desculpem pela imensa demora): fiz o tutorial de como rodar o Internet Explorer nas versões 6, 5.5 e 5
simultanemente no Linux via Wine. É o tutorial perfeito pra os WebDesigners que estavam querendo mudar de vez para Linux.
Aliás, estou preparando uma série de posts sobre
Como ser um WebDesigner no Linux.O primeiro, é este dos IEs. Os outros vêm nos próximos dias.
-----
Novas do Blog Cultural: