Para construir um site completo, com todos os recursos disponíveis para oferecer aos clientes, um bom desenvolvedor precisa saber todas as funcionalidades da linguagem HTML5 e as outras que formam a base do desenvolvimento web, como o CSS e o JavaScript.

Todas essas linguagens citadas são conhecidas como linguagens de programação client-side ou front-end, ou seja, são aquelas em que apenas o seu navegador vai entender e processar os dados. O HTML, CSS e JavaScript são linguagens client-side.

Já as linguagens de programação server-side ou back-end são as que o servidor - "server" - entende e processa, por isso também o nome "back", que é a programação que está atrás e o cliente não vê. O "front" ou "client" como o nome já diz está na frente, no visual, onde o cliente enxerga.

Alguns exemplos de linguagem server-side são:

  • Java

  • PHP

  • Python

  • C++

  • Ruby

É importante ressaltar que o JavaScript não tem nada a ver com Java, os nomes são parecidos, mas seus objetivos são totalmente diferentes. O JavaScript é uma linguagem de programação client-side usada para controlar o HTML - linguagem de marcação - e o CSS - linguagem de folhas de estilo. 

O HTML fica com a parte estrutural do documento, o CSS é usado para deixar o site mais estilizado, visivelmente bonito e agradável e o JavaScript manipula todo o comportamento da página. Sabe aquele momento em que você está navegando em um site e você passa o mouse no menu e aí aparece um submenu com diversos itens? Quem faz essa funcionalidade, ou seja, o submenu aparecer e funcionar é o JavaScript.

Depois de realizar o curso HTML5 para aprender a estruturar o seu site, não deixe de fazer o Curso Online Web Design para Iniciantes para você se capacitar ainda mais em desenvolvimento web com as linguagens CSS e JavaScript.

Diferente do que muita gente pensa, o JavaScript não foi criado pelo W3C - consórcio que padroniza a linguagem HTML. O criador foi Brendan Eich e o primeiro nome da linguagem era LiveScript, logo depois mudou para JavaScript. 

O JavaScript é uma linguagem mantida pela ECMA - European Computer Manufacturers Association -, onde você encontra a documentação oficial da linguagem. No entanto, os melhores ensinamentos e tutoriais sobre a linguagem são encontrados na web em geral.

JavaScript com HTML5

O desenvolvimento web funciona basicamente em camadas e as principais delas são as três que citamos acima: primeiro o HTML que faz a parte de conteúdo da página, o CSS que pratica a formatação do site e o JavaScript que é o comportamento.

Normalmente o uso do JavaScript fica depois do HTML e CSS, já que ele dá toda a movimentação, todo o tipo de ação para o conteúdo da página. Por isso a linguagem é conhecida como linguagem de comportamento. Ele é a terceira camada de todo esse processo de desenvolvimento.

Vamos agora aprender a integrar os códigos do JavaScript em um documento HTML5. Como todas as linguagens, o JavaScript passou por várias atualizações e evoluções para chegar onde chegou e, por isso hoje está mais fácil aprender uma linguagem do que antigamente.

Basicamente, como o nome da linguagem já diz, o seu principal elemento é o termo "script". Dentro do documento HTML, entre os elementos de abertura e fechamento de "body", você insere o elemento de JavaScript, assim:

HTML5

Viu como é fácil? Realmente as linguagens front-end são mais tranquilas de aprender, você precisa apenas de dedicação e prática. Depois de inserir esses códigos HTML e o "script" do JavaScript no seu bloco de notas, você já terá o seu primeiro código da linguagem no seu documento. 

No momento em que você abrir o documento no seu navegador, o alerta Hello World! já irá aparecer, legal não é mesmo?!

Cursos relacionados que podem te interessar:

Como usar o elemento canvas

Dentre os novos elementos inseridos na versão HTML5, a tag "canvas" sem dúvida é a mais comentada. Os desenvolvedores hoje têm a possibilidade de criar aplicativos web ricos sem precisar instalar plug-ins que antes eram obrigatórios, como o Flash Player da Adobe. 

Mas como usar o elemento e para que ele serve? O "canvas" é uso basicamente para a criação de elementos gráficos ou imagens, o desenvolvedor pode criar elementos gráficos a partir do marcador "canvas" juntamente com o JavaScript.

Entretanto o elemento não fica apenas em gráficos, você também pode criar vários tipos de imagens e efeitos dinâmicos. As possibilidades do elemento "canvas" usando JavaScript são infinitas e os sites criados com essas linguagens e marcadores são realmente impressionantes.

Para quem ainda está iniciando seu aprendizado em HTML5 vai aprender primeiro a construir elementos mais simples, como um quadrado, um círculo e alguns efeitos simplistas. Entretanto, não desanime! A criação de animações interativas básicas também são fáceis de fazer e em poucos dias de estudo já é possível criar algumas delas.

