02/10/2008 - 17:44
Vira e mexe alguns de nós, por falta de dinheiro ou por displicência, acabamos atrasando o pagaento de alguma conta.
Tinha que pagar o IPTu de minha casa, me esqueci de pagar a primeira parcela e “temendo” ir ao banco acabei atrasando algumas parcelas. Resolvi pagá-las, mas precisava saber quanto, mais ou menos, eu pagaria de juros para que pudesse sacar do banco. Pensando nisso, acabei criando um script que calcula o valor do juros e da mora.
A primeira versão, faz o cálculo de porcentagem, ou seja, você coloca o valor do boleto o valor em porcentagem da multa, o valor em porcentagem da mora e a data data para pagamento. O script calcula quantos meses está atrasado e a partir daí dá o valor que, provavelmente, você terá que pagar. Eu digo provavelmente, pois não conheço muito bem as nuances dessas coisas.
Se por um acaso vocês acharem que os cálculos estão errados e puderem me dizer o porque, eu fico agradecido, assim posso alterar e deixar bem funcional para que todos possamos usá-lo.
Clique aqui para abrir a calculadora
Enviado por: Leandro Garcia - Categoria(s): JavaScript, dicas
Tags relacionadas: calculadora, JavaScript, juros, mora
02/10/2008 - 00:19
O que é?
O doctype é a maneira de você dizer para qualquer navegador como ele deve agir ao ler seu código HTML.
Uma estórinha…
Certa vez Joãozinho, programador web experiente e usuário de firefox, programou seu site vendo-o apenas no firefox. Ele já esperava que quando fosse abrir pelo Internet Explorer fosse acontecer alguns problemas de layout, normal, porém o que ele viu deixou-o perplexo… Seu site, todo seu trabalho de dias e horas estava totalmente quebrado. Xingou a Microsoft por seu software. Resolveu abrir no Opera, no Safari, no Google Chrome, e… Tudo estranho. Joãozinho ficou desesperado, arrancando seus cabelos, mas como programador experiente que é, parou. Saiu, se acalmou e foi avaliar seu código. Seu primeiro passo foi validar seu código via W3C e para sua surpresa, o erro era simples, faltava o DOCTYPE.
Moral da estória… preste atenção no que você faz!
Por que a falta do DOCTYPE no site do João zinho causou tantos problemas?
Porque cada browser tem um padrão próprio de renderizar o HTML sem DOCTYPE.
Bela estória Garcia. Mas me diga uma coisa, Que tipos de DOCTYPES existem e onde colocá-los em meu código?
Até onde sei são quatro tipos para cada compilação HTML (HTML 4.0, HTML 4,1, XHTML, etc).
Os DOCTYPES devem ser a primeira coisa que um browser lê em seu código HTMl, ou seja, na primeira linha.
Quais são eles?
Strict, Transitional e Frameset.
XHTML STRICT
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
O Strict é o “melhor” uma vez que ao dizer para um browser renderizar com ele, você está dizendo que seguirá rigorozamente os padrões.
XHTML Transitional
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
Com este você diz ao Browser que seu código está em transição, não necessáriamente seguirá rigorozamente os padrões, mas não fará um “ninho de ratos”
XHTML FRAMESET
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Frameset//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd”>
Já o Frameser, ser para renderizar os enfadonhos e arcáicos Frames.
Enviado por: Leandro Garcia - Categoria(s): Praticas
Tags relacionadas: doctype, frameset, padroes, strict, transitional, webstandards
29/09/2008 - 23:45

Mais uma pérola de política tupiniquim.
Oscar marone, segundo seu Jingle “Empresário do Amor”
O site é desenvolvido em ASP sem a menor preocupação em ser validado;
Não está preparado para uma resolução maior do que 1024×768 (vide topo);
O layout é feio e lembra um template de blog do Blogger;
Não tem doctypte e nem codificação.
A parte positiva é que é disponibilizado o material da campanha no site, não que seja um material excelente.
Algum Material da campanha disponível

O Jingle:
O site: http://www.oscarmaroni70111.can.br/
Enviado por: Leandro Garcia - Categoria(s): Os Candidatos
Tags relacionadas: maroni, Os Candidatos, vereador
29/09/2008 - 23:30
Essa ação é uma das mais (se não a mais) fantásticas que eu ja vi na internet.

