20/05/2009 - 21:29
Quem trabalha com desenvolvimento web, mais precisamente com desenvolvimento de interfaces, assim como eu, necessita ter seu código validado segundo os padrões do W3c.
A maneira mais comum, é enviar a página para um servidor e validá-la no site do w3c, porém isso demanda muito tempo, coisa que cada vez temos menos. Para agilizar este processo, foi desenvolvido, já a alghum tempo, um complemento para o firefox, denominado “HTML Validator”.
O Html Validator, depois de instalado, verifica para você todas as páginas que você acessa, sem a necessidade de acessar o site da W3c, o algoritimo utilizado lê o código HTML e da a informação da validação. Essa informação é mostrada através de um icone que fica na parte inferior direita do navegador.
Ao clicar duas vezes no ícone, é exibido o códico finte da página e na parte de baixo, uma área dizendo onde está o erro e uma outra dizendo o que é o erro.
Se você ainda não o usa, clique no link abaixo e o instale, você verá como facilita nossas vidas.
https://addons.mozilla.org/pt-BR/firefox/addon/249
Enviado por: leandro garcia - Categoria(s): Complementos do Firefox
Tags relacionadas: HTML validator
29/01/2009 - 22:43
Volto eu aqui para escrever sobre performance de websites.
No mundo atual, as pessoas tem cada vez menos tempo e paciência para esperar por alguma coisa, muito menos se o que devem esperar é uma página ser carregada. Motivo este pelo qual nós, desenvolvedores para internet, devemos pensar na praticidade e velocidade que a página é carregada pelo usuário.
Existem algumas práticas que podem fazer com que seu código mais rapidamente carregado:
Diminua a quantidade de requisições http.
Em cada requisição que um site faz ao servidor, seja qual for (CSS, JS, Imaem, etc), há um trafego de informações, ou seja, sua página envia uma requisição e depois recebe a resposta do servidor, quanto menos requisições você fizer, menor será esse trafego, logo, mais rápido seu site carregará;
Você pode diminuir a rquisição de imagens background através de CSS sprites, já expliquei como fazê-los neste post.
Utilizar o menor número possível de arquivos CSSs, O ideal é usar apenas um, eventualmente um segundo, mas evitar o terceiro, o quarto a todo custo.
Se possível utilizar apenas um arquivo JS.
Cachear a página ou Header Expires
A inconveniência deste é que ele é server-side, ou seja, é feita através do servidor, mas serve para guardar na memória do usuário os arquivos das páginas que ele visitou, ou seja, um re-acesso ao site seria bem mais rápido.
Compressão de componentes (Gzip Components)
Esta é uma outra técnica de redução server-side. Com ela, o servidor entende que deve comprimir (ou “zipar”) os código, os CSSs os JSs e, inclusive o HTML.
Colocar as folhas de estilo no Header
Uma outra maneira eficaz de ganhar tempo no carregamento das páginas é, além de usar uma única folha de estilos, chamá-la de um arquivo externo e através da tag link posicionada dentro do header
Colocar os Scripts na parte inferior
O ideal é colocar os scripts logo antes da tag </body>, pois desta a página é carregada mais rapidamente. Quando o script está no header, a página primeiro carrega o script depois as demais informações, agora quando esle está posicionado abaixo, a página tem toda a informação carregado e só após isso os scripts são carregados.
Evite expressões em CSSs
Embora existam, as expressões em CSS não são a maneira mais eficaz de criar o seu layout, pois exigem demasiado tempo para serem entendidas pelos navegadores.
ex. background-color: expression( (new Date()).getHours()%2 ? "#B8D4FF" : "#F08A00" );
Folhas de Estilo (CSS) e Scripts (JS) externo
Evite colocar estilos e scripts em qualquer lugar no HTML, prefira sempre chama-los através de um arquivo externo. CSSs e JSs, são geralmente caheados pelo browser, o que significa que em uma próxima vista o usuário já terá esses arquivos preveamente carregados.
Otimize seus CSSs e JSs.
Quanto menor for seus códigos, menor tamanho eles terão, logo, mais rápido serão carregado.
Neste link, eu escrevi como se pode otimizar os códigos CSSs
Evite redirecionamentos
Evite ao máximo que suas páginas redirecionem para uma outra, pois desta maneira seu usuário terá que carregar duas ou mais páginas ao invés de uma.
Remova scripts duplicados
Remova todos os scripts duplicados, afinal, não há a necessidade de se carregar duas vezes a mesma coisa.
Reduza o número de DOMs
Reduza ao máximo as “firulas” via DOM do seu código.
Iframes
Se necesário for utilizá-los, utilize o menos possível, pois um ifram,e é uma outra página a ser carregada.
Escolha <link> ao invés de @import
Há duas maneiras de se carregar uma folha de estilo externa, através das tags <link> e @import. Prefira sempre a <link>, pois o @import se comporta da mesma maneira como se você colocasse o <link> lá embaixo.
E tem várias outras maneiras.
O Yahoo, disponibiliza um link onde eles explicam maneiras de se melhorar a performance. Além dessas que eu listei acima, há algumas outras. O line é este.
Como verificar como está o carregamento de meu site?
Não sei dizer quantas maneiras há para se fazer isso, a única que eu conheço, e acredito que a mais eficaz, é o YSLOW (Uái islou) (Porque está devagar).
O YSLOW, é um complemento para o Firefox que pode ser encontrado neste link.
No Próximo Post eu vou explicar como funciona o Yslow.
Enviado por: leandro garcia - Categoria(s): CSS, Complementos do Firefox, JavaScript, Praticas
Tags relacionadas: Complementos do Firefox, CSS, css sprites, JavaScript, Praticas, redução de peso, redução do tamanho
10/09/2008 - 19:47
Recentemente o Google lançou um novo browser, o Chrome, testei, gostei, em breve descreverei minha avaliação sobre. Porém este post não é sobre p Chrome, mas sim o Firefox que sempre nos ajuda.
Recebi via e-mail esta semana um complemento a ser adicionado no firefox, trata-se de adicionar um novo item ao campo de pesquisas, o Regsitro.br.
O bacana disso é, nós, que podemos pesquisar a disponibilidade de dominioss .br da mesma maneira que já efetuamos pesquisas no Google. é bem interessante e agiluiza um pouco nossa vida.
Para instalá-lo, você deve:
Abrir o Fire fox, em seguida insira o seguinte comando na barra de endereços
javascript:window.sidebar.
addSearchEngine(”
http://www.ater.com.br/registro/registro.br.src“,”
http://www.ater.com.br/registro/registro.br.png“,”Registro.br”,”Web”)
Depois enter
(Todo o comando deve estar numa só linha. Não deve haver quebras de
linhas.)
Irá surgir uma janela de confirmação.
Basta confirmar.
Pronto, você incluiu um campo de busca de dominios, depois é só você digitar “.com.br” e o browser exibira o resultado de sua busca e sem a necessidade de inserir o (chato, mas necessário) “captcha”.
Espero que seja útil
13/08/2008 - 20:04
Nova Categoria?: Complementos do Firefox
Para iniciar esta nova categoria, resolvi escrever sobre o FireFTP.
O FireFTP é um complemento bem útil que você pode instalar dentro de seu firefox. Como o prórpio nome ja diz, se trata de um complemento onde você consegue acessar, baixar ou efetuar o upload de arquivos via FTP.
Este complemento me acompanha desde o Firefox 1.5. É sempre atualizado vizando funcionar na versão atual do firefox.
É bem simples de ser utilizado.
Uma vez instalado, o complemento estará disponível dentro do menu ferramentas ou Tools.
Ao abrí-lo, você terá no canto superior esquerdo um selectbox onde você pode escolher a conta de FTP cadastrada que você quiser. Caso não haja qualquer conta, você clicar no select e depois em “Creat a new acount”. Insira os dados, Nome da conta, Host, Usuário e Senha. Após isso salve.
Agora você pode escolher essa conta.
Depois clique em conectar e faça a transferência dos arquivos que você precisar.
Abaixo o link para a página de Download
https://addons.mozilla.org/pt-BR/firefox/addon/684
Enviado por: leandro garcia - Categoria(s): Complementos do Firefox
Tags relacionadas: Firefox, FireFTP, FTP
