Aprenda os fundamentos: cores no CSS

Quando você se deparar com algum tipo de código, tenha a curiosidade de decifrá-lo.

Me impressiono com a quantidade de programadores que precisam escrever CSS com regularidade e nunca pararam para entender o significado dos código de cores.

É simples: uma cor RGB é composta de três números, representando as cores vermelho (R), verde (G) e azul (B). Cada um desses números pode ir de 0 a 255 (1 byte).

Então o vermelho vivo é:

rgb(255, 0, 0)

Que também pode ser escrito como:

rgb(100%, 0, 0)

Ou, em hexadecimal (255 = FF):

#FF0000

As cores que podem ser “arredondadas” para duplas de letras iguais, como essa, podem também ser escritas assim:

#F00

E é isso. Da próxima vez que você escrever uma cor, vai saber o que significa. Agora pesquisa sobre RGBA, você via ver como fica fácil entender.

Mas não é só sobre cores. Faça isso sempre que se deparar com qualquer tipo de código, tente entender o que ele significa, você vai gastar um pouquinho de tempo no início, mas a vida vai ficar muito mais fácil depois.

Yes we can! Minha apresentação no TDC 2015.

Agora que o Internet Explorer 8 morreu, e o número de usuários do Internet Explorer 9 é quase insignificante, há uma porção de recursos do CSS que finalmente podemos usar.

Essa é a primeira palestra de uma série, que inclui outros recursos do CSS, HTML5, SVG e Javascript. Em breve publicarei as outras, incluindo vídeos. Enquanto isso, veja os vídeos que publiquei recentemente:

Carta aos Presidenciáveis: Por que desprezam quem precisa de acessibilidade?

Da Lêda Spelta:

Caríssimos candidatos Dilma Rousseff, Marina Silva e Aécio Neves,

Desalentada com a escassez de informações apresentadas nos programas eleitorais, resolvi acessar os sites oficiais de campanha, na esperança de encontrar esclarecimentos sobre as principais diferenças programáticas, ou seja, sobre o que eu poderia esperar do futuro do Brasil com cada um dos senhores na presidência, já que são os candidatos com chances reais nessa eleição. E decidi começar pelo site da Presidenta Dilma…

Continue a leitura no site da Acesso Digital: Carta aos Presidenciáveis: Por que desprezam quem precisa de acessibilidade?

Acessibilidade para Twitter Bootstrap

Dica do Hans Mösl no grupo de trabalho de acessibilidade do W3C Brasil:

Plugin de Acessibilidade para Twitter Bootstrap. Plugin de código aberto, no GitHub. Promete tornar acessíveis uma porção de componentes Javascript do Bootstrap e, até onde eu consegui conferir, funciona muito bem.

Considere incluir em seu próximo projeto. Considere incluir nos seus projetos antigos baseados em Bootstrap 3. Considere incluir sempre.

Aprenda SVG!

SVG é suportado em tudo quanto é navegador hoje, incluindo o Internet Explorer 9. Isso significa que, num futuro próximo, você vai poder usar SVG sem medo. Enquanto isso, para boa parte das necessidades, você pode usar SVG com uma biblioteca de compatibilidade com IEs antigos, como a Raphaël e a svgweb.

Dá uma olhada nesse exemplo. Exibe o código fonte e você vai ver que isso aí foi feito com umas 300 linhas de javascript.

Qual o segredo?

SVG é um formato de XML para a descrição de gráficos vetoriais. O que significa que, diferente do que acontece com canvas, com SVG os objetos que você exibe na tela são de fato objetos, nós do DOM, na árvore do seu documento. Então dá uma olhada nesse outro exemplo. A animação do logo em cima e o gráfico interativo em baixo, tudo isso tem umas 35 linhas de Javascript apenas.

Então fica a dica: estude SVG. Tenho certeza que vai ser útil.

 

Alta Performance com WordPress

O que vai acontecer com seu site WordPress se ele receber muitas visitas? Aprenda neste Workshop as técnicas e segredos para manter seu site no ar, mesmo sob intenso tráfego.

Site bom é site rápido

A Amazon fez um trabalho de redução do tempo de carregamento em suas páginas e descobriu que cada décimo de segundo que suas páginas demoram a carregar representa 1% a menos de vendas. Ninguém gosta de sites que demoram a carregar.

Pensando nisso, preparamos este Workshop sobre otimização de performance em websites, focado especialmente em sites WordPress. Veja o programa

Novo local

Redesenhamos os Workshops da Visie. Serão eventos de menor porte, num lugar mais adequado a cursos de tecnologia, e também mais baratos. E esperamos que sejam mais frequentes. O lugar escolhido foi o MyJobSpace, que merece um post a parte.

E o primeiro Workshop que faremos neste novo formato é sobre um tema que acho apaixonante: performance. O Workshop Alta Performance com WordPress vai mostrar a você tudo o que você pode fazer, no servidor, PHP, em seu tema, plugins, HTML, Javascript, CSS e imagens para ter um site muito rápido.

Como temos apenas 34 vagas, é bom você não vacilar. Inscreva-se.