O Google, não é apenas um mecanismo de busca, ele possui diversos outros serviços que muita gente desconhece. 

Eu uso muito o Gmail, o Google Docs, Google Calendar, o Google Talk, Google Maps, Google Analytics, o You Tube e agora o Chrome. Sim, o Google tem tudo isso e muito mais!

Dentro do Google Docs, por exemplo, você pode fazer Upload de arquivos…

…criar um arquivo novo, e até mesmo compartilhar esse arquivo com uma ou mais pessoas. O mesmo acontece com o Google Calendar, você pode agendar algum compromisso e compartilhar com um amigo, por exemplo.

Já o Google Analitycs é excelente para quem tem sua própria página e quer saber tudo o que rola por trás dela! Com o Google Analytics, você pode medir a frenquência de visitas no seu site, saber a origem dos seus visitantes e muito mais.

E nem vou falar do You Tube neh, quem não vê vídeos nele, não ri muito, relembra velhas fases de nossas vidas, chora, publica seus próprios vídeos…

E o Google Maps, quem nunca procurou em endereço nele?! rsrs

Enfim, eu não vivo sem o Google e se você é assim, como eu, que não vive sem o Google, junte-se à mim! rsrs

Me conta quais serviços você mais usa do Google e me diz, se algum dia o Google morresse, o que seria de nós?!

O Jornal da Paraíba desenvolveu uma página acessível para deficientes visuais. Agora todos podem acessar a página do jornal e ficar por dentro de todas as notícias! O bom disso tudo é que o usuário não precisa de nenhum software de leitura ou plugin instalado no computador para poder utilizar o serviço.

Mas, navegando pela página e fazendo alguns testes, percebi que existem alguns erros que podem confundir o usuário, por exemplo quando você passa o mouse pela página para chegar até onde você quer, a “gravação” tenta falar tudo de uma vez e acaba se perdendo. Ou quando você escolhe o caderno que quer ler, ele acaba falando o nome do caderno juntamente com o nome do colunista, só que tudo ao mesmo tempo, o som acaba ficando sobreposto e dificultando o entendimento.

Percebi também que eles colocaram tudo em volta de um “quadrado”, no qual omite um som toda vez que você “entra” ou “sai” da área onde encontra-se o conteúdo da página. Isso é bom, porque a pessoa consegue, através desse som, se localizar dentro da página e não ficar passeando com o mouse sem nem saber onde está. Sim, com o mouse, o usuário não precisa utilizar o teclado para navegar pela página.

Essa é a página do jornal já “lendo” algum artigo, veja abaixo:

No círculo vermelho eu mostro uma letra, percebam que no topo todo da página sintetizada encontram-se letras e ao lado esquerdo números. Outro problema, enquanto você vai de um botão para o outro, com o mouse, a tela além de ler os botões, ela lê também as letras, tudo de uma vez, ou seja, enquanto ela lê o conteúdo da página, um artigo por exemplo, ela lê também as letras ou qualquer outra coisa em que o cursor do mouse passar por cima. Me confundi um pouco com isso porque achei que ficou muita coisa para ouvir de uma só vez, no fim, não escutei nem uma coisa e nem outra da qual a tela lia pra mim.

Mesmo com algumas falhas, preciso dizer que a iniciativa que eles tiveram de criar uma página como essa foi muito boa, esse conceito de sintetizadores de tela é muito legal e pode facilitar e muito a vida dos deficientes. Parabéns!

Visite o site você também: www.jornaldaparaiba.globo.com/dv

Eu conheço TODAS essas características =P!

Está muito bom, vale a pena ler! O artigo se encontra aqui.

Boa leitura!

Primeiro passo é escolher uma foto de sua preferência, eu escolhi essa:

Em seguida, depois de já aberta no Fireworks, você deve duplicar a imagem. Clique na imagem e dê Ctrl+c e Ctrl+v, assim você vai duplicar a imagem facilmente. Repare que no campo Layers aparecerá a imagem já duplicada:

Agora, selecione a segunda layer, vá até o menu Filters > Adjust Colors > Hue/Saturation. Na janela de opções selecione:

Agora, o próximo passo é selecionar a primeira layer e aplicar alguns efeitos.

