Olá, gostaria de indicar 3 tutoriais excelentes, que você deve conhecer e ler várias vezes.

30 CSS Best Practices for Beginners

20+ HTML Forms Bests Practices

30 HTML Best Practices for Beginners

Abraços!!!

Olá queridos, após muito tempo sem postar nada, estou voltando ;D

Conheça 05 ferramentas para poder testar seu site em vários navegadores.

Browsershots

Adobe Browserlab

Litmusapp (paid service)

VMware Fusion

IE Tester

Hoje as grandes/médias/pequenas empresas procuram uma forma de atingir seu público de uma forma ágil e eficiente.

As mídias sociais atendeu a essa expectativa, como por exemplo podemos ver grandes empresas como Globo, SBT, Record, MTV e várias outras no Twitter.

Veja um comparativo do tempo que demora para chegar a notícia até você

Jornal: 24h
Google: Até 24h
Sites de Notícias: Minutos
Blogs: Minutos
Twitter: Segundos

Recentemente a Google lançou uma nova ferramenta no Orkut chamada de Promover onde você cria um anúncio que vai aparecer em cada perfil de seus contatos, uma forma eficiente e 0800

Olá queridos amigos, vou tentar explicar o lado bom e o outro não tão bom do W3C.

O CLIENTE

Quando um cliente solicita algum projeto, ele que não quer saber se o site vai estar nos padrões W3C ou se é válido ou não, ele apenas quer saber se ao entrar no site não vai ter nenhum erro,  se está tudo no lugar e funcionando.

Não há dúvida de que quando seguimos os padrões não teremos nenhum problema de visualização, mesmo assim ainda temos o velho Internet Explorer onde tenho que desenvolver outro CSS para cada versão, ou usar algum CSS HACK.

TABLELESS

Pós
- Facilidade na atualização do código
- Arquivos mais leves
- Respeita a W3C

Contras
- Maior tempo gasto
- Muitas vezes utilizar de CSS-Hack

TABELAS

Pós
- Agilidade no desenvolvimento
- Não ter problemas de visualização em navegadores antigos

Contras
- Não respeita a W3C
- Arquivos mais pesados
- Atualização dependente de algum editor no modo Design

O DESENVOLVEDOR

Hoje nossos clientes estão cada vez mais exigentes quanto ao preso, e me pergunto se vale a pena continuar desenvolvendo meus projetos em Tableless, pois muitas vezes tenho que entregar o projeto rapidamente.
Por outro lado tenho que estar me atualizando sempre, para que eu possa acompanhar as novidades do mercado e ficar a frente do meu concorrente, além de que muitas agências de publicidade e propaganda exigem que o desenvolvedor utilize as normas W3C em seu projeto.

RESUMO FINAL

Ao desenvolver um novo projeto leve em consideração o prazo do projeto, se vai precisar de atualização constantes e seu tempo disponível para desenvolver em Tableless.

Irei terminar esta matéria com um comentário no twitter do @maujor onde ele disse o seguinte

RT: @???: @maujor o cliente que souber oq é HTML5…a maioria só se preocupa com o resultado final. – Então desenvolva com tabelas!

Ps.: Para quem não conhece o Maujor é o dinossauro do CSS, escritor de vários livros como o de jQuery, XHTML e CSS. Pode visitar seu site aqui

Hoje vou dar a dica de como utilizar as diversas ferramentas na web, os aplicativos web que vai ser o futuro, fiquem ligados.

O Google Docs é um aplicativo onde você edita/cria arquivos de texto, planilhas, enquetes, slides e muito mais, então se você tem um contrato e precisa ter acesso a qualquer momento do dia, basta deixar no Docs.

Tive o primeiro contato com o Docs na empresa em que trabalho Miranda Imobiliária, onde são 8 lojas e tinhamos a necessidade de ter um sistema do controle de imóveis seguro, eficiente e barato(o melhor que foi de graça).

Criamos uma planilha do Excel para cada loja, e nela a lista dos imóveis, descrição e muito mais e compartilhamos com todos os 60 corretores, um único arquivo para todas as lojas e usuários.

Hoje utilizo para manter um arquivo onde meu cliente e eu podemos adicionar comentários, idéias para que eu não fique ligando o tempo todo, basta eu acessar o docs e ver os recados do meu cliente.

Olá queridos vou disponibilizar para vocês um plugin onde serve para explicar algum link, ou fazer algum comentário.

Passo 1

Acesse o site do plugin Easiest Tooltip ou caso queira ver a DEMO

Passo 2

Agora vamos importar o jQuery e o plugin.

<script src="jquery.js" type="text/javascript"></script>
<script src="main.js" type="text/javascript"></script>

Passo 3

Adicione o texto no ALT do link.

<a href="http://cssglobe.com" title="Web Standards Magazine">Roll over for tooltip</a>

Para ver todas as formas possíveis com o uso deste plugin acesse e para fazer o download do js AQUI

Durante meu trabalho na Miranda Imobiliária estava atendendo um cliente no suporte online onde um usuário de Netbook estava reclamando de o site não “caber” na tela, isso me faz lembrar a velha história de a resolução 800×600 está em desuso como o IE6 e penso, como nós web designers/masters/programadores vamos desenvolver sites tendo que pensar nesses usuários? Ou vamos adotar a idéia de que quem usa o Netbook sabe que seu PC é pequeno e logo pode passar por isso? Ouro caso que me faz pensar é a Web Mobile, onde está crescendo rapidamente e vai ser o futuro, mais quanto ao Mobile não há muito problema pois nós desenvolvemos uma versão do próprio site para eles, claro que são 02 serviços e devemos cobrar por este serviço de nossos clientes.

