Posts

Showing posts with the label Iniciante

HTML - Sintaxe Comentários

Image
Sintaxe de Comentários O que é? Como usar? A "sintaxe comentários" é um conjunto de regras que permite ao desenvolvedor adicionar termos explicativos acima da linha de código, que o permite explicar a função dessa determina linha. A maioria, se não todas, as linguagens da web utilizam esse parâmetro. As mais utilizadas saõ // para comentários de linha única ou /**/ para blocos de linhas em CSS e Java. Já no HTML utiliza-se a sintaxe <!-- seu comentário--> .  NOTA: Falaremos das demais sintaxes de comentários em tutoriais a frente. Focaremos agora nas sintaxes de comentários em HTML. Estrutura básica de uma sintaxe de comentário Quando o texto é colocado dentro das <!-- tags desta maneira --> , ele não aparecerá na página web. Você pode usar estas tags para adicionar lembretes, avisos ou explicações sobre o código, o que facilita qualquer pessoas a fazer uma leitura mais precisa do seu documento HTML. Formas de adicionar comentários em um documento Ele pode ser adi...

Tag title

Image
A tag <title> é um dos elementos mais simples, mas ao mesmo tempo, importante do HTML . Vamos por partes: O que é a tag <title> e para que serve? A tag <title> define o título da página web . Nos resultados de busca do Google ( e outros mecanismos de busca), aparece como link que leva  a página de destino. Exibição de título da página de destino na web Este título é adicionado aos favoritos ou favoritos do navegador . *OBS: O texto que é adicionado entre a tag <title> Texto aqui.....</title> não aparece no corpo da página html . (Ao contrário da tags <h1> e <p> que são usadas para imprimir caracteres " letras e números " no corpo do documento ). Esquemático A tag ficara disposta sempre após a tag <head>  para ajudar na sua localização e deixar o código organizado caso outros desenvolvedores precisarem acessar. Entenda a importância da tag head no seu site : aprenda a usa-la de maneira profissional e entenda suas funções b...

Tag Head

Image
A tag <head> é uma das partes mais importantes da uma página HTML, mas ela não exibe nada diretamente na tela do navegador. Imagine ela como o "cérebro" do documento - é onde você coloca informações que descrevem e configuram toda a sua página, ou seja, nenhum conteúdo visual é adicionado a esta tag. O usuário não verá absolutamente nada. O que significa <head> ? O nome "head" vem de "cabeçalho" (não confunda com o cabeçalho visual do site). Ela indica ao navegador que o conteúdo dentro dela é apenas para meta informação sobre a página web. Então... Para que serve? A <head> serve para definir dados, recursos e instruções para o navegador antes de mostrar o conteúdo real da página. Este conteúdo sempre irá se encontrar dentro de tag <body> , que iremos ver mais a frente. Entre sua funções principais esta: Definir metadados Com a tag <meta> você informa a codificação de caracteres ( <meta charset="UTF-8"> ),...

Doctype html

Image
O que é doctype html? A tag <!DOCTYPE  html> é um código que declara a existência de um documento em Linguagem HTML, por isso, esta tag é tecnicamente chamada de document type declaration (declaração do tipo de documento) - colocada no início de um arquivo HTML. É importante que saibamos que ela não é uma tag qualquer: trata-se de uma declaração especial para o parser (o interpretador de códigos do navegador) . O que significa <!DOCTYPE html> ? <! - indica o início de uma declaração especial. DOCTYPE  - significa "document type", ou tipo de documento. html - informa que o documento é do tipo HTML. Quando o navegar encontra essa declaração, ele entra no modo padrão , em inglês (standards mode) , interpretando o código nas funções ou especificações oficiais do HTML e do CSS , evitando modelos antigos que causariam alguma inconsistência ou incompatibilidade na exibição do seu site. No HTML5, que é a versão mais atual da linguagem, a declaração foi simplificad...

Estrutura básica do HTML

