Desenvolvimento Web

Conceitos Fundamentais

Ambiente de trabalho

Editores de código

Visual Studio Code

Navegadores

Visual Studio Code

Tecnologias

HTML

Conteúdo
  1. Texto
  2. Tabela
  3. Imagem
  4. Vídeo

CSS

Estilização de Conteúdo

JS

Interatividade
Visual Studio Code

Página Web e Website

Página web ou Webpage é um arquivo onde você pode inserir textos, imagens, tabelas e incorporar planilhas, apresentações, vídeos com ligações de hipertexto que permitem a navegação de uma página, ou seção, para outra.

websites ou Sites são uma coleção de páginas web armazenadas em uma pasta ou em subpastas relacionadas de um servidor web.

Visual Studio Code

Profissionais

Front-End
HTML, CSS, Bootstrap, Javascript
Back-End
Python, Javascript, PHP, SQL
FullStack
HTML, CSS, Bootstrap, Javascript, Python, Javascript, PHP, SQL

HTML - Hypertext Markup Language

É uma Linguagem de Marcação de Hipertexto baseada em tags criada na década de 1990 por Tim Berners-Lee para publicação de conteúdo em hipertexto, tais como, texto, imagem, áudio e vídeo, e que podem ser vinculados através de hyperlinks.

Tags

As tags definem ao navegador a marcação de conteúdo. as tags tem funcionalidades específicas. Sem o uso de tags o navegador exibe um texto plano.

Sintaxe:
< nome_tag > conteúdo < /nome_tag >

As tags podem possuir atributos, ou seja, são parâmetros que definem algum tipo de informação extra do navegador.

Sintaxe:< nome_tag atributo="valor" > conteúdo < /nome_tag >

Estrutura básica do documento HTML

< html >
< head >
< title >Título da Barra de título< /title >
< /head >
< body >
Seu texto será digitado aqui
< /body >
< /html >

Estrutura do HTML

Marcação de Títulos

As tags de heading definem o título e possui seis níveis de importância.

Sintaxe:

< h1 > Este é um título 1 < /h1 >
< h2 > Este é um título 2 < /h2 >
< h3 > Este é um título 3 < /h3 >
< h4 > Este é um título 4 < /h4 >
< h5 > Este é um título 5 < /h5 >
< h6 > Este é um título 6 < /h6 >

Marcação de Parágrafos

As tags de parágrafo definem a apresentação dos parágrafos.

Sintaxe:

< p >Este é um parágrafo< /p >
< p >Este é outro parágrafo< /p >

Marcação de quebra de linhas

As tags de quebra de linha produzem uma quebra de linha em um texto. É útil para escrever poemas ou um endereço, onde a divisão de linha é significante.

Sintaxe:

Esta é uma < br > quebra de linha

Marcação para formatação de texto

As tags para formatação de texto definem destaque, tamanho de fonte, cor dentre outros.

Sintaxe:

< b >texto em negrito< /b >
< strong >texto destacado< /strong >

< i >Texto itálico< /i >
< em >Texto com ênfase< /em >

< big >This text is big< /big >
< font color="blue" size="14" >fonte em azul< /font >

Hans M. Boron

Analise e desenvolvimento de sistemas
Turma 2020

Instituto Federal do Paraná Campus Irati

Rua Pedro Koppe, 100 – Vila Matilde – 2104 0200,
(42) 2104-0203