Aprendendo webdesign em caixa de Sucrilhos #Parte 1
Postado em Dezembro 19th, 2008| Algo sobre Ossos do Ofício, Sites, Vale uma risada, Web Standards
Bom, dedico esse post clientes que costumam contratar os webdesigner “20 Conto”. Aqueles que compram uma revista “Aprenda a Construir Sites” por R$19,90 pela manhã, e de tarde já saem por ai com seu cd de templates debaixo do braço se achando O UÉBIDIZAINER.
Fui contratado para dar manutenção a um site by 20 Conto. E cada documento html que eu abria, aumentava meu desespero. Itens como CSS, Includes, Pastas ou qualquer outro ítem que sugira o mínimo de organização estavam longe de existir. Segue abaixo uma mostra do código que me fez chegar a beira de um ataque de nervos.
<p class=”MsoNormal” style=”margin-top: 0cm; margin-right: 0cm; margin-bottom: 6pt; text-indent: -17.85pt;”><span style=”font-size: 12pt;” lang=”DE”>·<span style=”font:7.0pt “>
</span></span><strong><span style=”font-size:12.0pt;font-family:” lang=”DE”>Artigos:</span></strong></p>
Por isso, se você está procurando algum curso de WebDesigner, aqui fica os meus mais sinceros Parabéns. Você acaba de ficar anos a frente do 20 Conto.Só cuidado pra não bater a cabeça e fazer algo parecido com isso.
E aos clientes, para tentar entender o que toda essa conversa significa, esse bloco de coisas eu escrevi ai em cima, foi substituido por:
<h2>Artigos:</h2>
.
Até mais galera, e bons estudos. ![]()
Usuários, Resoluções e Navegadores - A Saga
Postado em Dezembro 10th, 2008| Algo sobre Acessibilidade, Bugs do IE, Firefox, Ossos do Ofício, Web Standards
Bom dia caros amigos. Gostaria de opnião de vocês referente a um assunto que gera muita discussão. Usuários e a Resolução.
Hoje encontramos computadores até de R$800 nas mais diversas lojas. Extra, Carrefour e outras do tipo. Apesar de básicos, esses computadores possuem uma configuração que suporta resoluções um pouco mais altas (1024x 768 e 1280 x1024).
Muitos dizem que temos que dar opção para os usuários de 800×600 visualizarem os sites. Realmente concordo com esse pensamento, mas e o pessoal do outro extremo? É complicado limitar os projetos web por conta de uma minoria que ainda usa essa configuração (nos meus projetos, são apenas 3%).
Existem também usuários que gostam de se atualizar, que possuem resoluções bem mais altas (a partir de 1440), com links de no mínimo 600kb, que a nível nordeste é bem alto. Se certa forma, estamos atingindo esses usuários, já que tudo é limitado ele não tem diferencial nenhum, com o detalhe que ele pagou caro para isso.
Boa parte dos problemas com resoluções, podem ser resolvidos com a análise do público alvo do projeto. Fazer o site da BMW em 800×600 por exemplo. Quem tem interesse em uma BMW, em geral deve ter um computador razoável certo? Apesar de não ser uma regra, esse é o raciocínio que a maioria dos desenvolvedores usa.
É necessário forçar os usuários a fazer um update de alguns detalhes mínimos, como resoluções, e navagadores. A maioria dos usuários do IE 6, nem sabe que ele pode ser atualizado. Então mãos à obra.
Como não podemos forçar um usuário a adquirir uma máquina nova, e aposentar o k6II com Windows 98 e 800×600 dele, podemos tentar induzir os usuários do IE6 a pelo menos atualizar para o IE7 (pedir para colocar o Firefox seria o ideal, mas ai já pedir demais).
Vamos lá galera. Agora é com vocês.
Dicas de CSS #3 - Trabalhando com Frameworks
Postado em Dezembro 3rd, 2008| Algo sobre CSS, Dicas, Sites, Tutoriais, Web Standards
Hi. Estou de volta após uma grande correria de 2 semanas, entre compra de móveis ara o novo home office, pintura, e outras preocupações de fim de ano.
As dicas de hoje são para os meus amigos da Fatec. Vou escrever umas dicas para o uso de framework, visto que algumas pessoas tem me perguntado sobre questões de organização de arquivos, includes e outros detalhes que fazem a diferença na hora de codificar páginas. Começando.
1. Crie uma estrutura padrão: A maioria dos sites que faço, possuem itens que sempre estarão presentes, tais como menu, topo, uma div para servir de corpo (no meu caso, #principal) e por ai vai. Então você ganhará tempo se já tiver essa estrutura html pronta, para usar sempre a cada novo projeto. Além de ganhar tempo, isso também ajudar a criar padrões. Isso também é válido para o css.
2. CSS pronto pra ação: Crie uma estrutura padrão também no css, tais como formulários, listas, classes para uso geral, comportamento de links. Dessa forma vc sempre terá uma classe pronta para uso, ajudando a padronizar o código.
3. Use includes: O uso de includes evita que você repita códigos sem necessidade. Por exemplo, ao invés de inserir o código html do menu em todas as páginas, crie o menu em um arquivo separado, e sempre que necessário utilize o include para referenciar na página desejada. Dessa forma, se necessitar alterar o menu, só precisará alterar um arquivo.
4. Organize suas pastas: Uma das piores práticas que podem ser utilizadas, é a não criação de pastas para separar os arquivos. Pelo menos as pastas básicas devem ser criadas (imagens, css). Outras também ajudam a organizar, tais como “includes”, “JS” e “flash”. Particularmente, a pasta imagens, eu ainda separo entre “principal”, “internas” “temporarias”.
Essas são as essenciais, a medida que eu vá lembrando de outras dicas, vou postanto. Té mais
Google Bombing
Postado em Novembro 6th, 2008| Algo sobre Google, Vale uma risada, Web Standards
Oi povo. Não tenho blogado muito ultimamente devido a alguns problemas que me transtornaram nos últimos 10 dias. É stress com operadora de telefonia móvel, cartão de crédito, é devedor que não quer pagar e por ai vai.
Lendo meu feeds, vi que o Henrique Pereira do Revoluções.etc.br passou por algo parecido recentemente, e comentou sobre o Protesto 2.0. Como protestar em tempos de web.
Algo que está diretamente relacionado com isso, é o Google Bombing.
Google Bombing consiste em inserir links em diversos sites utilizando o mesmo texto âncora e a mesma página linkada até que o resultado da busca deste texto âncora retorne como a primeira opção na busca. Por exemplo, se esse link (Moto para Designers) for adicionado em vários sites, passará a ser relevante.
Essas atitudes em geral são utilizadas em caráter de humor, ou crítica. O link que usei foi só para exemplificar. Entre os exemplos mais famosos, temos “Atriz Gorda” que retorna a Preta Gil, “Mulambada” que retorna a página do Clube de Regatas Flamengo, e Déspota Cachaceiro, que retornava uma página com a bibliografia do presidente Lula.
Este texto não está na página linkada, mas está no link para ela. Se várias páginas fazem a mesma coisa, então a relevância da página é maior ela aparece nos primeiros resultados. Quando chegar ao primeiro lugar na busca, vira Google Bomb.
É certo que daqui a um tempo, o Google vai descobrir uma maneira de burlar isso (se não ja descobriu), mas enquanto isso, pode-se fazer algumas críticas (de preferência, com responsabilidade).
Valeu galera, até a próxima.
Meta tags, até onde vai a apelação
Postado em Outubro 27th, 2008| Algo sobre Google, Ossos do Ofício, Web Standards
Bom dia a todos. Após um tempo ausente, estou de volta, vida de freela não ta fácil, e ainda com stress com minha operadora de celular, mas isso é assunto para outro post.
Hoje venho falar de algo que venho notado a algum tempo, o uso (mal uso na verdade) de meta tags e a tag <title> nos sites. Antes, vamos a um breve resumo de o que é e como utilizar.
Meta tags:
Meta tags, são linhas de código HTML, que passam informações do seu site para para os buscadores. Em geral essas informações são descrições da página, palavras chave, autores do site, entre outras, mas essas 3 são as mais inportantes.
Keywords:
As keywords são as palavras chave do site/página. São as palavras que você imagina que o usuário irá pesquisar para achar o conteúdo do su site. Segue exemplo.
<meta name=“keywords” content=“webdesign, web design, designer/>
Description
O description, é uma pequena descrição do conteúdo da sua página, ela é exibida nos resultados das buscas no Google.
<meta name=“description” content=“Criação de sites, CSS XHTML” />
Title
Title, apesar de não ser uma meta tag, está bastante relacionada, ela é a tag mais importante do código da página. Ela, juntamente com as tags <h1> e <h2> são responsáveis pelos itens importantes do documento html.
Agora que vocês já foram apresentados aos personagens do post, vamos aos fatos.
As meta tags, são usadas para mostras aos mecanismos de busca (em especial o Google), do que se trata o conteúdo do meu site. Então se o meu site é sobre Ler o futuro em borra de café, minhas meta tags terão a ver com esse assunto. Então é previsivel que tenha palavras como: café, previsões, futuro, exoterismo, etc etc etc.
Acontece, que hoje em dia é comum de se ver na net, sites apelativos nesse sentido. Com meta tags e títulos que mais parecem ter sido retiradas do wikipedia, de forma que qualquer assunto que você buscar, essa página vai retornar.
Dessa forma, outros sites tendem a alterar sua palavras chaves também, a fim de concorrer com os exagerados da história, ampliando o efeito sem noção, e fazendo com que o resultado do Google seja falho, já que as palavras chaves desses sites são apenas um encher linguiça.
Vou ficando por aqui, e tentado uma maneira de não cair nas pesquisas do Google, sem precisar aderir ao método apelação. Té +




