W3CSS

Como estilizar o ALT com CSS

2009-04-21T21:51:00.000-03:00

O atributo ALT é usado para oferecer um texto descritivo à alguns elementos do HTML, sendo o mais famoso a tag <img>. Essa semana descobri que é possível estilizar esse atributo, e não precisa usar javascript.

Lembrando que o alt só aparecerá caso ocorra algum erro no carregamento das imagens. :)

CSS

img {
color: red;
text-decoration: underline;
}

Simples e fácil. :)

Como resolver problemas com caracteres

2009-04-13T10:30:00.002-03:00

Algumas páginas apresentam problemas com os caracteres, principalmente os acentuados. As vezes aparecem simbolos estranhos, outras vezes surgem pontos de interrogação (?). Hoje vou dar uma dica para resolver esses problemas.

O que é isso?

Existe diversos padrões para representar as letras do alfabeto, os números e outros caracteres especiais. Alguns suportam os caracteres mais usados em certos idiomas como o ISO-8859-1 para os latinos, o ISO-8859-7 que é para os Gregos e o UTF-8 que suporta vários caracteres de vários idiomas.

O problema.

Os caracteres estranhos surgem quando há uma diferença entre os caracteres declarados na página e no servidor. Normalmente os servidores (onde hospedamos nossas páginas) usam o padrão UTF-8 e se usarmos um padrão diferente desse pode ocorrer algum problema.

Como declarar os caracteres no HTML 4.01

É simples, dentro do <head> adicione a seguinte meta tag:
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
No XHTML é só por uma / no final da tag.
Para saber mais:

Internet Explorer 8: Versão Final

2009-04-02T10:00:00.003-03:00

A Microsoft anunciou no dia 19/03 a versão final do Internet Explorer 8, que já estava em beta há um bom tempo. Resolvi testar como anda esse novo browser, e essas são as minhas primeiras impressões:

Abas coloridas

As "guias", que são as abas do IE8, podem ser agrupadas por grupo. Guias de um mesmo site ficam com a mesma cor, facilitando a navegação. O Firefox podia imitar isso, será que existe alguma extensão com essa funcionalidade? :) UPDATE: o RobsonB indicou o ColorfulTabs, não é tão bom quanto a funcionalidade do IE8 mas quebra o galho.

O ponto negativo das guias são a demora para abrir, elas demoram alguns segundos a mais que em outros navegadores para serem abertas. :(

Aceleradores

Aceleradores é uma ferramenta que pode acelerar a sua vida na Web. Selecione um texto em alguma página e aparecerá um icone azul. Ao clicar nele, aparecerá uma série de opções como pesquisar no Google, enviar pelo e-mail, etc. :)

Web Slice

