4 - HTML Básico: Criando documentos HTML:

Tamanho: px
Começar a partir da página:

Download "4 - HTML Básico: 4.2 - Criando documentos HTML:"

Transcrição

1 4 - HTML Básico: O que é HTML? Os documentos na Web são organizados com o uso de comandos que são interpretados pelos browsers. Estes comandos compõem a linguagem HTML (HyperText Markup Language). A linguagem HTML é uma linguagem utilizada para estruturar e marcar o conteúdo HTML (formatação) dos documentos na Web Criando documentos HTML: Comandos HTML (TAGS): Os comandos HTML são descritores que indicam ao browser como as informações devem aparecer e são chamados de TAGS. São escritos obrigatoriamente entre os sinais "<" (menor que) e ">" (maior que) Formas dos Comandos HTML: Os comandos (TAGS) podem ser: - Abertos (simples): <comando> - Fechados: <comando>... </comando> - Compostos: <comando> <elemento 1>... </elemento 1> <elemento 2>... </elemento 2>... <elemento n>... </elemento n> </comando>

2 Regras HTML e Dicas: Fechar sempre os TAGS fechados e compostos; NUNCA esquecer um sinal de < ou de >, no início ou no fim do TAG; Não usar espaços no TAG (no interior dos sinais < e > ). EX: </ comando> ERRADO!!! < com an do> - NUNCA!!!! Os agrupamentos de espaços colocados FORA dos TAGS serão interpretados como apenas um espaço. Fora dos TAGS não há restrição do uso dos espaços ( é usado para adicionar mais espaços); NOMES DOS ARQUIVOS (inclusive extensão.html ou.htm ) Sempre em minúsculas. Algumas dicas importantes para o seu sucesso na Web: Verifique suas páginas com diferentes navegadores e em diferentes plataformas para assegurar que você terá uma experiência de visualização consistente; Como alguns usuários da Web ainda se conectam a velocidades baixas, verifique se suas páginas podem ser visualizadas com estes modems; Revise a grafia e a gramática antes de publicar a sua página (peça que outra pessoa a leia). Verifique todos os links entre as páginas. Esta dica é simples mas muitas pessoas esquecem dela e publicam péssimos trabalhos; Não coloque informações do tipo Este site está em processo de criação (geralmente acompanhada de sinais amarelos), pois praticamente todos os sites da Web estão em criação e em desenvolvimento. É preferível não colocar nada a colocar uma página com um aviso deste tipo;

3 Peça a opinião de outras pessoas antes de publicar o seu site, o olhar crítico de alguém pode detectar erros que não foram percebidos por você. Observações em relação aos nomes dos arquivos: As extensões ".html" ou ".htm" são importantes quando o servidor Web está identificando o arquivo. Usaremos como convenção para os nossos trabalhos a extensão ".html"; Os nomes devem iniciar com uma letra obrigatoriamente; Pode-se utilizar caracteres como "-" e "_"; Evite utilizar "ç", caracteres especiais e letras acentuadas em nomes de arquivos; Procure usar nomes significativos, que remetam ao conteúdo do arquivo. Para edição dos arquivos.html, utilizaremos o programa PHP Editor Versão PHP Editor é um editor freeware e totalmente em português destinado a edição de páginas PHP e HTML. Vamos salvar nossos arquivos de exemplo na pasta c:/wamp/www/dw Estrutura básica de uma página <html> <head> <title>titulo da Página</title> </head> <body> <!-- Corpo da Página --> </body> </html>

4 Um documento HTML básico é composto de duas partes: A seção de cabeçalho descritiva; O corpo do conteúdo. Analisaremos, mais adiante, cada um destes TAGS (comandos) Cabeçalhos Uma forma usada para configurar o tamanho da fonte é o TAG <H*>TEXTO FORMATADO</H*> onde o asterisco é substituído por um número que vai de 6 (menor) a 1 (maior). Este TAG é mais usado para títulos de textos. Faça o exemplo abaixo (cabecalho.html): Veja como o arquivo acima será visualizado no navegador WEB:

5 4.5 - Alinhamentos de parágrafos O alinhamento de parágrafo é definido pela propriedade align que pode receber quatro valores diferentes: VALOR EFEITO left alinhar à esquerda right alinhar à direita center alinhar ao centro justify justificar Faça o exemplo abaixo (paragrafos.html) e veja o resultado: Quebra de Linha A quebra de linha é usada apenas para mudar um determinado ponto do parágrafo de linha. Isso acarreta uma diferença na visualização. Se prestarmos atenção, há um grande espaço deixado entre uma linha e outra do parágrafo, porque são dois parágrafos diferentes. Mas se quisermos criar um parágrafo com duas linhas, obrigatoriamente, usaremos a quebra de linha que é identificado pelo TAG <br>. Faça o exemplo abaixo (quebra_linha.html) e veja o resultado:

6 4.7 - Formatando Textos: Todo documento HTML segue o mesmo modelo básico, e este modelo deve sempre estar completo para o browser reconhecer o seu documento. Conforme já explicado anteriormente, o modelo é o seguinte: <html> <head> <title>o título que ficará no topo da sua página você escreve aqui </title> </head> <body> Todo o texto contido no seu documento HTML deve estar aqui. </body> </html> Obs: Nunca se esqueça de fechar cada TAG, com a barra e o nome da tarefa. Quando seu TAG tiver vários atributos eles devem ser omitidos no fechamento do TAG. Por exemplo: <a href="agenda.html">agenda</a> Este TAG é um link, que você aprenderá com mais detalhes depois, mais agora o importante é que você perceba que os atributos (detalhes do TAG) foram omitidos no seu fechamento. Se você não fechar um TAG ele ficará aberto até o final do documento, alterando a propriedade de todo ele, por exemplo: se você não fechar <b> que é o TAG que cria textos em negrito, o documento inteiro ficará em negrito Formatação básica da Fonte: Dentro do TAG body, você escreve todo o texto da sua página. E é neste texto que vamos nos concentrar agora. Os principais TAGS para a formatação de texto são:

