Image

Neocodex Design Cursos - HTML

12 lições para iniciar em HTML - Artigo 1

Olá, tudo bem?

Eu sou Emilio Dami Silva e este é o meu primeiro artigo para levar você ao mundo do html de forma prática.
Este curso é bem básico e pretende te introduzir ao HTML apenas.

HTML (Em inglês. Hypertext Markup Language), é a linguagem de marcação padrão para a criação de páginas da web, descreve a estrutura de uma página da web e consiste em uma série de tags e elementos que informam ao navegador como exibir o conteúdo

De forma resumida é uma linguagem de marcação de utilizado pelos browsers para mostrar conteúdos nos computadores em geral, os browsers leem os códigos html e converte de em páginas de textos visíveis para ser mostrada na tela. O HTML é uma forma de script interpretado pelo browser.

O que vamos precisar para montar nossa primeira página?

  • • Um Computador com o Windows;
  • • um editor de textos e um browser, eu sugiro que seja o Google Chrome Browser


Por agora, vamos criar o nosso primeiro website, depois eu irei explicar cada linha em detalhe neste artigo e no próximo iremos estudar outras TAGS nos próximos artigos.

- Abra um editor de textos no seu computador, pode ser o bloco de notas e digite as seguintes linhas:



    
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="utf-8" />
        <meta name="author" content="Emilio Dami Silva"/>
        <meta name="description" content="Curso Básico de HTML"/>
        <meta name="keywords" content="Cursos, HTML, sites, web, websites, desenvolvimento"/>
        <title>Neocodex Design Cursos</title>
    </head>
    <body>
        <h1>
            Nossa página OFICIAL
        </h1>
        <p>
            Nossa primeira página criada para desenvolver scripts em HTML PURO.
        </p>
    </body>
</html>


                                        
code 1. Trabalho inicial de HTML PURO
- Crie um diretório para trabalho e salve o arquivo com o nome index e a extensão .html dentro desse diretório, depois abra no seu navegador e execute o script salvo, veja abaixo a tela:

Image

Clique sobre o arquivo e você irá executar seu primeiro site em html puro e parabéns para você que terminou essa primeira lição!

Em HTML tudo funciona com TAGS, vamos explicar passo a passo cada item do arquivo que digitamos dentro do nosso script:

<!DOCTYPE html>
Todos os documentos HTML devem começar com uma declaração <!DOCTYPE> que irá informar para o navegador que tipo de documento ele precisa esperar, assim, o tipo HTML diz ao navegador que pode esperar instruções HTML.

<html>
A tag <html> é o elemento raiz de uma página HTML, toda pagina html deve começar com essa tag. Tudo que está dentro dessa tag será considerado como sendo o próprio site.

<head>
A tag <head> contém meta informações sobre a página HTML, dentro desta tag irá conter todas as informações da sua página, essas informações serão usadas para que os motores de buscas possam classificar sua página e mostrá-la aos usuários que buscam por informações. O principal motor de busca hoje em dia é o Google Search. Se especializar em Google Search hoje pode lhe render um bom dinheiro e é essencial para quem trabalha com marketing e vendas.

<meta>
As Meta Tags <meta> auxiliam os motores de buscas (search engines) a encontrarem o seu site na web e servem de informação, isso porque são elas que dão um pequeno resumo sobre o que será encontrado na sua página, essa é uma das formas de indexar o conteúdo web disponível. No nosso exemplo, temos três TAGS, a tag author que contem o nome de quem foi o autor do código, description que contem a descricao do codigo e a meta keywords que contem as palavras chaves para indexar nos motores de busca.

<title>
A tag <title> especifica um título para a página HTML (que é mostrado na barra de título do navegador ou na guia da página)

<body>
A tag <body> define o corpo do documento e é um contêiner para todo o conteúdo visível, como títulos, parágrafos, imagens, hiperlinks, tabelas, listas, etc. Tudo que está dentro dessa tag será interpretado pelo browser para mostrar ao usuário.

<h1>
A tag <h1> define um grande título que será mostrado no browser, os números 1,2,3,4,5,6 define o tipo de título, conforme o número cresce maior o nível de subtítulo dele.

<p>
A tag <p> define um parágrafo, todos os textos devem ser colocados dentro de parágrafos e eles serão mostrados na tela do monitor quando chamado pelo usuário.

</> Esta barra finaliza cada tag, ela deve ser colocada quando terminar a tag, ficando assim:
    <body>
  • <p> Conteúdo </p>
  • </body>




Parabéns por sua primeira missão. No próximo artigo vamos incrementar com imagens e links. Clique nesse link:
12 lições para iniciar em HTML - Artigo 2,


Fontes:
w3schools
Spec
ICANN



Por enquanto é só.

Eu sou Emílio Dami e retornaremos em breve.

Assista nossos vídeos em nosso canal no you-tube, se inscreva lá para continuar a receber todas as novidades automaticamente e deixe seu comentário, ah e compartilhe!

Você pode enviar um e-mail para info@neocodexdesign.com

22/11/2021 – Artigo 1


Se você deseja construir uma plataforma sólida para seus negócios.

Envie-nos uma mensagem agora mesmo e vamos falar sobre o seu projeto!

Vamos conversar mais sobre o seu projeto?

Vamos direto ao trabalho! Fale algo sobre seu projeto!

Contate-nos usando o formulario abaixo, informe seu telefone e email para entrarmos em contato imediatamente!

Voce pode nos contatar ligando para nos, utilizando o email ou nos contatando via redes sociais. Mas se voce preencher os campos abaixo iremos entrar em contato agora mesmo. We will contact you back immediately.
Muito obrigado pela sua visita ao nosso site!

Contato