Parece-se com um feed de uma parte da página. Em sites que oferecem essa opção, aparecerá um icone verde que permite adicionar certas partes do site ao favoritos do IE8, e toda vez que aquele web slice for atualizado você saberá. Ainda não sei como adicionar essa funcionalidade em sites desenvolvidos por mim e não achei uma funcionalidade tão interessante. :(

Desenvolvimento Web

Na parte dos developers, o IE 8 melhorou em relação ao IE7 e IE6. Ele passa no Acid Test 2 mas só consegue tirar 20 (o máximo é 100) no Acid3. O unico nota 100 no Acid 3 é o Opera 10. :(

Outras

Outras funcionalidades que vem no IE8 é o novo modo ~~porno~~ InPrivate, que o Chrome já tinha; sugestões de pesquisas,filtros de segurança, que também não é nada original, entre uma série de outros recursos.

Conclusão

O IE8 melhorou muito em relação aos seus antecessores, e tem até recursos legais que mereciam ser copiados por outros browsers (como as guias coloridas). Apesar disso prefiro o meu Firefox. :-D

2 Anos de W3CSS

2009-03-31T10:00:00.001-03:00

Olá pessoal.

O W3CSS completa mais um ano, cheio de assuntos relacionados a desenvolvimento web. Os melhores artigos que apareceram por aqui esse ano trataram de hacks para blogger, vídeos sobre desenvolvimento web e sobre TI, um pouco sobre o CSS3 e até iniciei no PHP . Espero que possa postar mais e mais coisas interessantes para você, leitor.

Esse ano eu gostaria de agradecer em especial aos leitores Carlos Eduardo, Chris Benseler, Luis Milanese, Álvaro Dyogo, Gustavo Ribeiro, Rodrigo Teixeira e a todos os outros que já passaram por esse humilde blog.

Como escrever fórmulas em HTML

2009-03-04T12:12:00.000-03:00

Não é um recurso muito usado no nosso dia-a-dia mas imagine se você precisa fazer um site com fórmulas, como e=mc2 ou H2O. Escrevendo assim as formulas ficam estranhas e até mesmo incorretas, mas existe uma forma de posicionar os elementos acima ou abaixo do restante do texto.

No HTML existem duas tags especificas para fazer isso e elas são e

A tag serve para colocar um texto sobrescrito. Ele aparece meio caractere acima da linha base, que é como se fosse a linha do caderno por onde se escreve. Exemplo e = m.c²

A tag serve para colocar um texto sobrescrito. Ele aparece meio caractere acima da linha base, que é como se fosse a linha do caderno por onde se escreve. Exemplo H₂O. CO₂.

Esses elementos podem ser estilizados por CSS ou manipulados pelo Javascript, use e abuse da sua imaginação!

Referencia:
W3schools

Como inserir uma página dentro de outra com ajuda do PHP

2009-01-27T22:12:00.003-03:00

Uma duvida de várias desenvolvedores web é como inserir uma página dentro de outra, dando o efeito de um frame. Existe várias maneiras de se fazer isso, e na minha opinião a melhor é através de includes com PHP.

O primeiro passo para fazer isso é instalar o Apache e o PHP.

O PHP, ao contrário do HTML, é uma linguagem sever-side. O servidor é que faz todo o trabalho, enquanto que o cliente (um browser por exemplo) só renderiza o resultado, que são as páginas HTML, Javascript, CSS, imagens, sons, etc. Por esse motivo a instalação do Apache é necessária, porque ele é o servidor que vai transformar todos os comandos em PHP que forem digitados em HTML para que o browser entenda.

Depois de ter o Apache e o PHP funcionando, é hora de começar a brincar!

HTML

 <body>

    <?php include("topo.php") ?>

    <?php include("menu.php") ?>

    <div id="conteudo">

        Conteudo do site

    </div>

    <?php include("rodape.php") ?>

</body>

Nesse exemplo de código foram incluídas 3 páginas dentro de uma só. É como usar 3 <IFRAMES> dentro de uma página, mas com a vantagem de fazer isso sem que o usuário perceba.

O código que fez essa "mágica" é o include do PHP. Funciona assim:

<?php - Indica aonde começa uma tag php.
include() - É o comando que será utilizado.
"nomedapagina.php" - É a página que vai ser incluida.
?> - fim da tag php

É importante criar as páginas "topo.php", "menu.php", "rodape.php" e todas as outras que vão ser incluídas. Nessas páginas é só usar o trecho do HTML que você quer que elas usem. Por exemplo o "menu.php"

HTML - menu.php

 <div id="menu">

<ul>

    <li><a href="#">Link 1</a></li>

    <li><a href="#">Link 2</a></li>

    <li><a href="#">Link 3</a></li>

    <li><a href="#">Link 4</a></li>

</div>

Não é necessário colocar toda aquela sequência HTML > HEAD > BODY nas páginas que serão incluídas, só é necessário o código HTML que realmente vai ser usado.

Quando um visitante vê uma página que o PHP foi usado, ele nem percebe pois o servidor (no nosso caso o Apache) transforma o código PHP em HTML.

@Em especial para o leitor Carlos Eduardo.

Como usar o

2009-01-07T15:11:00.001-03:00

No HTML, existe 3 tipos de lista, cada uma com uma com suas tags especificas:

Listas ordenadas - com as tags <ol> e <li>.
Listas não ordenadas - com as tags <ul> e <li>.
Listas de definições - com as tags <dl>, <dt> e <dd>.

Hoje vou escrever um pouco sobre essa ultima, e pouca usada: Lista de definições.
Essas listas servem para explicar alguns termos, alguns nomes, ou até pra criar um FAQ.

HTML

<dl>

<dt>Termo 1</dt>

<dd>Explicação do termo 1.</dd>

<dt>Termo 2</dt>

<dd>Explicação do termo 2.</dd>

</dl>

Com criatividade e um pouco de CSS dá para criar efeitos legais.
Até a próxima.

HTML Semântico: STRONG e EM

2009-01-02T16:01:00.001-03:00

Muitos desenvolvedores Web iniciantes tem uma duvida sobre a utilidade das tags e . Afinal, qual a diferença dessas tags para as já conhecidas e ?

A W3C, diz que as tags e estão depreciadas, ou seja, não devem mais ser usadas em documentos XHTML 1 (no HTML elas ainda são aceitas). A explicação para esse "assassinato" de tags é bem simples e lógica: o HTML não deve conter estilos, somente conteudo. Estilo é com o CSS.

Ai é que entra a dúvida de muitas pessoas: se não deve mais usar o e o , porque usar o e o que são exatamente iguais?

Essas duas tags não são para fazer o texto ficar em negrito ou em itálico. Elas servem para indicar uma parte do texto que deve ser lida de uma forma diferente.

: Indica um texto que deve ser lido com uma voz maior, mais forte (strong em inglês, daí o nome da tag).
: Indica um texto que deve ser lido com ênfase (emphasys em inglês, daí o nome da tag).

Visualmente, as tags são iguais. Os browsers modernos renderizam o dá mesma forma que faz com o , o igual ao . Mas em browsers especiais, que leem a tela para o usuário, o e o são interpretados como texto normal enquanto que o e o alteram os parâmetros da leitura, deixando a voz mais forte ou com ênfase.

Resumindo: Use o ou o para indicar que o texto deve ser lido de uma forma diferente. Se quiser apenas uma parte do texto em negrito ou itálico, use CSS.

Referencias:

Noticias rapidas

2008-12-19T19:18:00.000-03:00

E ai galera, tudo bem?

Tutoriais Ubuntu - Estou começando um novo blog, sobre o Ubuntu. Então se você usa ou pretende usar essa distribuição Linux passe por lá. Divulguem :)

Fim do IE6 - Estou aderindo a campanha do Digital Paper: "Pare o IE6". Apartir de hoje vou usar um script que pede para os 27.18% visitantes que utilizam esse browser préhistorico para atualizarem para o IE7 ou trocar por um outro navegador melhor.

Um pouco de hardware - Para quem pretende comprar um computador ou alguma parte dele nesse fim de ano é bom saber como escolher as melhores peças. Então, conheça um pouco mais da placa de video, e do HD.

Estratégia em tempo real para as férias - Se você procura um bom jogo e não quer gastar nenhum centavo para isso, então você procura o Travian.

Bom final de ano!

Uma breve introdução ao Opacity e ao RGBA

2008-12-08T10:37:00.002-03:00

A propriedade Opacity diz o quanto opaco um elemento é. Ao declarar o valor 1 para a propriedade opacity, siguinifica que o elemento é completamente opaco; o valor 0 siguinifica que ele é totalmente transparente.



div {

background-color: rgb(255,0,0);

opacity: 1;

}

Firefox, Safari e Opera suportam essa propriedade.

A propriedade RGBA permite modificar a opacidade (pelo canal Alpha) junto com o valor da cor.



div {

background-color: rgba(255,0,0,1);

}

A principal diferença entreas duas propriedades é essa:

A propriedade opacity é herdada pelos seus "filhos".
A propriedade RGBA não é herdada.

Exemplo das propriedades Opacity e RGBA. - Adaptado de A brief introduction to Opacity and RGBA.

Os 7 melhores (e mais engraçados) videos sobre TI do Youtube

2008-11-22T16:11:00.001-03:00

Quer aprender como funciona as partes do seu computador e tá sem tempo de ler o manual? Veja os vídeos abaixo e aprenda se divertindo:

Tem algum video sobre informatica que seja interessante e não está nessa lista? Compartilhe nos comentarios. :)

