Internet Explorer 9 será um grande navegador

Internet Explorer 9: com aceleração por hardware, os mapas deslizam velozmente pela tela

Internet Explorer 9: com aceleração por hardware, os mapas deslizam velozmente pela tela

Tanto a Microsoft como a Mozilla vão usar o processador gráfico para acelerar o navegador. Resta saber se quem vai levar a melhor é o caçador ou a raposa.

A Microsoft publicou alguns vídeos sobre o Internet Explorer 9 em seu site Channel 9. Num deles, Dean Hachamovitch, gerente-geral para o Internet Explorer, e sua equipe demonstram o recurso de aceleração por hardware que deverá estar na próxima versão do navegador. Na tela, textos são redimensionados com perfeição de forma quase instantânea. Numa das demonstrações, os mapas do site Bing Maps rolam na tela continuamente como o cenário de um jogo 3D. Nem tudo que é visto numa demonstração se concretiza na vida real. Mesmo assim, o vídeo mostra que poderá haver algum avanço na experiência do internauta.

Cabe perguntar: se os jogos usam aceleração por hardware há tantos anos, por que isso demorou tanto para chegar ao navegador. A turma de Redmond diz que esses recursos não foram implementados antes porque havia barreiras técnicas no caminho. Uma delas é que muitas páginas da web incluem conteúdo cuja apresentação não é controlada pelo browser. Um exemplo são as animações e filmes em Flash. Nesse caso, quem cuida da apresentação é o programa da Adobe. Agora, o grupo teria descoberto como contornar essas barreiras.

O fato é que as APIs (interfaces de programação) que permitem transferir o processamento 2D à placa gráfica são relativamente recentes. A Microsoft tem duas: Direct2D, para gráficos, e DirectWrite, para textos. Ambas estão presentes no Windows 7 e rodam também no Vista (mas não no XP). Além da aceleração por hardware, os planos da Microsoft para o IE9 incluem adesão mais ampla ao padrão HTML5. Também incluem um novo mecanismo de processamento de JavaScript, algo que parece ser uma resposta ao Chrome, geralmente visto como o rei do JavaScript.

Naturalmente, a turma da raposa não está dormindo. Bas Schouten, programador chefe da Mozilla, publicou um artigo em seu blog sobre a aceleração por hardware no Firefox. “Já temos condições de apresentar um Firefox em que a apresentação de páginas será totalmente feita via Direct2D. Ele fará uso intensivo da GPU. Até a interface com os usuários e os menus serão produzidos por ela”, diz Schouten. Ele também fornece algumas comparações de desempenho na apresentação de páginas em nove sites da web, com e sem aceleração por hardware. No Twitter, por exemplo, o tempo para exibir a página caiu para menos da metade com essa tecnologia. Já na Wikipedia não houve ganho significativo.

Outra pergunta óbvia é quando teremos esses novos navegadores. Mas isso ninguém diz com certeza. No caso da Microsoft, a expectativa do mercado é que o Internet Explorer 9 fique pronto em 2011. Christopher Blizzard, evangelista da Mozilla, escreveu no Twitter que ele aposta que o Firefox vai sair antes. Suponho que o Google também esteja desenvolvendo uma versão do Chrome com aceleração por hardware. Mas a turma de Mountain View costuma manter segredo sobre seus planos. E, ao que parece, não vai ser diferente nesta vez.

Fonte: Info Abril

Como nasceu o nome Google?

GoogleO nome Google foi escolhido devido a expressão googol, que representa o número 1 seguido de 100 zeros, para demonstrar assim a imensidão da Web.

A expressão googol surgiu de um fato um tanto curioso. O matemático Edward Kasner questionou o seu sobrinho de 8 anos sobre a forma como ele descreveria um número grande – um número realmente grande: o maior número que ele imaginasse. O pequeno Milton Sirotta emitiu um som de resposta que Kasner traduziu por “googol”. Mais tarde, Kasner definiu um número ainda maior: o googolplex.