Image
Conhecendo o básico de HTML A partir de agora, iremos falar um pouco sobre a estrutura básica do HTML. Mas, no que se consiste essa estrutura e pra que serve? Pense no HTML como uma casa. Antes que a casa tome forma, o que é necessário para que ela fique de pé? Se você pensou em um bom alicerce, colunas e tijolos, pensou certo. No HTML não é diferente! Precisamos entender, como qualquer coisa na vida, a base de qualquer coisa. O HTML é a base da World Wide Web, o que nós conhecemos hoje como WWW. Esta linguagem foi criada por Tim Berners-Lee no CERN em 1991. Com o passar dos anos o HTML evoluiu de uma simples linguagem para algo com mais suporte web. Passou assim a atuar em multimídias, gráficos, armazenamento local de dados e muito mais coisas. Basicamente ela foi criada para permitir que documentos contenham links para outros documentos, essa era a ideia. Mas, ela acabou se ramificando para a área de conteúdos na web, permitindo com uso dela, que cabeçalhos, parágrafos, listas e ima...

Introdução ao JavaScript

Seja bem vindo a hulp! ou seu canal de aprendizado em programação da web! Hoje iremos conversar um pouco sobre uma das linguagens de programação mais utilizadas em todo o planeta por empresas, entidades governamentais e empreendedores. Esta linguagem é o JavaScript. Já ouviu falar alguma vez? Não? Fique tranquilo que a partir de agora você irá conhecer esta tecnologia de maneira completa. Vamos lá? O que é JavaScript? A linguagem JavaScript - muitas vezes abreviada para JS - é uma linguagem leve e interpretada para o lado de objetos, porém, ela não se limita apenas a objetos, podendo ser estendida também no uso de armazenamento de informações por meio de banco de dados, mais conhecido como Back-End. Por ser uma linguagem de programação ela pode ser usada para web podendo ser usada na atualização e alteração de dados em uma página web com o objeto de gerar interatividade entre o usuário e o que é impresso na tela pelo servidor. Ao usuário damos o nome de “ Lado do Cliente ”, pois é o us...

Introdução ao CSS

Introdução ao CSS Seja bem vindo a hulp! Seu canal de aprendizado contínuo no área de programação e design. Hoje iremos conversar um pouco sobre essa linguagem incrível que é o CSS. Já ouviu falar alguma vez? Não? Então não se preocupe se você nunca ouviu falar em CSS, vamos aprender juntos sobre ela a partir de agora. Primeiro, vamos descobrir…  O que é CSS? Segundo o site MDN , css é uma linguagem de estilo usada para descrever a apresentação de uma documento escrito em HTML, XML ou em XHTML. Basicamente, o css descreve como os elementos são apresentados na tela, no papel, na fala ou em outras mídias. A sigla CSS é descrita em inglês como Cascading Style Sheets (Folha de Estilo em Cascata -  em português). Exemplo de CSS body {   background-color : lightblue ; } h1 {   color : white ;   text-align : center ; } p {   font-family : verdana ;   font-size : 20px ; } Acima temos uma demonstração da estilização da tag <bod...

Editores de código

Image
Existem programas para edição de HTML profissionais, mas para que você comece a aprender de forma mais rápida e simples, indicamos alguns programas abaixo:  Bloco de notas do Windows Notepad++ TextEdit Visual Studio Code Bloco de notas O bloco de notas do Windows é o mais utilizado por iniciantes por ser um sistema que já vem implementado dentro das configurações do S.O (Sistema Operacional). Janela de trabalho Bloco de notas Lembrando que o Bloco de notas não é um editor de códigos profissional, por isso, recomendamos que o use somente para estudos simples e iniciais com indicamos aqui no site.

Introdução ao HTML

Image
O que é HTML? HTML é uma linguagem de marcação de hipertexto utilizada para imprimir na tela do seu computador caracteres como números, letras, símbolos e imagens em diversos formatos. Ele é o primeiro passo para quem deseja aprender a criar seus próprios sites e aplicativos web. Por se tratar de um documento, ele precisa ser utilizado em um editor de códigos que efetue a impressão desses caracteres na web. Veja abaixo uma representação simples de um documento em HTML <!DOCTYPE html> < html > < head > < title > Page Title < /title > < /head > < body > < h1 > My First Heading < /h1 > < p > My first paragraph. < /p > < /body > < /html > Que editor de código você pode usar para imprimir os elementos na web? Para iniciar seus estudos, você não precisa de um editor complexo para aprender a usar esta linguagem. Você poderá utilizar o bloco de notas que está instalado em seu computador no S.O do próprio Windows. Vej...