Mais sobre o Gimp

2008-11-12T17:47:00.001-03:00

Há um bom tempo atrás, escrevi uma lista de tutoriais sobre o Gimp, programa open source (código aberto) que concorre com o Photoshop. Pra você que quer se aprofundar nesse ótimo programa, segue uma lista com boas referencias (ps.: estão em inglês):

1000+ Free High Resolution GIMP Brushes
30+ Exceptional GIMP Tutorials and Resources
Documentação oficial

Curso de padrões Web

2008-11-03T20:32:00.000-03:00

Você que ainda não é muito bom em inglês deve aproveitar esse site. Um curso de Web Standards traduzido em português!

Danillo Nunes está traduzindo o Web Standards Curriculum (Curriculo dos Padrões Web ), e até o momento que escrevo esse post já tem dois artigos traduzidos. Os assuntos que serão abordados vão desde a história da internet, HTML, CSS, acessibilidade e muitos outros.

Se você tem um blog ou qualquer outra forma de divulgar esse conteudo, divulgue :)

Link: Curriculo dos Padrões Web
Dica do Revolução Etc

Como criar tabelas semânticas

2008-11-01T13:25:00.000-03:00

Há pouco tempo atrás o Tableless fez um ótimo artigo sobre Como criar tabelas semânticas, seguindo os padrões Web. Faça uma visita aotableless e confira!