7 <p>cria um parágrafo</p> <center>centraliza o texto</center> <b>textos em negrito</b> <i>textos em itálico</i> <s>texto tachado (riscado)</s> <u>textos sublinhados</u> <tt>textos no estilo da máquina de escrever</tt> <sub>texto subscrito</sub> <sup>texto sobrescrito</sup> <br>quebra de linha, não necessita ser fechado <!--Este TAG foi feito para comentários e é ignorado pelo browser --> <dd>este TAG é usado para criar parágrafo (o espaço para a primeira linha). Se você quiser um parágrafo maior ou menor é necessário o uso de espaços através do caractere " ". (Dado: 1 "<dd>" é igual a 10 " ". Com o tempo você irá memorizar o nome e a função de cada TAG!! Exercício - Formatação Básica (fbasica.html)

8 4.8 - Estilos de Textos: Um TAG muito importante na linguagem HTML é o TAG <font>. Ele determina a cor, tamanho e tipo da fonte. Primeiramente vamos ver como mudar o tamanho e tipo da fonte Atributo SIZE: O tamanho da fonte, em HTML, varia de 1 (menor) a 7 (maior). Lembre-se sempre que o tamanho em HTML não corresponde ao usual, que é dado em pixels. Para configurarmos o nosso texto com estas fontes é só fazer assim: <font size="n">onde n=tamanho da fonte desejado</font> Você também pode querer aumentar ou diminuir a fonte em relação a que está configurada no momento, então é só por um sinal de mais (para aumentar) ou menos (para diminuir) o tamanho da fonte. Exemplo de Formatação de fonte (fonte1.html): Veja como o arquivo acima será visualizado no navegador WEB: Atributo FACE: Para mudar o estilo da fonte é só usar o atributo face. Por exemplo, se eu quero que o meu texto use Arial, tamanho 2, é só fazer assim: <font size="2" face="arial">exemplo da combinação de estilo e tamanho de Fonte</font>

9 Neste exemplo demonstramos que os atributos podem ser usados ao mesmo tempo sem nenhum problema para o browser. Nota: Os tamanhos e estilos padrões são configurados de acordo com cada browser, ou seja, se você não determinar estes valores, o browser que abrir a sua página irá interpretar o seu texto com a fonte e estilo configurada nele Atributo COLOR: As cores das fontes são determinadas pelo atributo color, no TAG font. Você pode citar a cor que você quer de duas formas: <font color="nome da cor"></font> <font color="#xxxxxx"></font> Exemplo de Formatação de fonte (fonte2.html): Veja como o arquivo acima será visualizado no navegador WEB:

10 A primeira forma é mais simples, e admite os nomes de cores: red (vermelho), blue (azul), green (verde), yellow (amarelo), maroon (marrom), navy (azul-marinho), purple (roxo), olive (verde-oliva), teal (verde-azulado), fuchsia (mangenta), aqua (azul-ciano), lime (verde-limão), silver (prata), gray (cinza), black (preto), white (branco). Alguns browsers não aceitam este tipo de configuração, então o melhor é fazer a configuração de cores pelo segundo método. O segundo método usa o código RGB (red green blue). Todos os browsers reconhecem este código. Os XXXXXX podem ser qualquer número de 0 a 9 e qualquer letra de A a F. Esses números e letras representam uma ordem tonal do tom mais escuro para o mais claro: A B C D E F Os dois primeiros X representam a quantidade de luz vermelha em uma cor, os dois do meio de luz verde e os dois últimos de luz azul. Alguns exemplos de misturas: FFFFFF = branco = preto FF0000 = vermelho 00FF00 = verde 0000FF = azul FFFF00 = amarelo Para definir as cores em todo o texto de uma página usa-se o atributo text no TAG body. <body text="#xxxxxx"> text - cor dos textos da página => cor padrão (default) é preta Seus valores são dados em valores hexadecimais, equivalentes a cores no padrão RGB (Red, Green, Blue). Exemplos: #FFFFFF, #804040, # Exercício: Crie uma página com o nome ex_fonte.html, aplicando os Estilos de Textos vistos no item 4.8 e subitens correspondentes

11 4.9 - Atributos: Background e BGColor O TAG <body> tem dois atributos onde você pode especificar planos de fundo. O plano de fundo pode ser uma imagem ou uma cor Background: O atributo background configura o plano de fundo para uma imagem. O valor do atributo é a URL da imagem que você quer usar. Se a imagem é menor do que a janela do navegador, a imagem será repetida até preencher a janela inteira do navegador. Veja abaixo como este atributo é usado: <body background="fundo.gif"> => Usado se a imagem estiver no mesmo diretório da página.html <body background="http://www.meusite.com/fundo.gif"> => Neste caso estou buscando uma imagem da WEB. Observação: Se você quer usar uma imagem de plano de fundo, você deve ter em mente: A imagem de fundo aumentará o tempo de carga da página. Dica: Arquivos de imagem de fundo devem ter no máximo 10k A imagem de fundo aparecerá boa com outras imagens na página? A imagem de fundo aparecerá boa com as cores do texto na página? A imagem de fundo aparecerá boa quando ela for repetida na página? A imagem de fundo afasta o foco do texto? Bgcolor: O atributo bgcolor configura o plano de fundo em uma cor. O valor deste atributo pode ser um número hexadecimal (valor RGB) ou um nome de cor

12 <body bgcolor="#000000"> OU <body bgcolor="black"> As linhas acima configuram a cor do plano de fundo para preto Observações Básicas - Dicas Úteis: Os atributos bgcolor, background e text no TAG <body> estão desaprovados nas versões mais recentes da HTML (HTML 5 e XHTML). O World Wide Web Consortium (W3C) removeu estes atributos de suas recomendações. Nas versões futuras do HTML, as folhas de estilo (CSS) serão usadas para definir o layout e a exibir as propriedades dos elementos da página HTML. Poucos sites Web mais visitados usam imagens de fundo. As cores de fundo mais usadas são: branco, preto e cinza. Exercício: Crie uma página WEB com o nome plano_de_fundo.html aplicando os conceitos dos atributos background e bgcolor Atributos: Link, VLink e ALink Os atributos Link, Vlink e Alink servem para fazer o controle das cores dos textos que funcionam como links em páginas WEB. Imagine a seguinte situação: quando você entra em uma página web ao clicar em um link no corpo da página, quando você retorna a página pode perceber que o link que você clicou já não esta mais com a mesma cor. É aí que entra os comandos link, vlink e alink. link - a cor dos links não visitados ainda (padrão: azul) alink - cor dos links, quando acionados (padrão: vermelho) vlink - cor dos links, depois de visitados (padrão: azul escuro ou roxo)

13 Sua sintaxe é: <BODY link="#rrggbb" vlink="#rrggbb" alink="#rrggbb"><\body> Criando Links ou Hiperlinks Um dos TAGS mais importantes é o que permite fazer links, ou seja, fazer referência a um outro recurso da WEB ou a um ponto específico da sua página. Veja como usá-lo: <a href="url">texto que aparece no link</a> O atributo href determina a localização do arquivo da sua página ou do local da WEB a que o link se referencia. A URL (Uniforme Resource Locator) é o endereço do link. O texto entre os TAGS aparecerá sublinhado, indicando que é um link de hipertexto. Nota 1: Evite sublinhar o seu texto, para não confundir o seu usuário. Nota 2: As cores dos links podem ser alteradas utilizando-se os seguintes atributos link, vlink e alink dentro da TAG <body>, conforme já verificado. Exemplos: <a href="http://www.universo.edu.br">link para o site da Universo</a> <a href="exemplo.html">link para o arquivo exemplo.html</a> Você pode fazer link para um também, para isso escreva: <a para o Dalamura</a> Exercício: Crie um arquivo com o nome links01.html aplicando os conceitos aprendidos acima (Itens 4.10 e 4.11)

14 Embutindo links em textos: Âncoras Internas Para navegar dentro do próprio documento. São links que levam a outras partes do mesmo arquivo. É mais usado com arquivos extensos. Você pode referenciar área de texto para a qual você quer ir. No local que você quer acessar digite: <a name="nome da área de texto"></a> Para criar o link para chamar esta parte do texto, digite: <a href="#nome-da-área-de-texto">link</a> Se a área estiver em outro arquivo digite: <a href="outro.html#nome-da-área-do-arquivo">clique aqui</a> Outros atributos podem ainda ser usados em TAGS <a>. Por exemplo: target=" ": Especifica o carregamento de um link em uma janela de destino. Ele é usado muitas vezes com a TAG FRAME. Ele pode assumir diversos valores: o _top: Carrega o link no corpo inteiro da janela o _blank: Carrega o link em uma janela em branco o _parent: Carrega o link no seu pai imediato o _self: Carrega o link na mesma janela dele Exercício: Crie um arquivo com o nome links02.html aplicando os conceitos aprendidos acima

15 Listas - Numeradas e Não Numeradas Outros recursos importantes para a formatação de textos em HTML são o uso de marcadores. Os marcadores podem ser usados de três formas básicas: Lista com marcadores: Listas não-numeradas são equivalentes às listas com marcadores do Microsoft Word. Primeiramente você abre a lista com o TAG <ul>. Depois, quando você quiser incluir os itens é só usar o TAG <li> para cada item incluído. Não se esqueça de fechar a lista com o TAG </ul>. O atributo TYPE, assume os valores circle, square e disc (default). Crie o arquivo listas_nao_numeradas.html conforme abaixo e veja a aplicação desde conceito:

16 Lista numerada ou alfabética: Nesta lista os marcadores são números ou letras. Para abrir a lista use o TAG <ol>, para cada item use novamente <li>, fechando a lista com </ol>. Para escolher o tipo de marcador use um dos seguintes atributos: TYPE="A" (A, B, C...); TYPE="a" (a, b, c...); TYPE="I" (I, II, III...); TYPE="i" (i, ii, iii...); TYPE="1" (1, 2, 3...). START= "número": indica o marcador inicial. Crie o arquivo listas_numeradas.html conforme abaixo e veja a aplicação desde conceito:

17 Lista sem marcadores: Se você quiser usar uma lista sem marcadores, use o TAG <dl> para abrir a lista, <dt> para cada item desejado e <dd> para cada subitem. Crie o arquivo listas_sem_marcadores.html conforme abaixo e veja a aplicação desde conceito: Réguas: Para a inclusão de uma régua simples horizontal em um texto é só usar o TAG <hr>. Se você quiser mudar a aparência da régua, use os seguintes atributos: Para alterar a largura use o atributo width. Por exemplo: <hr width="50%"> cria uma régua com largura de 50% da página. Para alterar a altura use o atributo size. Por exemplo: <hr size="5"> cria uma régua de altura 5 pixels. A configuração padrão (default) cria uma régua 3D, com o atributo noshade você cria uma régua em negrito. Por exemplo: <hr size="5" noshade> A configuração padrão cria uma régua centralizada. Se você quiser que ela fique alinhada a esquerda ou direita, use o atributo align igual a left (esquerda) ou right (direita). Você pode definir qual cor você deseja usar na sua régua, através do atributo color. Ex: <hr size="5" width="33%" color="blue">

18 Exercício: Crie um arquivo com o nome reguas.html, de acordo com as considerações abaixo, aplicando os conceitos aprendidos acima. Crie uma régua com 40% da largura da página, centralizada. Crie uma régua com 5 pixels de altura e 250 pixels de largura, em negrito e alinhada à direita, de cor vermelha. Crie uma régua com 10 pixels de altura e 250 pixels de largura, em 3D e alinhada à esquerda. Exercício de Fixação: Crie o arquivo exercicio_fixacao.html de acordo com a imagem e as informações abaixo: Cabeçalho 1, centralizado, cor preta, fonte Courier New Régua cor azul, altura de 5 pixels Texto em Arial, centralizado, tamanho 7 e cor vermelha Régua cor azul, altura de 5 pixels Lista Ordenada, em Negrito, com Links para Âncoras nesta Página Web. Definir cor preta para Link, Link Visitado e Link em Acesso. Régua simples Texto em Tahoma, centralizado, tamanho 5 e cor vermelha Régua simples Lista Aninhada Ordenada em Negrito, com subitens Não Ordenados em Itálico. Link somente na palavra com o endereço de do referido aluno. Links para Âncora chamada #topo para exibir o topo da Página Web, com fonte normal (Voltar ao topo)

QUEM FEZ O TRABALHO?

QUEM FEZ O TRABALHO? Introdução a Linguagem HTML: Conceitos Básicos e Estrutura ANA PAULAALVES DE LIMA 1 QUEM FEZ O TRABALHO? Com as tagsaprendidas hoje, faça uma página HTML sobre você com as seguintes informações: Seu nome

Leia mais

> Herbet Ferreira Rodrigues > contato@herbetferreira.com

> Herbet Ferreira Rodrigues > contato@herbetferreira.com Curso HTML & CSS > Herbet Ferreira Rodrigues > contato@herbetferreira.com Sumário > Apresentação > Introdução ao HTML História Começando a Programar > Tags em HTML Headings (Cabeçalhos) Parágrafos Formatação

Leia mais

Webdesign HTML. Introdução a HTML e as principais tags da linguagem. Thiago Miranda dos Santos Souza

Webdesign HTML. Introdução a HTML e as principais tags da linguagem. Thiago Miranda dos Santos Souza Webdesign HTML Introdução a HTML e as principais tags da linguagem Conteúdos Os materiais de aula, apostilas e outras informações estarão disponíveis em: www.thiagomiranda.net Objetivos Apresentar a HTML

Leia mais

1. HTML - Introdução. Hyper Text Markup Language. É uma linguagem de formatação de conteúdos. Portável. Ficheiros de pequena dimensão

1. HTML - Introdução. Hyper Text Markup Language. É uma linguagem de formatação de conteúdos. Portável. Ficheiros de pequena dimensão 1. HTML - Introdução Hyper Text Markup Language É uma linguagem de formatação de conteúdos Não é uma linguagem de programação Portável Não depende da plataforma em que é vizualizado Ficheiros de pequena

Leia mais

Sumário. HTML CSS JQuery Referências IHC AULA 6 5-09-2011 1

Sumário. HTML CSS JQuery Referências IHC AULA 6 5-09-2011 1 Sumário HTML CSS JQuery Referências IHC AULA 6 5-09-2011 1 Linguagem HTML HTML é a abreviação de HyperText Markup Language, que pode ser traduzido como Linguagem de Marcação de Hipertexto. Não é uma linguagem

Leia mais

Introdução ao HTML Hypertext Markup Language

Introdução ao HTML Hypertext Markup Language Introdução ao HTML Hypertext Markup Language Prof. Marcus Ramos Tags São comandos que são inseridos juntamente com o texto a ser apresentado, e que definem a forma como o mesmo será exibido na tela do

Leia mais

Roteiro 2: Conceitos de Tags HTML

Roteiro 2: Conceitos de Tags HTML Roteiro 2: Conceitos de Tags HTML Objetivos Detalhar conceitos sobre TAGS HTML: elementos, atributos, elemento vazio, links. Implementar páginas de internet com uso da linguagem HTML; Ferramentas Necessárias

Leia mais

Quem sou eu? Ana Paula Alves de Lima. Formação: E-mail: paulapeniel@gmail.com

Quem sou eu? Ana Paula Alves de Lima. Formação: E-mail: paulapeniel@gmail.com Introdução a Linguagem HTML: Conceitos Básicos e Estrutura ANA PAULAALVES DE LIMA INFORMÁTICA E METODOLOGIA - SUBSEQUENTE 1 Quem sou eu? Ana Paula Alves de Lima Formação: Bacharel em Sistemas de Informação;

Leia mais

LINGUAGEM DE PROGRAMAÇÃO HTML COMPONENTES: ROBSON EDMILSON

LINGUAGEM DE PROGRAMAÇÃO HTML COMPONENTES: ROBSON EDMILSON COMPONENTES: ROBSON EDMILSON O HTML (Hiper Text Mark-up Language) é uma linguagem de programação hipertexto. O HTML tem códigos para criar páginas na web. Estes códigos que definem o tipo de letra, qual

Leia mais

Desenvolvimento em Ambiente Web. Prof. André Y. Kusumoto andrekusumoto.unip@gmail.com

Desenvolvimento em Ambiente Web. Prof. André Y. Kusumoto andrekusumoto.unip@gmail.com Desenvolvimento em Ambiente Web Prof. André Y. Kusumoto andrekusumoto.unip@gmail.com Conceitos de HTML Prof. André Y. Kusumoto andrekusumoto.unip@gmail.com Definição de HTML Linguagem de marcadores (tags).

Leia mais

Linguagem WEB Prof. Alexandre Unterstell alexunter@gmail.com - www.alex.inf.br/cesc

Linguagem WEB Prof. Alexandre Unterstell alexunter@gmail.com - www.alex.inf.br/cesc Linguagem WEB Prof. Alexandre Unterstell alexunter@gmail.com - www.alex.inf.br/cesc Dicas Importantes: - Sempre crie um diretório em seu computador e salve todos os arquivos que vai usar (imagens e paginas),

Leia mais

INDICE 1. INTRODUÇÃO À INTERNET E A THE WORLD WIDE WEB...4

INDICE 1. INTRODUÇÃO À INTERNET E A THE WORLD WIDE WEB...4 INTRODUÇÃO À PROGRAMAÇÃO WEB 2007 1 INDICE 1. INTRODUÇÃO À INTERNET E A THE WORLD WIDE WEB...4 1.1 A INTERNET...4 1.2 ENDEREÇAMENTO INTERNET...4 1.3 DEFINIÇÕES DA HTML...4 1.4 ELEMENTOS DE UM PROJETO WEB...4

Leia mais

HTML. Conceitos básicos de formatação de páginas WEB

HTML. Conceitos básicos de formatação de páginas WEB HTML Conceitos básicos de formatação de páginas WEB HTML HyperText Markup Language Linguagem utilizada para criar hipertexto na web Ou seja, criar documentos estruturados utilizando para tal um conjunto

Leia mais

Desenvolvimento de Sites com PHP e Mysql Docente André Luiz Silva de Moraes

Desenvolvimento de Sites com PHP e Mysql Docente André Luiz Silva de Moraes Roteiro 2: Introdução a Linguagem HTML Desenvolvimento de Sites com PHP e Mysql Neste roteiro é explorada a linguagem HTML. A linguagem HTML (Hypertext Markup Language) é amplamente utilizada na construção

Leia mais

André Kawamoto NE31A

André Kawamoto NE31A André Kawamoto NE31A Internet Internet: uma coleção de redes Todos os computadores conectados à Internet fazem parte de uma rede (rede local, rede doméstica) Rede de Redes Internet x WWW Internet e World

Leia mais

Desenvolvimento em Ambiente Web. Prof. André Y. Kusumoto andrekusumoto.unip@gmail.com

Desenvolvimento em Ambiente Web. Prof. André Y. Kusumoto andrekusumoto.unip@gmail.com Desenvolvimento em Ambiente Web Prof. André Y. Kusumoto andrekusumoto.unip@gmail.com Listas A HTML permite definir três categorias distintas de listas: Ordenadas Sem ordenação Lista de definição 2/28 Listas

Leia mais

Desenvolvedor Web Docente André Luiz Silva de Moraes

Desenvolvedor Web Docente André Luiz Silva de Moraes Roteiro 2: Introdução a Linguagem HTML Neste roteiro é explorada a linguagem HTML. A linguagem HTML (Hypertext Markup Language) é amplamente utilizada na construção de páginas de internet e é responsável

Leia mais

Passa a passo para construir uma página pessoal - Parte 1

Passa a passo para construir uma página pessoal - Parte 1 Passa a passo para construir uma página pessoal - Parte 1 Quais ferramentas são necessárias? - Editor de texto básico (sem formatações): use o Bloco de Notas (não use o MS Word e WordPad) - Navegador (browser):

Leia mais

Aplicação para Web I. Começando a compreender o HTML

Aplicação para Web I. Começando a compreender o HTML Aplicação para Web I Começando a compreender o HTML A Linguagem da WEB O HTML ou HyperText Markup Language linguagem universal compreendida pelos navegadores web (browsers) para a comunicação utilizando

Leia mais

INTRODUCAO DESENVOLVIMENTO E DESIGN DE WEBSITES INTRODUÇÃO. Professor Carlos Muniz

INTRODUCAO DESENVOLVIMENTO E DESIGN DE WEBSITES INTRODUÇÃO. Professor Carlos Muniz INTRODUCAO DESENVOLVIMENTO E DESIGN DE INTRODUÇÃO INTRODUÇÃO A linguagem HTML (Hipertext Markup Language Linguagem de Marcação de Hipertexto) é usada para divulgar páginas na World Wide Web, o serviço

Leia mais

Mini-curso de PHP. Aulas ministradas por: André Luis de Paula Arthur Kalsing Diego Silva

Mini-curso de PHP. Aulas ministradas por: André Luis de Paula Arthur Kalsing Diego Silva Mini-curso de PHP Aulas ministradas por: André Luis de Paula Arthur Kalsing Diego Silva Aula 1 Breve introdução de HTML, Conceitos básicos de PHP, Sintaxe, Separador de instruções e Comentários (Cap 1

Leia mais

Introdução 1ª Parte Web Web Web Web Browsers Editores Editores Etiquetas (tags) base indica que se trata de uma página escrita em linguagem HTML. Esta deve abranger todo o código;

Leia mais

OPERAÇÃO DE SOFTWARE E APLICATIVOS

OPERAÇÃO DE SOFTWARE E APLICATIVOS OPERAÇÃO DE SOFTWARE E APLICATIVOS 1 SUMÁRIO 1 INTRODUÇÃO A WEB... 4 1.1 O QUE É A WORLD WIDE WEB?... 4 1.2 COMO FUNCIONA A WWW?... 4 1.3 SERVIDORES WEB... 4 1.4 BROWSERS... 4 1.5 PADRÕES DA WEB... 5 1.6

Leia mais

Curso Superior de Tecnologia em Análise e Desenvolvimento de Sistemas Prof. Felippe Scheidt IFPR Campus Foz do Iguaçu 2014/2

Curso Superior de Tecnologia em Análise e Desenvolvimento de Sistemas Prof. Felippe Scheidt IFPR Campus Foz do Iguaçu 2014/2 Curso Superior de Tecnologia em Análise e Desenvolvimento de Sistemas Prof. Felippe Scheidt IFPR Campus Foz do Iguaçu 2014/2 Objetivo. O objetivo da disciplina é conhecer os princípios da programação de

Leia mais

Ferramentas para Multimídia e Internet - 1486

Ferramentas para Multimídia e Internet - 1486 1 Ferramentas para Multimídia e Internet - 1486 HTML BÁSICO: O que é uma página WEB? Uma página WEB, também conhecida pelo termo inglês webpage, é uma "página" na World Wide Web, geralmente em formato

Leia mais

Web Design. Prof. Felippe

Web Design. Prof. Felippe Web Design Prof. Felippe 2015 Sobre a disciplina Fornecer ao aluno subsídios para o projeto e desenvolvimento de interfaces de sistemas Web eficientes, amigáveis e intuitivas. Conceitos fundamentais sobre

Leia mais

Curso PHP Básico. Jairo Charnoski do Nascimento

Curso PHP Básico. Jairo Charnoski do Nascimento Curso PHP Básico Jairo Charnoski do Nascimento Agenda Ferramentas necessárias Introdução HTML HTML? Tags Construindo seu primeiro website Observações sobre a estrutura Mais tags Atributos Agenda Cores

Leia mais

SIMULADOS & TUTORIAIS

SIMULADOS & TUTORIAIS SIMULADOS & TUTORIAIS TUTORIAIS HTML Como criar links em HTML Copyright 2013 Todos os Direitos Reservados Jorge Eider F. da Silva Proibida a reprodução deste documento no todo ou em parte por quaisquer

Leia mais

Tutorial de HTML. O que é HTML? Aprendendo

Tutorial de HTML. O que é HTML? Aprendendo Tutorial de HTML Tutorial: O que é HTML? Aprendendo Títulos Textos Imagens Links Imagens Clicáveis Explorando o TAG BODY Música de Fundo Gifs Animados Tabelas Testando sua Página O que é HTML? HTML é uma

Leia mais

HyperText Markup Language HTML

HyperText Markup Language HTML HyperText Markup Language HTML Prof. Luis Nícolas de Amorim Trigo nicolas.trigo@ifsertao-pe.edu.br http://professor.ifsertao-pe.edu.br/nicolas.trigo/ Introdução Linguagem de Marcação de Hipertexto. Uma

Leia mais

UFCD 21 Criação de sites webs D U R A Ç Ã O : 5 0 H O R A S

UFCD 21 Criação de sites webs D U R A Ç Ã O : 5 0 H O R A S UFCD 21 Criação de sites webs 1 D U R A Ç Ã O : 5 0 H O R A S Objectivos: 2 C R I A R D O C U M E N T O S E M H I P E R T E X T O D E S E N V O L V E R E A L O J A R U M S I T E N A I N T E R N E T Conteúdos

Leia mais

Programação web Prof. Wladimir

Programação web Prof. Wladimir Programação web Prof. Wladimir HTML @wre2008 1 Sumário Histórico; Resumo XHTML; Tags; Edição de documentos HTML; Publicação de um documento; Estrutura básica de um documento HTML; Edição de documentos

Leia mais

Programação e Designer para WEB

Programação e Designer para WEB Programação e Designer para WEB html Prof. Rodrigo Rocha prof.rodrigorocha@yahoo.com http://www.bolinhabolinha.com Apresentação Onde Estamos Introdução a hipertexto. A linguagem. Ambientes para programação

Leia mais

Introdução. História. Como funciona

Introdução. História. Como funciona Introdução O HTML é uma linguagem de marcação utilizada para desenvolvimento de sites. Esta linguagem surgiu junto com o HTTP, ambos possibilitaram a internet ser popularizada. História O HTML foi criado

Leia mais

HTML Curso Básico HTML CURSO BÁSICO Aprenda os conceitos iniciais de HTML em alguns minutos.

HTML Curso Básico HTML CURSO BÁSICO Aprenda os conceitos iniciais de HTML em alguns minutos. HTML CURSO BÁSICO Aprenda os conceitos iniciais de HTML em alguns minutos. 1 Índice 1 - INTRODUÇÃO 3 2 - TAGS 3 3 - EDITORES 3 4 - SALVANDO UMA PAGINA HTML 3 5 - INICIANDO UMA PÁGINA 3 6 - CONSTRUINDO

Leia mais

Tutorial Módulo 1: Introdução e primeiros passos Por Daniel Chicayban (dan@trendnet.com.br)

Tutorial Módulo 1: Introdução e primeiros passos Por Daniel Chicayban (dan@trendnet.com.br) Tutorial Módulo 1: Introdução e primeiros passos Por Daniel Chicayban (dan@trendnet.com.br) Introdução A HyperText Markup Language e a Web No núcleo de toda página da Web, encontramos a HyperText Markup

Leia mais

Programação para Internet I

Programação para Internet I Programação para Internet I Aula 05 e 06 Fernando F. Costa nando@fimes.edu.br 1 Tags de Formatação de Texto - Permite que um texto se mova de um lado para o outro da página. Sintaxe:

Leia mais

MÓDULO 1 - xhtml Básico

MÓDULO 1 - xhtml Básico MÓDULO 1 - xhtml Básico 1. Introdução xhtml significa Extensible Hypertext Markup Language (Linguagem de Marcação Hipertextual Extensível) e é a linguagem de descrição de documentos usada na World Wide

Leia mais

4.14 - Imagens: src único atributo que não pode ser omitido neste TAG Nota: img

4.14 - Imagens: <img src=...> src <img src=tecnologia.jpg> único atributo que não pode ser omitido neste TAG Nota: img 4.14 - Imagens: O TAG utilizado para a inclusão de imagens em páginas html é o: O atributo src especifica o local onde está a imagem e o seu nome. Nas páginas pessoais é mais comum o uso

Leia mais

Roteiro de Estudos e Atividades Avaliativas HTML

Roteiro de Estudos e Atividades Avaliativas HTML Roteiro de Estudos e Atividades Avaliativas HTML Faça essa atividade de forma individual ou em dupla, faça o máximo de questões que conseguir. Pesquise na Web o significado das tags e utilize-as para alcançar

Leia mais

4.14 - Imagens: SRC único atributo que não pode ser omitido neste tag Nota: img

4.14 - Imagens: <IMG SRC=...> SRC <IMG SRC=tecnologia.jpg> único atributo que não pode ser omitido neste tag Nota: img 4.14 - Imagens: O tag utilizado para a inclusão de imagens em páginas html é o: O atributo SRC especifica o local aonde está a imagem e o seu nome. Nas páginas pessoais é mais comum o uso

Leia mais

Desenvolvimento Web Introdução a XHTML. Prof. Bruno Gomes

Desenvolvimento Web Introdução a XHTML. Prof. Bruno Gomes Desenvolvimento Web Introdução a XHTML Prof. Bruno Gomes 2014 Introdução HTML e XHTML Estrutura básica do documento DTDs Validação do documento Exercícios HTML e XHTML HTML (Hipertext Markup Language)

Leia mais

PDI 1 - Projeto e Design de Interfaces Web

PDI 1 - Projeto e Design de Interfaces Web Introdução a HTML e XHTML Elementos básicos parte 2 Professor: Victor Hugo L. Lopes Agenda: --Aprofundando nos elementos básicos do HTML; --Criando Hiperlinks em HTML; 2 Estrutura básica de um documento

Leia mais

OS LINKS Os termos que aparecem em destaque na página, geralmente sublinhados e em cores diferentes, são textos que indicam uma ligação hipertexto.

OS LINKS Os termos que aparecem em destaque na página, geralmente sublinhados e em cores diferentes, são textos que indicam uma ligação hipertexto. Apostila de web estático Prof. Eduardo 2 CAPÍTULO PADRÕES DE FUNDO Uma Home page pode conter uma textura como padrão de fundo, um arquivo no formato gif ou jpg, ou utilizar as cores do padrão RGB. A notação

Leia mais

1.Introdução ao HTML página 04. 2.O que é o HTML página 05. 3.O que são tags HTML página 05. 4.Iniciando com HTML página 10

1.Introdução ao HTML página 04. 2.O que é o HTML página 05. 3.O que são tags HTML página 05. 4.Iniciando com HTML página 10 Apostila de Índice HTML 1.Introdução ao HTML página 04 2.O que é o HTML página 05 3.O que são tags HTML página 05 4.Iniciando com HTML página 10 5.Mais tags HTML página 12 6.Atributos página 14 7.Links

Leia mais

HTML. Um documento HTML é constituído por um conjunto de TAGS (ex. html, head, body, etc.).

HTML. Um documento HTML é constituído por um conjunto de TAGS (ex. html, head, body, etc.). HTML Um documento HTML é constituído por um conjunto de TAGS (ex. html, head, body, etc.). Para se criar um novo documento HTML pode-se utilizar o Bloco de Notas, bastando para tal gravar o documento com

Leia mais

Web Design Aula 02: HTML

Web Design Aula 02: HTML Web Design Aula 02: HTML Professora: Priscilla Suene priscilla.silverio@ifrn.edu.br Motivação Roteiro Introdução Conceitos HTML Primeira Página Identação Incluindo o título Salvando a página Vizualizando

Leia mais

CURSO: PROGRAMADOR WEB DISCIPLINA: HTML 4.0.1

CURSO: PROGRAMADOR WEB DISCIPLINA: HTML 4.0.1 ESCOLA ESTADUAL PROF. JOSÉ BARROSO TOSTES PROFESSOR: ESP. ANDREW RODRIGUES CURSO: PROGRAMADOR WEB DISCIPLINA: HTML 4.0.1 CURSO: PROGRAMADOR WEB DISCIPLINA: HTML 4.0.1 1 APOSTILA DE INTRODUÇÃO À LINGUAGEM

Leia mais

A estrutura de um documento HTML apresenta os seguintes componentes:

A estrutura de um documento HTML apresenta os seguintes componentes: A estrutura de um documento HTML apresenta os seguintes componentes: Titulo do Documento texto, imagem, links,... As etiquetas HTML não são sensíveis

Leia mais

Algoritmia e Programação APROG HTML. Introdução. Nelson Freire (ISEP DEI-APROG 2014/15) 1/15

Algoritmia e Programação APROG HTML. Introdução. Nelson Freire (ISEP DEI-APROG 2014/15) 1/15 APROG Algoritmia e Programação HTML Introdução Nelson Freire (ISEP DEI-APROG 2014/15) 1/15 O que é o HTML? Sumário Geral Documento HTML Elemento HTML Estrutura Básica de Documento HTML Elementos Títulos

Leia mais

INTRODUÇÃO À PROGRAMAÇÃO

INTRODUÇÃO À PROGRAMAÇÃO Departamento de Informática INTRODUÇÃO À PROGRAMAÇÃO Apontamentos de (HyperText Markup Language) Prof. Carlos Pampulim Caldeira Évora, Março de 2003 ÍNDICE 1. O QUE É O?...1 1.1 INTRODUÇÃO...1 1.2 QUE

Leia mais

INSTITUTO FEDERAL DE EDUCAÇÃO, CIÊNCIA E TECNOLOGIA DO RN - IFRN APOSTILA: AUTORIA WEB PROFESSOR: ADDSON ARAÚJO DA COSTA SANTA CRUZ - RN

INSTITUTO FEDERAL DE EDUCAÇÃO, CIÊNCIA E TECNOLOGIA DO RN - IFRN APOSTILA: AUTORIA WEB PROFESSOR: ADDSON ARAÚJO DA COSTA SANTA CRUZ - RN INSTITUTO FEDERAL DE EDUCAÇÃO, CIÊNCIA E TECNOLOGIA DO RN - IFRN APOSTILA: AUTORIA WEB PROFESSOR: ADDSON ARAÚJO DA COSTA SANTA CRUZ - RN Sumário 1. Introdução...1 2. Tags...1 3. HTML...1 4. Cabeça, Corpo

Leia mais

WEB DESIGNER WEB DESIGNER

WEB DESIGNER WEB DESIGNER WEB DESIGNER 1 WEB DESIGNER INICIO DO CURSO DE HTML 4.0 Toda vez que você acessar um site (veja tópico Word Wide Web) por meios de domínios quando adiciona a URL na barra de endereço, do seu Navegador

Leia mais

Aula 03: Noções Fundamentais do CSS, Formatação de Fonte e Inserção de Imagens

Aula 03: Noções Fundamentais do CSS, Formatação de Fonte e Inserção de Imagens Aula 03: Noções Fundamentais do CSS, Formatação de Fonte e Inserção de Imagens Tag para inserir imagens e HTML O modelo CSS Noções fundamentais e funcionamento do CSS Incluindo estilos em uma página Sintaxe

Leia mais

INTRODUÇÃO AO DESENVOLVIMENTO WEB. PROFª. M.Sc. JULIANA H Q BENACCHIO

INTRODUÇÃO AO DESENVOLVIMENTO WEB. PROFª. M.Sc. JULIANA H Q BENACCHIO INTRODUÇÃO AO DESENVOLVIMENTO WEB PROFª. M.Sc. JULIANA H Q BENACCHIO Estrutura básica do HTML Um documento HTML deve estar delimitado pela tag e . Dentro deste documento, podemos ainda distinguir

Leia mais

Claudio Damasceno. Avançar

Claudio Damasceno. Avançar Claudio Damasceno Conteúdo Alinhamento Âncoras, Links Tabelas Formatação Próximo Capítulo HTML prof.claudiodamasceno@hotmail.com 2 Recapitulando - Estrutura básica título DA PÁGINA

Leia mais

Técnicas e processos de produção. Profº Ritielle Souza

Técnicas e processos de produção. Profº Ritielle Souza Técnicas e processos de produção Profº Ritielle Souza INTRODUÇÃO HTML Sigla em inglês para Hyper Text Markup Language, traduzindo daria algo como Linguagem para marcação de Hipertexto. E o que seria o

Leia mais

Lista e Tabelas. Fundamentos da Linguagem Web

Lista e Tabelas. Fundamentos da Linguagem Web Lista e Tabelas Fundamentos da Linguagem Web Bruno Angelo Medeiros Março de 2015 LISTAS O que são? Tipos Ordenadas Não ordenadas De definição Exemplos Exercícios LISTAS - O QUE SÃO? São uma forma de organização

Leia mais

2 HTML Inserindo objetos

2 HTML Inserindo objetos 2 HTML Inserindo objetos Vinicius A. de Souza va.vinicius@gmail.com São José dos Campos, 2011. 1 Sumário Desenvolvimento Web Imagem...3 Links...5 Links para locais da mesma página...6 Áudio e vídeo...8

Leia mais

Introdução. Introdução a HTML. A Linguagem HTML. Estrutura de uma Página. Mário Antonio Meireles Teixeira

Introdução. Introdução a HTML. A Linguagem HTML. Estrutura de uma Página. Mário Antonio Meireles Teixeira Introdução Introdução a HTML Mário Antonio Meireles Teixeira Dept o. de Informática - UFMA mario@deinf.ufma.br Página Web: É um documento composto de texto e códigos especiais, chamados tags, que especificam

Leia mais

Faculdade de Ciências Médicas FCM Unicamp Núcleo de Tecnologia de Informação NTI

Faculdade de Ciências Médicas FCM Unicamp Núcleo de Tecnologia de Informação NTI Manual do usuário Desenvolvendo páginas em Drupal Faculdade de Ciências Médicas FCM Unicamp Núcleo de Tecnologia de Informação NTI Conteúdo Primeiro Passo... 3 1.1 Login... 3 1.2 Recuperando a Senha...

Leia mais

Profa. Reane Franco Goulart

Profa. Reane Franco Goulart Profa. Reane Franco Goulart A linguagem HTML (Hypertext Markup Language) tem o objetivo de formatar textos através de marcações especiais denominadas tags, para que possam ser exibidos de forma conveniente

Leia mais

HTML -- Criação de Home Page

HTML -- Criação de Home Page i.exe PPáággi innaa 1 INTERNET Uma rede convencional pode se conectar através de pontes ou gateways com outras redes. Quando a Internet surgiu o propósito inicial não era a conexão entre computadores,

Leia mais

Tecnologia WEB I. Prof. Erwin Alexander Uhlmann. Dos princípios do HTML, estruturação com CSS e automação com Javascript

Tecnologia WEB I. Prof. Erwin Alexander Uhlmann. Dos princípios do HTML, estruturação com CSS e automação com Javascript 1 Tecnologia WEB I Prof. Erwin Alexander Uhlmann Dos princípios do HTML, estruturação com CSS e automação com Javascript UHLMANN, Erwin Alexander. Dos princípios do HTML, estruturação com CSS e automação

Leia mais

Programação para Internet

Programação para Internet Programação para Internet Aula 07 Os direitos desta obra foram cedidos à Universidade Nove de Julho Este material é parte integrante da disciplina oferecida pela UNINOVE. O acesso às atividades, conteúdos

Leia mais

APOSTILA. Curso de HTML com PHP HTML. Pablo Dapont

APOSTILA. Curso de HTML com PHP HTML. Pablo Dapont APOSTILA Curso de HTML com PHP HTML Pablo Dapont PET Computação - sala 202 Prédio 43424 ( prédio dos laboratórios ) Instituto de Informática - UFRGS email : pet@inf.ufrgs.br Av. Bento Gonçalves, 9500 bloco

Leia mais

TECNOLOGIAS WEB AULA 5 PROF. RAFAEL DIAS RIBEIRO @RIBEIRORD

TECNOLOGIAS WEB AULA 5 PROF. RAFAEL DIAS RIBEIRO @RIBEIRORD TECNOLOGIAS WEB AULA 5 PROF. RAFAEL DIAS RIBEIRO @RIBEIRORD Objetivos: Apresentar as principais tags utilizadas na construção de páginas Web. Compreender as principais funcionalidades de cada tag utilizada.

Leia mais

Aula 4: Cores e Multimídia

Aula 4: Cores e Multimídia Aula 4: Cores e Multimídia Nesta quarta aula vamos entender os conceitos de cores na WEB. Veremos como definir a cor da página e dos textos. Aprenderemos a incluir recursos multimídia de som e vídeo em

Leia mais

Prof. Vania Gimenez- Aula de Hoje Caro aluno- Este material é só um apoio as aulas, os livros devem ser utilizados para o aprimoramento de seu estudo.

Prof. Vania Gimenez- Aula de Hoje Caro aluno- Este material é só um apoio as aulas, os livros devem ser utilizados para o aprimoramento de seu estudo. Prof. Vania Gimenez- Aula de Hoje Caro aluno- Este material é só um apoio as aulas, os livros devem ser utilizados para o aprimoramento de seu estudo. Como defino e escrevo uma classe? Classe é um seletor

Leia mais

Introdução ao HTML 5 e Implementação de Documentos

Introdução ao HTML 5 e Implementação de Documentos Linguagem de Programação para Web Introdução ao HTML 5 e Implementação de Documentos Prof. Mauro Lopes 1-31 20 Objetivo Iremos aqui apresentar a estrutura básica de um documento HTML e iremos também apresentar

Leia mais

A seguir voce vai poder acompanhar, em 10 passos, como gerenciar o conteúdo das páginas pelas quais voce é responsável.

A seguir voce vai poder acompanhar, em 10 passos, como gerenciar o conteúdo das páginas pelas quais voce é responsável. A seguir voce vai poder acompanhar, em 10 passos, como gerenciar o conteúdo das páginas pelas quais voce é responsável. Índice Geral TULogarUT 3 TUConhecer e VisualizarUT 6 TUÁrea de Edição / Blocos e

Leia mais

mkdir /srv/www/default/html/calculadora/imagens mkdir /srv/www/default/html/calculadora/blocos

mkdir /srv/www/default/html/calculadora/imagens mkdir /srv/www/default/html/calculadora/blocos Programando em PHP www.guilhermepontes.eti.br lgapontes@gmail.com Criando uma Calculadora Primeiramente deve se criar uma estrutura para armazenar os arquivos necessários para o funcionamento da calculadora.

Leia mais

CURSO CONSTRUÇÃO DE WEBSITES

CURSO CONSTRUÇÃO DE WEBSITES CURSO CONSTRUÇÃO DE WEBSITES Aline Michelle Ellen Oliveira Maria do Carmo Alves da Silva Patrícia Virgínia de Souza Magalhães Sueli Gonçalves da Silva APOSTILA DE INTRODUÇÃO À LINGUAGEM HTML HTML significa

Leia mais

6 Aplicações Ricas para Internet

6 Aplicações Ricas para Internet 6 Aplicações Ricas para Internet DESENVOLVIMENTO WEB II - 7136 6.1. Evolução das aplicações para web O crescente número de pessoas que usufruem da informatização das tarefas cotidianas, viabilizadas na

Leia mais

MINISTÉRIO DA EDUCAÇÃO

MINISTÉRIO DA EDUCAÇÃO MINISTÉRIO DA EDUCAÇÃO SECRETARIA DE EDUCAÇÃO PROFISSIONAL E TECNOLÓGICA INSTITUTO FEDERAL DE EDUCAÇÃO, CIÊNCIA E TECNOLOGIA DE SANTA CATARINA CAMPUS SÃO JOSÉ TECNICO EM TELECOMUNICAÇÕES REDES DE COMPUTADORES

Leia mais

Ensino I nterativo Universidade Anhembi Morumbi. Multimídia I

Ensino I nterativo Universidade Anhembi Morumbi. Multimídia I Ensino I nterativo Universidade Anhembi Morumbi Multimídia I Objetivo Mostrar o que é preciso para o desenvolvimento de um Projeto para Web, apresentando os primeiros conceitos de HTML. Tópicos 1. Etapas

Leia mais

Guia de Início Rápido

Guia de Início Rápido Guia de Início Rápido O Microsoft Word 2013 parece diferente das versões anteriores, por isso criamos este guia para ajudar você a minimizar a curva de aprendizado. Barra de Ferramentas de Acesso Rápido

Leia mais

WebDesign. Professor: Paulo Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br. Escola CDI de Videira

WebDesign. Professor: Paulo Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br. Escola CDI de Videira WebDesign Professor: Paulo Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira Entendendo Alguns Conceitos Antes de prosseguirmos é importante ter em mente o motivo pelo

Leia mais

Por que aprender a fazer tabelas? Tabelas auxiliam na formatação da página, e é por essa razão que eles foram acrescentados à linguagem html

Por que aprender a fazer tabelas? Tabelas auxiliam na formatação da página, e é por essa razão que eles foram acrescentados à linguagem html Por que aprender a fazer tabelas? Tabelas auxiliam na formatação da página, e é por essa razão que eles foram acrescentados à linguagem html Tabela de dados Tabelas para alinhar texto Tabelas para conter

Leia mais

Módulo: Criação de Páginas WEB

Módulo: Criação de Páginas WEB Módulo: Criação de Páginas WEB 50 Horas - Sessão 05/13 TEXTO ANIMADO O comando MARQUEE orienta o browser a definir o efeito de texto/imagem a passar no ecrã. Deve ser utilizado quando queremos dar destaque

Leia mais

XHTML. A versão mais recente desta linguagem é a XHTML (extensible HyperText Markup Language Linguagem de Marcação de Hipertexto Estendida).

XHTML. A versão mais recente desta linguagem é a XHTML (extensible HyperText Markup Language Linguagem de Marcação de Hipertexto Estendida). XHTML 1. Significado do Termo HTML (HyperText Markup Language Linguagem de Marcação de Hipertexto) é a linguagem na qual são feitas as páginas que irão compor um site da Internet. A versão mais recente

Leia mais

MODULO 4 DESENVOLVIMENTO DE PÁGINAS WEB ESTÁTICAS. Redes de Comunicação

MODULO 4 DESENVOLVIMENTO DE PÁGINAS WEB ESTÁTICAS. Redes de Comunicação MODULO 4 DESENVOLVIMENTO DE PÁGINAS WEB ESTÁTICAS Redes de Comunicação Regras para um website eficaz Categorização dos conteúdos estrutura lógica dos conteúdos Condensação conteúdos simples e directos

Leia mais

Introdução a Tecnologia Web Desenvolvimento e Manutenção de Site

Introdução a Tecnologia Web Desenvolvimento e Manutenção de Site Tecnologia Educacional na Formação Profissionalizante de Jovens Introdução a Tecnologia Web Jovens do Saber Digital Inclusão Sócio-Digital Fortaleza - Ceará, Brasil Sumário 1. O que é a Internet? 2. O

Leia mais

Introdução; Sintaxe; Utilizando estilos; Estilo In-line; Estilo Incorporado; Estilo Vinculado; Prioridade; Cores; Valores Relativos x Absolutos.

Introdução; Sintaxe; Utilizando estilos; Estilo In-line; Estilo Incorporado; Estilo Vinculado; Prioridade; Cores; Valores Relativos x Absolutos. Ana Paula Ambrósio Zanelato anapaula@unitoledo.br Disciplina: Aplicações para Web Conteúdo Introdução; ; Utilizando estilos; Estilo In-line; Estilo Incorporado; Estilo Vinculado; Prioridade; Cores; Valores

Leia mais

7. Cascading Style Sheets (CSS)

7. Cascading Style Sheets (CSS) 7. Cascading Style Sheets (CSS) O CSS (Folha de Estilo em Cascata) é um padrão de formatação para páginas web que vai além das limitações impostas pelo HTML. O Cascading Style Sheets não é exatamente uma

Leia mais

Autoria Web HTML. Introdução a HTML e as principais tags da linguagem. Thiago Miranda dos Santos Souza

Autoria Web HTML. Introdução a HTML e as principais tags da linguagem. Thiago Miranda dos Santos Souza HTML Introdução a HTML e as principais tags da linguagem Conteúdos Os materiais de aula, apostilas e outras informações estarão disponíveis em: www.thiagomiranda.net Objetivos Apresentar a HTML Apresentar

Leia mais

jquery Apostila Básica

jquery Apostila Básica jquery Apostila Básica INTRODUÇÃO 3 CAPÍTULO 1 POR ONDE INICIAR 3 CAPÍTULO 2 MEU PRIMEIRO SCRIPT! 4 EXERCÍCIOS...5 CAPÍTULO 3 ADICIONANDO CSS 6 EXERCÍCIOS...7 CAPÍTULO 4 MODIFICANDO APENAS PARTE DO DOCUMENTO

Leia mais

Observações importantes:

Observações importantes: Fundação CECIERJ - Vice Presidência de Educação Superior a Distância Curso de Tecnologia em Sistemas de Computação Disciplina Criação de Páginas de WEB AD1 1 semestre de 2014. Observações importantes:

Leia mais

PÓS-GRADUAÇÃO EM MATEMÁTICA COMPUTACIONAL INFORMÁTICA INSTRUMENTAL Aula 06: Introdução Linguagem HTML

PÓS-GRADUAÇÃO EM MATEMÁTICA COMPUTACIONAL INFORMÁTICA INSTRUMENTAL Aula 06: Introdução Linguagem HTML PÓS-GRADUAÇÃO EM MATEMÁTICA COMPUTACIONAL INFORMÁTICA INSTRUMENTAL Aula 06: Introdução Linguagem HTML O Desenvolvimento Web O desenvolvimento web é o termo utilizado para descrever atividade relacionada

Leia mais

FTIN - Módulo de WebDesign. Prof. Iran Pontes

FTIN - Módulo de WebDesign. Prof. Iran Pontes FTIN - Módulo de WebDesign Prof. Iran Pontes FTIN FORMAÇÃO TÉCNICA EM INFORMÁTICA IMPLEMENTAÇÃO HTML/CSS Hipertexto É um sistema para a visualização de informação cujos documentos contêm referências internas

Leia mais

TECNOLOGIAS WEB. Unidade 2 Introdução a Construção de Páginas Estáticas. Luiz Leão luizleao@gmail.com http://luizleao.com

TECNOLOGIAS WEB. Unidade 2 Introdução a Construção de Páginas Estáticas. Luiz Leão luizleao@gmail.com http://luizleao.com Luiz Leão luizleao@gmail.com http://luizleao.com CONTEÚDO PROGRAMÁTICO DESTA UNIDADE HTML TAG S HTML LINGUAGEM HTML Hypertext Markup Language Interpretada pelo navegador Não linearidade da informação Formatação

Leia mais

1 INTRODUÇÃO. Web é o diminutivo para World Wide Web.

1 INTRODUÇÃO. Web é o diminutivo para World Wide Web. 1 1 INTRODUÇÃO Antes de começarmos a trabalhar HTML, é necessário que se conheça alguns termos básicos que envolvem esta linguagem. Internet é um conjunto de pequenas redes de computadores, formando assim

Leia mais

HTML -- Criação de Home Page

HTML -- Criação de Home Page PPáággi innaa 1 LISTAS Na linguagem HTML existem elementos específicos para a criação de listas, que podem ser listas ordenadas (OL), listas sem ordenação (UL), ou listas de definição (DL). Um detalhe

Leia mais

EXEMPLO. h1 {font-family: arial, verdana, sans-serif;} h2 {font-family: "Times New Roman", serif;}

EXEMPLO. h1 {font-family: arial, verdana, sans-serif;} h2 {font-family: Times New Roman, serif;} Fontes A propriedade font-family é usada para definir uma lista de fontes e sua prioridade para apresentação de um elemento em uma página. Se a primeira fonte da lista não estiver instalada na máquina

Leia mais

Instrução de Trabalho Base de Conhecimento

Instrução de Trabalho Base de Conhecimento Aprovado por Comitê da Qualidade Analisado criticamente por Dono do processo 1. OBJETIVOS Esta instrução de trabalho tem como objetivo orientar os colaboradores da SINFO, de como a será mantida e acessada.

Leia mais

WEBDESIGN. Professor: Paulo Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira

WEBDESIGN. Professor: Paulo Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira WEBDESIGN Professor: Paulo Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira 1 CDI - Curso de Webdesign - Prof. Paulo Trentin Objetivos para esta aula Debater sobre

Leia mais

Coleção - Análises de email marketing em clientes de email

Coleção - Análises de email marketing em clientes de email Coleção - Análises de email marketing em clientes de email Thunderbird e Terra Nesta terceira edição da Coletânea de Análises de Email Marketing em Clientes de Email, apresentamos os estudos do webmail

Leia mais

CRIAÇÃO DE SITES (AULA 4)

CRIAÇÃO DE SITES (AULA 4) Prof. Breno Leonardo Gomes de Menezes Araújo brenod123@gmail.com http://blog.brenoleonardo.com.br CRIAÇÃO DE SITES (AULA 4) O que eu preciso para construir um link? Para construir um link você usa o que

Leia mais