Olá queridos, essa matéria não tem nada haver com o Web Standads, e sim com um problema que vinha passando há messes, tenho um roteador Encore e tinha o problema de entrar no MSN e o roteador reiniciava, nunca conseguia ficar por mais de 2 minutos online, após muitas pesquisas e nunca achei nada que pudesse me ajudar, até que procurei o código embaixo do roteador, entrei no site do fabricante, minha surpresa foi que a foto do produto no site é um e o meu é outro. Veja o aparelho ENHWI-G3 no site do fabricante.

Agora veja o modelo que eu tenho

A solução que eu encontrei foi fazer o download do firmware aqui.

Depois acesse o INICIAR > EXECUTAR > cmd > ipconfig e copie o endereço do Gatway Padrão, coloque o IP em seu navegador, irá pedir um login admin e senha admin, depois clique em Firmware e selecione o arquivo que você fez o download do site.

Olá, tive que integrar um site com o twitter e com uma rápida pesquisa encontrei um tutorial muito simples no Pinceladas Web. Nós iremos utilizar um JS e pronto.

Tutorial

Faça o download do JS o download do plugin e a biblioteca jQuery antes da sua <head>

<script src="jquery.twitter.js" type="text/javascript"></script>

Logo depois

<div id="twitter"></div>

Agora altere o seu login e pronto, coloque esse script antes do <head>


$(document).ready(function() {
$("#twitter").getTwitter({
userName: "jquery",
numTweets: 5,
loaderText: "Loading tweets...",
slideIn: true,
showHeading: true,
headingText: "Latest Tweets",
showProfileLink: true
});
});


O firefox facilita, e muito, a vida de nós desenvolvedores web. E nada mais justo que eu eu enumerar aqui os melhores plugins que o firefox tem para nós que amamos desenhar/programar e temos que quebrar a cabeça para funcionar tudo em navegadores ruins como os IEs…

1. Firebug: Edita Javascript, HTML e CSS em tempo real e pode ser acessado com F12 do teclado. Usando a função Inspect você escolhe qualquer elemento do site e edita na hora – muito útil para verificar heranças CSS e corrigir erros de layout em tempo real.
URL: https://addons.mozilla.org/en-US/firefox/addon/1843

2. Web Developer: É o melhor e mais completo plugin para desenvolvimento web. É uma barra de ferramentas com mais de 100 opções, por exemplo: desabilita e habilita javascript, cookies, css, imagens, cores da página, cache; identifica em tempo real o tamanho ou caminho (path) de uma imagem, divs block level, divs inline, tabelas, frames, elementos obsoletos, formulários; edita em tempo real o CSS e o HTML; mede partes da página com uma régua dinâmica; preenche formulários automaticamente.
URL: https://addons.mozilla.org/en-US/firefox/addon/60

3. ColorZilla: Seu cursor vira um conta-gotas que pode pegar qualquer cor da página sem ter que abrir um editor de imagens.
URL: https://addons.mozilla.org/en-US/firefox/addon/271

4. LoremTools: Inserir Lorem Ipsum com apenas um clique. Lorem Ipsum é um texto em latim usado para ocupar blocos de texto em layouts ainda em teste.
URL: https://addons.mozilla.org/en-US/firefox/addon/4191

5. IE NetRenderer: Renderiza a página atual com IE NetRenderer e assim você pode ver seu site em todas as versões dos famigerados IEs.
URL: https://addons.mozilla.org/pt-BR/firefox/addon/6455

6. MeasureIt: Plugin que permite desenhar uma régua em qualquer página web para verificar a largura ou altura de um elemento.
URL: https://addons.mozilla.org/en-US/firefox/addon/539

7. SeoQuake: Extensão SEO que visa essencialmente ajudar webmasters que lidam com a Search Engine Optimization (SEO) e promoção de websites na internet. Permite a obtenção e investigação de muitos parâmetros importantes de SEO da internet.
URL: https://addons.mozilla.org/en-US/firefox/addon/3036

8. Total Validator: Verdadeira validação HTML (HTML 2.0 para XHTML 1.1), utilizando o funcionário DTDs, com adição atributo verificação. Você já não tem de colocar-se com as limitações do W3C Validator (nenhum tipo de verificação) e ferramentas como HTML. Também realiza validação acessibilidade (WCAG, US-508), broken link controlo, verificação ortográfica (5 línguas), e leva 32 screenshots usando navegadores em Windows, Linux e OS / X.
URL: https://addons.mozilla.org/pt-BR/firefox/addon/2318

9. CSS Validator: Valida uma página usando o CSS W3C Validator. Adiciona uma opção para o botão direito do mouse e menu de contexto no menu Ferramentas para permitir a fácil validação do CSS da página atual. Abre os resultados em uma nova guia.
URL: https://addons.mozilla.org/en-US/firefox/addon/2289

10. Window Resizer: A janela do navegador Resizer é útil para testar diferentes tamanhos de ecrã. Apoia a 640 × 480, 800 × 600, 1024 × 768, 1280 × 800, 1280 × 1024, 1600 × 1200 resoluções. Apoia a 640 × 480, 800 × 600, 1024 × 768, 1280 × 800, 1280 × 1024, 1600 × 1200 resoluções.
URL: https://addons.mozilla.org/en-US/firefox/addon/1985

SUGADO, EXTRAVIADO de LERIADO