HTML

Nesse Guia de Consulta voc� encontrar� o conte�do que precisa para iniciar seus estudos sobre a linguagem HTML, base para a constru��o das p�ginas web.

Comece seu teste gratis

Guia de HTML
DevMedia
16 Conte�dos
300 Exerc�cios
Iniciante
192 avalia��es

O que � HTML?

HTML (Hypertext Markup Language) � a linguagem base para constru��o das p�ginas web que acessamos diariamente. � uma linguagem de marca��o de texto, n�o de programa��o.

Sua principal finalidade � estruturar o conte�do disponibilizado em uma p�gina, definindo elementos como par�grafos, t�tulos, imagens, etc.

Ela � fundamental para o programador Front-end web, pois com ela criamos as p�ginas da aplica��o.

Por que aprender HTML?

O HTML � a linguagem padr�o de todo o conte�do que vemos na internet - desde a sua estrutura at� o significado sem�ntico de seus elementos. Seja qual for a tecnologia que criou o site ou software, ou o dispositivo que o acessa (pc, smartphone, tablet...), sua visualiza��o ser� neste formato.

� a forma mais b�sica de um site ou software web. Mesmo que voc� tenha pleno conhecimento de programa��o, quando o assunto � desenvolvimento web o resultado de uma aplica��o invariavelmente ser� um documento HTML.

Se voc� programa para a web ou pretende ingressar nessa �rea, � fundamental saber usar corretamente a linguagem HTML.

Exemplo de c�digo HTML

Veja abaixo um exemplo de c�digo HTML:


<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <body>
        <h3>Hello World
    </body>
</html>

HTML � a forma mais b�sica de todo o site
Define a estrutura dos elementos e a sem�ntica da p�gina.
N�o cabe a ela definir caracter�sticas visuais ou comportamentos, pois isso deve ser feito usando CSS e JavaScript.

HTML e Carreira Front-end

Uma p�gina web � a parte visual de um software online. Essa p�gina � criada pelo programador Front-end

P�ginas ou sistemas web se tornaram praticamente obrigat�rios para uma empresa, por isso o mercado precisa cada vez mais de programadores Web, ou como tamb�m s�o chamados, programadores Front-end.

Um programador Front-end/Web cuida da parte visual, ou seja, tudo que o usu�rio consegue ver e interagir em uma p�gina. A programa��o Front-end est� relacionada com a experi�ncia do usu�rio final, ou User Experience (UX).

Foi o tempo onde ter conhecimentos em Front-end era opcional. Agora saber HTML e CSS virou requisito obrigat�rio na maioria das vagas para programadores.

O programador Front-end necessita saber utilizar o HTML tanto para estruturar a p�gina de sua aplica��o, organizando seus conte�dos, quanto para dar sem�ntica aos elementos da p�gina, melhorando a posi��o de seu site nos buscadores e a acessibilidade para o usu�rio final.

Na programa��o Front-end temos diversas tecnologias utilizadas para agilizar e otimizar o processo de cria��o das p�ginas, por�m duas delas se destacam no mercado de trabalho. S�o elas:

Angular
React

Se voc� deseja trabalhar na carreira Front-end (web), muito provavelmente voc� vai trabalhar com o Angular ou React como tecnologia.

Caracter�sticas da programa��o Front-end (web)

Envolve conhecimentos referentes a experi�ncia do usu�rio (UX).
Est� associado a programa��o da �tela�, ou seja, a programar o que aparece para o usu�rio e como ele vai interagir com a p�gina.
Sempre h� vagas para programador Front-end j� que � quase obrigat�rio para uma empresa ter uma p�gina web.
Envolve programar as a��es que o usu�rio vai fazer na p�gina.
Se preocupa com a navega��o entre as p�ginas.

HTML e frameworks Front-end

Como vimos, na carreira Front-end voc� vai, muito provavelmente, trabalhar com as ferramentas mais utilizadas do mercado: Angular e React.

Ou seja, � improv�vel que voc� utilize �apenas� a linguagem HTML em um projeto. Em um aplica��o front-end profissional, voc� vai utilizar um framework ou biblioteca, que por sua vez vai utilizar a linguagem HTML para estruturar os elementos.

Angular e React s�o ferramentas - ou seja, eles s�o usados para que a programa��o das p�ginas web seja feito da forma mais r�pida poss�vel.

O Angular e React s�o a ferramenta final, � onde voc� vai encaixar as pe�as e construir seu software front-end - estruturando os elementos da aplica��o com HTML, preenchendo com os dados recebidos, estilizando com CSS e exibindo para o usu�rio final.

Por esse motivo aprender HTML � um pr�-requisito para se tornar um programador Front-end completo.

Planos de estudo angular e React — **Figura.** Planos de estudo programador Angular e programador React.

Utilize HTML com Angular ou React para se tornar um programador front-end completo
React utiliza JSX, que � baseado no HTML , para estruturar os elementos da aplica��o

Saiba mais sobre HTML

O que voc� vai aprender sobre HTML?