Mais sobre tabelas semânticas:
Revolução Etc - Semântica de tabelas

Links #13

2008-10-15T20:33:00.001-03:00

Voltando com a série links, que já estava sumida à um bom tempo.

Enigmas e desafios: Decifra-me e Desafio Hacker
Porque usar o UTF-8? - Um pouco sobre charset e UTF-8
Melhorando seu processo de trabalho - para quem não quer ter dificuldade no futuro.
Mantendo seu código organizado - é melhor para trabalhar em equipe.

Como escrever CSS pensando no futuro

2008-10-07T15:44:00.001-03:00

Você segue várias dicas sobre como escrever o seu CSS para que ele funcione em vários browsers, para que seja o mais leve possivel, e várias outras "regrinhas"?

Conheça mais uma recomendação para evitar problemas no futuro, o CSS modular:

Modular CSS

View SlideShare presentation or Upload your own. (tags: flexible system)

O CSS modular é a técnica de dividir o arquivo CSS de um site em vários outros menores, cada um desses arquivos controlando uma parte do layout. Um para o topo, outro para o menu, um para imprimir, outro pro IE, e assim vai. Todos esses arquivos serão incorporados no CSS principal, através do comando @import. Fica assim:

cssprincipal.css



@import "geral.css";

@import "topo.css";

@import "menu.css";

@import "rodape.css";

Quais as vantagens de usar CSS modular?

Fica mais fácil de achar algumas regras do CSS.
Mais de uma pessoa pode trabalhar nos estilos de um site ao mesmo tempo.
Os arquivos podem ser ligados/desligados caso necessário.
Você pode adicionar/modificar os arquivos CSS sem mexer no CSS principal ou no HTML.

Ou seja, fica muito mais fácil manter o seu CSS, podendo fazer mudanças no futuro sem precisar ficar confuso com isso.

