por Diego Eis
Março 16th, 2006
Quando eu estava criando o site da Visie, aproveitei para gravar um video para depois compartilhar com vocês. O Video está sem audio porque eu fiz tarde da noite e a minha verborragia poderia acordar alguém. Se eu aplicasse a narração depois, talvez correria o risco de sair muito artificial. Por isso, o video não tem audio, mas tem umas legendas que explicam o que eu estou fazendo. De qualquer forma, acho interessante.
Video Tutorial #8 - Criando a home da Visie - Estrutura XHTML.
Tempo: ~8m
Tamanho: ~23,7 Mb
Formato: SWF
Quando tiver um tempinho, liberarei o video da implementação do CSS. Ainda preciso colocar as legendas, e ele é muito mais longo que o do XHTML, se não me engano tem 1 hora de duração.
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.
Se ainda estiver interessado, leia também:
Este post foi criado
na Quinta-feira, Março 16th, 2006 às 11:54 e está arquivado em Artigos, Geral, Vídeos Tutoriais.
Você pode seguir as atualizações pelo feed: RSS 2.0.
Você pode deixar um comentário, ou deixar um trackback de seu próprio site.
Não consigo abrir o vídeo, fala que o arquivo XML não está disponível para exibição!!! Alguém já conseguiu abrir?
Ótimo tutorial passo-a-passo sobre xhtml, parabéns diego! Fico no aguardo do css, ok!
Abraços.
Diego, Gostaria de saber qual software vc usa para criar essas vídeo-aulas.
Comigo, apesar da demora, abriu normalmente.
Usei o Opera 9 TP2
Excelente! É impressionante como montar um site Tableless é fácil (pelo menos a estrutura XHTML).
Vcs poderiam colocar um tutorial AJAX sobre aquele busca endereço pelo CEP, que tem no form de inscrição da Visie!
Abração!
Vedovelli
ótimo tutorial, agora precisamos ver um para aplicar o css. =)
quero moleza né !
abração tudo de bom
E ae.. achei muito legal esse seu vídeo.
Só 2 perguntas:
1 - existe uma diferença semântica entre usar ID ou CLASS para estilizar um elemento. Há alguma regra?
2 - você poderia passar um tuto como você criou as imagens no Illustrator, seria interessante e também ficaria completo o seu tuto.
Valeu.
Não sei se vocês viram da mesma forma, mas vendo este tutorial só veio à minha cabeça a palavra planejamento.
Está aí, um aspecto que faz um trabalho profissional.
Obrigada pelo tutorial Diego
Gostei muito do tutorial.
Tem link pra download? Feed? Podcast?
Abraços
Outra pergunta, reparei no seu firefox duas extenções que fiquei curioso.
Os dois no canto inferior direito. Uma que mostra os e-mails que vc recebe no gmail, e a outra tem um ícone de macaco.
Você pode dizer quais são?
Atenciosamente,
Boa Diego!!!
Bem vc poderia disponibilizar o video para download.
Abraços
Raphael
o do gmail é - gmail notifier a do macaco é o Grease monkey
O do macaquinho deve ser o tal do GreaseMonkey e o do Gmail, certamente alguma coisa para notificar novos e-mails.
Mas e aquele no canto inferior esquerdo da tela? Não me diga que copia as cores? Se for isso, me diz qual é…. isso deve ser muito util.
Vou esperar anciosamente o video do css.
Tem uma função no editplus que passa textos que estão em caixa alta para apenas o primeiro caracter em caixa alta (de cada palavra), é so selecionar o texto e apertar Ctrl + Shit + U se não me engano.
Abraços.
Mt bom o video, a velocidade que o diego cria a estrutura do site, e tudo semanticamente correcto, o css que aí vem a caminho deve ficarr mt bom mesmo. Vamos esperar, os cursos da Visie devem estar com um bom nível… haa quanto as extensões que o diego está usando, é só ver alguns posts antigos ( não mt antigos ) do tableless.
No IE nao abre o tutorial, eu uso somente o firefox mas to na faculdade e aqui nao da para instalar nada, quando chegar em casa eu olho. =)
Ai tenho uma colaboração ai e acho que seria interessante, tipo eu gostaria muito de fazer o curso de ajax de vocês da Visie so que nunca mechi com javascript, e o javascript que voces tem la e para quem ja tem o basico. Ai vem a sugestao, sera que voces nao abririam um modulo que ia do javascript basico (para quem sabe pouco ou nada como eu!) e ia ate o ultimo modulo do ajax, tipo nas certificacoes macromedia e afins. Eu seria o primeiro aluno de voces. hehehehhe. um abraco ai t+.
e galera to em casa agora e nada de tutorial =(
Gostei bastante do tutorial.
Assim tirei algumas duvidas que tinha com relação a montagem do layout.
Adorei o que li e ouvi no site. Nas dicas.. enfim, me apaixonando novamente.
Sou um novato em tableless.. Preciso, urgentimente reaprender.
Obrigada Cristiano,
Baixei e já estou usando. Falando nisso sou viciada nesses brinquedinhos do Firefox, mas, acho que ocupar este espaço para falar deles, embora seja interessante, é também desviar-se do foco.
É melhor que eu faça o quanto antes o registro no fórum que vocês têm aqui. Por certo já tem alguma coisa a respeito disso por lá.
Obrigada mais uma vez…
O vídeo não funciona no IE mesmo!!!!
Interessante a video aula, mas eu não saquei a semelhançã entre “Novidades” e a frase “Se ficar o bicho pega”. =]
Não consigo abrir o video no IE.
Só faltou um link para download mesmo… o planejamento foi essencial para a concepção e velocidade com a qual foi montada a estrutura, pois desde o Illustrator o site foi minuciosamente planejado.
parabéns pelo excelente trabalho.
Muito bom o video tutorial! Fico no aguardo anciosamente pelo do CSS.
Abraço
show de bola o tutorial , tambem não consegui abrir no Internet explorer a não ser colocando a url inteira do swf como disse o Pedro Rogéiro
Um outro editor muito bom que conheço é o Ultraedit, não comparei ainda com o EditPlus mas é fantástico tambem.
Meu preferido por enquanto , uso a anos
Estou aguardando o video do css
Muito bom o tutorial, show ein…
kra ! show d bola ! acho q vou começar a aprender programar com as video aulas…
sou bem assim, aprendo vendo os outros fazerem
teria como vc passar o video do css?
mesmo sem as legendas…
qualquer coisa >> liandrovsk@hotmail.com
abraços ! parabens !
Teria como vc passar o video do css?
mesmo sem as legendas…
e também gostaria de saber qual software vc usa para criar essas vídeo-aulas.
Att, Alexandre
Consigo abrir o vídeo, mas fica sem som… alguém teve esse problema?
[…] I am using part of my spare time to learn how to develop websites. Luisinho and Marcelo Bello, good friends, are giving some hints.I have started using the Macromedia Dreamwaver to do the basic things, but it is somehow cumbersome, the code it “writes” it is not clean. So I have started to do it the hard way. Typing the code, as suggested by Diego Eis on his blog tableless. It has been a great experience, sort of learning by doing.Marcelo Bello gave the hint to use RoR (Ruby on Rails) but I think I am not there yet. When I feel I am ready I will jump into it. […]
[…] Esse Video Tutorial mostra o processo de aplicação de CSS em cima da estrutura HTML criada no Video Tutorial #8. […]
ola. eu nao consigo ver o video.
eu clico para ve-lo e só aparece uma tela em branco. nao aparece mais nada. eu espero um tempo, mas continua sempre a mesma coisa.
estou louco para ver o video
aguardo resposta,
Rafael
Poxa…muito bom os seus trabalhos aki no site. Você está de parabéns. Vou já ver a vídeo aula 9. Abraço!
Bom dia Diego, estou aqui mas uma vez para pedir(importunar mesmo) o download deste tutorial.
[]’s
Claudio
Muito bom o a video aula, vai me ajuda muita a estruturar meus códigos
O software é o Cantasia 3.0 .
muitp bom mesmo. ae alexandre tem varios softwares para criacao de videos aulas, eu uso o camtasia studio 3, da uma procurada no google.
Faltou mesmo o link pra baixar
Como fazer para assistir o video ? O.o
Nao consegui assistir o video. Qual sera o problema?
soh apareceu um objeto
Abracos…
o tutor deve ser bom pena eu nao estou camsequindo baixa ele ta dano erro !!
mais se alguem suber outros postem ai plz
valew ^^
Tenho interesase no Video tutorial #8, pena que o som e a resolução estão horrível no IE.
Da pra melhorar?
Abraço…
A vídeo aula não está abrindo….
ai vc poderia me arrumar uma video aula sobre html
Legal Diego!!!
Mas vc poderia disponibilizar o video para download.
Abraços
Adonai
Hmm…
seria legal se conseguisse abrir!
Que tal disponibilizar o link pra download? Acho q ficaria mais fácil.
Abs!
Poxa…tava querendo muito ver esse tuto…
((((
O vídeo sumiu!
Poxa, o Video Tutorial #8 - Criando a home da Visie - Estrutura XHTML. não abriu!
Tem como colocar o link para download?
Vlw.
sensacional, baixei o vídeo e estou aprendendo muito com ele, mas será que conseguimor baixar o código fonte tb ? seria melhor pra estudar.
[…] Criando a estrutura XHTML da home da Visie […]
Aqui está acontecendo o mesmo, o vídeo parece não estar mais disponível para visualização…
Já acessei o tutorial anteriormente (muito bom, por sinal) e estava indicando para alguns amigos quando me deparei com tal situação.
Pessoal do Tableless, dêem uma olhada nisso por favor!
Obrigado.
Muito interessante esse vídeo, dá pra rever alguns conceitos que havia esquecido hehehe, grande abraço!
Mto interessante esse modo de ensino sobre HTML+CSS, principalmente para iniciantes, PARABÉNS!
Diego, teria como vc disponibilizar ou encaminhar pro meu email o Video Tutorial #8 - Estrutura Xhtml?
Forte abraço!
Diego eu não consegui ver o video ….
teria como vc me add la no msn pra gente trokar uma idéia???
se poder me add la to precisando mesmo
tiago_14ja@hotmail.com
orte abraço aí !!
haha erro de ortografia éra “Forte abraço” e não “orte abraço” ^^!! mals ai
Aew blz. é so pa dize que não consigo ve esse video não tem joito de vcs me pasarem ele? si tive add aew NasTyGM@hotmail.com
Bom dia !, estou a procura desse materials só que não estou conseguindo baixar, teria como vc fazer o up dele novamente ou enviar para meu email?
fico grato, abraços!
O vídeo 8 não está funcionando, vocês podem disponibilizar um .rsr para download igual fizeram copm o video 9?
Gostaria de saber se algum de vcs montao site em XHTML…..
Estou precisando montar um layout… e gostaria q seje em CSS…
entre em contato comigo porfavor!
e tbm gostaria de saber qnd vcs cobrao!
brigadooo!
[…] Mais 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 de XHTML […]