20 May 2008

As 7 regras do JavaScript não obstrutivo - Parte 2

Caso não lembrem, já tivemos uma pequena introdução e a parte 1 dessa série.

Se você não souber o que é JavaScript não obstrutivo, recomendo a leitura desse artigo antes de qualquer coisa. Caso contrário, vamos ao que interessa…

Encontre ganchos e relações (HTML, a base do desenvolvimento)

Antes de começar a escrever seu JavaScript, olhe para a base em que você está desenvolvendo. Se você não conhecer o código HTML ou ele estiver mal estruturado, será extremamente difícil fazer uma solução inteligente para o seu script. Provavelmente você acabará criando um código com marcações excessivas ou sua aplicação dependerá de JavaScript.

Por isso, considere duas coisas no seu HTML: ganchos e relações.

Ganchos

Dessa vez o gancho está aí pra ajudar :-)

Os ganchos HTML são, em primeira instância, os IDs, já que eles podem ser facilmente acessados via DOM pelo método getElementById. Eles podem ser usados com tranquilidade pois são fáceis de testar e um ID é único no documento. O Internet Explorer ás vezes confunde os atributos name e id, mas existem boas bibliotecas que contornam esse problema. Eu, particularmente, uso e recomendo a jQuery.

Existem outros ganchos, que são elementos que podem ser acessados com getElementByTagName e através das classes CSS (que até o momento não pode ser acessada com um método nativo - Mozilla em breve terá um e o Opera 9.5 já possui. Mesmo assim, há uma série de métodos auxiliares que permitem utilizar simular um getElementByClassName).

Utilizando um trocadilho infame, o gancho é apenas o local onde você “enroscará” seu JavaScript para atingir o objetivo.

Relações

Não esqueça: o que você quer está interligado com todo o HTML.

Outra coisa interessante sobre o HTML é como sua estrutura está relacionada. Pergunte a você mesmo:

  • Como posso chegar a determinado elemento mais facilmente e percorrendo o mínimo de passos via DOM?
  • Qual elemento eu devo alterar para atingir os elementos-filhos que eu preciso mudar?
  • Quais atributos ou informações de um determinado elemento eu posso usar para relacionar com outro?

Percorrer o HTML via DOM é trabalhoso e pode ser demorado, por isso é uma boa idéia deixá-lo para uma tecnologia que já está em uso nos browsers. Bibliotecas como jQuery, Mootools e Prototype podem auxiliar nessa tarefa.

Continua…

Para saber mais

Tags: , , ,
3 Comentários
13 May 2008

As 7 regras do JavaScript não obstrutivo - Parte 1

Caso não lembrem, eu fiz uma pequena introdução sobre esta série.

Se você não souber o que é JavaScript não obstrutivo, recomendo a leitura desse artigo antes de qualquer coisa. Caso contrário, vamos ao que interessa…

Não faça suposições (JavaScript, o assistente não-confiável)

Imagem (O Gordo e o Magro) JavaScript é seu amigo, mas não deixe que ele faça tudo.

Provavelmente a característica mais importante de um JavaScript não obstrutivo é você deixar de fazer suposições:

  • Não suponha que o JavaScript estará disponível, otimize seu código para não ficar dependente dele;
  • Não suponha que os browsers interpretarão corretamente determinados métodos e propriedades, teste individualmente em cada browser antes de publicar;
  • Não suponha que o código HTML estará correto, verifique-o e não faz nada até que ele esteja devidamente estruturado;
  • Mantenha a funcionalidade independente do dispositivo do qual seu site é acessado;
  • Suponha que outros scripts tentarão interferir com o seu e mantenha o seu script o mais seguro possível.

A primeira coisa a fazer, antes mesmo de começar a planejar seu JavaScript[bb], é analisar o código em que você irá trabalhar e ver o que pode ser usado em benefício próprio.

Não comece a escrever o JavaScript enquanto não estiver com o HTML impecável. Faça com que seu site/aplicação seja funcional sem JavaScript, para depois implementá-lo.

O que você ganha com isso?

