Update: Você pode assistir mais video aulas como essa no Campus Online. Vídeos grátis de Tableless e Javascript.
Esse Video Tutorial mostra o processo de aplicação de CSS em cima da estrutura HTML criada no Video Tutorial #8.
UPDATE: Se alguém quiser baixar o vídeo, só clicar nesse link. O arquivo está em formato Rar (rarlab.com).
O vídeo tem uma hora de duração, portanto esteja preparado. Meus comentários não foram muito incisivos porque eu não fiz o audio durante gravação. Tentei ser o mais completo possível, espero que ajude.
Duração: ~1 hora
Tamanho: 60Mb
Formato: SWF
Acesso: Video Tutorial #9
Download: videotutorial9.rar (formato rar)
Por favor, comentem, vai ser bom.
Obs.: O arquivo é grande, mas tem um buffer muito bom, dá para assistir tranqüilamente sem aqueles gaps. Eu acho. 
Se você quiser mais vídeos e em alta-resolução, visite o Campus Online. Lá você vai encontrar vídeos tutoriais de Tableless, Ajax, Javascript e boas práticas de desenvolvimento web.
40 Comentários
40 Comentários
leandro 24/03/2006 às 12:23
aeeee !
Giovani 24/03/2006 às 12:53
Muito bom…parabéns pelo conteúdo!
vcosta 24/03/2006 às 13:05
Não daria para colocar um link para download?
Faz isso no vídeo 8 também seria de muita valia
paulo 24/03/2006 às 16:35
diego bem que você poderia disponibilizar esse videos tambem para download eu não tenho internet em casa ai fica dificiul…
vlw
Cosme 24/03/2006 às 17:24
Bem completinho mesmo. Mais de 1 (uma) hora de vídeo bem explicadinho, ninguém tem desculpa para não aprender tableless, só se tiver preguiça mesmo…
Jayme Ayres 24/03/2006 às 17:29
Não tem como disponilbilizar prá baixar? Este e o outro…
Junio Vitorino 24/03/2006 às 18:43
Nossa ta massa, não deu para eu ver tudo porque estou no serviço, mas pelo que vi acho que vou reformular o meu jeito de fazer websites! :d
Obs.: É o Diego não tem como nos deixar baixar o swf?
Daniel Gianni 24/03/2006 às 20:21
Diego, porque não utiliza a extensão TAB IE, fica mais fácil alternar entre o IE e o Firefox, só clicar no canto do firefox (tem outros atalhos) que ele renderiza pelo engine do IE dentro do firefox (outra aba ou na mesma).
https://addons.mozilla.org/extensions/moreinfo.php?id=1419&application=firefox
Julian 24/03/2006 às 22:27
nussa
bem loco
nao pude ver tudo pq eu tava no serviço tb
e eu tb gostaria muito se esse e o outro pudessem ser baixados
Dot•Zero 24/03/2006 às 23:35
Realmente, baixar o conteúdo é muito útil pra quem quer ter trechos do tutorial como referencia mesmo qndo limpou o cache do navegador.
Está de parabéns pela escolha da ferramenta de design (Illustrator) e pelo tutorial.
Abraço.
Diogo 25/03/2006 às 02:38
Quem disse q não dá pra baixar?
Claudio 25/03/2006 às 12:44
Diego, bom dia, teria como disponibilizar este video-tutorial para downlaod?
[]’s
Claudio
Diego Eis 26/03/2006 às 04:09
Download do arquivo: videotutorial9.rar. Está em formato RAR.
Maurício 26/03/2006 às 05:25
Diego, não tem relação com o post, eu sei, mas qual plugin, se é que é um plugin, você usa aqui para o Adsense?
vcosta 26/03/2006 às 10:55
Valeu mesmo Diego Eis
…
Benjamin 26/03/2006 às 12:25
Muito bom mesmo esse video tutorial. Completo.
Meio metendo o bedelho, você comenta sobre as fontes serifadas. Para quem não sabe e venha a ler isso, Serifas são os pontas que finalizam os traços das fontes. Como são consideradas mais legíveis do que as sem serifa, são usadas em textos. Fontes sem serifa são mais limpos e usadas mais para títulos.
Gisele 27/03/2006 às 12:23
Pro bem da nação…please continue a fazer esses videos….é uma mão na roda…..
valeuuu mesmoo
renato cruz 27/03/2006 às 15:28
Parabéns pelo conteúdo Diego! É sempre bom ver outras técnicas, embora o fundamento seja o mesmo… Posso dizer que aprendi algumas coisinhas novas! Muito bom! Gostei!
Michael 27/03/2006 às 18:43
Tá… agora só falta o download do video#8
Marcelo Carvalho 27/03/2006 às 18:49
Putz assisti só um pedaço mais logo de cara aprendi uma coisa, aquele *(asterisco), não sabia que existia isso.
Espero, na verdade acho que é Esperamos, que você faça mais videos tutoriais assim.
to baixando agora pra assistir depois valeu hein Diego, para os iniciantes é ótimo!!
Valdeir [ MAX ] 29/03/2006 às 09:13
Vocês, como sempre, estão de parabéns por estes tutoriais disponibilizados a nós, visitantes, que estão iniciando neste mundo Web Designer e também para aqueles que profissionais e querem melhorar as suas práticas de desenvolvimento …
Continuem assim, pois sua um visitante ativo e pelo que podemos ver, somos milhões de visitantes ativos e diários aqui …
Parabéns …
Elias 29/03/2006 às 18:57
Diego, queria saber se tem como vc disponibilizar as demais videoaulas para download tb . . . pq seria muito bom pra se poder estudar.
vlw.
As videoaulas são muito boas . . .
Leandro S. dos Santos 30/03/2006 às 11:23
Está de parabéns, e continue disponibilizando para download se possível, pois como pode ver é da vontade de praticamente todos que comentaram.
PS: Só não entendi porque usou imagem para fazer a separação (num efeito tipo degradê como você mesmo descreveu) dos destaques, alegando que ainda não consegue fazer isso com CSS (de uma forma direta não mesmo), por outro lado usou a técnica das cores das bordas (direita de um link e esquerda de outro link) para conseguir praticamente o mesmo efeito na separação dos itens do menu.
Se possível poderia me esclarecer isso?
Estou apenas começando no CSS, então posso estar falando uma besteira das grandes.
Agradeço desde já.
Felipe Sacchs Viscovo 05/04/2006 às 10:24
Parabéns Diego por abrir mão de algumas madrugadas e repartir teu conhecimento conosco.
O tutorial está muito bom, fiquei feliz em vê-lo, pois aprendi alguns macetes e percebi que eu estou no caminho certo.
Num futuro tutorial poderia ser mais direto e mostrar algumas abreviações nos css ok.
Parabéns mais uma vez e VIVA TABLELESS rs….
Carlos Henrique Schmitt 07/04/2006 às 16:59
Muito legal !! tenho acompanhado todos os videos do Tableless.. e adoro!
Sabe o que seria legal também?
Colocar uma série de dicas de facilidades tanto de softwares e artemanhas..
Por exemplo, com os video-tutoriais aprendi a usar o notepad++, baixei uma ou duas extensões super uteis do firefox..
coisas assim… vlw galera..
abraços e continuem com o bom trabalho!
estao de parabens!
Erick Viana Leão 13/06/2006 às 12:13
QUal é a quela estenção que vc usa para medir no ff? que fica no canto inferior esquerdo ?
corporacao Web » Nova Comunidade! 14/02/2007 às 17:32
[...] a facilidade de utilização dos padrões com alguns de seus videos de implementação de layout e criações de CSS. O pessoal de lá criou uma espécie de comunidade que vai reunir varios blogs e sites que falam [...]
Magus 09/03/2007 às 01:16
a extensão do firefox que mede é a MeasureIt
valeu pelo vídeo, ja estou baixando!
André - MaNcHa 28/08/2007 às 17:35
Diego, baixei o arquivo e ele deu erro ao abrir, pode verificar se está com algum problema, assisti o video por aqui mas gostaria de ter o video em ksa pra estudar com mais calma!
No aguardo, André.
henrique 04/09/2007 às 11:56
uia que da hora
Marcelo 19/12/2007 às 10:26
Parabéns pelo video, não tinha visto ainda nada igual!
Bruno 19/12/2007 às 14:43
Muito boa tua iniciativa, esse é o espírito, ou seja, compartilhar o conhecimento né, assim como eu faço nos meus blogs (xtremedl.blogspot.com e o mais recente blogv8.blogspot.com)!
Mas, faltou só o link para baixar as imagens que compõem a página da home page!
André 07/01/2008 às 12:27
Parabens Diego, o seu site esta muito bom. Eu fique dois meses sem acessar devido ao trabalho e quando voiltei fiquei muito surpreso.
Narley Fabricio 24/01/2008 às 19:35
Muito bom….!!!
Parabéns….
Valeus….!!!
» Tableless, o termo maldito ? | Igor Escobar // Blog | Desenvolvimento, Tecnologia e Informação, na ponta do lápis. 25/02/2008 às 15:34
[...] Video tutorial #9: Implementando a home de um site tableless [...]
Marlon 22/04/2008 às 13:37
Estou muito interessado no em baixar o projeto feito, o arquivo css e a imagem do indesigner …
Ei sua video aula é 10. Estou iniciando no ramo agora e eu já tinha muita dificuldade mesmo com tabelas mas agora com tableless e as suas videos aulas, estou mais seguro do quero fazer.
Giovanni 25/04/2008 às 15:23
otimo conteudo mano vlw mesmo.
estão de parabens!
Romário 23/07/2008 às 23:44
o vídeo ficou legal, o ruim foi o audio por que vc não gravou ele junto com o vídeo, daí ficou aquele silêncio.
mais fora isso ficou da hora!
e ainda grátis
estou começando com Design e agora com a sua vídeo aula ta ajudando muito, vou dar uma estudada
Párabéns!
Vídeos tutoriais de Webdesign | Tecnologia da Informação - Desenvolvimento e Educação 17/08/2008 às 17:58
[...] alguns vídeos tutoriais, desta vez de webdesign. Veja a lista: 1. CSS 2. CSS Hacks 3. Transformação de leiaute fixo em fluido. 4. Leiaute de três colunas 5. Estrutura [...]
thiago 10/04/2009 às 22:56
cara vc pode me da uma explicada melhor porque num faco a menor ideia de onde comeca meu programa se vc (diego) ou alguem daqui pode me da uma ajuda eu agradeco muito me add no msn quem pode me ajuda nunca tive bateu na minha cabeca em fase aula num entendo nada vi seu video e fiquei impresionado me add no msn thiagou1949@hotmail.com ta ae me ajuda ae por favor cara vlw ae…