PROGRAMAÇÃO EM AMBIENTE WEB I
|
|
- Clara Graça Camarinho
- 6 Há anos
- Visualizações:
Transcrição
1 PROGRAMAÇÃO EM AMBIENTE WEB I Prof. Esp. Fabiano Taguchi fabianotaguchi@gmail.com UM POUCO DE HISTÓRIA Tudo começou com a ARPANET; 1977 ARPANET nasce 1987 Das universidades, volta-se a fins comerciais 1991 É criado o HTML HTTP - WWW 1
2 WWW É um grande conjunto de documentos (páginas) interligados, onde cada uma dessas páginas pode conter um tipo de hipermídia: Vídeos Sons Hipertextos Figuras MAIS UM POUCO DE HISTÓRIA Logo do Mosaic Mosaic exibindo uma página de
3 HISTÓRIA: HTML 1992: Primeira aparição do HTML; 1993: HTML + algumas definições de aparência, tabelas e formulários. 1994: HTML padronização de características 1994: HTML extensão do HTML 1995: HTML padronização do Netscape e Internet Explorer. HISTÓRIA: HTML 2000: XHTML é criado (versão do HTML 4.0); 2004: Surge a Web 2.0; 2008: W3c anuncia a especificação do HTML : Crescente o desenvolvimento do HTML : Previsão da versão final do HTML5 Hoje: Difusão de uso do HTML5. 3
4 WEB 1.0 Tinha como características: Estática, não existia interatividade; Destaque para o surgimento dos grandes portais; 1994 Apenas 10 mil sites hospedados. WEB 2.0 Tinha (tem) como características: Web colaborativa; Oferece conteúdo dinâmico com interatividade dos usuários; Criação de redes sociais dás mais variadas instâncias e finalidades. 4
5 WEB 3.0 Terá como características: Geração de conteúdo através da coletividade; Ferramentas para inovação; Terceirização de tarefas para um grande número de pessoas. Exemplos: Companhia aérea Azul. Exemplos: Starbucks LINGUAGEM DE MARCAÇÃO E ESTILOS - HTML 5
6 SEPARAÇÃO EM CAMADAS HTML Conteúdo Dados e estrutura CSS Apresentação Cores, fontes e posicionamentos. JavaScript Comportamentos - Interatividade 6
7 HYPERTEXT MARKUP LANGUAGE Ou simplesmente HTML é uma linguagem de marcação interpretada por um navegador Web, esta linguagem é composta por diversas tags com atributos que permitem que seja escrito um site. Tag indica estrutura Atributos são as propriedades de uma estrutura. ESTRUTURA DE UMA PÁGINA <!DOCTYPE html> <html> <head> <meta charset= UTF-8 /> <title> Minha primeira página em HTML </title> </head> <body> Minha primeira informação. </body> </html> 7
8 REGRAS HTML As tags HTML devem ser escritas em letras minúsculas e devem ser fechadas, bem como atributos devem sempre ter valores e entre aspas duplas. Exemplos: <p> Começamos um novo parágrafo </p> <b><p> Parágrafo em negrito </p></b> <br /> <hr /> <img src= imagem.gif alt= Foto da cidade /> TAGS ESTRUTURAIS 8
9 BODY Envolve todo o conteúdo HTML e pode receber vários atributos, dentre eles destacam-se: bgcolor Cor de fundo background Imagem como plano de fundo text Cor do texto principal link Cor dos links existentes na página alink Cor do link que foi ativado vlink Cor do link que já foi visitado META Esta tag fornece informações sobre o documento que não são mostrados, mas que podem ser utilizados em buscadores. <head> <meta name= aula content= Programação Web /> <meta name= keywords content= HTML, CSS /> <meta name= author content= Fabiano Taguchi /> <meta charset= UTF-8 /> </head> 9
10 META A tag ainda pode definir a linguagem natural da página, conteúdo padrão e redirecionamento de páginas. <head> <meta http-equiv= Content-Language content= pt-br > <meta http-equiv= Content-Type content= text/html > <meta http-equiv= refresh content= 5 ; URL= p1.html > </head> STYLE Apesar de ser recomendado utilizar regras CSS em arquivos separados (organização), esta tag é utilizada para inserir o CSS diretamente no HTML de uma página. O atributo utilizado é o type. <style type= text/css > body { color: red; background-color: blue; </style> 10
11 SCRIPT Tag utilizada para incluir um código JavaScript em uma página HTML. Os principais atributos utilizados são: src; type; async; charset. <script type= text/javascript src= ania.js > </script> ATRIBUTOS DE FORMATAÇÃO 11
12 FORMATAÇÃO font u em s sub big small i sup Alteração de face (face), cor (color) e tamanho (size) Efeito sublinhado Efeito enfatizado Efeito tachado Efeito subscrito Efeito que aumenta o texto Efeito que diminui o texto Efeito itálico Efeito sobrescrito TAGS PARA CONTEÚDO 12
13 IMAGEM DE FUNDO O atributo background quando usado na tag body permite que seja inserido uma imagem de fundo em uma página. <body background= fotos/cores.png > Informações a serem exibidas na página </body> PARÁGRAFOS Representada pela tag <p>, seu objetivo é organizar textos dentro de uma página HTML separando-os. O principal atributo é o align. <p> Começamos um novo parágrafo </p> <p align= right > Parágrafo à direita </p> <p align= left > Parágrafo à esquerda</p> 13
14 CORES Para trabalhar com cores em uma página HTML devem ser utilizados os atributos color e bgcolor. <body bgcolor= #00ff99 > <hr> <p color= #ff0000 > Exemplo de texto </p> </body> CABEÇALHOS 14
15 PRE É utilizada para mostrar um texto em sua formatação original, desta forma todos os enters, tab e espaços são preservados. <pre> Texto separado por dois espaços </pre> <pre> Texto em quebras de linha </pre> LINHA HORIZONTAL Para ser criado uma linha horizontal, a tag utilizada é a <hr>. <h1> Fabiano Taguchi </h1> <hr> <h2> fabianotaguchi@gmail.com </h2> <h3> </h3> 15
16 QUEBRAS DE LINHAS As quebras de linha podem ser executadas com o uso da tag <br>. <p> Esse texto ficará Na mesma linha. <br> E este em outra linha. </p> <font color= ff0000 size= 3 > As páginas Web são escritas em HTML </font> TABULAÇÃO Para que seja deixado um espaço de margem dentro da página, a tag <blockquote> é utilizada. O efeito desta tag é acumulativo. <blockquote> Está é o site da XYZ. </blockquote> <blockquote> Seja bem vindo </blockquote> 16
17 CENTRALIZAR Um texto pode ser centralizado se for colocado dentro da tag <center>. Esta tag é antiga, e era usada quando não havia formas de centralizar textos. <center> Está é o site da XYZ. </center> <center> Seja bem vindo </center> ALINHAMENTOS Para que outros alinhamentos sejam feitos, o atributo align é inserido em várias tags. <h1 align= center > Cabeçalho centralizado </h1> <p align= left > Parágrafo alinhado à esquerda </p> <p align= right > Parágrafo alinhado à direita </p> <p align= center > Parágrafo centralizado </p> 17
18 IMAGENS As imagens são inseridas em um documento Web através da tag <img>. Alguns atributos podem ser inseridos: src Especifica o caminho físico da imagem alt Indica um texto alternativo title Exibida quando cursor fica sobre a imagem width e height Atributos de largura e altura border Cria borda ao redor da imagem IMAGENS Pode ainda na versão 5 do HTML fazer uso da tag <figcaption>, que cria uma legenda para imagem. <figure> <img src= img/produto.jpeg alt= Foto > <figcaption> Produto por R$ 129,90 </figcaption> </figure> 18
19 MAPAS SENSITIVOS Um mapa consiste em uma imagem que pode ser colocados links em áreas específicas. Como áreas podem ser usadas: rect, circle ou poly. <img src="planets.gif usemap="#planetmap"> <map name= mapa1 > <area shape= rect coords= 300,2,60,60 href= # > </map> LINKS A tag que representa um link é a tag <a>, seu principal atributo é o href que indic ao local do arquivo. Target também pode ser usado como atributo, que indica se o link será aberto na mesma página ou em uma nova. <a href= > Google </a> 19
20 PERSONALIZANDO LINKS <body vlink= #ff0000 text= #ff00ff > <h2> <a href= > Link para acesso ao site do Google </a> </h2> </body> ÂNCORAS São utilizadas como ponto de referência para marcar o início de uma seção no documento. No exemplo abaixo é criado a âncora para seção 1. <a href= #secao1 > Clique aqui </a> <a name= secao1 > Conteúdo a ser mostrado </a> 20
21 LISTAS NÃO ORDENADAS As listas não ordenadas são representadas pela tag <ul>. Cada item dentro de uma lista está contido dentro das tags <li>. <ul type= square > <li> Tome uma xícara de café </li> <li> Veja o sol nascer </li> <li> Ouça o canto dos pássaros </li> <li> Ouça o vento </li> </ul> LISTAS ORDENADAS São listas nas quais cada item é numerado de forma sequencial. Para criar uma lista ordenada, utilizamos a tag <ol>. <ol start= 10 type= A > <li> Inseria o CD-ROM </li> <li> Selecione executar </li> <li> Digite a letra para o drive de CD-ROM </li> <li> siga as instruções de instalação </li> </ol> 21
22 LISTAS DE GLOSSÁRIO Uma lista de glossário possui duas partes: termo e a definição do termo. Para o termo utiliza-se a tag <dt>, para a definição a tag usada é a <dd>. <dl> <dt> Manjericão </dt> <dd> Anual. Pode crescer até quatro pés de altura </dd> </dl> ÁUDIO E VÍDEO Uma forma de adicionar áudio e vídeo em páginas Web é fazendo uso da tag embed. O HTML5 possui suporte para adicionar mídia através do elemento <audio> e do elemento <video>, fazendo uso de alguns atributos: controls Cria controles padrão para áudio e vídeo autoplay Reprodução automática loop Repetição automaticamente do arquivo widht e height Largura e altura do elemento 22
23 ÁUDIO E VÍDEO Exemplos de aplicação dos elementos <audio> e <video>: <audio src= musica.mp3 ></audio> <video src= filme.wma ></video> <video src= audio.mp3 width= 300px height= 300px controls= controls autoplay= autoplay /> TABELAS 23
24 TABELAS Uma tabela é criada a partir da tag <table>. Cada linha dentro da tabela é criado com a tag <tr>, por sua vez cada célula dentro de uma linha pela tag <td>. <table> <tr> </tr> </table> <td> </td> <td> </td> TABELAS Entre os principais atributos de tabela temos: background Imagem do plano de fundo; bgcolor Cor do plano de fundo; border Largura da borda em pixels; cellpading Espaçamento nas células; cellspacing Espaçamento entre as células; width Largura da tabela align Alinhamento da tabela bordercolor Cor na borda da tabela 24
25 TABELAS <table border= 1 > <tr> <td> Primeira coluna </td> <td> Segunda coluna </td> <td> Terceira coluna </td> </tr> <tr> <td> Primeira coluna </td> <td> Segunda coluna </td> <td> Terceira coluna </td> </tr> </table> TABELAS <table border= 2 > <caption> Dados do curso </caption> <tr> <td> Nome do curso </td> <td> Valor do curso </td> <td> Nome do professor </td> </tr> </table> 25
26 TABELAS <table border= 2 cellpading= 2 > <tr> <td colspan= 2 > Primeira linha </td> </tr> <tr> <td> Primeira coluna </td> <td> Segunda coluna </td> </tr> </table> TABELAS <table border= 2 cellpading= 2 > <tr> <td> Programação Web </td> <td> R$ 250,00 </b> <td rowspan= 2 > José Joaquim </n> </tr> <tr> <td> Lógica de Programação </td> <td> R$ 120,00 </td> </tr> </table> 26
27 TABELAS <table border= 2 cellpading= 2 > <caption> Dados do curso </caption> <tr> <th> Nome do curso </th> <th> Valor do curso </th> <th> Nome do professor </th> </tr> <tr> <td> Programção Web </td> <td> R$ 250,00 </td> <td> José Joaquim </td> </tr> </table> LINHAS DE TABELAS Como visto, para criar uma linha de uma tabela a tag <tr> é criada. Alguns atributos podem ser utilizados nas linhas: align Alinhamento do conteúdo da linha valign Alinhamento vertical do conteúdo bgcolor Define uma cor de segundo plano para linha 27
28 TABELAS <table border= 2 align= center bgcolor= ff4321 > <tr> <td> Nome do curso </td> <td valign= top nowrap> Valor </td> </tr> <tr> <td> Programação Web </td> <td> R$ 250,00 </td> </tr> </table> EXERCÍCIO 28
29 FRAMES FRAMES <html> <head> <title> Usando frames </title> </head> <frameset cols= 150,650 > <frame src= menu.html name= Menu > <frame src= principal.html name= Principal > </frameset> </html> 29
30 PÁGINA MENU.HTML <html> <head> <title> Menu </title> </head> <body bgcolor= #99ff33 > <a href= Principal.html target= Principal > </a> <a href= Java.html target= Principal > </a> <a href= JavaMe.html target= Principal > </a> </body> </html> PÁGINA PRINCIPAL.HTML <html> <head> <title> Principal </title> </head> <body bgcolor= # > Principal </body> </html> 30
31 PÁGINA JAVA.HTML <html> <head> <title> Java </title> </head> <body bgcolor= # > Java </body> </html> PÁGINA JAVAME.HTML <html> <head> <title> Java </title> </head> <body bgcolor= # > Java ME </body> </html> 31
32 FRAMES DOIS FRAMESETS <html> <head> <title> Usando frames </title> </head> <frameset rows= 150,400 > <frame src= cabecalho.html name= Cabecalho > <frameset cols= 150,650 > <frame src= menu.html name= Menu > <frame src= principal.html name= Principal > </frameset> </frameset> </html> PÁGINA CABECALHO.HTML <html> <head> <title> Cabeçalho </title> </head> <body bgcolor= # > <font align= center > Cabeçalho </font> </body> </html> 32
33 EXERCÍCIOS EXERCÍCIOS 33
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 mais4. Características Gerais das Tabelas do HTML
4. Características Gerais das Tabelas do HTML Curso de Extensão em HTML PUCRS A criação de uma tabela começa pelo tag e termina pelo tag. Antes do texto de cada linha da tabela você deve inserir o tag
Leia mais> 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 maisProgramaçã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 maisOPERAÇÃ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 mais1. 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 maisAutoria Web. Professor: Diego Oliveira. Conteúdo 02: Principais Tags HTML
Autoria Web Professor: Diego Oliveira Conteúdo 02: Principais Tags HTML Diferença de HTML e XHTML Os elementos XHTML devem estar devidamente aninhados Os documentos XHTML devem estar bem-formados Os nomes
Leia maisCEEP-CENTRO ESTADUAL DE EDUCAÇÃO PROFISSIONAL PEDRO BOARETTO NETO INTERNET E PROGRAMAÇÃO WEB INICIO DE HTML
INICIO DE HTML Neste tutorial usaremos o já conhecido Notepad++ ou Bloco de Notas e um Browser (Chrome, Mozilla ou Internet Explorer). Para nossos exemplos usaremos o Chrome. A estrutura básica de uma
Leia maisProgramação para Web HTML - Parte 2
Programação para Web HTML - Parte 2 Professor: Harlley Lima E-mail: harlley@decom.cefetmg.br Departamento de Computação Centro Federal de Educação Tecnológica de Minas Gerais Belo Horizonte, 2 de março
Leia maisCurso 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 maisQUEM 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 maisAlgoritmia 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 maisIntroduçã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 maisEnsino 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 maisProgramaçã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 maisWebdesign 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 maisProf. Erwin Alexander Uhlmann 1/7/2010
HTML 5 O html 5 é a nova versão do html 4. Foi desenvolvido para a interoperabilidade e padronização de plataformas e navegadores (motores). Compare as estruturas do html4 e do 5, abaixo: HTML 4 HTML 5
Leia maisFerramentas 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 maisHyperText 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 maisMini-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 maisMaurício Samy Silva. Novatec
Maurício Samy Silva Novatec Sumário Agradecimentos...13 Sobre o autor...13 Introdução...15 Para quem foi escrito este livro... 15 Convenções tipográficas... 16 Site do livro... 18 Capítulo 1 O que é (X)HTML?...20
Leia maisINSTITUTO 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 maisDesenvolvedor 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 maisWebDesign. 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 maisDesenvolvimento 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 maisLinguagem 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 maisgedit Bloco de notas
GOVERNO DA REPÚBLICA PORTUGUESA gedit Bloco de notas Sistema Operativo Linux Tecnologias de Informação e Comunicação Professor: Joaquim Frias Instruções básicas do HTML TAGS TAGS Uma tag é uma instrução
Leia maisProgramaçã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 maisRoteiro 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 maisHTML. Sessão 4 HTML. Criação de Páginas WEB. Tabelas
HTML Sessão 4 HTML É por vezes interessante fazer com que uma célula se expanda de forma a incorporar a célula imediatamente abaixo ou ao lado (o que em folhas de cálculo como o Microsoft Excel se denomina
Leia maisHTML 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 maisIntroduçã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 maisQuem 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 maisTecnologias para apresentação de dados - HTML. Aécio Costa
Tecnologias para apresentação de dados - HTML Aécio Costa Apresentação de Dados na Web Tecnologias client-side HTML CSS JavaScript HyperText Markup Language Uma linguagem de marcação utilizada para produzir
Leia maisMÓ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 maisLINGUAGEM 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 maisDesenvolvimento 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 maisProf.: Melba Lima Gorza Aula Introdutória de HTML. Componentes do HTML. Estrutura de um documento XHTML
Prof.: Melba Lima Gorza Aula Introdutória de HTML Componentes do HTML Estrutura de um documento XHTML primeiro Documento XHTML meu primeiro documento XHTML
Leia maisIntroduçã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 mais4 - HTML Básico: 4.2 - Criando documentos HTML:
4 - HTML Básico: 4.1 - 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).
Leia maisSíntese da aula anterior
Síntese da aula anterior Na última aula, aprendemos a utilizar em html: Tabelas Hiperligações 1 O que vamos fazer hoje? Vamos utilizar o que aprendemos da aula anterior juntamente com Utilização de imagens
Leia maisIntroduçã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 maisHyperText Markup Language (HTML) Desenho de Documentos na World Wide Web
Programação Na Web HyperText Markup Language (HTML) Desenho de Documentos na World Wide Web 1 António Gonçalves Agenda Introdução ao HTML Criar e publicar uma página Web Validar uma documento Elementos
Leia maisRoteiro 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 maisTecnologia 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 maisAula 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 maisCurso de HTML. Daniel Destro do Carmo Softech Network Informática daniel@danieldestro.com.br
Daniel Destro do Carmo Softech Network Informática daniel@danieldestro.com.br Definições conceituais O que é HTML? Criando e publicando uma página web Elementos da HTML Estrutura básica de uma página HTML
Leia maisTécnicas e processos de produção. Profº Ritielle Souza
Técnicas e processos de produção Profº Ritielle Souza Ferramentas Programáveis Mensagem para mais de um destinatário FALE CONOSCO Definindo
Leia maisIntroduçã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 maisSumá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 maisProgramação HTML Construção de Páginas para WEB 47
Programação HTML Construção de Páginas para WEB 47 INICIANDO EXEMPLO3.HTML Crie um novo arquivo html chamado exemplo3.html dentro da pasta exemplos. Após os exercícios e trabalhos anteriores, nossa pasta
Leia maisDesenvolvimento Web. Saymon Yury C. Silva Analista de Sistemas. http://www.saymonyury.com.br
Desenvolvimento Web Saymon Yury C. Silva Analista de Sistemas http://www.saymonyury.com.br Vantagens Informação em qualquer hora e lugar; Rápidos resultados; Portabilidade absoluta; Manutenção facilitada
Leia maisINTRODUÇÃ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 mais1 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 maisWeb Design Aula 15: Propriedades CSS
Web Design Aula 15: Propriedades CSS Professora: Priscilla Suene priscilla.silverio@ifrn.edu.br Roteiro Propriedades de texto Propriedades de Cores Propriedades de Bordas Propriedades de Listas Cor de
Leia maisPor 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 maisIntroduçã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 maisApostila Programador Web v3.0 Prof. Alexandre Unterstell alexunter@gmail.com www.alex.inf.br
1 Apostila Programador Web v3.0 Prof. Alexandre Unterstell alexunter@gmail.com www.alex.inf.br Antes de começar desenvolver um site na internet é importante que conheçamos alguns fatores importantes que
Leia maisHTML. 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 maisRoteiro de Auxílio para as Atividades Práticas de Sistemas de Informação
Roteiro de Auxílio para as Atividades Práticas de Sistemas de Informação A linguagem XML no contexto do curso de Sistemas de Informação é utilizada principalmente para o armazenamento e a manipulação de
Leia maisFTIN - 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 maisComo criar uma página WEB
Como criar uma página WEB Utilização de comandos HTML Luís Manuel Borges Gouveia versão 1.1 Dezembro, 1996 Requisitos necessários para criar ou editar uma página Web um navegador (browser): Netscape ou
Leia maisAPOSTILA DE INTRODUÇÃO AO HTML
1 2 Apostila de Introdução ao HTML 3 ESTA OBRA PODE SER REPRODUZIDA E DISTRIBUÍDA PARCIAL OU INTEGRALMENTE DESDE QUE CITADA A FONTE. MATERIAL COPYLEFT - VENDA PROIBIDA Todo material desenvolvido pela Coordenadoria
Leia maisEscrito por Sáb, 15 de Outubro de 2011 21:16 - Última atualização Seg, 26 de Março de 2012 03:31
Preço R$ 129.00 Compre aqui Entre definitivamente para o mundo de desenvolvimento web. Curso Webdesigner, criação de Sites com HTML, DHTML, javascript e CSS + dreamweaver cs4. São 147 videoaulas, 2 dvd
Leia maisClaudio 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 maisLista 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 maisAPOSTILA. 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 maisCurso de HTML. Rone Ilídio
Curso de HTML Rone Ilídio HTML HyperText Mark-up Language Linguagem criação de páginas Apresenta informações Formada por tags, exemplo: Tag H1: dados marcados com h1 Interessante: Acesse qualquer
Leia maisDesenvolvimento 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 maisJosé Frazão. Página 2 de 19
Página 2 de 19 Índice Página 1. Introdução 4 2. História e características 5 3. Sintaxe 5 3.1. Texto 7 3.2. Comandos básicos mais utilizados 8 3.3. Fundo (Backgrounds) e cores 10 3.4. Tabela de acentos
Leia maisTodos os tags obedecem a uma hierarquia, como no seguinte exemplo: <a> <b> <c> </c> </b> </a>
O que é o HTML? HTML significa HyperText Markup Language, e é uma linguagem universal destinada à elaboração de páginas com hiper-texto, como o nome indica. O conceito de hiper-texto é bastante simples:
Leia maisCURSO HTML. www.regilan.com. Parte 1: Introdução ao desenvolvimento WEB. Olá amigos visitantes,
CURSO HTML www.regilan.com Parte 1: Introdução ao desenvolvimento WEB Olá amigos visitantes, O objetivo deste mini-curso é fornecer os conhecimentos básicos que permitirão construir um web site. Como partiremos
Leia maisAplicativos para Internet Aula 01
Aplicativos para Internet Aula 01 Arquitetura cliente/servidor Introdução ao HTML, CSS e JavaScript Prof. Erika Miranda Universidade de Mogi das Cruzes Uso da Internet http://www.ibope.com.br/pt-br/noticias/paginas/world-wide-web-ou-www-completa-22-anos-nesta-terca-feira.aspx
Leia maisWeb 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 maisO HTML possui sintaxes para os tags na ordem LIFO, ou seja, o último tag a ser digitado é o primeiro a ser fechado, por exemplo:
HTML é a sigla usada para Hyper Text Markup Language (linguagem de Marcação de Hipertexto). É a linguagem destinada a criação de páginas para a WEB. Ao contrário do que muita gente boa pensa, HTML não
Leia maisTECNOLOGIAS 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 maisCapítulo 9 - Imagens. Imagens
Capítulo 9 - Imagens 9 Imagens EM JAVASCRIPT, É POSSÍVEL MANIPULAR COM AS IMAGENS DE UMA PÁGINA, alterando a URL que localiza o arquivo de imagem. Assim, pode-se trocar a imagem que está sendo exibida
Leia maisCurso 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 maisUNIVERSIDADE PAULISTA UNIP EMENTA E CONTEÚDO PROGRAMÁTICO. I. Ementa HTML e XHTML, de estrutura e marcação utilizados na sua composição; CSS.
UNIVERSIDADE PAULISTA UNIP EMENTA E CONTEÚDO PROGRAMÁTICO Instituto de Ciências Exatas e Tecnologia Curso: Ciência da Computação e Sistemas de Informação Série: 1º semestre Disciplina: Programação de Computadores
Leia maisDesenvolvimento em Ambiente Web. Prof. André Y. Kusumoto andrekusumoto.unip@gmail.com
Desenvolvimento em Ambiente Web Prof. André Y. Kusumoto andrekusumoto.unip@gmail.com No início A Web é criada em 1989, para ser um padrão de publicação e distribuição de textos científicos e acadêmicos.
Leia maisMó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 maisMODULO 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 maisIntrodução à Tecnologia Web
Introdução à Tecnologia Web HTML HyperText Markup Language XTML extensible HyperText Markup Language Elementos da Seção do Corpo Tabelas Formulários Professor Alan Cleber Borim www.alanborim.com.br Índice.
Leia maisPDI 1 - Projeto e Design de Interfaces Web
Introdução a HTML e XHTML Elementos básicos parte 2 Professor: Victor Hugo L. Lopes Agenda: --Adicionando imagens; --Trabalhando com vídeos e sons em HTML; Disponível em http://wp.me/p48yvn-43 2 Inserindo
Leia mais1 INTRODUÇÃO 4 2 APLICAÇÕES
ÍNDICE 1 INTRODUÇÃO 4 2 APLICAÇÕES 5 2.1 BROWSERS 5 2.2 FTP 6 2.3 GOPHER 6 2.4 NEWSGROUP 6 2.5 CORREIO ELETRÔNICO 6 2.6 TELNET 6 3 INFORMAÇÕES ADICIONAIS 7 3.1 O ACESSO À INTERNET 7 3.1.1 Requisitos de
Leia mais2 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 maisXHTML. 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 maisWeb 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 maisAs tags indicam as diversas partes da página e produzem diferentes efeitos no navegador, elas são os comandos da linguagem HTML.
World Wide Web A Web é um conjunto de documentos acessíveis por meio da Internet. Esses documentos (ou páginas Web) contêm uma tecnologia chamada hipertexto. Onde você poderá percorrer partes do documento
Leia maisCURSO BÁSICO DE HTML Alessandro S Silveira. Lista de tags e atributos
CURSO BÁSICO DE HTML Alessandro S Silveira Lista de tags e atributos Os tags apresentados aqui formam uma compilação das definições oficiais da linguagem mais as extensões introduzidas por empresas como
Leia maisWEB 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 maisUNIVERSIDADE FEDERAL DO PARANÁ FRONTPAGE 2000
UNIVERSIDADE FEDERAL DO PARANÁ PRÓ-REITORIA DE RECURSOS HUMANOS E ASSUNTOS ESTUDANTIS COORDENAÇÃO DE DESENVOLVIMENTO DE RECURSOS HUMANOS UNIDADE DE QUALIFICAÇÃO FRONTPAGE 2000 Módulo I Hamilton Chaiben
Leia maisHTML5 e Mobile Web Reinaldo Ferraz W3C Brasil
HTML5 e Mobile Web Reinaldo Ferraz W3C Brasil Um pouco do W3C O W3C no Brasil Web e W3C 5 Tim Berners-Lee criou / propôs a Web em 1989 (há 23 anos) (URI + HTTP + HTML) HTML5 - Futuro da Web Web em 1989
Leia maisApostila Básica de Informática Ensino Fundamental Volume 4
Apostila Básica de Informática Ensino Fundamental Volume 4 1 Introdução:... 3 A Tela do Excel... 3 Criando uma nova pasta de trabalho... 3 Diferença entre Pasta de Trabalho e Planilha.... 4 Salvando sua
Leia maisObservaçõ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 maisProf. 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 maisUNIVERSIDADE PAULISTA UNIP EMENTA E CONTEÚDO PROGRAMÁTICO
UNIVERSIDADE PAULISTA UNIP EMENTA E CONTEÚDO PROGRAMÁTICO Instituto de Ciências Exatas e Tecnologia Curso: Ciência da Computação e Sistemas de Informação Série: 1º semestre Disciplina: Laboratório de Práticas
Leia maisComandos Básicos de HTML
Comandos Básicos de HTML Agora iniciaremos o estudo ao HTML, para você fazer o site utilize o bloco de notas do windows(notepad) ou um outro editor de texto como Notepad++, Geany ou PSPAD. Para fazer você
Leia maisAPOSTILA DE INFORMÁTICA INTERNET E E-MAIL
APOSTILA DE INFORMÁTICA INTERNET E E-MAIL Profa Responsável Fabiana P. Masson Caravieri Colaboração Empresa Júnior da Fatec Jales Monitora: Ângela Lopes Manente SUMÁRIO 1. INTERNET... 3 2. ACESSANDO A
Leia maisEste arquivo é parte integrante do CD MEGA CURSOS Acesse - www.megacursos.com.br
Pg 1 Introdução... Pg 2 Exemplo completo... Pg 3 Passo 2... Pg 4 Hyperlinks e Texto dentro de uma caixa... Pg 5 Tag para cores e Tabelas... Pg 6 Formatar o Texto... Pg 7 Download... Pg 8 Frame... Pg 9
Leia mais