Segundo o documentário do Biography Channel sobre os criadores do Google, quando o primeiro investidor da empresa passou um cheque de 100 mil dólares perguntou a que ordem o devia passar. Brin e Page disseram que estavam a pensar dar o nome de “Googol” à empresa, mas o empresário, possivelmente por ignorância, escreveu “Google”, obrigando, assim, a que a empresa tivesse este nome.

Parece aquelas pessoas com nomes escritos totalmente errados porcausa da incompetência da “mulher do cartório”. 🙂 Mas no caso do Google, isso pode ter sido a causa da sua grandesa, pois o nome “Google” parece mais universal do que “Googol”. Vai saber…

fonte: Wikipédia

A Semântica e a Acessibilidade: um casal perfeito

A semântica, bem como a acessibilidade, podem ser aplicadas a tudo. Na construção de um prédio, na dissertarção de uma redação e claro, na criação de sistemas e websites.

Semântica, pode ser definido como: a realização de algo utilizando um padrão formal.

semantica

Como nesta imagem, você pode perceber a utilização da semântica quando se organiza os veículos de transportes com os tipos de transportes (terrestres, aéreos e aquáticos). Imagine que o “land”, “water” e “air” não estivesse nessa representação, ficaria uma bagunça, dificultando o entendimento e a leitura desta imagem.

 

 

No desenvolvimento de sites, é um pouco diferente, mas com o mesmo objetivo e conceito.

Nesta imagem ao lado (clique nela semantica_html5para ampliar), tento mostrar bem como a semântica pode ser utilizada na criação de sites com a nova versão do HTML, definindo bem os elementos em seu local correto e definindo tag’s corretas para cada informação que será exibida ao cliente. Mas e o cliente saberá que o site está utilizando uma boa semântica na sua estrutura? Não, mas os mecanismos de buscas, leitores de telas e navegadores saberão, e é aí que a acessibilidade entra. Somando a compatibilidade do navegador com a interpretação do leitor de tela, as pessoas com deficiência poderão usufruir do site como deveria e como todo mundo usufrui.

Acessibilidade, além da sua definição clássica que é permitir que pessoas com deficiências ou mobilidade reduzida participem de atividades que incluem o uso de produtos, serviços e informação, também podemos incluir o direito de eliminação de barreiras arquitetônicas, de disponibilidade de comunicação, de acesso físico, de equipamentos e programas adequados, de conteúdo e apresentação da informação em formatos alternativos.

Não é fácil, a princípio, avaliar a importância dessa temática associada à concepção de páginas para a web. Mas os dados da W3C (Consórcio para a WEB) e WAI (Iniciativa para a Acessibilidade na Rede) apontam situações e características diversas que o usuário pode apresentar:

  • Incapacidade de ver, ouvir ou deslocar-se, ou grande dificuldade – quando não a impossibilidade – de interpretar certos tipos de informação.
  • Dificuldade visual para ler ou compreender textos.
  • Incapacidade para usar o teclado ou o mouse, ou não dispor deles.
  • Insuficiência de quadros, apresentando apenas texto ou dimensões reduzidas, ou uma ligação muito lenta à Internet.
  • Dificuldade para falar ou compreender, fluentemente, a língua em que o documento foi escrito.
  • Ocupação dos olhos, ouvidos ou mãos, por exemplo, ao volante a caminho do emprego, ou no trabalho em ambiente barulhento.
  • Desatualização, pelo uso de navegador com versão muito antiga, ou navegador completamente diferente dos habituais, ou por voz ou sistema operacional menos difundido.

Um código HTML com uma boa formatação e semântica, pode ajudar muito o seu site tornar-se mais acessível.

10 Dicas rápidas para construir web sites

