HTML5 & CSS3 Readiness

by Luiz Paulo | novembro 19, 2010 | No Comments »

HTML5 & CSS3 Readiness é um infográfico que mostra os recursos HTML5 + CSS3 implementados em cada browser.

Para quem tiver interesse, preparei um resumo com os links W3C de todos os recursos expostos no gráfico. Para que possam estudar os novos recursos ;)

HTML 5

CSS3

Categorias: Artigo, Browser, CSS, Desenvolvimento web, HTML, JavaScript, Tecnologia, Tendências
Tags: , , , ,

@font-face – Estilizando fonte no css

by Luiz Paulo | novembro 13, 2010 | 2 Comments »

Estilizar fontes na web sempre foi um sonho para os designers de plantão. Hoje, com o CSS3 e sua funcionalidade @font-face,  esse sonho se tornou realidade. Veja como isso é possível.

A capacidade dos programadores de criar gambiarras soluções é impressionante! Lá atrás quando um design chegava com um layout mais estilizado, o cara sempre dava um jeito de resolver o problema.

Uma das primeiras técnicas (da mais utilizada) era gerado uma imagem para cada texto estilizado. O que transformava o site em algo pesado.

Cheguei a ver soluções em SERVER-SIDE, onde era enviado o texto e o servidor criava uma imagem (dinamicamente) com o texto desejado.

Uma outra técnica utilizada é a utilização de FLASH, que utiliza mais ou menos o mesmo esquema do SERVER-SIDE, só que a fonte está "compilada" no SWF.

Mas isso tudo é passado... Não precisamos mais dessas gambiarras soluções. Agora podemos contar com o CSS3 que trás vários recursos para facilitar o nosso trabalho.

Sua utilização é simples!

@font-face {
	font-family: 'fontAlias';
	src: url(font.ttf);
}
 
body {
	font-family: fontAlias, Arial, Heuvetica, Tahoma;
}

Essa funcionalidade certamente nos poupará muito tempo de desenvolvimento.

Vale apena comentar... Em um teste que fiz, a fonte "ttf" não funcionou no IE. Precisei converter em "eot" para que funcionasse.

[]'s

Categorias: Artigo
Tags:

Excesso de informação e a falta de conhecimento

by Luiz Paulo | outubro 21, 2010 | 7 Comments »

Estamos em uma era que atualizar-se é imprescindível. Informação é o que não falta! E o meio mais rico atualmente é a internet que nos trás uma tonelada (ou PETAiada) de informações para todos os gostos. Mas quanto de conhecimento realmente conseguimos absorver de toda essa informação?

Nós que trabalhamos com tecnologia, precisamos ler bastante, nos atualizar, saber o que está acontecendo no mundo TI, lemos blogs, sites de notícias, livros, e mais uma infinidade de coisas, passamos muito tempo engolindo textos, vídeos. Esse excesso de informação reduz a nossa capacidade de absorção, de transformar essa informação em um conhecimento aplicado.

A motivação para escrever sobre esse assunto foi ter aberto o meu Google Reader, depois de quase 2 semanas sem ver meus feeds, tinha 1000+ não lidos. E posso dizer, de tudo o que assino (mais de 300 blogs) a quantidade de posts lidos é muito pequena, e nem tudo o que leio é totalmente assimilado.

Acabei procurando sobre o assunto e tem vários artigos interessantes...

"Antes, as pessoas não sabiam que não sabiam. Agora, sabem que não sabem, e isso, num mundo competitivo e predatório, gera uma sensação de frustração e incapacidade que, aos poucos, vai se transformando em uma ansiedade cada vez maior".

"Uma só edição do jornal americano The New York Times contém mais informações do que uma pessoa comum recebia durante toda a sua vida há 300 anos (Revista Veja de 05 de setembro de 2001);"

"A tentativa de apreender muitas informações ao mesmo tempo prejudica a capacidade de fixação mnemônica dessas informações e, conseqüentemente, a consolidação do aprendizado".


Leia esse artigo, achei super interessante (por Dr. Ryon Braga).

Agora me fala, você absorve (ou pensa) tudo o que lê?

Categorias: Artigo
Tags: , , , , ,

IE8 reconhecendo DOCX como ZIP

by Luiz Paulo | outubro 20, 2010 | 7 Comments »

