500.000.000 de Raposas !!!
February 23rd, 2008
Archive
Archive for February, 2008
Boas práticas para Desenvolvimento Web #1
February 22nd, 2008
Conversando sobre Boas Práticas(na área de programação) com um amigo essa semana, achei interessante falar um pouco sobre isso aqui no blog.
Primeiro, o significado de boas práticas vem do inglês “best practices”, que denomina os melhores métodos para se realizar uma tarefa, ou seja, o meio que tem mais chance de levar até o resultado esperado sem muitos problemas.
Muitas profissões tem criado as suas “Boas práticas” relacionadas a área, para otimizar processos ou encaminhar melhor os novos profissionais que estão chegando.
Na área de computação não é muito diferente. Temos várias “boas práticas”, para a grande maioria das tarefas de informática que ajudam e muito no dia-a-dia.
O Desenvolvimento Web também tem as suas “boas práticas”, que ajudam na hora de desenvolver um site, e é sobre algumas delas que eu vou falar.
Doctype – DTD(Document Type Definition)
Essa boa pratica é o começo de tudo, ou seja, é a primeira coisa que o user agent do seu browser procura para saber qual é o tipo de Linguagem de marcação(que por muitos é conhecido também como HTML 
) que ele terá que interpretar(parsing) no momento em que a página for solicitada.
Quando ele é informado na página, o browser saberá qual tipo de marcação deverá interpretar, e assim a página será carregada muito mais facilmente.
Para saber mais sobre Doctype, visite os links abaixo:
Quirks Mode e Strict Mode
Dentro do doctype, nós temos como informar para os Browsers dois tipos de renderização de CSS. O modo “antigo”( ou Quirks Mode ) e o modo “estrito” ( ou Strict Mode ).
O Quirks mode, é considerado o modo “antigo”, pois é a implementação que na época dos Browser Internet Explorer 4/5 e Netscape 4 (onde ambos não faziam parte da W3C, e assim, não seguiam os padrões, apesar de na época, o Internet Explorer interpretar muito melhor o CSS do que o Nestcape) permitia que os browsers passassem a interpretar os padrões(Strict Mode), que estavam começando a ganhar espaço, ou o modo “antigo”(dai o Quirks mode).
Para saber mais sobre Quirks Modes, visite os links abaixo:
Por tanto, verifique sempre, qual será o destino final do seu site, ou da sua aplicação web, para saber qual modo utilizar. Mas nunca se esqueça de utilizar os Doctypes e os Modos de renderização certos para a sua aplicação.
Mais alguns site para uma boa leitura:
- 24 ways – Transitional vs. Strict Markup(inglês)
- Mozilla Developer Center – Mozilla’s DOCTYPE sniffing(inglês)
Technorati Tags: dtd, doctype, best practices, boas práticas, quirks mode, strict mode, user agent, parsing, development, desenvolvimento
Boas Praticas, Desenvolvimento Web, acessiblidade, css, firefox, mozilla, problemasSolucoes
Experimentando o twitter!!
February 15th, 2008
Utilizando Wireframes
February 14th, 2008
Depois de ler alguns artigos sobre Wireframe, e ver que realmente isso é importante no processo de criação de sites. Resolvi criar um post sobre isso.
Hoje é muito comum ver sites sendo desenvolvidos sem nenhum planejamento, pois ele precisa ser desenvolvido rapidamente e precisa estar no ar logo(entre outras coisas que os gerentes e clientes falam).
Muitas vezes, isso causa vários retrabalhos de código, seja em client-side(CSS, HTML, Javascript …) ou server-side(PHP, ASP.NET, JSP …), pois não ouve um planejamento de como fazer, ou do que o site realmente deveria ter.
Se pensarmos em um site como um projeto de automóvel, por exemplo, vamos ver que não adianta saber que o todo carro possue motor, rodas, freios, etc. Precisamos saber qual será o tamanho do carro, a disposição do motor, como será a disposição do painel(onde estão o radio, porta luvas, etc).
É nesse ponto que entra os desenhos do projeto para o automóvel. Nada sei da cabeça do projetista e vai direto para a linha de montagem.
Antes mesmo do carro conceito(como é chamado o protótipo), é feito um estudo para verificar a usabilidade dos controles do carro, como será o espaço interno, se a aerodinâmica ir prejudicar a estabilidade, entre outros fatores, que podem influenciar no sucesso ou no fracasso do produto.
A criação de um site, também segue(ou pelo menos deveria seguir) esse conceito, mas infelizmente, muitas empresas ainda não gastam um tempo do projeto para essa tarefa, e muitas vezes, pagam por não ter planejado e projetado uma interface(ou até mesmo os controles do site) mais intuitivos e dinâmica.
Para diminuir esse impacto de projeto, e até mesmo, de tempo e dinheiro gasto no desenvolvimento, o Wireframe é um excelente passo.
Basicamente, o Wireframe consiste em um “esboço” de como será o layout do site, dizendo onde os elementos serão posicionados , e descrevendo quais elementos serão utilizados(isso dependendo é claro, qual o nivel de detalhamento que o seu Wireframe terá), de acordo com o que, muito provavelmente, será o layout final.
Há também a possibilidade de uma pratica e rápida mudança antes do layout definitivo, evitando que muitos imprevistos aconteçam no decorrer do desenvolvimento, e ajudando ainda na analise de usabilidade de interface do site.
Alguns links interessantes sobre Wireframe estão listados abaixo:
http://usabilidoido.com.br/quanto_mais_simples_o_wireframe_melhor.html
http://webinsider.uol.com.br/index.php/2003/12/09/wireframe-documento-cada-vez-mais-importante/
Você deve esta se perguntando agora se há alguma ferramenta para “desenhar” os Wireframes?!?!
Bem, eu procurei várias ferramentas para isso, mas a que mais me agradou, e que mais me deu produtividade, foi o Inkscape.
Além de ser open source e multi-plataforma(Windows, Linux e MacOS), o inkscape tem uma interface muito fácil de usar.
Mas você pode testar outras ferramentas como o GIMP, PhotoShop, Flash(sim, já vi pessoas usando o Flash para desenhar wireframes), ou alguma ferramenta que você tenha mais habilidade para desenhar.
Grande abraço, e comentem
Technorati Tags: wireframe, usabilidade, acessibilidade, web, desenvolvimento, firefox, open souce, inkscape
Boas Praticas, Desenvolvimento Web, acessiblidade, blogices, css, firefox, openSource, problemasSolucoes
Master Hack – A web não tem preço!!!
February 4th, 2008
Pra não dizer que o carnaval não foi divertido, ai vai uma tirinha retirada do site “Nerdson não vai à Escola”
Bom carnaval à todos!!!