Para saber mais:
CSS modular

Como criar gráficos com CSS

2008-09-29T20:49:00.002-03:00

As propriedades do CSS podem ser usadas para criar gráficos de barra. Essa é uma excelente forma de apresentar informações para os visitantes do site. Confira o exemplo online, antes de começar, para entender melhor.

Primeiro, deve-se criar a DIV que será a porcentagem do gráfico.

HTML


<div class="grafico"><strong style="width: 47%;" class="bar">47%</strong></div>

Agora, partimos para os estilos:

CSS


.grafico { 
position: relative; /* para corrigir problema no IE */
width: 200px;
border: 1px solid #B1D632;
padding: 2px;
}

O CSS acima declara que a largura da DIV grafico deve ser 200px, define 1px de borda, e deixa um pequeno espaço entre a borda da div e a barra de porcentagem.

CSS


.grafico .barra {
display: block;
position: relative;
background: #B1D632;
text-align: center;
color: #333;
height: 2em;
line-height: 2em;
}

.graph .bar span { position: absolute; left: 1em; } /* para corrigir problema no IE */

Agora vem o truque. A "barra" é definida com uma cor de fundo, que tenha bom contraste com o fundo da página. O texto é alinhado no centro da barra.Para mudar a porcentagem, basta modificar o style="width: 88%;" no HTMLA página pronta (com os códigos) está aqui.

Referencias:
CSS for bar graphs

Dúvidas simples no CSS

2008-09-19T19:59:00.000-03:00

Olá pessoal, o post de hoje trago para vocês a resolução de dúvidas simples, que são frequentemente perguntadas em diversos foruns e listas de discussão na internet.

Problema na inserção de imagem com CSS

Estou tentando colocar uma imagem na minha página. O diretório está assim:
SITE
-- CSS
--- style.css
-- IMAGENS
--- imagem.jpg
-- pag01.html

Estou usando o seguinte código:
body {
background: url(imagens/imagem.jpg) no-repeat;
}

Solução: body {
background: url(../imagens/imagem.jpg) no-repeat;
}

Como tirar o sublinhado dos links quando o ponteiro estiver sobre ele ?

Solução: a:hover {
text-decoration: none;
}

Como alterar o espaço abaixo do H1?

TITULO EM H1
[como modificar esse espaço?]
OUTROS ELEMENTOS

Solução: h1 {
margin-bottom: 10px; /* Onde está 10px é a quantidade de espaço desejado*/
}

Como posicionar uma imagem no topo da página?

Gostaria de colocar uma imagem no topo da página, para servir como banner. Como faço?

Solução: img.topo {
position: absolute;
top: 0;
}
Tags: CSS Imagens

Extensões proprietarias do CSS

2008-09-10T19:45:00.000-03:00

A maioria dos browsers suportam regras CSS personalizadas, que (ainda) não são partes de nenhum padrão da W3C. Esses estilos são normalmente precedidos pelo nome da empresa que desenvolve o browser. A o -moz- fica para a Mozilla (Firefox). A Microsoft usa o -ms- . E o Safari usa o -webkit-, que é o nome do motor de renderização que ele usa.

Os links abaixo são algumas regras de cada browser. Use com moderação. :)

Blog Day 2008: É hoje!

2008-08-31T14:23:00.000-03:00

Hoje, dia 31/08, é comemorado o Blog Day. Dia em que blogueiros do mundo todo postam links para 5 outros blogs, para que seus leitores conheçam novos blogueiros e assuntos diferentes.

Aqui vão os meus escolhidos:

Guanabara.info - Blog sobre tecnologia com um excelente podcast semanal.

QueroTerUmBlog.com - Dicas fantásticas sobre blogs e blogosfera.

Let's blogar - Posts curtos e rápidos, levando o leitor direto a informação.

Blogwaw - Um wallpaper novo a cada post. Dá vontade de mudar de papel de parede a cada semana!