Trabalhando dessa maneira, você evita futuros incovenientes com incompatibilidade de browsers, brechas de segurança e insatisfação do usuário. E consequentemente, melhora a qualidade do seu trabalho.

Resumindo, não confie numa aplicação baseada em JavaScript, use-o apenas para a adicionar novas funções e melhorar a experiêcia de quem acessa seu site.

Continua…

Tags: , , ,
Nenhum comentário
12 May 2008

Ganhe ingressos para o 10º Encontro Locaweb

Na última quarta-feira(07/05) teve início o 10º Encontro Locaweb de Profissionais de Internet. O evento já é referência entre os desenvolvedores web do país e conta com a participação de diversos profissionais e empresas renomados.

A edição carioca já acabou, mas o ainda terão edições em Porto Alegre (20/05), Belo Horizonte (27/05), Curitiba (10/06) e São Paulo (18/06).

Se você ainda não se inscreveu, aproveite. Vou sortear 2 ingressos para o evento. Para participar basta deixar um comentário nesse post dizendo “Quero Participar!” (só será contabilizado um comentário por pessoa). Os assinantes da newsletter automaticamente já estão concorrendo, então se quiser aumentar suas chances, cadastre-se para receber os artigos por e-mail.

O evento acontece em horário comercial, então é importante confirmar a viabilidade de estar no dia e local do encontro antes de participar. Os ingressos são válidos para apenas uma edição do evento, que será definido pelo ganhador.

O sorteio acontece na quinta-feira à noite ou quando atingirmos 100 comentários. Enjoy it! ;-)

UPDATE: O Undergoogle também está sorteando uma inscrição.

UPDATE2: Os ganhadores foram os autores dos comentários 29 e 36. Edy Nunes e Marcus Sá: Parabéns, vocês receberão um e-mail com as instruções. Valeu a participação pessoal! ;-)

Tags: , ,
46 Comentários
08 May 2008

Sobre as teias de aranha

Pessoal, esse blog não morreu (ainda), só está faltando tempo pra atualizar. Além desse, estou envolvido em outros 3 blogs, isso sem contar o trabalho aqui na Hiperquímica.

Tá meio abandonado, mas não tá esquecido. =)

Tem uma série de textos que é só finalizar e publicar, se alguém se disponibilizar pra ajudar eu agradeço. A coisa tá preta (mesmo), não tenho mais tempo nem pra jogar vídeo-game.

Pra ficar por dentro das próximas atualizações, assine o feed. Assim você não perde nada.

E vem novidades por aí. Por favor, como diria o Didi[bb], aguarde e confie! ;-)

Tags: ,
Nenhum comentário
10 Apr 2008

O que é Javascript não obstrutivo?

Javascript não obstrutivo diz respeito a scripts que, ao serem desabilitados, não interferem no funcionamento da página.

Como assim?

Simples, digamos que você tem um menu que funciona com JavaScript:

Menu DropDown Olha que maravilha, você passa o mouse e surgem novas opções.

O que aconteceria se alguém acessasse sua página com um navegador que não tem suporte a JavaScript[bb]? Ela deixaria de funcionar? No exemplo acima, como o internauta chegaria até “sub Option 0”?

Utilizar JavaScript não obstrutivo é utilizar scripts que aprimorem suas aplicações web sem que elas fiquem dependentes do mesmo.

Um bom exemplo disso são os links Boo-box. Ao clicar em um link, uma chamada JavaScript abrirá uma vitrine dentro do site. Caso o Javascript esteja desabilitado, o internauta é redirecionado para uma nova página. A aplicação funciona de qualquer maneira, o JavaScript apenas adiciona uma funcionalidade.

Por que utilizar?

Simples, JavaScript não obstrutivo é uma das principais maneiras de garantir a acessibilidade, facilitar a manutenção e ganhar tempo na hora de desenvolver seu site.

Para saber mais

Nos próximos dias estarei publicando a série The Seven Rules Of Unobtrusive JavaScript traduzida. Então assine o feed e fique por dentro das 7 regras essenciais para um JavaScript não obstrutivo.

Tags: , ,
6 Comentários
Página 2 de 9«12345»...Last »
Topo