Guia completo e checklist: www.w3.org/WAI/

  • Imagens e Animações: Use o atributo alt para descrever a função de cada elemento visual.
  • Imagemaps: Use mapas client-side (o tag map) e texto para as regiões clicáveis.
  • Multimídia: Inclua legendas e transcrições para o áudio, e descrições para o vídeo.
  • Híperlinks: Utilize texto que faça sentido fora do contexto. Evite a frase “clique aqui”.
  • Organização da Página: Use cabeçalhos, listas e uma estrutura consistente. Use CSSpara layout e estilo sempre que possível.
  • Gráficos e Diagramas: Sumarize o conteúdo ou use o atributo longdesc.
  • Scripts, applets e plug-ins: Para o caso de estarem desabilitados ou de não serem suportados pelo browser, forneça conteúdo alternativo.
  • Frames: Use o tag noframes e empregue títulos significativos.
  • Tabelas: Torne compreensível a leitura linha a linha. Resuma.
  • Valide seu trabalho: Use as ferramentas, checklist e os guias disponíveis em http://www.w3.org/TR/WCAG.

 

Com a padronização da W3C, os designers e desenvolvedores estão sendo forçados a criar aplicativos mais acessíveis.

As novas tags que vem no HTML 5

  • <article>: Define um artigo.
  • <aside>: Define algum conteúdo relacionado ao artigo.
  • <audio>: Define um streaming de áudio em um documento HTML
  • <canvas>: Define a criação de gráficos em uma página web
  • <command>: Define um botão de comando, como um radiobutton, uma caixa de seleção ou um botão.
  • <datagrid>: Define uma lista de dados selecionáveis. O datagrid é exibido como uma árvore.
  • <datalist>: Define uma lista de dados selecionáveis. Utilize esse elemento juntamente com o elemento input, para fazer uma lista suspensa para um valor de entrada.
  • <datatemplate>: Define um recipiente para o modelo de dados. Deve conter elementos filho que são <rule> para definir um modelo.
  • <details>: define os detalhes de um elemento, no qual o usuário pode ver, e clicar para ocultar.
  • <embed>: Utilizado para incorporar conteúdo no HTML, atuando como um plugin.
  • <eventsource>: Define um destino para eventos enviados por um servidor.
  • <figure>: Especifica ilustrações, imagens, fotos, associado juntamente com alguma legenda.
  • <footer>: Define o rodapé de uma seção ou documento. Normalmente, contém o nome do autor, data em que o documento foi escrito e / ou informações de contato.
  • <header>: Define o cabeçalho de uma seção ou documento.
  • <mark>: Define texto marcado. Utilize a tag <mark> se você quiser destacar partes do seu texto
  • <meter>: Define uma medição. Usado apenas para medições com conhecimento de um valor mínimo e um valor máximo.
  • <nav>: Define uma seção de links de navegação.
  • <nest>: Define o ponto de incício para criação de elementos em um <datatemplate>, utilizado em conjunto com o elemento <rule>.
  • <output>: Define a saída de diferentes tipos de dados, por exemplo, o cálculo efetuado por algum script.
  • <progress>: Define o progresso de uma tarefa de qualquer tipo.
  • <rule>: Define as regras para atualização de um datatemplate. Usado em conjunto com os elementos <datatemplate> e <nest>.
  • <section>: Define as seções em um documento. Tal como capítulos, cabeçalhos, rodapés, ou quaisquer outras seções do documento.
  • <source>: Define recursos para elementos de mídia, como <audio> e <video>.
  • <time>: Define tempo ou data, ou ambos.
  • <video>: Define vídeo, como um clipe de filme ou vídeo de outros fluxos.
  •  

    TAGS PARA CONSTRUIR O LAYOUT NO HTML 5

     

  • <nav>: Define o local do menu
  • <section>: Define uma sessão de conteúdo da página
  • <article>: Define o conteúdo (artigo, textos, postagens, etc)
  • <header>: Define o cabeçalho (topo) de algum elemento (body, section, nav, etc)
  • <footer>: Define o rodapé de algum elemento (body, section, nav, etc)
  • <aside>: Define o local da barra lateral (como um layout em 3 colunas)
  • Lembrando que nada é mágico e nem deve ser, tudo precisa e continua necessitando de estilização com CSS.

    No próximo artigo, irei mostrar alguns exemplos e formas de utilizar essas novas tags.

    Abraços!

    Sobre o HTML 5

    HTML 5 No início de 2009, o W3C anunciou a primeira especificação do HTML5.

    A versão atual do HTML é a 4.0.1, e a versão final do HTML está prometida para 2012.

    Foram feitas grandes alterações que favorecem a semântica, que incluem:

    • novas API’s
    • Elemento <canvas> para desenhos dinâmicos;
    • Network status (online/offline);
    • Utilização de um plugin gratuito de áudio e vídeo via tags;
    • contentEditable – Editor rico de conteúdo;
    • Drag and Drop de elementos;
    • Cross-document e cross-domain messages;
    • Histórico de navegação em Ajax;
    • Geolocation API;
    • Maior controle de dados sobre formulários;
    • Armazenamento de dados no cliente;
    • Web worker threads;
    • Melhoria na depuração de erros;
    • Entre outros avanços.

    Esta evolução da linguagem padrão para web pode eliminar a necessidade de plug-ins para aplicações multimídia em navegadores. Diversos críticos consideram a tecnologia como um forte concorrente ao Flash do Adobe, Silverlight, da Microsoft, e o recente JavaFX, da Sun.

    Recentemente, Shantanu Narayen, diretor executivo do Adobe, disse que o Flash não irá perder mercado, porem a versão 5 do HTML já está sendo chamado de “Flash-killer”. Estas tecnologias precisarão se adaptar rapidamente para conseguir manter-se no mercado, tão popular quanto hoje.

    Na avaliação do co-diretor de ferramentas da Mozilla, Ben Galbraith, as tecnologias viabilizadas pelo HTML 5 como o Canvas para desenhos 2D e o armazenamento de conteúdos no desktop, permitirão que “usemos mais o browser do que nunca”.

    Após dez anos sem atualizações, a forma como se escreve páginas na Internet passa por uma boa transformação. O HTML 5 oferece uma experiência web totalmente diferente para usuários e embora exista um longo caminho para ser finalizado, os navegadores mais importantes, como o Opera, Google Chrome, Safari 4, o novo Firefox 3.5 e o Internet Explorer 8 já implementaram partes da linguagem, incluindo tags de vídeo e suporte à tecnologia Canvas.

    Na versão 4 do HTML, a atual, o navegador não distingue o que é topo, conteúdo, rodapé e menu, mas com o HTML 5 isso irá mudar, veja:

    Estrutura de código com o HTML 4:

    <body>
      <div id="topo">...</div>
       <div id="menu">...</div>
       <div class="content">...</div>
       <div id="barralateral">...</div>
       <div id="rodape">...</div>
      </div>
    </body>

     

    html5_estrutura Estrutura de código com o HTML 5:

    <body>
      <header>...</header>
      <nav>...</nav>
      <section>
        <header>...</header>
        <article>...</article>
        <footer>...</footer>
      </section>
      <aside>...</aside>
      <footer>...</footer>
    </body>

    Ou seja, agora o navegador terá um conhecimento real de como o layout está sendo renderizado, o que é o rodapé, o conteúdo, a barra lateral da direita e etc. E claro, isto irá auxiliar muito os mecânismos de busca a filtrar informações úteis ou não. Talvez o que está em “header” não interesse muito, talvez o mais importante será o que está dentro de “article”, e por ai vai as possibilidades de mudanças que a nova tecnologia nos dará.

    Repare pela imagem representando o layout que os elementos header e footer não são exclusivos da página, mas pode ser usado para representar o topo e o rodapé de qualquer conteúdo (ou article).

    Bom, não vamos extender muito o tópico, resumi bem e de forma simples o que é o novo HTML.

    Nos próximos artigos sobre o HTML 5 eu vou mostrar detalhadamente sobre as novas TAGs e atributos e quais são suas funcionalidades. Também irei mostrar um exemplo prático de como desenvolver o HTML 5.

    Abraços!