Papo de homem - Política, esportes, mulheres e muito mais papo de homem.

Tags: Blogday2008

HTTP: Código 404 Not Found

2008-08-26T20:42:00.000-03:00

Este artigo é uma continuação de "Conheça e entenda o HTTP". ;)

Quando um servidor envia uma resposta à um user-agent, ele procura o documento solicitado e envia uma resposta. Nessa mensagem, há os chamadoscódigos de resposta. O código 200 Ok siguinifica que o servidor encontrou o documento solicitado e que não houve problemas.

Já o código 404 Not Found diz ao user-agent que aconteceu um problema: o documento não foi encontrado. Isso pode ter acontecido porque o documento não existe, erro de digitação, ou foi apagado.

Geralmente, as páginas de erro 404 são péssimas para o usuário que está acessando o site. Ele não encontra a informação que estão procurando e acaba saindo do site.

Para contornar isso, faça páginas de erro 404 criativas. Use links para a página incial, contato e para outras páginas importantes. Além de uma caixa de busca, para o leitor encontrar a página que procura.

Para criar páginas de erro no Apache, basta modificar o arquivo .htacess . Insira a seguinte linha:

ErrorDocument 404 /erros/404.html

E não se esqueça de criar uma pasta "erros" com o documento "404.html" dentro dela.

Precisa de inspiração para criar páginas de erro 404? Procure nesses sites:
50 exemplos de páginas de erro 404

Até a próxima!

Conheça e entenda o HTTP

2008-08-24T11:12:00.006-03:00

Segundo a Wikipédia:

HTTP (acrônimo para Hypertext Transfer Protocol, que significa Protocolo de Transferência de Hipertexto) é um protocolo de comunicação (na camada de aplicação segundo o Modelo OSI) utilizado para transferir dados por intranets e pela World Wide Web.

Simplificando, o HTTP é um conjunto de regras para as comunicações realizadas por user-agents (robôs de busca, browsers) em servidores Web. Neste artigo e nos próximos, vou explicar um pouco mais sobre esse protocolo e como um site chega ao monitor do usuário.

Diálogo por HTTP

Quando um site é acessado, o user-agent (o Firefox, por exemplo), pede (faz uma requisição) de algum arquivo em um servidor web (o servidor em que o site está hospedado).

O user-agent faz uma requisição assim:

GET /apps HTTP/1.1
Host: www.google.com
User-Agent: Mozilla/5.0 (X11; U; Linux i686; pt-PT; rv:1.9.0.1) Gecko/2008072820 Firefox/3.0.1
Accept: text/xml,application/xml,application/xhtml+xml,text/html;q=0.9,text/plain;q=0.8,image/png,*/*;q=0.5

O GET diz ao servidor web que o user-agent quer "pegar" o diretório "/apps". Esse diretório (pasta) está no host www.google.com
Na terceira linha, o user-agent se apresenta, diz o seu nome (Firefox/3.0.1), o mecanismo de layout (Gecko), onde está instalado
(Linux), entre outras informações. A quarta linha é aonde o user-agent diz os tipos de arquivo que quer receber.

O servidor web recebe a mensagem, e se tudo estiver certo, entrega os documentos pedidos e responde assim:


HTTP/1.x 200 OK
Date: Mon, 12 Dec 2005 04:15:03 GMT
Server: Apache/1.3.33 (Unix) DAV/1.0.3 mod_fastcgi/2.4.2 mod_gzip/1.3.26.1a PHP/4.3.10 mod_ssl/2.8.22 OpenSSL/0.9.7e
Content-Type: text/html; charset=UTF-8

O código 200 OK siguinifica que os documentos pedidos foram encontrados no diretório e serão enviados. Existe diversos outros códigos
desse tipo que serão estudados mais afrente aqui no blog. Na segunda linha está a data da resposta, e na terceira ele se apresenta.
A quarta linha informa o tipo de documento que vão ser enviados e o charset deles.

Caso queira se aprofundar no estudo do HTTP, e ver essas conversas entre o user-agent e o servidor web ao vivo, use a extensão
para o firefox Live HTTP Headers. No próximos artigo, um pouco mais sobre os códigos de resposta 404.

Referencias:

Maujor em Podcast

2008-07-30T00:20:00.000-03:00

O Maujor, referencia em CSS no Brasil, foi entrevistado no Podcast Grife e falou um pouco de como começou o seu interesse por CSS e Web Standards, além de contar algumas novidades sobre o CSS 3.
O Podcast tem 32 minutos e você pode baixa-lo no site da GrifeMídia.

3 maneiras diferentes de buscar imagens na Web

2008-07-24T23:13:00.000-03:00

Conheça formas diferentes de achar imagens na Web.

Retirada do Flickr

Já imaginou se ao contrário de usar palavras-chave ou tags, você pudesse procurar a imagem pela sua cor? Ou então em um ambiente 3D?

1- Multicolr Search Lab

Escolha as cores predominantes e pronto, o site busca em mais de 3 milhões de imagens do Flickr e mostra miniaturas das fotos. Você pode escolher entre 1 e 10 cores em cada pesquisa. Bem interessante para quem precisa de imagens que combinem com alguma cor especifica.

2- Tag Galaxy

Veja as fotos em forma de planetas!
Digite uma tag e surgirão diversos planetas orbitando um planeta principal (que será a tag que você digitou). Clique no planeta principal para ver as imagens ou então explore os outros planetas para encontrar mais fotos.

3- Open Clip Art Library

Ferramenta para busca e compartilhamento de desenhos no estilo clip art.

Saiba mais sobre imagens:
31 Sites onde achar imagens para o seu blog
JPG, GIF e PNG: Qual usar?
CMYK vs. RGB

Desenvolvimento web em video-tutoriais

2008-07-07T15:44:00.001-03:00

Aprenda técnicas HTML + CSS, como menu horizontal, layout fluido entre outras, através de video-tutoriais.

Menu horizontal com CSS
Menu inline
Escrevendo formulários básicos
Layout fixo/fluido de 3 colunas
Como aumentar a efetividade usando macros
Centralizando o layout horizontalmente
A propriedade float do css
Design Coding - Musica engraçada, que dá umas dicas de SEO e desenvolvimento web.

Até a próxima =)

W3CSS

Como estilizar o ALT com CSS

Como resolver problemas com caracteres

O que é isso?

O problema.

Como declarar os caracteres no HTML 4.01

Internet Explorer 8: Versão Final

Abas coloridas

Aceleradores

Web Slice

Desenvolvimento Web

Outras

Conclusão

2 Anos de W3CSS

Como escrever fórmulas em HTML

<SUP>

<SUB>

Como inserir uma página dentro de outra com ajuda do PHP

HTML

HTML - menu.php

Como usar o

HTML

HTML Semântico: STRONG e EM

Noticias rapidas

Uma breve introdução ao Opacity e ao RGBA

Os 7 melhores (e mais engraçados) videos sobre TI do Youtube

Mais sobre o Gimp

Curso de padrões Web

Como criar tabelas semânticas

Links #13

Como escrever CSS pensando no futuro

cssprincipal.css

Quais as vantagens de usar CSS modular?

Como criar gráficos com CSS

Dúvidas simples no CSS

Problema na inserção de imagem com CSS

Como tirar o sublinhado dos links quando o ponteiro estiver sobre ele ?

Como alterar o espaço abaixo do H1?

Como posicionar uma imagem no topo da página?

Extensões proprietarias do CSS

Blog Day 2008: É hoje!

HTTP: Código 404 Not Found

Conheça e entenda o HTTP

Diálogo por HTTP

Referencias:

Maujor em Podcast

3 maneiras diferentes de buscar imagens na Web

Desenvolvimento web em video-tutoriais