Carlos Tristacci Just another WordPress weblog

Padrões web

  • Na categoria: Padrões web
  • por: Carlos Tristacci
  • em: 26.11.2009

Hitler falando sobre o Internet Explorer 6

Salve galera!

Sempre posto artigos mais técnicos ou conceituais. Mas desta vez, não pude me conter com esta tragicomédia sintetizando tudo que nós desenvolvedores e designers enfrentamos graças a existência do Internet Explorer.

Hi Hitler!

  • Na categoria: Padrões web
  • por: Carlos Tristacci
  • em: 20.07.2009

Layout Líquido – Parte 3 ( Final )

Finalizando a série sobre layout líquido, nesta vídeoaula apresento a técnica chamada  Holy Grail ou Santo Graal, para um layout com 3 colunas, sendo 2 colunas com largura fixa e 1 coluna com largura variável.

Está técnica foi publicada no site www.alistapart.com/articles/holygrail e depois traduzida para o português no site alabrasil.blogspot.com/2006/02/em-busca-do-santo-graal.html. Acredito que tenham batizado com este nome devido aos problemas que ocorrem na estruturação deste tipo de layout principalmente no Internet Explorer 6.

Sinta-se a vontade em assistir e comentar a técnica.

Get the Flash Player to see this player.

Baixe os arquivos desta vídeoaula.

  • Na categoria: Internet
  • por: Carlos Tristacci
  • em: 07.07.2009

Falando em Browser…

best-browser

Estava no twitter quando vi um post do Imasters falando sobre a guerra dos browsers e como estava falando do Firefox…

A StatCounter divulgou que a Microsoft perdeu 9,27% dos usuários nos últimos 11 meses e o novo Firefox 3.5 abocanhou mais 2% dos usuários.

O Internet Explorer ainda continua com a maioria dos usuários, 59.5% de participação para IE6, IE7 e IE8 combinados. Que é uma grande queda se pensarmos que em Julho do ano passado ele tinha a preferência de 67.38% dos internautas…. Ainda bem!

A Mozilla continua firme na segunda colocação com 30.4% contando todas as releases. Na Europa, a participação do Firefox mostrou-se ainda maior no mês passado: 39%, contra 46% do IE.

Atualmente a corrida pela preferência do grande público está com a seguinte colocação:

  1. Internet Explorer – 59,5%
  2. Firefox – 30,4%
  3. Opera – 3,1%
  4. Safari – 2,94%
  5. Google Chrome – 2,83%
  • Na categoria: Internet
  • por: Carlos Tristacci
  • em: 05.07.2009

Firefox 3.5

Baseado na plataforma de renderização Gecko 1.9.1, que esteve em desenvolvimento durante o ano passado. Esta nova versão oferece muitas mudanças em relação a versão anterior, apoio a novas tecnologias da Web, melhorando o desempenho e facilidade de uso.

Get the Flash Player to see this player.

Navegação Privativa

O histórico do navegador é bastante útil caso você queira voltar a visitar uma página que não lembra o endereço. Mas talvez você não queira que outras pessoas que utilizem o seu computador possam acessar seu histórico de navegação ou de download. Então, basta ativar a opção Ferramentas > Iniciar Navegação Privativa.

TraceMonkey

TraceMonkey acrescenta código nativo-compilação para o motor JavaScript da Mozilla (conhecido como “SpiderMonkey”). É baseado em uma técnica desenvolvida na UC Irvine chamado “trace trees“, e da construção no código e idéias partilhadas com o projeto Tamarin Tracing. O resultado final é um aumento enorme de velocidade.

performance-chart

Desempenho do Firefox: Rápido – Máis rápido – Mais rápido ainda
Resultados do teste SunSpider em uma máquina com Windows XP

Navegação ciente de localização

Sites que usam a navegação ciente de localização perguntarão onde você está para poder fornecer informações mais relevantes, ou para economizar tempo ao pesquisar. Digamos que você esteja procurando por uma pizzaria na sua região. Um site será capaz de pedir que você compartilhe sua localização para que uma simples busca por “pizza” traga os resultados que você precisa… nenhuma outra informação ou digitação extra será necessária.

Ou, se você estiver mapeando um percurso para chegar em algum lugar, o site saberá o seu ponto de partida; você só precisará informar para onde deseja ir.

Esse serviço é totalmente opcional – o Firefox não disponibiliza a sua localização sem pedir a sua permissão – e foi feito respeitando ao máximo a sua privacidade. E, como todos os elementos do Firefox, está sendo criado usando padrões abertos para facilitar a adoção por desenvolvedores da web.

Suporte das tags HTML 5 <video> e <audio>

Com o suporte cada vez mais frequentes nos browsers, o Firefox 3.5 oferece suporte as tags <video> e <audio> incluindo suporte nativo para a codificação de vídeo Ogg Theora e codificação de áudio Vorbis.

<video src=&quot;meet.ogv&quot; controls=&quot;true&quot;>
Seu navegador não tem suporte a tag video.
</video>

