| Maior acervo de vídeo aulas da web

André Buzzo (Tuco)
2.188 visitas
29 jun 2010
20 Comentários

Não consegue visualizar a vídeo aula?

CSS + XHTML 1.0 STRICT + VALIDAÇÃO

Fala Pessoas! Nesta vídeo-aula, falarei um pouco sobre XHTML 1.0 Strict, assim como ensinarei a estruturação em CSS do layout, utilizando um arquivo criado no Fireworks. Darei uns toques também sobre como testar a validação localmente, utilizando o próprio Dreamweaver para tal. Na próxima aula, ensinarei a configurar, via CSS, um cabeçalho, textos, imagens e como inserir um vídeo em flash seguindo os padrões Web para o mesmo! Espero que gostem! Abraços e até a próxima!

Você gostou dessa Vídeo Aula, então compartilhe com seus amigos

Comentários

João vitor p. sousa

Sencacional, simples e perfeito , adorei cara, aguardo as proximas
Tuco

Fala João!

Que bom que gostou! Vou ver se vai dar tempo, mas se der, eu vou montar o mesmo site, numa 4º vídeo aula quem sabe, totalmente em tabelas…como normalmente a turma costuma fazer, e fazer um comparativo entre eles…vc vai ver a economia de código no final..rs

Abraços e obrigado!
Sergio Araujo

Fala André blz…

Excelente sua video aula, realmente eu tbem queria muito ver uma video aula dessa, pois vc acabou de sanar algumas dasminhas dúvidas.

1) Agora para fazer tudo isso usando a familia CS4 é igual ou muda algo?

2) Como trabalhar um fundo background para o site ?

3) Se o topo e o rodapé forem imagens como proceder ?

No mais sua didatíca foi excelente parabens, continue nos trazendo conhecimento.

Abraços
Tuco

Fala Sérgio!

Seguinte…eu creio que para trabalhar com o pacote CS4 seja a mesma coisa, afinal de contas, a maior parte da estrutura você poderia fazer no bloco de notas mesmo. Portanto, não é programa, e sim a programação que vai mandar nessa brincadeira. Exceto o lance da validação que o DW faz, que você teria que fazer direto pela web.

Agora, suas demais dúvidas, em como se trabalhar com backgrounds, tanto para o topo quanto para o rodapé, e para o body do site, eu apresento na parte 2 dessa aula pode ser?

Aí eu ensino a estilizar com imagens e tals.

Obrigado pelos comentários, e vâmo-que-vâmo! rs

Abraços!
Marcelo

Olá Tuco, bacana dua vídeo-aula, esta de parabéns.

Só um detalhe que reparei, uma simples observação, mas como existem clientes chatos.. la vai…

No layout que você montou no fireworks, o menu tem a largura menor que a largura total do site, já pelo css você deixou exatamente do mesmo tamanho, acredito que seja 10px menor de cada lado.

Bom é isso.

Grande abraço.
Tuco

Fala Marcelo!

Era pra ver se vcs estavam espertos!! rs…

Seguinte Compadre: aquele “layout” que eu apresento no FW é chamado de Wireframe. Usa-se esse tipo de estrutura para montar-se a estrutura do site. O layout em si, vem depois. Eu vou inserir tudo o que for necessário lá, e acertar a imagem que vamos usar para dar o efeito de “recuado” ao layout!

Boa observação!

Espere pela segunda parte que a gente vai ver como deixá-lo menor lá!

Abraços!

Tuco: “Mais liso que um peixe ensaboado…” kkkk
João vitor p. sousa

@MARCELO eu tb reparei isso mais isso é simples , é só dimiunuir 20px na width e botar a margin lateral de 10px :]
http://www.wellingtonsilva.net Wellington Silva

Cara sua VA esta sensacional, apenas ia dar uma olhada mas não consegui parar de acompanhar.

Parabens e obrigado por compartilhar

Wellington Silva
Marcio Vinicius

Ótima Video Aula Tuco, muito bem elaborada e bem explicada, parabéns. Agora cara, sem querer sem chato nem nada, gostaria de dar apenas uma sugestão, não chega a ser uma critíca ou algo do tipo, é apenas uma sugestão mesmo… Não seria mais viável você mostrar o layout passo a passo em um Navegador ao inves do Dreamweaver? Porque o destino final do site é o navegador, e ele (o site) deve estar acessível para todos os navegadores disponiveis, então creio eu que seria mais interessante ir testando ali, na pratica mesmo… Até porque a galera que tem procurado saber mais de CSS pode não conhecer essa “dica”. Bom, é só isso mesmo.. Bom trabalho pra você e fique com Deus. Irei ver a próxima VA. Abraços
http://tutorial-city.net/ Tutorial City

