|
|
|
|
|
Arquivado em ‘Web Design e CSS’Quando criatividade não se comparada com execuçãoSexta, mai 23rd, 2008
Grace Moon, uma jovem estudante na Califórnia venceu uma competição do Google que propunha a criação de um Doodle , usado em ocasiões sazonais. A criatividade dela custou US$10 mil em bolsa de estudos, mais US$25 mil para sua escola Canyon Middle School, em Castro Valley. 
Designer, como o MEC compreende a formaçãoSegunda, abr 28th, 2008A designer Cristina Jacó escreveu um artigo interessante sobre como a profissão de designer, hoje é vista pelo MEC - Ministério da Educação e Cultura. Para ler o artigo na íntegra, acesse “Como o MEC compreende a formação em Design“, no portal Imasters.
CSS Reset, corrigir problemas de renderização nos browsersQuinta, abr 10th, 2008Apesar de não ser mais novidade para quem já trabalha profissionalmente com desenvolvimento web, muitos aindas não conhecem a maneira de corrigir problemas de renderização nos browsers. CSS Reset faz com que todas as propriedades das tags sejam zeradas desde o início, através dos seletores que aplicam no HTML e/ou XHTML. Quem pesquisar por CSS Reset vai encontrar um padrão que promete fazer com que os principais browsers que dominam o mercado, renderizem de igual pra igual. Eu, que uso o IE7, IE6, Firefox, Opera e Netscape para testar meus trabalhos, tive alguns probleminhas entre eles, com a tag <table>. Então, fiz um ajuste para solucionar o problema. Abaixo, segue o CSS Reset que uso no meu dia-a-dia: CSS:
Aproveito para deixar muma dica, que é sempre setar as propriedades de estilo e tamanho de fonte no seletor body. Exemplo: CSS:
CSS Escolhidos #18Terça, nov 28th, 2006[tags]css, webdesign[/tags]
CSS Escolhidos #17Segunda, nov 13th, 2006Formulário semântico e acessívelSábado, nov 4th, 2006Esta semana peguei um formulá¡rio de boleto online para torná-lo semântico e acessível, e no momento em que alterava aqui e ali, pensei: preciso escrever artigos voltados ao desenvolvimento web. Não vou falar de tags como h1, h2, h3, h4, h5, h6 ou p, span, blockquote etc. Todos já estão "carecas" de saber o que é certo e o que é errado. Tive a idéia de escrever um artigo sobre formulários depois de alterar um boleto online que continha um fonte totalmente fora da realidade. Então, estou pegando um simples formulário escrito em HTML, para deixá-lo acessével e correto, semanticamente falando. Há vá¡rios tópicos que eu poderia abordar sobre usabilidade, mas não quero o fazer agora. O que eu quero é mostrar a parte "por trás", da coisa. Sei que muitos ainda se esquecem de escrever corretamente formulários HTML, pensam em tudo, mas quando chega a hora, esquecem de coisas simples que fazem grande diferença aos usuários de leitores de tela ou para aqueles que por algum motivo, não podem usar o mouse. O preview abaixo, é de um simples formulário de 5 campos, escrito do modo antigo:  Clique aqui para ver o código fonte. Vamos fazer a mágica? Abaixo, segue a lista das etapas para a transformação do formulário:
Pronto! Confira o resultado do novo formulário semântico e acessível logo abaixo ou clique aqui para ver o resultado:  Baixe os fontes formulário acessível
CSS Escolhidos #16Segunda, out 30th, 2006CSS Escolhidos pt 15Segunda, out 9th, 2006CSS Escolhidos pt 14Domingo, out 1st, 2006CSS Escolhidos pt 13Segunda, set 25th, 2006CSS Escolhidos pt 12Terça, set 19th, 2006CSS Escolhidos pt 11Segunda, set 11th, 2006CSS Escolhidos pt 10Terça, set 5th, 2006SVG, imagens vetoriais em aplicações WebSábado, set 2nd, 2006SGV, ou Scalable Vector Graphics (Gráficos Vetoriais Escaláveis) é uma linguagem baseada em XML, projetada para a criaação de gráficos vetoriais estáticos e dinâmicos, ou animados através de comportamentos JavaScript/DOM. A linguagem foi criada pelo W3C e também pode ser manipulada com ASP, PHP e JSP.
Essa tecnologia permite três tipos de objetos gráficos:
A grande vantagem do formato SVG, é que não há perda de qualidade nas imagens quando ampliadas, ao contrário do que acontece com os formatos convencionais (por pixels), como: JPG, BMP, GIF e PNG. Também é uma linguagem Open Source. Nenhuma marca tem direitos exclusivos sob a utilização da mesma, e não exige a legalização de determinados softwares/aplicativos. Onde está a graça? Na possibilidade de criação de gréficos e figuras geométricas de forma dinâmica. Jé imaginou a criação de gráfcos a partir de valores vindos de bancos de dados? Para se ter uma idéia, o Google Analytics faz algo parecido, porém utilizando a tecnologia Flash. Exemplo de gráfico gerado a partir de dados fornecidos pelo usuário:
No caso acima, o grafico foi gerado depois de eu setar o número 40 para o campo de canditado 1, e 100 para candidato 2. Se eu tivesse setado 60 para o campo candidato 1, a porcentagem cresceria, imediatamente. Infelizmente, não são todos os browsers que suportam SVG. Atualmente, talvez os únicos que suportam: Firefox e Opera Saiba mais sobre Gráficos Vetoriais Escaláveis.
CSS Escolhidos pt 9Segunda, ago 28th, 2006 |
Páginas do siteCategoria de artigosParticipo |
Tecnologia, Marketing e Design de Internet | Design by Thalis Valle | RSS Feed
Visite também: http://mp3.thalisvalle.com
Este site é licenciado sob lei Creative Commons. This work is licensed under a
Creative Commons Attribution-NonCommercial-ShareAlike 2.5 Brazil License
