| Maior acervo de vídeo aulas da web

Eduardo de Matos
5.999 visitas
7 jul 2009
20 Comentários

Não consegue visualizar a vídeo aula?

Transformando PSD para xHTML/CSS – parte 1

Olá Pessoal. Me chamo Eduardo Matos e esta é minha primeira vídeo aula aqui no VAB.

Hoje você aprenderá a primeira parte da transformação de um layout, criado no Photoshop, para xHTML/CSS.
A primeira parte é composta do xHTML, a segunda pelo CSS (e várias dicas do Photoshop).

Bom aprendizado!

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

Comentários

Gláucio Cajuela

Adorei essa vídeo aula , obrigado por compartilhar estou aprendendo muito com vcs …
http://www.videoaulasbrasil.com.br David CHC

Muito boa a video aula Eduardo. Mas pq vc usou a tag de parágrafo para usar no formulário, se existe tag do próprio formulário, como fieldset q fazem a mesma função?

Uma dica interessante, usar classes em elementos q terão a mesma propriedades no css, se quiser personalizar, usar classes múltiplas.
http://tutorial-city.net Tutorial City

@David
Usei a tag de parágrafo por que elementos em linha tem de ter um elemento em bloco o circundando, e se isso não for feito o xHTML não valida.
Fieldset é legal quando se tem um formulário com vários campos e/ou vários assuntos(dados pessoais de interesses por exemplo).

A idéia das classes é correta, já que acaba diminuindo o tamanho do arquivo CSS. Eu sempre crio o xHTML já pensando no CSS, porém geralmente eu esqueço alguma coisa ou coloco alguma coisa a mais, e esse tipo de coisa eu corrigo quando estou criando o CSS.
A parte 2 desse vídeo vem para completar essa primeira.

http://www.videoaulasbrasil.com.br David CHC

@Eduardo, não sei outras pessoas, q modos de ver um formulário pode ser de pessoa para pessoa, uns podem entender com uma certa lista de definição, ou lista não ordenada, etc; Não sei pq, não me agrada muito ver usando uma tag de parágrafo, pq não é um parágrafo. Já vi documentos do W3C utilizam a tag de parágrafo, mas mesmo assim, sabendo q o fieldset é para agrupamentos de elementos com mesmas caracteristicas, acho mais apropriado e semântico. É outra coisa q pode variar, semântica, rs.

Seria interessante, tbm ter colocado um label para input. Mas sei como é, a gente fazendo video aula, sempre esquece alguma coisa, ou não fala pra ficar mais facil o aprendizado das pessoas.

abrs, aguardando a 2ª parte

http://www.webdesigndaniel.com.br Daniel Jhonatan

Fico muito bom, aprendi bastante com essa aula.

Mais eu acho que fica melhor para aprender, pelo menos para mim fazendo igual ao Felipe cardoso.

Ex: Ele digita uma parte do xhtml, e logo depois ela já vai para o css.
Tomer

Vamos utilizar mais um pouquinho de herança e pseudo-classes né? =P O negoço de post-1 ali tbm não ficou legal não… São todos iguais, uma class faria tudo… Abraços
http://tutorial-city.net Tutorial City

@TOMER
Como eu disse em um comentário anterior, o xHTML não está necessariamente 100%, quando vou para o CSS eu adiciono ou retiro um monte de coisas afim de fazer uma melhor integração. É bom lembrar que eu fiz essa página aí de primeira, eu não deixei prontinho ou pensei antes como eu poderia fazer, então é normal esses pequenos ‘erros’. E também é bom assim porque os usuários veem o autor debugar o codigo, o que é de grande valia.

@DANIEL JHONATAN
Faço o HTML separado do CSS justamente porque cada um tem o seu proósito, que por sinal são muito diferentes. A parte de CSS vem no próximo vídeo.
Gláucio cajuela

amigo Eduardo Matos gostaria de pedir uma gentileza sua , falar um pouquinho mais alto nas vídeo aulas pois o audio dessa vídeo aula estava muito baixo , obrigado pela atenção seus tutoriais são nota 10.
Carlos

bom dia , tem que como vc falar um poko mais auto num da pra ouvir nada
amanda souza

não consegui entender nada o som muito baixo
http://tutorial-city.net Tutorial City

@Amanda, Carlos, Gláucio
Eu uso um Headset e consigo ouvir numa boa. Cheque se o áudio do sistema está no máximo. De qualquer maneira no próxima vídeo vou tomar o cuidado de falar mais alto.

Abraços e obrigado pelo feedback.
http://www.webinsw.com.br André Silva

@TutorialCity, você salva os vídeo em qual formato? Porque eu uso o .avi e não consigo upar no Vimeo. Abraços.
http://www.blackfullhott.comoj.com Rangel

Aqui ta de boa o SOM….:)

valeu…muito boa aula.

abss.
http://www.pipocascleber.com/pipoca.php jeferson

Oi Eduardo!!!

Estamos esperando a segunda video aula……..rss

Tutorial bacana!
http://www.sintcorp.com.br Andre Figueiredo

Seria ideal poder baixar os video aula, assim poderia assistir no Celular quando estivesse no transito.
http://www.johnwebdesign.com Jonathan Silva

Não consegui ver nenhum dos 3 vídeos.
Obs.: O flash player e shockwave estão atualizados.
Obs².: Já assistir a outros vídeos dete site.

http://www.videoaulasbrasil.com.br David CHC

@Jonathan Silva, tente limpar o cache do seu navegador. Se vc estiver usando Internet Explorer basta vc apertar CTRL + F5, caso esteja usando o Firefox, vá em Ferramentas > Opções > Avançado. Escolha a Aba Rede, clique em Limpar agora. Veja se isso resolve.

Junio Martins

Muito boa a video aula. Super explicativa,

mas pode me dizer como colocou o editor do aptana com essa interface? (background cinza, e letras em destaque..)

acho muito mais facil para editar…

se poder me da essa dica…

vlw..
http://danielfarias.net Daniel Farias

Ótima video-aula. Só o som que está meio baixo, fora isso, nota 10.
Robson

olá amigo, estou há muito tempo procurando por uma vídeo aula dessas, oconteúdo é bom pena que não conseguir ouvir nada, se vc puder melhorar o áudio, os visitantes da sua vídeo aula agradecem.