Sem a necessidade de criar um player, o navegador renderiza o vídeo e dá ao usuário controles utilizando o botão direito do mouse. Se habilitar os controles com o atributo controls=”true”, deixará disponível os controles para o usuário.

A mensagem que está dentro da tag vídeo aparece quando o navegador não suportar a tag.

A tag audio possui as mesmas características.

<audio src=&quot;audio.wav&quot; controls=&quot;true&quot;>
Your browser does not support the audio element.
</audio>

Suporte a fontes externas

Imagine um desenvolvimento mais fácil e criativo, sem ter que utilizar somente as fontes padrões dos sistemas operacionais ou ter que exportar imagens com os textos que utilizam fontes não pertencentes por padrão nos sistemas operacionais.

Antes esta possibiidade era possível apenas em navegadores com motores Webkit, mas agora o Firefox 3.5 permite isso, aumentando o número de usuários que suportam essa característica.

Sintaxe:

@font-face {
font-family: <nome da fonte>, Verdana, Arial;
src: <endereço da fonte>;
[font-weight: <weight>];
[font-style: <style>];
}

Valores:

<nome da fonte>

Especifica o nome da fonte.

<endereço da fonte>

Especifica o endereço remoto onde está hospedada a fonte.

<weight>

Valor opcional, especifica o peso da fonte,.

<style>

Valor opcional, especifica o estilo de uma fonte.

Concluindo

É empolgante ver que a web evolui de forma a tornar tudo mais fácil e empresas como a Mozilla, correrem em disponibilizar cada vez mais funcionalidades em seus produtos.

Mas, acredito que o que ainda não satisfaz os desenvolvedores é o uso do Internet Explorer por parte dos usuários. Não, não sou um fanático pelo Firefox, mas infelizmente a maioria dos usuários utiliza o versão 6 do Internet Explorer, o que limita o nosso desenvolvimento ao CSS 2.1, ainda de forma parcial.

Por isso, se chegou até esta conclusão, mesmo que não seja desenvolvedor, contribua com uma internet mais dinâmica e rica. Instale o Firefox, Safari, Google Chrome, Opera ou atualize a versão do seu Internet Explorer.

  • Na categoria: Padrões web
  • por: Carlos Tristacci
  • em: 08.05.2009

Tableless – XHTML

Tableless segundo a Wikipédia é uma forma de desenvolvimento de sites que não utiliza tabelas para disposição de conteúdo na página, pois defende que os códigos HTML deveriam ser usados para o propósito que foram criados, sendo que tabelas foram criadas para exibir dados tabulares. Para a disposição da página o recomendado seria usar CSS. O termo ganhou destaque no Brasil sendo pouco utilizado no resto do mundo.

Dentre as possíveis vantagens da metodologia, estão a diminuição do peso da página (na realidade, o conteúdo da página é mostrado mais rápido, o que não significa que o peso da página seja menor – isso, é claro, sempre dependendo de como o HTML é feito) e melhora da acessibilidade – podem ser vistos em dispositivos móveis sem necessidade de versão especial e por deficientes visuais, embora não sejam muitos os sites tableless que carregam atualmente esta segunda característica.

Está é a primeira vídeoaula de uma série de duas vídeoaulas que falam sobre tableless. Pensando em quem está iniciando no desenvolvimento web, começamos com a estrutura do conteúdo em XHTML, para demontrar o uso da metodologia e de que forma podemos aproveitar todas as suas vantagens e como resolver os problemas de compatibilidade entre os navegadores, crossbrowser.

Get the Flash Player to see this player.

  • Na categoria: Padrões web
  • por: Carlos Tristacci
  • em: 07.05.2009

Web Standards. A Teoria da Simplicidade

Estreio meu primeiro Screencast (vídeo-aula), falando sobre Web Standards. Este será uma sequência de outros Screencasts falando sobre o desenvolvimento web dentro dos padrões e de forma acessível.

Espero que gostem deste novo modelo de post e deixem comentários. Um abraço!

  • Na categoria: Padrões web
  • por: Carlos Tristacci
  • em: 03.05.2009

Obituário do IE 6

imagem5

O site RIPIE6 http://ripie6.com/ é o aviso que o Internet Explorer 6 morreu. É uma mensagem para todos os usuários que ainda utilizam o “browser” e que não sabem a hora de atualizar seu navegador.

Este movimento contra o Internet Explorer 6 é por ele ser o causador dos principais problemas de compatibilidade no design de páginas HTML. Onde o desenvolvedor tem que realizar esforços extras e memorizar práticas de codificação, para obter o mesmo design independente do navegador utilizado pelo usuário. Mas se o usuário, utiliza-se uma nova versão do “falecido” ou qualquer outro navegador mais compatível com os padrões web. Nossa vida, realmente seria mais simples.

  • Na categoria: Padrões web
  • por: Carlos Tristacci
  • em: 05.05.2008

Acessibillidade Web: Custo ou Benefício

Estudando acessibilidade na internet esta semana encontrei este vídeo no site www.acessibilidade.net, apresentado por pessoas com necessidades especiais, falando sobre a importância e o custo benefício da acessibilildade. Perceba a importância do desenvolvimento de sites acessíveis.