A criação mais complicada é a de animações mais complexas, que dão um pouco mais de trabalho, mas nada que com esforço e estudos você não aprenda! O único defeito do elemento "canvas" é que uma vez desenhada a animação, ela deve permanecer do jeito que foi criada. Caso precise movê-la, será necessário redesenhá-la.

Crie jogos com o canvas

Atualmente, encontramos muitos jogos para smartphones desenvolvidos apenas com as linguagens HTML5 e JavaScript. Pode parecer estranho, mas o uso dessas linguagens para a criação de jogos deve aumentar devido à simplicidade na criação e manutenção desses aplicativos.

É importante ressaltar que esses jogos são feitos em 2D (bidimensionais) e são jogos bem mais simplistas que os em 3D (tridimensionais). Estatisticamente os usuários preferem os jogos em 2D, até porque são mais leves e mais fáceis de jogar.

As empresas desenvolvedoras de jogos estão optando cada vez mais pelo uso do HTML5 e JavaScript por ser uma opção mais fácil de desenvolver e mais barata. Essa possibilidade vem através da tecnologia "canvas" que consegue, juntamente com o JavaScript, criar gráficos e animações para infinitas possibilidades.

E para você desenvolver esses tipos de jogos não é preciso muito, basta ter um editor de texto - como o Notepad ++ - e um navegador que já é o suficiente. Porém, para aprender a criar essas e outras tecnologias, é preciso que você comece agora mesmo o Curso Online Web Design Avançado depois de fazer o curso para iniciantes. Após o curso você estará preparado para desenvolver páginas web e jogos simples para smartphones, legal não é?

Além desses cursos da área de tecnologia e informática, você encontra no nosso portal outros diversos cursos online com certificado para sua formação profissional!

Iframe

tag "iframe" da linguagem HTML5 é uma das mais usadas em sites específicos, pois ela faz com que uma página fique aberta dentro de outra, para a exibição de algum conteúdo externo que o desenvolvedor do site queira mostrar em sua própria página. Como no exemplo a seguir:


Como vemos, a página do Enfoque Capacitação está dentro da própria página do portal. Para funcionar os códigos HTML, como é o caso do "iframe", a página precisa aceitar a linguagem para que todos os elementos funcionem de forma correta.

Nesse "iframe" exemplo que criamos acima, você tem acesso direto - sem sair da págna do nosso artigo - ao portal do aluno, cursos mais acessados etc.

Esse recurso é muito usado para que o cliente possa interagir com o seu próprio site ou com outra página de forma fácil e segura, sem que ele precise sair de onde está. Também é usado como mural de recados, para oferecer outros serviços e produtos, um cadastro, dentre outras possibilidades.

Os principais atributos usados para a criação de um "iframe" são:

  • Src: dentro dessa tag você vai colocar o endereço da URL, do site que será o "iframe";

  • Height: essa será a altura da sua página interna;

  • Width: esse será o comprimento da sua página interna;

  • Frameborder: para escolher se a página interna terá alguma borda ou não. Caso não queira, só colocar o valor "0";

  • Scrolling: para aparecer o controle de rolagem ou não. Se você não deseja que ela seja exibida, coloque "no".

Você deve ter percebido que o idioma das linguagens é todo em inglês. Você não precisa ser um fluente na língua para saber programar, mas é importante ter pelo o menos o inglês básico para não ficar totalmente perdido. Vale lembrar que o inglês é importante não só para os profissionais de TI, mas para qualquer área do conhecimento.

Sabendo dessas exigências do mercado de trabalho, o nosso portal oferece o Curso Online Inglês Básico‍ para o seu aprimoramento básico na língua. Acesse também os outros cursos online oferecidos pela plataforma e seja um profissional completo!

HTML5

Formulários com HTML5

Talvez um dos recursos mais requisitados da linguagem HTML seja o de criação de formulários. Eles são essenciais para qualquer tipo de site, seja ele de vendas de serviços ou produtos, site que quer recolher um cadastro dos visitantes, enviar newsletter aos seus leitores, dentre outros.

Antes, criar um formulário com HTML era um pouco chato e cansativo, só que agora o HTML5 trouxe muitas melhorias. A linguagem possui novos elementos de entrada de formulário e algumas técnicas de CSS3 que deixam o recurso mais agradável e estilizado tanto para quem cria como para os usuários que preenchem.

A principal tag para a criação de formulários é a "form". Dentro desse elemento encontramos alguns atributos, como:

  • Action: endereço para onde os dados do formulários serão enviados;

  • Method: será o método do http em que os dados serão transmitidos;

  • Post: é a informação de que queremos salvar os dados desse formulário em algum local;

  • Get: quando queremos obter alguma informação, como por exemplo um formulário de busca.

