Autor: Kadu Oliveira

  • Imagens em Tela Retina com Compressive Images

    Compressive images é a técnica de gerar um JPG grande, com o dobro da resolução original, porém com uma qualidade bem baixa. Incluímos essa imagem na página declarando a metade do seu tamanho. Boa solução para servir telas retina.

  • Performance de imagens – acelerando o tempo de carregamento do seu site

    Atualmente a maioria dos sites contém uma grande quantidade de imagens. Essas imagens, quase sempre, são responsáveis pela maior parte das requisições, chegando de 50% a 65% da carga total de uma página.

  • Técnicas e ferramentas para melhorar a performance de sites

    Um bom desempenho no requisito velocidade é o primeiro passo para atrair visitas e melhorar a experiência do usuário. Pessoas detestam esperar, principalmente na Internet. Os buscadores como o Google usam o fator velocidade de carregamento nos rankings de busca. Entregar um site lento e pesado para seus usuários é um dos Crimes de usabilidade…

  • Font Local Storage, Implementando em segundos

    Já pensou em poder armazenar suas fontes no navegador do usuário? LocalFont é uma ferramenta online que converte sua família de fontes no formato .woff .woff2 e .ttf para ser armazenada no navegador usando Local Storage do HTML5. A ferramenta gera o código CSS e o JS necessário para fazer o armazenamento da fonte (localStorage).…

  • Paginação e SEO

    Quando temos muito conteúdo em uma mesma página é comum usarmos paginação. Onde o usuário tem que clicar num link para ir para a próxima página ou voltar para página anterior. Mas agora, como o Google trata a paginação? Informar sua paginação aos mecanismos de busca é algo simples de resolver. Podemos indicar sobre a…

  • Ativando Breadcrumbs no WordPress

    Ative os Breadcrumb no WordPress e crie uma navegação mais elegante, complementando a usabilidade do seu site. Além disso, Breadcrumbs servem para os mecanismos de busca entenderem melhor a estrutura do site, já que eles aparecem nos resultados de busca do Google. Breadcrumbs é uma opção nativa do plugin wordpress seo yoast, é necessário apenas…

  • Centralizar na vertical com três linhas de CSS

    Aprenda como alinhar qualquer elemento HTML na vertical com apenas três linhas de CSS. A técnica consiste em usar a propriedade CSS transform, que normalmente é usada para girar elementos. Além dela utilizamos também a função translateY. Dessa forma centralizamos qualquer elemento na vertical, mesmo sem sabermos a altura do elemento. Recomendo que leia também…

  • Forçar estado de elementos no navegador

    Você já tentou inspecionar um elemento no seu estado hover? Se alguma vez você fez isso deve ter passado um certo apuro, já que quando você move o mouse para o Dev Tools, o elemento perde o estado de hover e você não consegue mais inspecionar aquele elemento que aparece só no estado hover. Saiba…

  • Convertendo um layout fixo para fluído

    Se todos usuários acessassem nossos sites com navegadores cujas janelas fossem todas do mesmo tamanho seria um mundo praticamente perfeito e o desenvolvedor poderia ter um controle perfeito do seu layout. Mas sabemos que nossa realidade é bem diferente, Tempos atrás até dava para o desenvolvedor “enganar” e criar sites com um tamanho padrão como…

  • Dica para indexar páginas em minutos no Google

    Após publicar um post no seu blog ou criar uma página nova no seu site você pode aguardar que essa página seja indexada. Em algum momento o Google vai indexar essa URL, porém temos menos controle de quando isso vai acontecer. Em vez disso podemos pedir para o Google indexar nossa página. Vou mostrar uma…