Erika Sarti | portfolio web designer » html

HTML5? Ainda não, obrigada

Erika Sarti — Wed, 19 Aug 2009 19:16:32 +0000

Nos últimos meses tenho lido bastante sobre HTML5 e CSS3. Acompanho cada detalhe dessas novas linguagens com muito interesse, mas quando eu tive a idéia de escrever um artigo sobre elas para o InfoWester percebi que seu uso prático, no momento, é quase nenhum.

Primeiro porque HTML5 e CSS3 são suportados apenas pelas versões mais recentes de alguns navegadores. Para criar um site comercial com essas tecnologias é necessário fazer tantos hacks no CSS – pra não falar num JavaScript para posicionar corretamente os elementos nas versões anteriores do Internet Explorer – que o projeto se torna absolutamente inviável.

Quantas pessoas ainda utilizam Internet Explorer 6 e continuarão utilizando por algum tempo? (talvez não muito tempo já que o Orkut agora pede educadamente para você atualizar seu navegador e pelo menos alguns usuários com computadorzinho mais antigo vão fazer a atualização).

Apesar da promessa de um código mais semântico, utilizando as novas tags do HTML5 (como

para a navegação da página e

para o rodapé), com o que temos disponível agora é perfeitamente possível escrever um código limpo e funcional. Não precisamos esperar por uma nova linguagem para começar a utilizar os elementos do HTML corretamente, certo?

Então por enquanto eu vou deixar o HTML5 e o CSS3 para projetos pessoais, quando eu tiver algum tempo livre. Assim que as aplicações práticas dessas novas linguagens começarem a aparecer, a primeira coisa que eu vou fazer será escrever um tutorial sobre como criar uma página com HTML5.

Mas não hoje.

Post inspirado no ótimo Three reasons why you shouldn’t care about HTML5 and CSS3… yet.

Tags HTML quase desconhecidas, mas muito úteis para as suas tabelas

Erika Sarti — Fri, 29 May 2009 03:29:57 +0000

Neste segundo artigo sobre “tags desconhecidas”, vamos falar sobre três tags que vão tornar suas tabelas mais semânticas: , e .

Continue lendo “Tags HTML quase desconhecidas, mas muito úteis para as suas tabelas” no InfoWester…

Otimizando um menu com a técnica de CSS sprite

Erika Sarti — Thu, 16 Apr 2009 00:28:18 +0000

Imagine que você tem um site com menu totalmente baseado em imagens, e que quando o usuário passa o mouse sobre um dos itens, essa imagem muda. Desenvolver esse menu utilizando CSS ao invés de Flash é uma boa ideia, mas é necessário criar duas imagens para cada item, cada uma representando um estado, correto? Na verdade, não. Aplicando a técnica de CSS sprite, é possível utilizar apenas uma única imagem para todo o menu. Você entenderá como fazer isso neste tutorial.

Continue lendo “Otimizando um menu com a técnica de CSS sprite” no InfoWester…

Tags HTML quase desconhecidas, mas muito úteis para os seus formulários

Erika Sarti — Fri, 20 Mar 2009 14:31:20 +0000

Mesmo para quem trabalha com design ou desenvolvimento para Web, algumas tags são desconhecidas ou de pouca utilidade. No entanto, algumas vezes elas podem simplificar nossa vida na hora de escrever o código HTML de uma página. Neste artigo, vamos conhecer algumas tags que se encaixam nessa situação:

, e . Todas elas podem ser usadas para adicionar funcionalidades interessantes a formulários.

Continue lendo “Tags HTML quase desconhecidas, mas muito úteis para os seus formulários” no InfoWester…

Favicon: por que ele é importante e como fazer o seu

Erika Sarti — Tue, 10 Mar 2009 15:24:47 +0000

Ao olhar esta sequência de ícones, você provavelmente é capaz de lembrar de quase todos os sites a que eles se referem, não é verdade?

Isso porque cada um desses símbolos é o favicon (nome oriundo da combinação dos termos favorites + icon) de alguns sites bastante famosos, ou seja, o pequeno ícone que aparece ao lado da barra de endereços ou no canto da aba de navegação do navegador quando acessamos um site, ou ainda quando adicionamos um endereço aos favoritos ou à barra de links. Sua principal função está relacionada à usabilidade: elementos visuais são sempre mais fáceis de serem lembrados, e isso destaca um site no meio de outros, facilitando a navegação do usuário. Por isso, ele é sempre gerado a partir da simplificação do logotipo ou da marca do site.

Continue lendo “Favicon: por que ele é importante e como fazer o seu” no InfoWester…

Novo trabalho no ar: Encontros com a Arte

Erika Sarti — Mon, 02 Feb 2009 18:57:51 +0000

Um dos primeiros trabalhos de 2009 foi o hotsite Encontros com a Arte, criado para divulgar os workshops de história da arte coordenados e ministrados pela professora Carmen Cruz aqui em Jundiaí. Ela, que é arte-educadora, também é a minha professora de francês.

O primeiro workshop, “O olhar e as formas”, acontece no próximo sábado (dia 7) às 14h30. Mais informações no site: www.carmen-arte.com.br.

HTML?

Erika Sarti — Mon, 14 Jan 2008 12:26:45 +0000

Ultimamente eu tenho visto muita gente (muita gente mesmo) dizer por aí que HTML é linguagem de programação.

Pessoas, HTML é linguagem de formatação, ok? Não dá pra programar com HTML, nem com CSS. Vocês provavelmente estão confundindo o HTML com o JavaScript, achando que tudo é uma coisa só, e não é.

Cuidado pra não dar fora por aí, combinado?

Tabela de cores em HTML

Erika Sarti — Tue, 17 Jul 2007 17:29:16 +0000

Logo que eu coloquei a tabela de cores web safe no ar, decidi que compilaria uma tabela com outras cores.

Por isso, montei essa segunda tabela de cores em HTML, com todas as cores que têm um nome, seu código hexadecimal e seu código RGB.

Apesar de não terem a mesma “garantia de fidelidade de cores” da tabela web safe, esses tons têm a vantagem de serem muito mais fáceis de memorizar – é mais fácil lembrar de HotPink do que de #FF69B4, não?

favicon

Erika Sarti — Sat, 16 Jun 2007 00:47:36 +0000

Como eu demorei tanto pra perceber que meu portfolio precisava de um favicon com a minha cara, não sei.

Duas páginas do meu site, a de acentuação em HTML e a de cores web safe, estão na barra de links do meu Firefox para acesso rápido. Sabe quando você tem um estalo e repara que todos os outros links têm um íconezinho que torna cada atalho único?

Então, por que não?

Criei um arquivo bmp e, como não tinha nenhum programa que convertesse a imagem num arquivo .ico, acabei encontrando o FavIcon from Pics, uma ferramenta que gera, online, seu ícone.

Agora, quando vocês abrirem o menu de favoritos ou olharem pra barra de links, vão ver meu atalho lá, rosa-pink-psico olhando pra vocês ;D

15 erros que você deve evitar em um site

Erika Sarti — Tue, 17 Apr 2007 17:30:04 +0000

Você já acessou um site e teve a sensação de que alguma coisa muito errada tinha sido feita ali? Ruim essa sensação, não é mesmo? Se você quer evitar que os visitantes do seu site tenham essa mesma impressão, fique de olho em alguns detalhes que podem derrubar seu projeto.

Continue lendo “15 erros que você deve evitar em um site” no InfoWester…