O HTML5 também incorporou novos componentes para facilitar a criação de um fórmulário. Alguns deles são "email", "number", "url", dentre outros. Quer conhecer mais elementos, saber a função de cada um e como usá-los? No curso online HTML5 você aprenderá todos esses elementos, suas funções e dicas exclusivas de utilização.

E agora, como hospedar o site?

Depois de criar a sua página com todos os elementos necessários, com a inserção das linguagens HTML5, CSS3 e JavaScript e seguindo os aprendizados dos cursos online do Enfoque Capacitação, é hora de colocar o site no ar. Como fazemos isso?

Essa pode parecer a parte mais difícil do trabalho, mas é bem o contrário. O sonho de qualquer blogueiro é que seu site esteja no ar com domínio ".com.br", mas acabam deixando o registro de lado por acharem que é complicado, confuso e caro.

O portal oficial que registra sites no Brasil é o registro.br. Ele é totalmente seguro e responsável pelas atividades de registro e manutenção dos nomes de domínios que usam o ".br". Por cerca de R$ 50,00 reais é possível criar o seu domínio - caso ele ainda não exista - e tê-lo garantido por um período de 12 meses.

Além do domínio ".com.br" você pode escolher outros tipos de domínios de acordo com sua profissão, cidade ou segmento. Veja alguns exemplos:

  • art.br: para pessoas físicas ou jurídicas do segmento de música, pintura ou artes em geral;

  • edu.br: para instituições de ensino superior;

  • blog.br: para web logs;

  • eti.br: para profissionais de tecnologia da informação;

  • gov.br: instituições do governo federal;

  • org.br: instituições não governamentais sem fins lucrativos;

  • ind.br: para indústrias;

  • tv.br: para empresas de radiodifusão ou transmissão via Internet de sons e imagens; dentre outros vários domínios.

Vale lembrar que alguns deles exigem apenas o CPF, outros necessitam que o criador tenha um CNPJ - pessoa jurídica. Outras categorias possuem restrições para a criação e são destinadas para setores específicos. O interessado deverá enviar documentos comprovativos para a criação desses domínios restritos.

Depois de comprar o seu domínio, você precisa agora encontrar uma hospedagem para o seu site. Existem opções gratuitas para você hospedar o seu site e usar o seu domínio próprio, mas caso queira pagar por uma hospedagem de sites e aproveitar mais recursos o custo também não é caro. Esse processo gira em torno de R$ 20, R$ 30 reais por mês.

Para publicar o site que você criou com o curso HTML5, dentre os outros cursos online com certificado que ensinam as linguagens CSS e JavaScript, é preciso que a sua página criada esteja instalada no servidor de hospedagens. O próprio site de hospedagem oferece essa opção. Após alguns ajustes o seu site estará no ar!

Os certificados do Enfoque Capacitação podem ser usados para:


Prova de Títulos em Concursos Públicos

Horas complementares para faculdades

Complemento de horas para cursos técnicos

Progressão de carreira em empresas

Turbinar seu currículo

Revolucionar sua vida profissional e acadêmica

Curso HTML5: uma opção a mais na sua vida profissional

Todos esses elementos e funcionalidades dos códigos HTML que aprendemos até aqui estão incluídos no curso HTML5. Depois indicamos a você conhecer os cursos online com certificado do Enfoque Capacitação que incluem a linguagem de folhas de estilo - CSS3 e a linguagem de scripts - JavaScript. 

Com essa capacitação você estará preparado para criar um site interativo e com várias funcionalidades interessantes. Além disso, você tem mais de 1.100 opções de cursos online na plataforma de diversas áreas diferentes.

Para aproveitar essa oportunidade é fácil: basta investir R$ 69,90 no Pacote Master e você terá acesso irrestrito a todo o conteúdo da plataforma por um ano inteiro, sem mensalidades.

O curso online HTML5, dentre os outros da plataforma, são feitos com qualidade através de um estudo e elaboração de conteúdo programático pelo nosso departamento de pedagogia, preparado para oferecer um dos melhores conteúdos do Brasil.

Mais de 160 mil alunos já experimentaram o portal com alto índice de aprovação pela qualidade dos conteúdos e do ensino. Venha conhecer o curso online HTML5 e as centenas de outros cursos de áreas requisitadas como psicologia, direito, administração, saúde, dentre outros. Inscreva-se agora mesmo e aproveite esta incrível oportaunidade!

Gostou do artigo? Não deixe de compartilhar com seus amigos e comentar sobre esses temas. Em breve teremos mais conteúdos, até a próxima!