Com a layer já selecionada vá ao menu Commands > Batch Commands > Invert Selection Color. Após feito isso, ainda com a segunda layer selecionada, vá ao menu Blend Mode e escolha a opção Color Dodge.

Logo após, vá ao menu Filters > Blur > Gaussian Blur. Na janela de opções selecione e altere a opção Blur Radius para dar o efeito efeito desejado, eu escolhi 40.

Pronto! Minha foto ficou assim:

E a sua?!

Sua máscara vai ficar assim!

1º - Abra a imagem no Fireworks

Essa é a imagem que eu escolhi:

2º - Selecione o tipo de ferramenta que quer utilizar, pode ser um Círculo, um Retângulo, Quadrado… Nesse exemplo eu usei a Rounded Rectangle (Retângulo com bordas arredondadas).

*Não esqueça de deixar sem preenchimento e com uma borda de 1px para poder visualizar seu objeto na imagem.

3º - Faça um retângulo em cima da imagem e duplique por toda ela toda.

4º - Perceba que você ficou com várias Layers, uma de cada retângulo… Selecione todas elas e dê um Ctrl + G para agrupá-las e deixar todas as formas em uma Layer só. Você pode agrupá-las também pelo menu Modify > Group.

5º - Agora, com os retângulos selecionados, retire a borda deles.

6º - Agora o truque! Ainda com os retângulos selecionados dê um Ctrl + x, selecione a sua imagem e vá até o menu Modify > Mask > Past as Mask (Ctrl + Alt + V).

7º - Para dar uma melhor acabamento dê um Flatten Selection na sua imagem. Com a imagem selecionada vá ao menu Modify > Flatten Selection (Ctrl + Alt + Shift + z).

Sua máscara está pronta!
Você pode dar o acabamento que quiser nela…eu coloquei uma sombra por baixo utilizando o recurso de filtros: Filters > Shadow and Glow > Drop Shadow.

Então…

O que é acessibilidade?

No geral Acessibilidade significa não apenas permitir que pessoas com deficiências participem de atividades que incluem o uso de produtos, serviços e informação, mas a inclusão e extensão do uso destes para todas pessoas com deficiências presentes em uma população.

Na internet significa que pessoas portadoras de necessidades especiais sejam capazes de usar a mesma. Ou seja, uma web projetada de maneira que estas pessoas possam perceber, entender, navegar e interagir com a web.

O número de pessoas hoje, portadoras de necessidades especiais com acesso restrito a web é muito grande, a maior parte dos websites não utilizam as regras para acessibilidade dificultando muito ou até mesmo tornando impossível que pessoas com alguma deficiência consiga acessar.

A acessibilidade à web contempla todo tipo de necessidade especial, incluindo as visuais, auditivas, físicas, de fala, cognitivas e neurológicas.

Mas porque é tão importante?

Uma Web acessível e que permita a participação de pessoas portadoras de necessidades especiais na sociedade é fundamental para proporcionar oportunidades iguais para todos nas diversas áreas.
A acessibilidade à web pode trazer benefícios também a pessoas sem qualquer tipo de restrição. Um dos princípios básicos de acessibilidade preconiza a flexibilidade para atender variados tipos de necessidades, situações e preferências. Esta flexibilidade acaba por beneficiar todas as pessoas que usam a web, inclusive aquelas sem qualquer tipo de restrição em diferentes situações, como por exemplo pessoas com uma conexão lenta, pessoas com restrições temporárias como um braço quebrado e pessoas idosas.

Um website acessível…

O principal motivo da existência de tantos sites não acessíveis e o uso de softwares geradores de conteúdos sem programação para suporte aos critérios de acessibilidade é o número de desenvolvedores sem o conhecimento dos itens básicos de acessibilidade ou mesmo sem maiores preocupações com ela.

O trabalho requerido para construir um website acessível depende de vários fatores, entre eles o tipo de conteúdo, o tamanho e a complexidade do site e das ferramantas de desenvolvimento e do ambiente de desenvolvimento.

A acessibilidade é mais facilmente implementada se for planejada antes do início do desenvolvimento ou redesign. Contudo, adaptar sites pode demandar uma quantidade grande de trabalho e esforço, principalmente para aqueles sites sem os padrões web, e para sites com determinados tipos de conteúdos, tal como multimídia.