Introdu��o keyboard_arrow_down
- lock O que � HTML?
- lock Qual � a fun��o do HTML?
- lock HTML: Fundamentos do HTML
- lock 50 Exerc�cios
Tags B�sicas keyboard_arrow_down
- lock HTML: Tags B�sicas
- lock 50 Exerc�cios
Tabelas, Listas, Formul�rios, �udio e V�deo keyboard_arrow_down
- lock HTML b�sico - c�digos HTML
- lock HTNL Meta Tags: Entendendo o uso de Meta Tags
- lock 50 Exerc�cios
Formul�rios keyboard_arrow_down
- lock Formul�rios em HTML 5 - Conhecendo e usando
- lock Crie formul�rios com HTML5
- lock 50 Exerc�cios
HTML Sem�ntico keyboard_arrow_down
- lock HTML Sem�ntico
- lock Introdu��o a Web Sem�ntica
- lock HTML Sem�ntico: Conhe�a os elementos sem�nticos da HTML5
- lock Curso de HTML B�sico
- lock O que preciso saber sobre HTML 5?
- lock HTML Sem�ntico
- lock 50 Exerc�cios
Praticando keyboard_arrow_down
- lock Ser� que o meu HTML est� pronto?
- lock HTML na pr�tica: Criando mais uma p�gina WEB
- lock 50 Exerc�cios

Seja PRO Agora

Tenha acesso ilimitado a todo conte�do.

Teste Gr�tis

Possui uma conta? Login

Por que aprender na DevMedia?

Estudar tecnologia na DevMedia � uma experi�ncia �nica, pelos diferenciais abaixo:

Guias de estudo passo a passo

keyboard_arrow_down

Estudo orientado com Guias

Na nossa experi�ncia no ensino de programa��o ao longo dos anos, vimos que uma das maiores dificuldades dos alunos � ter um �plano de estudos�, ou seja, n�o se perder no meio do caminho.

Para resolver esse problema a plataforma DevMedia � dividida em Guias passo a passo.

Guia de Algoritmo — **Figura.** Estude atrav�s de guias e nunca se perca.

+40 tecnologias

keyboard_arrow_down

40 tecnologias para voc�

Estudar programa��o sempre envolve o aprendizado de mais de uma tecnologia. Na plataforma DevMedia voc� conta com 40 tecnologia dispon�veis - e a melhor not�cia, estamos sempre publicando novos conte�dos e exerc�cios. :)

Guia de Estudo — **Figura.** 40 tecnologias dispon�veis.

Suporte em tempo real

keyboard_arrow_down

Suporte a d�vidas em tempo real

Outro ponto muito importante durante seus estudo � conseguir tirar d�vidas rapidamente. Na DevMedia temos um time de programadores que tem a miss�o de tirar sua d�vida em tempo real.

Veja o que nossos usu�rios dizem sobre o Suporte em tempo real :)

Agrade�o e venho aqui reconhecer o trabalho de voc�s, pois eu nunca fico sem solucionar uma d�vida, seja pelas respostas aos outros usu�rios ou a mim.
Voc�s se dedicam muito ao suporte e fico feliz por ter escolhido a DevMedia tendo em vista este quesito. Acho importante esse feedback pois � o m�nimo que posso fazer.

Ismael Lima

star star star star star_border

Muito obrigada! Super claro e objetivo, adorei a aten��o que voc�s d�o aos alunos... Parab�ns!!! At� a pr�xima...

Tain� Rocha

star star star star star

Exerc�cios Gamificados

keyboard_arrow_down

Fortale�a o conhecimento com games de exerc�cios

Para te manter motivado e fortalecer os conhecimentos adquiridos na mem�ria, a plataforma DevMedia tamb�m � um game de exerc�cios de programa��o.

Cada t�pico de estudos cont�m um game de exerc�cios! Ao acertar os exerc�cios voc� ganha pontos, medalhas e tamb�m sobe sua posi��o ranking da plataforma.

Al�m disso toda vez que voc� acerta exerc�cios de programa��o voc� evolui o seu card! Veja abaixo:

Seja visto por grandes empresas

keyboard_arrow_down

Acerte exerc�cios e chame aten��o de grandes empresas

Aqui na Plataforma temos v�rias empresas parceiras que buscam seus novos programadores conosco!

Quanto mais exerc�cios voc� acertar, maior ser� sua chance de ser convidado a participar do processo seletivo dessas empresas!

Evolua e chame aten��o das empresas na plataforma

Curta 7 dias PRO gr�tis

Vem testar nossa Plataforma gratuitamente.

Iniciar Teste

Possui uma conta? Login

O que dizem

Confira o que andam dizendo sobre n�s ap�s conclu�rem seus objetivos em nossa Plataforma.

Estou Inteiramente satisfeito! J� vim com conhecimento em java de nivel m�dio, mas estou seguindo toda a guia de Java desde o inicio. Muito Bom, parab�ns!

Luis Ferreira

star star star star star

Achei muito top o trabalho que a DevMedia est� fazendo, ensinando passo a passo deste jeito � muito mais facil...Parab�ns pelo �timo trabalho!

Moises

star star star star star_border

Acho que esse tipo de material organizado e em formato de arvore � muito favoravel para o aprendizado! Achei super positivo o conte�do feito desta forma, perincipalmente para os novos programadores! Parab�ns pelo empenho!

Erik

star star star star star

Muito boa a qualidade das aulas online, estou gostando bastante de aprender diversas tecnologias com a Devmedia!

Graciomar Mascarenhas

star star star star star_border

Gostei bastante do primeiro contato. Em seguida assinei por um ano e j� conclui o meu primeiro curso no portal. Gostei muito e espero enquanto esteja buscando me tornar um profissional da �rea de analista e programador de sistemas, ter muita ajuda dos cursos da DevMedia.

Eberton Ferreira

star star star star_border star_border

Tudo o que voc� precisa e mais um pouco. Cheguei no site a pouco tempo como assinante, e j� vi que foi o melhor investimento que poderia ter feito. Conte�do excelente e o que mais me chamou aten��o foram as v�rias formas de aprender. Assistindo, ouvindo, lendo, consertando c�digos. As ferramentas est�o aqui, s� depende de voc� utiliza-las. Recomendo mais do que tudo!

Elen Pires

star star star star star