Como eu começo com o HTML5? [fechadas]

Se eu fosse iniciar um novo projeto HTML5 do zero agora provavelmente faria algo assim:

Faça o download e use o Boilerplate HTML5 . Isso lhe dará uma nova página com a maioria das coisas importantes inicializadas e prontas para teste. Também inclui alguns bons recursos de depuração que você deve usar junto com o firebug

Procure Mergulhe no HTML5 para ver o histórico e o uso do código.

No meu mac eu uso o Coda, e no trabalho eu uso o Dreamweaver no modo de exibição de código. Eles não vão construir a página para você, mas o preenchimento de código, a insinuação e o código de cores funcionam bem. Tenho certeza que o Aptana e similares oferecem ótimos recursos, mas eu sempre achei mais simples ser melhor quando se trata de html.

Defina os HTML5 e CSS3 book s de "A Book Apart" (CSS3 sai no final deste mês)

E finalmente - para tentar descobrir tudo isso, confira:

Opera Developer Network - link

Folha de dicas sobre tela - link

Como desenhar com HTML5 Canvas link

O HTML5 não é uma coisa única integrada. É uma coleção de extensões para HTML, algumas das quais são amplamente implementadas e podem ser usadas com segurança, algumas das quais ninguém implementa ainda e muito no meio. Se você tentar tratar o HTML5 como uma única plataforma de desenvolvimento coerente e "aprender tudo", terá um tempo realmente difícil.

Em vez disso, o que você precisa aprender é a Web como um todo: HTML básico, CSS, JavaScript, o DOM principal, o DOM HTML, o modelo básico de objetos do navegador. Então você pode adicionar recursos da Nova Web como e onde você precisa deles, e o suporte ao navegador permite: extensões HTML5, propriedades CSS3, desenho de tela, websockets, as outras extensões DOM e BOM desmembradas do trabalho HTML5 ...

O conjunto de recursos da Web está em constante evolução e não há um único ponto de referência. W3Schools (que é nada para fazer com o W3C incidentalmente) tenta, mas é cheio de erros. Não confie no que diz como evangelho.

Talvez seja necessário consultar o HTML4 definitivo, CSS2 . Núcleo DOM e HTML DOM especificações para ter certeza. Você provavelmente também desejará consultar a referência DOM do MDC e Referência DOM do MSDN para o que o Firefox e o IE suportam. A especificação HTML5 contém muito mais coisas DOM atualizadas, bem como as novas Extensões HTML, mas é um documento longo e pesado, muito difícil de usar, mesmo pelos padrões de documentos de padrões. Embora não seja tão ruim quanto a impenetrável especificação ECMAScript . (Felizmente você provavelmente já estará familiarizado com isso se estiver acostumado a trabalhar com o ActionScript.)

Você não precisa de um SDK ou IDE para desenvolver HTML / CSS / JS. Você pode usar um IDE se quiser, mas estou feliz em fazer tudo no meu editor de texto favorito. Não há etapas de compilação / compilação para se preocupar, basta salvar seu arquivo e clicar em recarregar, trabalho concluído. A maioria dos navegadores modernos tem um depurador e outras ferramentas de desenvolvimento incorporadas (por exemplo, IE8) ou prontamente disponíveis como extensões (por exemplo, Firebug ).

Eu recomendo altamente WebStorm , da JetBrains (ou qualquer um de seus Produtos baseados em IntelliJ , como PHPStorm, RubyMine, PyCharm, como todos eles suportam HTML). Você obtém CSS, preenchimento automático de HTML e ao vivo (enquanto digita) para verificação de correção. Suporte a refatoração para JavaScript (algo que eu não vi em nenhum outro lugar), e até mesmo a capacidade de depurar Javascript no IDE (se o Firebug ou as ferramentas do Chrome Developer estiverem faltando para você). Tem suporte a projetos, bem como suporte a SVN, Git, Perforce e CVS. E uma tonelada de outros recursos, altamente recomendados ...

Várias ferramentas valiosas

• FireBug - plugin de desenvolvedor para o Firefox. Permite depurar JS, HTML, Styles.
• Barra de ferramentas do IE Developer for older versões do IE (6,7). Não há muito HTML5 lá Apesar. O novo IE tem a ferramenta F12.
• O Chrome tem suas ferramentas de desenvolvedor

Essas ferramentas são principalmente para depuração de Javascript e para descobrir coisas sobre posicionamento de elementos e estilos CSS aplicados.

Se você está procurando por uma recomendação do IDE, o Eclipse é muito bom. Se você está procurando por ferramentas Javascript, o Firebug é ótimo para depuração.

No entanto, você realmente não precisa de nenhuma "ferramenta". Eu acho que a noção de que "projetos maiores não podem ser / não são desenvolvidos no Bloco de Notas" é, simplesmente, falsa. Eu uso o Notepad ++ para escrever todo o meu HTML / CSS / Javascript e acho que esta é uma abordagem muito comum - mesmo para web designers profissionais. O Notepad ++ possui realce de sintaxe para HTML, CSS e Javascript, além de preenchimento automático. Se você quiser um software que oferece mais do que isso, especifique quais recursos são importantes para você. (BTW, se você é um usuário do mac, tente o BBEdit).

Sites maiores geralmente são escritos com frameworks como Django ou Ruby on Rails, mas isso realmente não tem nada a ver com o uso ou aprendizado de HTML5.

Acredito que a Adobe (os criadores do Flash) estão realmente lançando uma ferramenta de conversão Flash para HTML5, que pode valer a pena pesquisar.

link

Efetivamente, o Flash se torna uma ferramenta para o desenvolvimento de HTML5.

E a partir desta semana, a Microsoft anunciou que está indo em uma direção similar com o Silverlight, então parece que tudo está indo para o HTML5 agora.

A única pergunta que tenho é quão bom o código HTML5 gerado por essas duas ferramentas será? Não saberemos a resposta para isso até que sejam liberados, mas nunca achei que o código gerado tenha uma qualidade particularmente boa. Espero que não acabemos com o equivalente moderno do MS Front Page.

Eu recomendo strongmente a criação de um sistema de compilação para o seu código Javascript, e checá-lo contra JSLint em cada compilação. Descobri que isso acarreta muitos erros desde o início e promove uma boa codificação (brinque com as opções se ela for muito rígida). Veja o sistema de compilação do jQuery em GitHub como um bom exemplo.

Além disso, para edição, eu sou um grande fã do Notepad ++, já que eu ainda não encontrei um IDE que forneça recursos úteis sem uma grande quantidade de truques de inchaço e GUI.

Você pode ver o mais recente Dreamweaver, o editor de código não é ruim e eles têm uma galeria de widgets com um número de HTML5 widgets você pode simplesmente aparecer.

I don't believe that bigger projects can be/are developed in Notepad

Você estaria errado lá. Sou um usuário de longa data do Notepad e acho que é o melhor caminho a percorrer. Para depuração, eu uso as Ferramentas de Desenvolvedor do IE, o FireBug do Firefox e o Inspetor do Chrome.

No que diz respeito ao HTML5, é basicamente apenas um HTML normal com alguns brinquedos extras. Além disso, não há nada que impeça você de declarar um documento em HTML5, usando apenas coisas que estão em versões mais antigas do HTML.

Uma coisa que eu recomendaria evitar a todo custo são programas como o Dreamweaver. Eles fazem as coisas parecerem fáceis com as ferramentas de design gráfico, mas quando você quer fazer suas próprias coisas, fica muito difícil. (estou olhando para os outros alunos no curso que estou fazendo quando digo isso)