-
HTML Tutorial
-
Lecture 1HTML – Introdução
-
Lecture 2HTML – Tags básicas
-
Lecture 3HTML – Elementos
-
Lecture 4HTML – Atributos
-
Lecture 5HTML – Formatação
-
Lecture 6HTML – Tags para frases
-
Lecture 7HTML – Meta Tags
-
Lecture 8HTML – Comentários
-
Lecture 9HTML – Imagens
-
Lecture 10HTML – Tabelas
-
Lecture 11HTML – Listas
-
HTML – Introdução
HTML significa Hyper Text Markup Language, que é a linguagem mais amplamente usada na Web para desenvolver páginas da web. O HTML foi criado por Berners-Lee no final de 1991, mas “HTML 2.0” foi a primeira especificação HTML padrão publicada em 1995. HTML 4.01 era uma versão principal do HTML e foi publicado no final de 1999. Embora a versão HTML 4.01 seja amplamente utilizada, atualmente temos a versão HTML-5, que é uma extensão do HTML 4.01, e esta versão foi publicada em 2012.
Por que aprender HTML?
Originalmente, o HTML foi desenvolvido com a intenção de definir a estrutura de documentos como cabeçalhos, parágrafos, listas e assim por diante, para facilitar o compartilhamento de informações científicas entre pesquisadores. Agora, o HTML está sendo amplamente utilizado para formatar páginas da web com a ajuda de diferentes tags disponíveis na linguagem HTML.
HTML é OBRIGATÓRIO para que estudantes e profissionais que trabalham se tornem um grande Engenheiro de Software, especialmente quando estão trabalhando no Domínio de Desenvolvimento Web. Vou listar algumas das principais vantagens de aprender HTML:
- Criar Sites Web – você pode criar um site Web ou personalizar um modelo da Web existente se conhecer bem o HTML.
- Torne-se um web designer – se você deseja iniciar uma carreira como um web designer profissional, o design de HTML e CSS é uma habilidade obrigatória.
- Entenda a web – Se você deseja otimizar seu site, para aumentar sua velocidade e desempenho, é bom saber HTML para obter os melhores resultados.
- Aprenda outras linguagens – depois de entender o básico de HTML, outras tecnologias relacionadas, como javascript, php, tornam-se mais fáceis de entender.
Documento HTML básico
Em sua forma mais simples, a seguir está um exemplo de um documento HTML ou se você quer editar para aprender mais – clique aqui:
See the Pen
Exemplo de Documento HTML by John Pires (@johnpiresBR)
on CodePen.
Olá, Mundo usando HTML.
Apenas para deixá-lo um pouco entusiasmado com o HTML, vou apresentar um pequeno programa convencional HTML Olá, Mundo, que você pode experimentar usando esse link.
See the Pen
Ola Mundo HTML by John Pires (@johnpiresBR)
on CodePen.
Tags HTML
Como dito anteriormente, HTML é uma linguagem de marcação e faz uso de várias tags para formatar o conteúdo. Essas tags são colocadas entre colchetes angulares <Nome da tag>. Exceto algumas tags, a maioria das tags tem suas tags de fechamento correspondentes. Por exemplo, <html> tem sua tag de fechamento </html> e a tag <body> tem sua tag de fechamento </body>, etc.
O exemplo acima usa as seguintes tags:
- <!DOCTYPE…> : Esta tag define o tipo de documento e a versão HTML.
- <html> : Esta tag engloba o documento HTML completo e consiste principalmente no cabeçalho do documento, que é representado por <head> … </head>, e no corpo do documento, que é representado pelas tags <body> … </body>.
- <head>: Esta tag representa o cabeçalho do documento que pode manter outras tags HTML como <title>, <link> etc.
- <title>: A tag <title> é usada dentro da tag <head> para mencionar o título do documento.
- <body>: Esta tag representa o corpo do documento que mantém outras tags HTML como <h1>, <div>, <p> etc.
- <h1>: Esta tag representa o título.
- <p>: Esta tag representa um parágrafo.
Aplicações em HTML
Como mencionado antes, o HTML é uma das linguagens mais utilizadas na web. Vou listar alguns deles aqui:
- Desenvolvimento de páginas da web – HTML é usado para criar páginas que são renderizadas na web. Quase todas as páginas da web têm tags html para processar seus detalhes no navegador.
- Navegação na Internet – HTML fornece tags que são usadas para navegar de uma página para outra e é muito usado na navegação na Internet.
- UI responsiva – as páginas HTML hoje em dia funcionam bem em todas as plataformas, dispositivos móveis, guias, desktops ou laptops devido à estratégia de design responsivo.
- As páginas HTML de suporte off-line, uma vez carregadas, podem ser disponibilizadas off-line na máquina sem a necessidade de internet.
- Desenvolvimento de jogos – o HTML5 tem suporte nativo para uma experiência rica e agora também é útil na arena de desenvolvedores de jogos.
Público
Este tutorial de HTML foi projetado para aspirantes a Web Designers e Desenvolvedores com necessidade de compreender o HTML em detalhes suficientes, juntamente com sua visão geral simples e exemplos práticos. Este tutorial fornecerá ingredientes suficientes para começar com HTML, de onde você poderá obter um nível mais alto de especialização.
Pré-requisitos
Antes de prosseguir com este tutorial, você deve ter um conhecimento básico de trabalho com o sistema operacional Windows ou Linux.
- Como criar diretórios e arquivos em seu computador.
- Como navegar por diferentes diretórios.
- Como digitar conteúdo em um arquivo e salvá-lo em um computador.
- Noções básicas sobre imagens em diferentes formatos, como formato JPEG, PNG.