Demonstra a interatividade console-jogador. É fantástivo. Vale a pena ver todo.
Link:http://br.youtube.com/experiencewii
Posts relacionados
Enviado por: Leandro Garcia - Categoria(s): Sites que rolam, Vale um clique
Tags relacionadas: acontece, console-jogador, interatividade, nintendo, video game, viral, wii
24/09/2008 - 23:05
Dando continuidade na redução do peso das páginas, apresento à vocês uma técnica chamada: CSS Sprites!
Mas o que diabos é isso? É um novo refrigerante?
Não, não é refrigenrante é a arte de fazer uma unica requisição de imagem via CSS para diversos itens.
Como assim?
Vamos começar do básico.
Segundo o Wikipedia
Sprites were originally invented as a method of quickly compositing several images together in two-dimensional video games using special hardware. As computer performance improved, this optimization became unnecessary and the term evolved to refer specifically to the two dimensional images themselves that were integrated into a scene. That is, figures generated by either custom hardware or by software alone were all referred to as sprites. As three-dimensional graphics became more prevalent, the term was used to describe a technique whereby flat images are seamlessly integrated into complicated three-dimensional scenes.
Em português
Sprites foram originalmente inventadas como um método de composição rápida de algumas imagens juntas em jogos de video game em 2d usando hardwares especiais. Como forma de otimizar o careggamento dos softwares….
Creio que Já é o sificiente!
Vamos ao que interessa. Os Sprites em CSS
A técnica é simples e você pode utilizar para quase todas as imagens do seu layout, desde que essas imagens não se repitam dentro de um mesmo elemento ou não tenham tamanho definido. Exemplo: em um background de página você não deverá utilizar o Sprites, pois não há um delimitador de altura e largura para a exibição desta imagem.
Vamos a um exemplo prático:
Façamos um menu.
Briefing: Quatro links, cada um com a cor de fundo diferente, cada um deve ter um degradê.
1º Passo: A IMAGEM