Ao desenvolver ou redesenhar um site, a avaliação da acessibilidade logo no início e ao longo do trabalho detectará itens de acessibilidade que se tornarão mais fáceis de corrigir do que se deixarmos o trabalho de avaliação para o final do projeto. Técnicas simples, tais como alterar as ’setagem’ do browser (resolução, tamanho da janela, tamanhos de fontes, etc…) podem determinar conformidades com alguns itens de acessibilidade. Uma avaliação para determinar se um site está conforme as diretrizes de acessibilidade é uma tarefa mais complexa.

Como checar a acessilidade de um website?

Dez testes rápidos para checar a acessibilidade de um website.

1. Checar os textos alternativos para imagens que transmitam informação.

Coloque o cursor sobre a imagem, por exemplo, o logotipo da empresa. Aparece na tela uma caixinha amarela com um texto descritivo da imagem? Para usuários navegando com browsers sem suporte para imagens, será aquele texto descrito, visto (e/ou ouvido) no lugar da imagem.

2. Checar textos alternativos para imagens decorativas.

Coloque o cursor sobre a imagem que não tem outra função senão decorativa. Aparece na tela uma caixinha com um texto descritivo da imagem? Não deverá aparecer. Não há qualquer razão para que usuários com browsers sem suporte para imagens tomem conhecimento de uma imagem decorativa.

Atenção ao realizar este teste. Se a caixinha não aparecer, isto pode ser interpretado e analisado de duas maneiras:

1. O texto alternativo para a imagem foi definido como inexistente - alt="" - significando que será ignorado pelo browser sem suporte para imagem. Esta situação é a ideal.
2. O texto alternativo para a imagem não foi definido, significando que usuários com browser sem suporte para imagem tomarão conhecimento da existência de uma imagem, mas não saberão qual o propósito dela - o que será uma situação frustrante para o usuário! Esta certamente é uma situação a ser evitada.

3. ‘Ouça’ conteúdos de vídeos e áudio, sem volume.

Se você desligar suas caixas de som, estará garantindo o corte total do volume para qualquer conteúdo de áudio e em consequência impossibilitado de ouvir qualquer som. Esta situação simula um usuário portador de surdez. Assegure-se de que o website disponibiliza um conteúdo escrito para o conteúdo de áudio, de modo que usuários portadores de surdez tenham acesso ao conteúdo áudio.

4. Checar a acessibilidade dos formulários.

Usualmente cada campo de formulário possui seu texto descritivo. Por exemplo, um formulário de contato possui os textos ‘nome’, ‘e-mail’ e ‘comentários’ cada um deles próximo ao seu respectivo campo onde os usuários entrarão com os seus dados. Clique sobre o texto descritivo do campo e deverá aparecer o cursor ‘piscando’ no campo respectivo. Se o cursor não aparecer é porque não foi usado o elemento no formulário e isto poderá tornar o formulário inacessível para alguns usuários.

5. Checar a possibilidade de aumentar o tamanho dos textos.

No IE vá em View > Font size > Largest. O texto do website aumentou de tamanho? Se não aumentou o site estará inacessível para usuários portadores de baixa visão.

6. Checar o website no browser Lynx.

O browser Lynx é um browser de texto e não oferece suporte para muitas das facilidades oferecidas pelos outros browsers tal como o IE. Você poderá checar como o website se comporta em browsers de texto com o Simulador Lynx. Se o website apresenta-se estruturado (se ele ‘faz sentido’) e você pode navegar por ele no Lynx então poderá estar certo de que muitos dos itens de acessibilidade estão em conformidade.

7. Checar a navegabilidade sem o uso do mouse.

Você pode navegar no website usando somente tab, shift-tab e return? Se isto não for possível, o website será inacessível para usuários impossibilitados do uso de mouse bem como a usuários com leitores de tela. Deixe seu mouse de lado e navegue com o teclado para testar.

8. Checar a existência de um mapa do site.

Existe um mapa do site, facilmente localizável? Se não, os usuários poderão ficar perdidos no site.

9. Assegure-se que os textos dos links sejam descritivos para o destino remetido.