Eu costumava usar o Doctype xhtml 1.0 strict, mas quando vi que todos os navegadores suportam o padrão de de HTML 5 passei a usa-lo, pois é muito mais simples:

Validar o documento é importante, mas é só 10% do caminho, os outros 90% incluem semântica, organização e usabilidade. Se algum desses tiver de ser sacrificado, que a usabilidade seja a última, por que nada é mais importante do que a experiência do usuário final.

Sua didática é bastante boa, queria muito ter o seu carisma.
Abraços.

Dica: Recuar(indentar) as tags ajuda bastante a manter o documento organizado. Tudo bem que o Dreamweaver não ajuda nisso, mas aí é questão de usar uma IDE que te ajuda de verdade.
Tuco

Fala Wellington!

Valeu pelos elogios! Isso me motiva a criar mais VA e postá-las por aqui!

Obrigado….”Despertar o interesse” é fundamental…rs

Abraços!
Marcelo

@JOÃO: sei como fazer, alias, já trabalho com css a um bom tempo, apenas comentei pq existem clientes chatos que querem exatamente como no layout desenvolvido pelo webdesign, onde nós programdores, nos eh q temos que escutar, mas agradeço sua resposta em tentar ajudar.

Abraço.
Thales Caricati

Parabéns Tuco! Bela vídeo-aula. Só tenho uma crítica a fazer. Pow Tuco, você podia criar mais vídeo-aulas, muito boa sua explicação. Já conheço a programação em CSS mais parei para dar uma olhadinha, pois sua explicação é bem interativa e divertida.

Parabéns novamente!
Tuco

Tales, Tutorial City e Márcio, muitíssimo obrigado!

Espero, na parte 2 dessa aula, superar expectativas e trazer algo com mais qualidade!

Tutorial, não vou assassinar a usabilidade do site. Também costumo observar esse quesito de extrema importância na hora do desenvolvimento.

Obrigado pela dica da “identação” do código. Preciso me policiar mais sobre isso. Eu assisto VA e uso a identação, mas na hora do meu “processo criativo”, fico tão abilolado que nem me lembro disso…rs

Abraços a todos!
http://www.videoaulasbrasil.com.br David CHC

Não podia de deixar meu comentário, rs. Ótima aula @Tuco, sua maneira de abordar os assuntos de maneira leve e dinâmica fica impossivel vc não acompanhar a aula até o final. Parabéns!!
http://www.krcomunicacao.com.br Tuco

Fala David CHC! The Great Master!! kkkk

Valeu pelo comentário meu amigo!!!

Receber comentários é legal…hahahahaha

Abraços e já tô preparando a Parte 2 dessa VA com uns toque “a mais”…rs

Até mais!
Denildo

Tuco parabéns cara faz pouco tempo que comecei a trabalhar com CSS

Sabia fazer essa parte, mas sua aula é 10
Parabéns mesmo um grande incentivo pra quem começou a usar CSS

Não sabia que tinha como validar no Dreamweaver
E seu incentivo (web Design é tentativa e erro!) pow cara você é 10

Ansioso para a parte dois, pois não sei por arquivos Flash em Tablelles
Tuco

Fala @Denildo!

Seguinte compadre!

Muito obrigado pelo comentários, e a parte do flash, eu vou deixar por último blz? É a parte mais chatinha pra se fazer, e pra não ficar muito extensa a VA, eu vou dividí-la em mais 3 partes….

Na segunda, vamos formatar o topo e o menu…na terceira, o conteúdo e na última parte, farei a inserção do flash pra fechar legal a sequencia ok?

Abraços e fica ligado que daqui a pouco tem mais!
Denildo

Beleza grande Tuco.Estou aqui na espera como sempre. Um pouco antes de eu ter visto VA eu estava fazendo um templatezinho em tablelles praticamente a mesma coisa já formatei o topo e menu ficou até legal sim deixo uma dica: Hoje eu já sei como usar gradiente em tablelles mais tem muita gente que não seria legal se você fizesse isso iria ajudar muita gente, beleza to indo nessa e aguardando a segunda parte.
george faria

obgdo pela VA, tenho duvida com relação a validação no DW, teno o CS5 e não esta ativada a validação, aparece apenas a opção settings…, como faço para ativar o validador no DW?