Internet Explorer como sempre nos trás boas surpresas. Dessa vez, me deparei com um erro bizarro. Quando cliquei em um arquivo DOCX para download, o Internet Explorer 8 transformou em ZIP. Veja o motivo e a solução para o problema.

O problema está nas configurações de segurança padrão do IE8, que restringe arquivos (docx, xlsx, pptx) e são baixados como ZIP. Não pesquisei e o problema ocorre com outras extensões, mas só de não aceitar os arquivos da própria Microsoft, já é um problema grave.

Solução em sua aplicação JAVA

Obviamente, passei por esse problema em nossa aplicação e tive que achar alguma forma de solucionar. A modificação é relativamente simples.

Basta adicionar uma regra de mime-type em seu web.xml que tudo se resolve.

No local que encontrei a solução, dizia para referenciar "DOCX" a "application/msword" mas dessa forma o arquivo é reconhecido como "DOC", gerando inconsistência na leitura do Office.

Segue a solução que implementei:

<mime-mapping>
	<extension>docx</extension>
	<mime-type>application/vnd.openxmlformats-officedocument.wordprocessingml.document</mime-type>
</mime-mapping>

Com essa modificação, seus arquivos DOCX serão baixados normalmente no IE8.

Agora que você já tem o conhecimento, poderá resolver o problema em sua aplicação mesmo que seja em outra linguagem... Basta modificar as configurações PHP, por exemplo seria o php.ini, e assim por diante.

Solução no seu browser

Para que seu browser passe a aceitar os arquivos, basta seguir os seguintes passos:

  1. No canto superior direito do IE8, clique em Ferramentas para abrir o menu drop-down;
  2. Na parte inferior do menu Ferramentas, clique em Opções da Internet;
  3. Na caixa de diálogo Opções da Internet, selecione a aba Segurança;
  4. Na guia Segurança, selecione a zona Internet e clique no botão Nível Personalizado;
  5. Vá aproximadamente 2 / 3 para baixo na lista para a opção "Abrir arquivo com base no conteúdo, não na extensão de arquivo" e alterar a configuração Desativar;
  6. Clique em OK;
  7. Repita os passos 4-6 para a zona da intranet local e zona de sites confiáveis;
  8. Clique em OK;
  9. Feche todas as instâncias do IE8;
  10. Reabrir o IE8 e agora deve reconhecer o Office 2007 e 2010 extensões de arquivo ao salvar anexos de email.

Isso provavelmente fará com que seu browser aceite os arquivos.

Abraços!

Categorias: Artigo, Browser, Desenvolvimento web, Java
Tags: , , , , ,

[javascript] Jogo Sokobox em jQuery

by Luiz Paulo | setembro 18, 2010 | 8 Comments »

Demorei um pouco para postar esse jogo. Mas enfim, tive tempo de fazê-lo, rs

Quem me acompanha, sabe que gosto de inventar moda, então resolvi refazer o famoso joguinho de empurrar caixas no jQuery.

O jogo tem 105 fases. E obviamente as fases subsequentes são bloqueadas. Você precisa passar da corrente para liberá-la, hehe.

Além disso o jogo conta com 2 skins

- homem emourrando caixas

- carro empurrando blocos

Alguns amigos já testaram e reclamaram que não funciona no touch do celular, mas por enquanto não só funciona via teclado mesmo (setas, a, s, d, e).

Histórico
Quando iniciei o desenvolvimento, estava escrevendo os cenários com vetores (GIGANTESCOS), o que estava tornando o trabalho metodico e difícil.
Levei por volta de 1 dias para finalizar o jogo (incluindo as fases), e gostei bastante do resultado.

Pensei em guardar estatísticas, scores, etc. Mas isso ficará para um próximo passo pois tenho muitas outras prioridades, rs.

Depois das fazes quase prontas, resolvi refazer utilizando caracteres para desenhar um cenário. Segue um exemplo:

__###___
__#+#___
__#-####
###@-@+#
#+-@&###
####@#__
___#+#__
___###__

Achei essa forma bem mais intuitiva para gerar os cenários.
Enfim... Espero que gostem!

Abraços.

Categorias: Artigo, JavaScript, Jogo
Tags: , , , , ,

Prximos posts »

 

Valid XHTML 1.0 Strict Valid CSS!

Luiz Paulo | tecnologia web