Usuários portadores de deficiência visual total, navegam por sites na internet valendo-se da ‘tabulação’ pelos links. Os textos descritivos dos links tem sentido? ‘Clique aqui’ e ‘mais’ são dois exemplos bem comuns de textos não descritivos para links. Se você estiver restrito a frases curtas para descrever os links, considere o uso do atributo title no elemento a para suprir uma informação adicional sobre o destino do link, por exemplo: <a href="descontos.html" title="Como obter descontos adicionais nas suas compras ">Descontos adicionais</a>

10. Checar o website em programas automatizados.

Dois programas automatizados de checagem estão disponíveis na internet, o Bobby e o Wave. Estes programas, embora não sejam capazes de todas as checagens possíveis para acessibilidade, já que alguns pontos só poderão ser checados por humanos lhe dará uma indicação em quais áreas os itens de acessibilidade precisam ser revistos.

Esta listagem foi retirada do site maujor.com.

Depois de “pegar” a cor com um duplo clique no eye-dropper uma palet vai se abrir onde você pode escolher diferentes tonalidades dessa cor, bem como copiar e colar os valores RGB e HEX para outras aplicações.

Se você já visitou o CSS Zen Garden deve ter percebido que uma das coisas que mais impressiona nos layouts é a riqueza das fontes, infelizmente existem milhares de fontes disponíveis nos dias de hoje, mas quem trabalha com webdesign está limitado a no máximo 10 delas (é maravilhoso só poder usar verdana e arial…) que são as fontes que você pode ter certeza que o cliente tem instaladas, pelo menos no windows, são as chamadas fontes universais. Quem quiser layouts ricos como os do Zen Garden tem invariavelmente que apelar para imagens de background, o que é péssimo já que além do custo de carregar a imagem em sí elas não são adaptáveis no contexto da programação, é impossível alterar o texto de uma imagem por javascript por exemplo.

As web fonts vem para resolver esse problema, finalmente poderemos associar fontes diferentes através do CSS e rapidamente obter resultados como esses a partir do mesmo HTML.

Web fonts na prática:
Aqui está um exemplo de como a coisa funciona no código CSS:

@font-face {
   font-family: "Kimberley";
   src: url(http://www.princexml.com/fonts/larabie/ »
   kimberle.ttf)format("truetype");
 }
 h1 { font-family: "Kimberley", sans-serif }

A nova “tag” @font-face permite que uma nova font-family seja criada e associada ao contexto, e que um caminho para download da fonte seja apontado, uma mudança dramática na forma como pensamos formatação de texto hoje na Web. Infelizmente ter o aval de Opera e Safari (dois ótimos browsers) hoje em dia não quer dizer muito, vamos esperar para ver o suporte a esse recurso no Firefox 3 e quem sabe no Internet Explorer.

O Fireworks é um editor de imagens desenvolvido pela Macromedia, hoje adquirido pela Adobe. É uma ferramenta focada na publicação gráfica na Internet, por isso inclui suporte a GIF animado, PNG e imagens fatiadas, além de possuir ótima compreensão de imagens.

Achei um artigo muito bom onde mostra como utilizar a ferramenta para o desenvolvimento de imagens, neste caso, flores. O artigo mostra bem como utilizar a ferramenta e seus efeitos passo a passo. Você pode acessar o artigo clicando aqui.

Tente fazer a sua! Eu fiz a minha…

O livro apresenta os principais recursos da nova versão do Flash. Ele é voltado para webmasters, webdesigners, animadores e desenvolvedores web. Ele vai aprender como criar botões e links, desenhar e animar em Flash, formatar textos, inserir vídeos e sons, carregar dados em um aplicativo. Com exercícios passo a passo, ajuda o leitor no processo de desenvolvimento de diversos projetos em Flash. Cada exercício contém um pequeno comentário sobre os novos conceitos, dicas e melhoria da produtividade.

Os painéis do Flash são bem explorados o que ajuda o leitor a conhecer melhor a ferramenta e suas novidades. Criação de animações, manipulação e otimização de gráficos, textos e símbolos são os principais assuntos do livro. O livro também possui uma boa introdução sobre ActionScript.

O livro traz tutoriais práticos e voltados para projetos, produzidos para ensinar aos usuários como desenvolver um website sofisticado e de padrão profissional. O livro contém um CD que traz os arquivos de todas as lições e uma versão de teste do Flash 8.

Ao fim do livro, o leitor terá uma compreensão sólida de desenvolvimento e design em Flash 8.