2º Passo: O HTML
<ul class=”sprites”>
<li class=”um”><a href=”#”>1</a></li>
<li class=”dois”><a href=”#”>2</a></li>
<li class=”tres”><a href=”#”>3</a></li>
<li class=”quatro”><a href=”#”>4</a></li>
</ul>
3º Passo: O CSS
*{list-style:none}
.sprites li{float:left; text-align:center; width:50px; height:30px; background:url(http://www.leandrogarcia.com/tutorials/images/sprites.jpg) repeat-x}
.sprites li.um{background-position: 0 0}
.sprites li.dois{background-position: -30px 0x}
.sprites li.tres{background-position: 0 -60px}
.sprites li.quatro{background-position: 0 -90px}
.sprites li a{color:#000;font-weight:bold}
Resultado
Assim Conseguimos um layout, onde cada um dos itens do menu tem uma imagem de fundo, mas não precisamos requisitar quatro imagens, apenas uma.
Vantagens?
Entre as vantagens, posso citar:
a facilidade de manutenção, uma vez que haverá menos imagens a alterar;
o menor número de requisições HTTP;
maior velocidade de carregamento, uma vez que haverá menos itens a requisitar.
Pra finalizar
Ao utilizar o sprites, nós possíbilitamos ao usuário uma maior velocidade no carregamento. Uma página carregada mais rápido, deixa o usuário mais feliz, um usuário mais feliz, tende a voltar mais vezes, desde que o conteúdo seja relevante
Veja em funcionamento: link
Download: Sprites
Enviado por: Leandro Garcia - Categoria(s): CSS, Praticas, dicas
Tags relacionadas: boas práticas, CSS, css sprites, redução de peso, redução do tamanho, sprites
19/09/2008 - 23:21
Pois é pessoal, qualquer um pode ser candidato neste país.
Os Candidatos.
Tati Pink, outrora participante do BBB, candidato-se a vereador em Recife.
O site é um dos melhres que já vi para candidatos a vereador, mas isso não significa que é bom.
“Abra o olho Recife”
Embora o nome da candidata seja “Pink”, o excesso de rosa cansa muito quem está vendo.
Na área de conteúdo, o texto está muito grudado do lado direito, chegando a parecer “comido”.
As cores não tem contraste e o lyout deixa muito a desejar, mas há um ponto positivo.
Qual Garcia?
O fato de ela disponibilizar vídeos e o jingle de sua campanha.

Ah, um outro ponto positivo, é não tocar (ao menos no firefox) o jingle da campanha ao entrar no site.
Falando em Jingle, ouça-o
O site http://www.pink25888.can.br/
Enviado por: Leandro Garcia - Categoria(s): Os Candidatos
Tags relacionadas: candidata, Tati Pink, vereadora
19/09/2008 - 17:30
Mais um da série “Os Candidatos”.
Segundo o wikipedia:
Léo Áquilla, nome artístico de Jadson Mendes de Lima (Teófilo Otoni, Minas Gerais, 6 de setembro de 1973) é uma drag queen brasileira.
Léo Áquilla ficou conhecido por suas performances em shows de boates gays e por suas aparições em programas de TV. Foi repórter do programa Noite Afora, de Monique Evans, bem como do Bom dia Mulher, ambos na Rede TV. Pai de dois filhos — um natural e outro adotivo. Nas eleições de 2006 concorreu ao cargo de Deputado Estadual de São Paulo pelo PSC mas não conseguiu se eleger, obtendo, contudo, um número expressivo de votos: 21.778. Atualmente retomou sua agenda artística realizando suas performances em várias cidades do país.

O site é muito Ruim, mas ainda não supera nossa versão Feminia do Rocky Balboa..
E não há um jingle de campanha, infelizmente. Seria interessante.
Imaginem, uma paródia de I wil survive da Gloria Gaynor.
Não consegui pensar em uma paródia para este, quem tiver uma idéia, me envie..
O site: http://www.leoaquilla22022.can.br/
Conhece um candidato “interessante” que tenha site, me envie.
Enviado por: Leandro Garcia - Categoria(s): Descategorizado, Os Candidatos, Trash sites
Tags relacionadas: candidato, Léo Aquila, Trash sites, vereador
19/09/2008 - 17:20
Prosseguindo com a série “Os Candidatos”, segue mais um candidato a vereador por São Paulo, trata-se do Kid Bengala.
Segundo o Wikipedia:
Kid Bengala é o nome artístico do ator pôrno Clóvis Basílio dos Santos [1] (Santos - SP, 19 de Novembro de 1954 - )[2]. Ator que tornou-se figura de destaque do cinema pornográfico brasileiro, ganhou o apelido “bengala”, devido ao instrumento de auxilio em seu trabalho: uma bengala feita à medida de seu pênis que, segundo fontes, inclusive a do próprio Kid, mede em torno de 33 cm, além do tamanho avantajado, o seu orgão genital é dotado de uma grande grossura e fica extremamente rígido quando está em estado de ereção. Seu maior fã declarado, é o jogador do São Paulo, Richarlyson, que possui em sua videoteca todos os filmes lançados no mercado. O jogador revelou que seu maior sonho é fazer figuração no filme do ator.
Atuou em filmes como: “Kid Bengala”, “Casal no Pau” e “Sexo no Salão 2006″, filme esse que possui uma entrevista com “Bengala” feita por Rita Cadillac.

O site em si, Não é tão ruim quanto o da Havanir, mas está longe de ser bom.
O chato é que não há um jingle de campanha. Imaginem como seria um jingle de um cara desses.
Seria uma paródia de uma música de Marvin Gale, mais ou menos assim: Ele é grande, e vai f… com a corupção…
O site da figura: http://kidbengala23333.can.br/
Enviado por: Leandro Garcia - Categoria(s): Os Candidatos, Trash sites
Tags relacionadas: candidato, kid bengala, Trash sites, vereador
10/09/2008 - 19:55
Eu e, acredito que, muitos dos que lerão este post já sofream ou sofrem quando precisam bolar um layout e não sabem quais cores combinam melhor com o que.
Ha algum tempo um designer amigo meu, o Rafael Tatu, me apresentou o ColourLovers!
O que é o Colour Lovers?
O colourLovers é uma comunidade onde Designers e não designers do Mundo todos postam paletas de combinação de cores, além de texturas, que você pode usar em seus layouts. É muito útil, principalmente para os não Designers, como eu!
www.colourlovers.com
Abraços
Posts relacionados
Enviado por: Leandro Garcia - Categoria(s): Sites que rolam, dicas
Tags relacionadas: color, colour Lovers, cor, dica, lover
10/09/2008 - 19:47
Recentemente o Google lançou um novo browser, o Chrome, testei, gostei, em breve descreverei minha avaliação sobre. Porém este post não é sobre p Chrome, mas sim o Firefox que sempre nos ajuda.
Recebi via e-mail esta semana um complemento a ser adicionado no firefox, trata-se de adicionar um novo item ao campo de pesquisas, o Regsitro.br.
O bacana disso é, nós, que podemos pesquisar a disponibilidade de dominioss .br da mesma maneira que já efetuamos pesquisas no Google. é bem interessante e agiluiza um pouco nossa vida.
Para instalá-lo, você deve:
Abrir o Fire fox, em seguida insira o seguinte comando na barra de endereços
javascript:window.sidebar.
addSearchEngine(”
http://www.ater.com.br/registro/registro.br.src“,”
http://www.ater.com.br/registro/registro.br.png“,”Registro.br”,”Web”)
Depois enter
(Todo o comando deve estar numa só linha. Não deve haver quebras de
linhas.)
Irá surgir uma janela de confirmação.
Basta confirmar.
Pronto, você incluiu um campo de busca de dominios, depois é só você digitar “.com.br” e o browser exibira o resultado de sua busca e sem a necessidade de inserir o (chato, mas necessário) “captcha”.
Espero que seja útil
Enviado por: Leandro Garcia - Categoria(s): Complementos do Firefox
Tags relacionadas: complementos, Complementos do Firefox