CiiN - Alvo Conhecimento

No intervalo entre um post e outro, as vezes ficamos numa “pausa” para elaborarmos conteúdos originais e interessantes aos leitores (não notícias, não é o foco). Pensando nisso achei que deveria iniciar uma série de posts contendo dicas de serviços on-line, templates, tutoriais, shapes, icons gallery, brushes, css, etc etc etc. Principalmente porque sou contra clonar posts: cadê aquela lei do blogueiro, tem isso??

Nada como um bom bookmark hã?

Serviços online:

Adicionar marca d’agua nas imagens

Esquema de cores (EXCELENTE)

Adicione recursos de medição em qualquer site que esteja
INSTRUÇÕES: coloque o link nos favoritos, visite qualquer site e entre nesse favorito.

3D Pack - Criador de caixinhas de produtos (esses que vemos no mercado, ex.: um jogo de computador)

Coleções:

Shapes de flores e folhas para Photoshop

Templates para serem utilizados na criação de logos

Muitas texturas (muito bom)

Inspiração:

Vários layouts orientais

Até a próxima!
Mandem suas sugestões que estarei postando em outros da série. Vai servir de dica também nos comentários

Abração,
Daniel Accorsi

Uma dica bem legal para quem tem dificuldades de entender a sintaxe do CSS. Um carinha fez de uma maneira bem didática a explicação em forma de diagramas. Fácil de entender!! No final do post dele alguns links para se aprofundar no estudo, inclusive no desenvolvimento de layouts.

É uma excelente dica para quem está começando, mas as informações estão em inglês, acredito que não terá problemas.

http://www.rikkertkoppes.com/thoughts/css-syntax/

Abração!
Daniel Accorsi.

Tenho notado que ainda há muita dificuldade sobre o uso correto de divs e tables. Consultei os termos mais pesquisados no Google, e cheguei a conclusão que muitos desenvolvedores ainda não estão “conectados” as novas tendências. Não vou (mesmo) falar de Web 2.0, na minha opinião esse assunto já saturou e a mídia fez tanta confusão em cima disso que tem muita gente se confundindo…

Bom, vamos lá…como disse acima, existem muitas pessoas fazendo pesquisas no Google a procura de soluções sobre a tag DIV, as vezes nem sabem o que estão procurando. Outras vão mais a fundo, pedem uma explicação sobre diferenças entre DIV x Table. Concordamos que quando falamos em tableless, acessibilidade e web standards uma das primeiras coisas que vem a nossa mente é o método de desenvolvimento, é aí que temos que bater, ou mudar.

Tem muita gente ainda indo pelo caminho mais longo, veja bem, não é o errado, só o mais longo. Quem vem de uma cultura tabelas para se trabalhar com layout e muda para estrutura em div, sofre pois há uma série de conceitos diferentes. Imagine então a confusão de um individuo em desenvolver um layout usando div mas pensando como tabelas, imaginem a loucura que não sai.

Para não entrar em redundância de posts (forcei ), abaixo alguns links com dicas e tutoriais para criação de layout, inclusive um post interno falando da difença de uso entre div e table:
blog.ciin.com.br - Diferença Div x Table

www.tableless.com.br - layout 3 colunas
www.maujor.com - Raciocinando com DIVs
www.maujor.com - Construindo um layout sem tabelas
www.maujor.com - Layout CSS de 2 colunas com faux column
www.maujor.com - Layout de 3 colunas em qualquer ordem
www.maujor.com - Layout 3 colunas
www.maujor.com - Layout 2 colunas

Qualque dúvida estamos aí.
Abraços,
Daniel Accorsi.

Post editado: Esse post tem um grande número de acesso, porém vazio e parado. Sua intenção inicial era trazer opiniões referente a um assunto na época um tanto movimentado, porém nem tanto agora. Nada impede de ainda participarmos.

Com tantos comentários sobre o esperado CSS3, vimos que ainda falta um percurso grande para a W3C, não é mesmo? tantas opiniões, sugestões, criticas…basta se manter atualizado com o site oficial para termos conhecimento disso.

Sabemos também que o Brasil possui ótimos programadores e designers, muitos ainda em fase de atualização de conceitos. Em nossa comunidade (-brasileira-) que se dedica em se manter por dentro desses grandes acontecimentos “weblísticos” que nunca tem fim…mas afinal, com o que e como podemos participar para evoluirmos como uma só equipe? Há mais críticas do que soluções, é fato! As decisões não são nossas, fora do nosso alcance tentar decidir alguma coisa, por isso que temos os Work Groups, mas será que eles pensam em tudo?

Abraços,
Daniel Accorsi

Estive fazendo algumas implementações em Java Script. Nada fora do comum. Coisas do dia-a-dia. Sempre testo os projetos no Firefox, IE6, IE7 e Opera, garantir a qualidade, vocês sabem.

Quebrei a cabeça num bugzinho, porém terrível. Parece até um vírus, uma praga mesmo!

A grosso modo, meu objetivo era alterar um src de uma imagem dinamicamente (para aqueles que já mexem a anos, já devem estar desconfiando) através de JS. Firefox ok, IE7 ok, Opera ok, IE6 ok…mas então, onde está o problema?

Joguei o projeto na web e fui testar novamente, incrível, no IE6 parou de funcionar (a imagem nova não aparecia, somente clicando com botão direito e selecionar “Mostrar imagem”. Ou seja, quando localhost, funcionou normal, mas quando web não! Tentei então fazer um pre-loader em JS assim que carregasse o projeto (web), fui testar, ainda correto para todos, menos para o IE6.

Então fui tentar passar um alert() e ter certeza do que estava acontecendo. E para minha surpresa, a imagem nova apareceu APÓS o alert(). Bug?? “imagina, engano meu…”: CLARO que sim!

Claro que eu não ia fazer um alert() só para a imagem funcionar no IE6, nada prático…então fui pesquisar.

Então, o bug não estava na tag img e nem no JS, a praga estava no link (imagem) que ativava (através do onclick) uma função JS. Veja como estava:

<a href="javascript:;" onclick="selecionaIcone('icone3.png');"><img border="0" src="img/icones/icone3.png" /></a>

Caso resolvido assim:

<a onclick="selecionaIcone('icone3.png');"><img border="0" src="img/icones/icone3.png" /></a>

Explicando: retirei o href=”javascript:;” e no CSS adicionei a seguinte linha: cursor:pointer; para ficar com a “mãozinha” no mousehover.

Existem várias maneiras de se fazer carregar uma função JS, mas meu objetivo aqui é mostrar o belíssimo BUG do IE6. Ainda bem que foi resolvido no 7.

Abraços a todos,
Daniel Accorsi.

Pessoal, somente uma dica para vocês.
Todos nós sabemos que nosso querido CSS3 ainda está em fase experimental, porém, já disponibilizaram um validador para sabermos se nossos browsers já estão prontos para tal.

• Veja o link e confira: http://www.css3.info/selectors-test/test.html

Aproveitando o post, vejam alguns links internos do W3C interessantes que separei:

Diferenças entre um GIF e um PNG (use PNG): http://www.w3.org/QA/Tips/png-gif
Perguntas e respostas: http://www.w3.org/QA/
Famoso validador CSS: http://jigsaw.w3.org/css-validator/
Sobre dispositivos móveis: http://www.w3.org/Mobile/About
Dica: entre no site da W3C e confira a seção a esquerda: W3C A to Z

Afinal…já estamos preparados para o tão esperado CSS3? ou ele só vai complicar ainda mais nossa tentativa de criar uma certa qualidade independente de browsers?

Abraços,
Daniel Accorsi