Introdução ao Desenvolvimento Web
|
|
|
- Giovana Álvaro Barros
- 6 Há anos
- Visualizações:
Transcrição
1 MKT-MDL-02 Versão 00 Introdução ao Desenvolvimento Web Aula 1
2 O que vamos ver nesta aula? Introdução ao Desenvolvimento Web Arquitetura Cliente-Servidor HTML CSS Servlets
3 Por que Java Web? Integração com a linguagem Java Grande comunidade desenvolvedora Várias opções de desenvolvimento Programar no eclipse
4 A Web O modelo cliente-servidor é usado: Cliente: faz as requisições ao servidor e recebe os resultados Servidor: recebe requisições do cliente, processa e devolve ao cliente Requisição Resposta Cliente Servidor
5 HTTP (Hyper Text Transfer Protocol) Principal protocolo da Web utilizado para a comunicação entre os clientes e os servidores Toda requisição e resposta HTTP é montada sobre uma conexão cliente-servidor Não mantém estado (Stateless)
6 Protocolo HTTP: Request Método HTTP GET (digitar URL do Recurso) GET Método HTTP POST (enviar dados de Formulário) POST
7 Diferenças entre GET e POST A quantidade de dados que se pode passar no GET é limitada pelo servidor (no geral, 256 bytes) Os dados enviados via GET são exibidos na barra de endereços do browser (exposição de dados secretos) Não é possível marcar (favoritos) o resultado de um request que usa o POST. Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com CEFET-PB
8 Detalhes de um GET Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com CEFET-PB
9 Detalhes de um POST Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com CEFET-PB
10 Protocolo HTTP: Response Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com CEFET-PB
11 Anatomia de uma URL Típica O path é contado a partir de um diretório base que é específico de cada servidor web (o do apache é htdocs. Se o recurso não estiver no path indicado ou o nome dele estiver errado, o servidor devolve uma resposta de erro. Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com CEFET-PB
12 Acesso a recursos web HTTP
13 Recursos web Podem ser: Estáticos: Páginas HTML Imagens (JPG, GIF, BMP...) Dinâmicos: Programas web (php, cgi, apsx, servlet, jsp...)
14 HTML ( Aula 1
15 Páginas HTML Podem conter tags que indicam a presença de outros recursos (links, imagens) Os formulários HTML permitem enviar dados para serem processados no servidor São os recursos mais acessados
16 HTML (Hyper Text Markup Language) Linguagem para descrever páginas web Consiste normalmente de um cabeçalho e um corpo definidos por tags Os browsers são encarregados de interpretar as tags e formatar o texto adequadamente Não é uma linguagem de programação Possui extensão htm ou html
17 Tags em HTML São delimitados por < e > Não são case-sensitive Forma geral: <tag> texto </tag> Outras formas: <tag atributo= valor > texto </tag> <tag /> <br> <hr>
18 Exemplo de tags <b>texto em negrito</b> <h1><b>tags aninhadas</b></h1> <img src="constr4.gif" width="144" height="50" />
19 Estrutura de um documento HTML <html> <head> <title>título</title> </head> <body> <p> Conteúdo </p> </body> </html> Cabeçalho Corpo
20 Tag <img> Usada para inserir uma figura no documento HTML Atributos da tag Alt -> define uma descrição da imagem Src -> define a url da imagem Height -> define a altura da imagem em pixels Width -> define a largura da imagem em pixels <img src= nassau.gif" alt= Nassau" />
21 Tag <a> Usada para criar um link para outro documento ou para apontar para um lugar específico no documento atual Atributos principais Href -> define a localização do documento de destino Name -> define rótulo para definir um lugar específico da página <a href=" da Nassau!</a> <a href= index.html#topo >Voltar ao topo</a> <a name= topo >Topo da página</a>
22 Prática 1 (30 minutos) Tentar reproduzir a seguinte página HTML:
23 Tag <table> São definidas com a tag <table> São divididas em linhas (<tr>) e as linhas são divididas em colunas (<td>) <table > <tr> <td>linha 1, célula 1</td> <td>linha 1, célula 2</td> </tr> </table>
24 Atributos de tabela Border: define o tipo de borda da tabela Colspan: define quantas colunas uma célula ocupará Rowspan -> define quantas linhas uma célula ocupará
25 Formulários <form> Formulários permitem que o usuário informe dados para serem processados pela aplicação Normalmente os elementos de um form são: Text field Text area Checkbox Radio button...
26 Formulários HTML A tag <form> não pode ser aninhada
27 Passos na submissão de um formulário O navegador envia os dados do formulário para o servidor O servidor ativa a url especificada através do atributo action O tipo do método definido no atributo method define como os dados enviados pelo formulário serão acessados O método padrão, caso não seja especificado, é o GET É boa prática usar o método POST
28 Elementos de um <form> Campos de texto, senha e hidden Campo de texto: Name: <input type="text" name= login"> Campo de senha Senha: <input type= password" name= senha"> Campo hidden: <input type= hidden" name= methodtocall value= 1 >
29 Radio buttons São usados quando é necessário que o usuário escolha uma opção dentre algumas oferecidas <input type="radio" name= sexo" value= masculino"> Masculino <input type="radio" name= sexo" value="feminino"> Feminino
30 Checkboxes São usados quando o usuário pode escolher uma ou mais opções dentre algumas oferecidas <input type="checkbox" name="curso" value="basico"> Java basico <input type="checkbox" name="curso" value="web"> Java Web <input type="checkbox" name="curso" value="avancado"> Java avancado
31 Text area É usado para que o usuário possa passar um texto com várias linhas <textarea name="informacoes" rows="2" cols="30">a carga horária do curso de Java Web do Citi totaliza 40 horas divididas em duas semanas. </textarea> A carga horária do curso de Java Web da Nassau totaliza 80 horas divididas em 40 aulas
32 Button Define um botão com uma ação específica Pode conter textos e imagens Atributos onmouseover, onclick podem especificar a ação do botão O atributo type é obrigatório com o valor button <button type="button >Incluir</button>
33 Drop-down list Cria uma lista com algumas opções que são exibidas quando o usuário clica <select> <option value= 1 >Java Web</option> <option value= 2 >C/C++</option> <option value= 3 >C#</option> </select>
34 Tag <div> Serve para dividir o documento em partes que apresentam características em comum Útil para adicionar CSS e alterar a visualização na tela <div id="lista1 align="center"> <select> <option>java Web</option> <option>c/c++</option> <option>c#</option> </select> </div>
35 Prática 2 (30 minutos) Implementar uma busca do google com opções de italiano e português (padrão) Deve-se usar: <div>, <img>, <form>, <table>, radio button
36 CSS ( Aula 1
37 CSS (Cascate Style Sheet) Linguagem de propósito geral para formatação de código HTML Separa o conteúdo do layout da página HTML Facilita a manutenção e diminui o tamanho dos arquivos escritos em HTML (Legibilidade) Não é um PADRÃO, é uma ESPECIFICAÇÃO Forma Básica: Selecionador{propriedade:valor}
38 Maneiras de Definir CSS (1) Externo com Link: <HEAD> <LINK REL=STYLESHEET TYPE="text/css" HREF="estilo.css" > </HEAD>
39 Maneiras de Definir CSS (2) Externo com Import: <HEAD> <STYLE url(c:\estilo.css); </STYLE> </HEAD>
40 Maneiras de Definir CSS (3) Interno: <HEAD> <STYLE TYPE= text/css > body{background-color:red} h1{color:green; font-size:36pt} </STYLE> </HEAD>
41 Maneiras de Definir CSS (4) Inline: <BODY style="background-color: red"> <h1 style="font-size:36pt; color=green"> Este cabeçalho tem 36 pt e agora é verde </h1> </BODY>
42 Herança Capacidade de repassar as características de estilo nos elementos HTML É possível graças à estrutura em árvore do documento HTML Possibilidade de redefinição de propriedades herdadas
43 Classes Servem para adicionar granularidade sobre os selecionadores. Classes: <HTML><HEAD><STYLE TYPE="text/css"> p.right {text-align: right} p.center {text-align: center} </STYLE></HEAD><BODY> <p class="right"> Parágrafo a direita </p> <p class="center"> Parágrafo centralizado</p> </BODY></HTML>
44 Pseudo-classes Adicionam diferentes efeitos em alguns selecionadores: A:link { color: red } /* link não visitado */ A:external:visited { color: blue } /* link visitado */ A:active { color: lime } /* links ativos */ A:hover {color: #FF00FF} /* mouse sobre link */
45 Identificadores <html><head> <style type="text/css"> #xyz34 { text-decoration: underline } </style> </head><body> <H1 ID="XYZ34">A HEADLINE</H1> <P ID="XYZ34">UNDERLINED TEXT</P> </body></html>
46 Free CSS Templates: Prática 3 (30 minutos) Tentar implementar o Design em CSS apresentado abaixo utilizando o maior número de elementos no site da w3cschools (livre).
47 Recursos Web Dinâmicos Material por: Carlos Diego Fonte: Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com CEFET-PB
48 Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com CEFET-PB
49 Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com CEFET-PB
50 Programas Web Localizados no servidor Recebem dados do cliente Processam os dados recebidos Fornecem resposta baseada nos dados enviados pelos clientes Tem que ser escritos em linguagens suportadas pelo servidor Exemplos: Servlets, JavaServer Pages, PHP, ASP, CGI
51 Exemplo Geral de Aplicações Externas no Servidor Web (1) O Servidor web recebe um pedido de execução de uma aplicação (via GET ou POST) Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com IFPB
52 Exemplo Geral de Aplicações Externas no Servidor Web (2) O Servidor web cria um processo para a aplicação e passa alguns parâmetros e variáveis especiais Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com IFPB
53 Exemplo Geral de Aplicações Externas no Servidor Web (3) A aplicação executa e devolve o resultado (código HTML) para o servidor web pela saída padrão Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com IFPB
54 Exemplo Geral de Aplicações Externas no Servidor Web (4) O Servidor web monta um frame de resposta HTTP, põe o HTML dentro dele e devolve para o cliente Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com IFPB
55 Introdução a Servlets Material por: Carlos Diego (diegoquirino@gmail.com) Fonte: Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com CEFET-PB
56 Servlets São classes especiais em Java Executam sob um container Podem acessar outras classes de Java Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com CEFET-PB
57 Elementos de aplicações web com Java Container (tomcat) Diretório raiz ou contexto Deployment descriptor (web.xml) Servlets/JSP Classes Java Arquivos auxiliares (XML, properties, libs, html...)
58 Prática 4: Codificando e Implantando um Servlet Conhecendo o ambiente de Desenvolvimento (Eclipse) Criando um projeto Web Dinâmico
59 Prática 4: Codificando e Implantando um Servlet Escreva uma classe Java que herde HttpServlet: Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com IFPB
60 Prática 4: Codificando e Implantando um Servlet Escreva o descritor da aplicação web (web.xml): Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com IFPB
61 Prática 4: Codificando e Implantando um Servlet Compile o servlet e crie a seguinte estrutura de diretórios: Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com IFPB
62 Prática 4: Codificando e Implantando um Servlet Implante a estrutura no container: Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com IFPB
63 Prática 4: Codificando e Implantando um Servlet Ponha o servidor no ar, abra o browser e aponte uma URL para o servlet. O resultado é a exibição do HTML formatado na tela. Slides de Aula / Frederico Costa Guedes Pereira 2006 fredguedespereira@gmail.com IFPB
64 No próximo encontro... Arquitetura da Aplicação Web Minitutorial MVC Sendo um Servlet: Ciclo de Vida
65 Dúvidas? Contato:
HTML BÁSICO E TEMPLATE VIEW. Gabrielle Amorim Porto
HTML BÁSICO E TEMPLATE VIEW Gabrielle Amorim Porto HTML BÁSICO E TEMPLATE VIEW Hypertext Markup Language Linguagem de marcação de hipertexto; Descreve a estrutura das páginas Web utilizando tags. HTML
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
COM222 DESENVOLVIMENTO DE SISTEMAS WEB. Aula 01: HTML e CSS
COM222 DESENVOLVIMENTO DE SISTEMAS WEB Aula 01: HTML e CSS 2 Conteúdo Noções introdutórias HTML CSS HTML: HyperText Markup Language 3 Linguagem usada para construir páginas Web Função principal Estruturar
Introdução à linguagem HTML. Volnys Borges Bernal
1 Introdução à linguagem HTML Volnys Borges Bernal 2013-2015 Volnys Bernal 2 Introdução à linguagem HTML Sumário Visão geral Primeira página Principais tags Principais atributos Formulários 2011-2015 Volnys
Volnys Bernal. Introdução à linguagem HTML. Introdução à linguagem HTML. Visão geral. Visão geral. Visão geral. Visão geral.
1 2 Introdução à linguagem HTML Sumário Volnys Borges Bernal Primeira página Principais tags Principais atributos 3 4 HTML HTML = HyperText Markup Language Linguagem de marcação (Markup) para criação de
Tabelas. Tabelas. Iniciando a construção... Atributos <table> Tag <table></table> 05/06/2011
INSTITUTO FEDERAL DE EDUCAÇÃO, CIÊNCIA E TECNOLOGIA DA PARAÍBA CAMPUS CAMPINA GRANDE 1 2 Tabelas INTERNET BÁSICA: EXTENSIBLE HYPERTEXT MARKUP LANGUAGE XHTML PARTE 3 Largamente suportado(browser); Controlar
O que faz um servidor/navegador web? 14/03/2016 Rômulo da Silva Lima Slid e 2
HTML O que faz um servidor/navegador web? e 2 O que é? HyperText Markup Language Utilizada para produzir páginas WEB Documentos escritos na linguagem HTML podem ser traduzidos por browser O HTML utiliza
Tabelas. Tabelas. Iniciando a construção... Atributos <table> Tag <table></table> 05/04/2011
INSTITUTO FEDERAL DE EDUCAÇÃO, CIÊNCIA E TECNOLOGIA DA PARAÍBA CAMPUS CAMPINA GRANDE 1 2 Tabelas INTERNET BÁSICA: EXTENSIBLE HYPERTEXT MARKUP LANGUAGE XHTML PARTE 3 Largamente suportado(browser); Controlar
Recursos Complementares (Tabelas e Formulários)
Linguagem de Programação para Web Recursos Complementares (Tabelas e Formulários) Prof. Mauro Lopes 1-31 30 Objetivo Nesta aula iremos trabalhar o conceito de tabelas e todas as tags associadas ao seu
Programação Web Aula 2 XHTML/CSS/XML
Programação Web Aula 2 XHTML/CSS/XML Departamento de Informática UFPR 17 de Fevereiro de 2014 1 Histórico 2 Funcionamento 3 Atributos 4 HTML5 Estrutura de uma arquivo HTML5 Validação Tags básicas Seleção
Os slides que seguem mostram os principais comandos da linguagem HTML. Conhecer o código HTML possibilita a criação de páginas leves que contenham ape
INTRODUÇÃO A PROGRAMAÇÃO HTML Os slides que seguem mostram os principais comandos da linguagem HTML. Conhecer o código HTML possibilita a criação de páginas leves que contenham apenas os comandos necessários
Desenvolvimento de Aplicações para Internet
Desenvolvimento de Aplicações para Internet CSS Celso Olivete Júnior olivete@fct.unesp.br HTML Formatando o documento... Formulário Responsável por fazer a interação entre os dados fornecidos pelo usuário
Tabelas Div Span Frames Formulários
Tabelas Div Span Frames Formulários Tabelas Tabelas implementam um conceito importante de layout: as grades, segundo as quais organizamos textos e ilustrações de maneira harmoniosa. A utilização de tabelas
Adicionando mais tags HTML
Instituto Federal de Minas Gerais Campus Ponte Nova Adicionando mais tags HTML Professor: Saulo Henrique Cabral Silva Bookmark Bookmark ou demarcação de destinos para links (informações) dentro do próprio
Autoria Web. Professor: Diego Oliveira. Conteúdo 03: Tags de Formulário
Autoria Web Professor: Diego Oliveira Conteúdo 03: Tags de Formulário Caminhos Os caminhos dentro de um projeto HTML podem ser Relativos ou Absolutos O caminho Relativo é o caminho a partir da página em
HyperText Markup Language HTML. Formulário
HyperText Markup Language HTML Formulário Prof. Luis Nícolas de Amorim Trigo nicolas.trigo@ifsertao-pe.edu.br http://professor.ifsertao-pe.edu.br/nicolas.trigo/ Introdução O usuário interage com os serviços
Tags estruturais <!-- --> Cria um comentário <html> </html> Envolve todo um documento html <head> </head> Envolve o cabeçalho de um documento html
Tags estruturais Cria um comentário Envolve todo um documento html Envolve o cabeçalho de um documento html Fornece informações gerais sobre o documento
HTML. Professor Victor Sotero. html
HTML Professor Victor Sotero html 1 Conceito Linguagem com a finalidade de marcação de hipertexto, sendo assim escritas páginas da web, e interpretada pelo navegador. As páginas contém um código fonte,
O que faz um servidor/navegador web? 30/03/2017 Rômulo da Silva Lima Slid e 2
HTML O que faz um servidor/navegador web? e 2 O que é? HyperText Markup Language Utilizada para produzir páginas WEB Documentos escritos na linguagem HTML podem ser traduzidos por browser O HTML utiliza
HTML? HTML? HTML? HTML e HTTP. HTML e HTTP 26/02/2011
INSTITUTO FEDERAL DE EDUCAÇÃO, CIÊNCIA E TECNOLOGIA DA PARAÍBA CAMPUS CAMPINA GRANDE 1 2 HTML? INTERNET BÁSICA: EXTENSIBLE HYPERTEXT MARKUP LANGUAGE XHTML PARTE 1 Hypertext Markup Language (Linguagem de
Java para WEB com Struts 2 e Hibernate
Java para WEB com Struts 2 e Hibernate Aula 01 http://fernandoanselmo.orgfree.com fernando.anselmo74@gmail.com Apresentação Fernando Anselmo fernando.anselmo74@gmail.com 25 anos na área de Desenvolvimento
INTRODUÇÃO AO DESENVOLVIMENTO FRONT-END COM HTML, CSS E JAVASCRIPT
v1.1 06/04/2017 INTRODUÇÃO AO DESENVOLVIMENTO FRONT-END COM HTML, CSS E JAVASCRIPT AULA 3 TRABALHANDO COM FORMULÁRIOS Eder Franco @ FPF Tech Agenda 1. Introdução 2. A tag form e seu atributos 3. As tags
Programação para Internet
AULA: Passagem de parâmetros em PHP (URL e Formulários) Programação para Internet http://docentes.ifrn.edu.br/albalopes alba.lopes@ifrn.edu.br Passagem de parâmetros Em PHP, há algumas formas de passar
CSS CASCADING STYLE SHEET
CSS CASCADING STYLE SHEET CURSO TÉCNICO DE INFORMÁTICA MODALIDADE SUBSEQÜENTE DESENVOLVIMENTO WEB 1 PROF. ALEXANDRO DOS SANTOS SILVA 1 SUMÁRIO Conceito Sintaxe básica Tipos de folhas de estilos 2 1 CSS
CSS (Cascading Style Sheet)
CSS (Cascading Style Sheet) André Tavares da Silva andre.silva@udesc.br CSS Folha de Estilo em Cascata Mecanismo simples para adicionar estilos (fontes, cores, espaçamentos, por exemplo) aos documentos
Desenvolvimento Web. HTML 5 Parte I. Prof. Vicente Paulo de Camargo
Parte I Prof. Vicente Paulo de Camargo Páginas com podem ser desenvolvidas com editor de texto simples Existem, no entanto, alguns editores interessantes, que facilitam a edição de páginas É o caso de
TAGS. O HTML trabalha com o sistema de tags (etiquetas). Esse sistema funciona da seguinte maneira. <tag>conteúdo da tag</tag>
HTML DDW TAGS O HTML trabalha com o sistema de tags (etiquetas). Esse sistema funciona da seguinte maneira. conteúdo da tag Toda tag aberta, deve ser fechada, salvo raras exceções, nesses casos
Prof. Fernando Gonçalves Abadia. Sistemas Multimídias
Prof. Fernando Gonçalves Abadia Sistemas Multimídias Títulos Títulos são definidos com as tags a . A define o título maior. A define o título menor. este é um título este
TECNOLOGIA WEB. XHTML Aula 5. Profa. Rosemary Melo
TECNOLOGIA WEB XHTML Aula 5 Profa. Rosemary Melo HTML (Hiper Text Markup Language) Linguagem de marcação de hipertexto Comum especificar o conteúdo do documento e sua formatação em um só documento HTML.
HTML. Leonardo Gresta Paulino Murta
HTML Leonardo Gresta Paulino Murta leomurta@gmail.com Introdução a HTML Formulários em HTML Critério para escolha de campos Agenda Leonardo Murta HTML 2 HTML HyperText Markup Language Criada por Tim Berners-
Informática I. Aula 8. Aula 8-19/09/2007 1
Informática I Aula 8 http://www.ic.uff.br/~bianca/informatica1/ Aula 8-19/09/2007 1 Ementa Noções Básicas de Computação (Hardware, Software e Internet) HTML e Páginas Web Internet e a Web Javascript e
Programação para web HTML: Formulários
Programação para web HTML: Formulários 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, 9 de março
Formulários são áreas onde se inserem campos que permitem uma troca de informações maior entre usuários e desenvolvedores de sites HTML Até o momento,
HTML Formulários são áreas onde se inserem campos que permitem uma troca de informações maior entre usuários e desenvolvedores de sites HTML Até o momento, HTML mostrou-se uma linguagem bastante adequada
Teste de avaliação de frequência Parte Prática
Abaixo está uma proposta de solução para os exercícios do teste de avaliação de frequência às aulas práticas. Se tem dúvidas sobre esta resolução, fale com o seu Professor. GRUPO I HTML 1. CrieumHTMLcom3tiposdiferentesdelistasnãonumeradas.
Finalidade dos formulários
ENTENDENDO O FORMULÁRIO Na opinião de muitos a criação de formulários na linguagem HTML é uma das áreas mais importantes no desenvolvimento web. Diferentemente de outras marcações HTML o formulário não
Módulo 17E. Revisões de HTML. A) Noções básicas de HTML (cont.)
Módulo 17E Revisões de HTML A) Noções básicas de HTML (cont.) Inserção de Imagens A inserção de imagens em documentos HTML é feita através da tag (que não tem tag de fecho). A indicação do local
INTRODUÇÃO À PROGRAMAÇÃO EXERCÍCIO DE REVISÃO
INTRODUÇÃO À PROGRAMAÇÃO EXERCÍCIO DE REVISÃO Questões de concurso 1. Na interface Web, ele é um arquivo independente do arquivo HTML no qual são declaradas propriedades e valores de estilização para os
17/01/2016 PROGRAMAÇÃO EM AMBIENTE WEB I UM POUCO DE HISTÓRIA WWW. Tudo começou com a ARPANET; 1977 ARPANET nasce
PROGRAMAÇÃO EM AMBIENTE WEB I Prof. Esp. Fabiano Taguchi fabianotaguchi@gmail.com http://fabianotaguchi.wordpress.com UM POUCO DE HISTÓRIA Tudo começou com a ARPANET; 1977 ARPANET nasce 1987 Das universidades,
F E B A C. Exercício de Fixação 3. FACULDADE DE EDUCAÇÃO DE BACABAL FEBAC Credenciamento MEC/Portaria: 472/07 Resolução: 80/07
F E B A C FACULDADE DE EDUCAÇÃO DE BACABAL FACULDADE DE EDUCAÇÃO DE BACABAL FEBAC Credenciamento MEC/Portaria: 472/07 Resolução: 80/07 Curso: Sistemas para Internet Período: 2 o Disciplina: Fundamentos
PROGRAMAÇÃO EM AMBIENTE WEB I
PROGRAMAÇÃO EM AMBIENTE WEB I Prof. Esp. Fabiano Taguchi fabianotaguchi@gmail.com http://fabianotaguchi.wordpress.com UM POUCO DE HISTÓRIA Tudo começou com a ARPANET; 1977 ARPANET nasce 1987 Das universidades,
Recurso Didáctico. Dossier Técnico Pedagógico Projecto: 5742/2008/22 Acção: 5742/2008/ Formador[a]
![Recurso Didáctico. Dossier Técnico Pedagógico Projecto: 5742/2008/22 Acção: 5742/2008/ Formador[a]](/thumbs/75/71501484.jpg "Recurso Didáctico. Dossier Técnico Pedagógico Projecto: 5742/2008/22 Acção: 5742/2008/ Formador[a]")
Recurso Didáctico Formador[a] Sónia Rodrigues UFCD / UC 0793 Scripts CGI e Folhas de Estilo Data 05/05/2009 Contextualização / Objectivos Documentação de apoio Orientação Pedagógica Apontamentos de Folhas
Dezembro/2012. Universidade Federal Fluminense. Curso de Introdução ao HTML. SeTel- Grupo PET-Tele. Adicionando links e imagens. Tabelas.
Universidade Federal Fluminense Dezembro/2012 1 2 3 4 5 6 7 8 Informações principais Base da Web: - Um esquema de nomes para localização de fontes de informação na Web : URL. - Um Protocolo de acesso para
Desenvolvimento Web TCC Turma A-1
Desenvolvimento Web TCC-00.226 Turma A-1 Conteúdo Projeto de Interface com o Usuário em HTML Professor Leandro Augusto Frata Fernandes laffernandes@ic.uff.br Material disponível em http://www.ic.uff.br/~laffernandes/teaching/2013.2/tcc-00.226
INTRODUÇÃO A PROGRAMAÇÃO PARA WEB
INTRODUÇÃO A PROGRAMAÇÃO PARA WEB PROF. ME. HÉLIO ESPERIDIÃO Navegador O navegador também conhecido como web browser é um programa que habilita seus usuários a interagirem com documentos hospedados em
Desenvolvimento em Ambiente Web. Prof. André Y. Kusumoto
Desenvolvimento em Ambiente Web Prof. André Y. Kusumoto andrekusumoto.unip@gmail.com Um Formulário é uma área com entrada de dados disponível para o usuário. A ideia básica do formulário é apresentar campos
Desenvolvimento de Aplicações para. Prof.: Bruno Rafael de Oliveira Rodrigues
Desenvolvimento de Aplicações para Internet Prof.: Bruno Rafael de Oliveira Rodrigues Videos nas Páginas Existem várias maneiras de inserir um vídeo em sua página. O vídeo pode aparecer sob a forma de
Aplicação para Web I. Manipulando Imagens e Links
Aplicação para Web I Manipulando Imagens e Links Antes de começar O HTML também é uma linguagem de programação, então deve ser organizada de forma identada também. Estamos aprendendo agora a linguagem
HTML: FORMULÁRIOS SUMÁRIO. Conceito Tag FORM Tag INPUT Tag BUTTON Tag TEXTAREA Tag SELECT
HTML: FORMULÁRIOS CURSO TÉCNICO DE INFORMÁTICA MODALIDADE SUBSEQÜENTE DESENVOLVIMENTO WEB I PROF. ALEXANDRO DOS SANTOS SILVA 1 1 SUMÁRIO Conceito Tag FORM Tag INPUT Tag BUTTON Tag TEXTAREA Tag SELECT 2
Autoria Web. Formulários Aula 5. Cleverton Hentz
Autoria Web Formulários Aula 5 Cleverton Hentz Sumário da Aula } Introdução } Formulários Básicos } Elementos Suportados 2 Introdução } Os formulários possibilitam o envio de informação para o servidor
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
Tabelas. Uma célula de dados pode conter texto, imagens, listas, parágrafos, formulários, linhas horizontais, etc. <table> <tr>
Tabelas HTML Tabelas Tabelas São definidas pela tag Uma tabela é dividida em linhas -com a tag Cada linha divida em células de dados (com a tag ). As letras td são um acronimo
AULA 01. Introdução (HTML, CSS e Javascript) JAVA ENTERPRISE EDITION - DESENVOLVENDO APLICAÇÕES CORPORATIVAS
AULA 01 Introdução (HTML, CSS e Javascript) Mestrado em Educação (em andamento) MBA em Negócios em Mídias Digitais MBA em Marketing e Vendas Especialista em games Bacharel em Sistema de Informação Email:
Curso de PHP. - Início 22 de agosto. - Término 20 de outubro. - Aulas: segunda e quinta-feira - Horário:18h às 20h. - Carga horária do curso: 40h
Curso de PHP Palestrantes: Marco Aurélio Jefson Farias - Início 22 de agosto Curso de PHP - Término 20 de outubro. - Aulas: segunda e quinta-feira - Horário:18h às 20h. - Carga horária do curso: 40h -
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
Introduçã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.
Formulários [8] Desenvolvimento e Design de. Websites. Prof.: Ari Oliveira
![Formulários [8] Desenvolvimento e Design de. Websites. Prof.: Ari Oliveira](/thumbs/68/58571051.jpg "Formulários [8] Desenvolvimento e Design de. Websites. Prof.: Ari Oliveira")
Desenvolvimento e Design de Websites Prof.: Ari Oliveira Formulários: Tag form Campos: Texto, Senha, checkbox, radio, botões, textarea e menu select. 2 Crie uma Tabela de Horários Faça seu horário semanal,
Mini-Curso Expotec 2010 Professores: Paulo Vítor, Jackson, Raimundo, Lucas e Cleverton
Mini-Curso Expotec 2010 Professores: Paulo Vítor, Jackson, Raimundo, Lucas e Cleverton Sumário da Aula Introdução Introdução à XHTML Introdução à Folhas de Estilo (CSS) A Ferramenta Dreamweaver CS4 2 O
REDES DE COMUNICAÇÃO. 11º - ANO Professor: Rafael Henriques
16-01-2019 Redes de Comunicação - Prof. Rafael Henriques 1 REDES DE COMUNICAÇÃO 11º - ANO Professor: Rafael Henriques E-mail: prof@rafaelhenriques.com Apresentação módulos 4 - Desenvolvimento de Páginas
Web Design Aula 10: Formulários - Parte2
Web Design Aula 10: Formulários - Parte2 Professora: Priscilla Suene priscilla.silverio@ifrn.edu.br Roteiro Textarea Select FieldSet e Legend Atributo Action Atributo Method Exercício Form Um formulário
Links, Imagens e Tabelas
Links, Imagens e Tabelas Criar um link em um texto significa estabelecer uma ligação com outra página, outro texto, que o leitor pode abrir clicando numa palavra, grupo de palavras ou em uma imagem. Para
AULA 02 Introdução (HTML, CSS e Javascript) PROGRAMAÇÃO PARA WEB Marcelo Henrique dos Santos
AULA 02 Introdução (HTML, CSS e Javascript) Mestrado em Educação (em andamento) MBA em Negócios em Mídias Digitais MBA em Marketing e Vendas Especialista em games : Produção e Programação Bacharel em Sistema
CSS EXTERNO. <head> <link href="estilo.css" type="text/css" rel="stylesheet" /> </head>
CSS DDW CSS EXTERNO O CSS é um arquivo que visa personalizar o modo como seu HTML aparece para o usuário. Ele deve ser chamado dentro da tag no topo do site.
Aula 3. Imagens. <img src="foto.jpg" />
Aula 3 Imagens Para inserir uma imagem na página utilizamos a tag
Dreamweaver CC_15x21.indd 1 06/04/ :04:22
Dreamweaver CC_15x21.indd 1 06/04/2015 11:04:22 SUMÁRIO INTRODUÇÃO... 3 CAPÍTULO 1 Iniciando e conhecendo o Dreamweaver... 8 Interfaces... 21 Criando e configurando sites... 22 CAPÍTULO 2 Criando arquivos...
Desenvolvimento Web. Introdução Geral. Prof. Vicente Paulo de Camargo
Introdução Geral Prof. Vicente Paulo de Camargo Web e Internet A Internet é uma rede de computadores que conecta milhões de computadores Se comunicam através do protocolos específicos A Web é uma forma
Formulários. Etapa 1 Criação de formulários
9 Formulários Objetivos deste capítulo Ao terminar este capítulo, você deverá: Saber o que são formulários; Conhecer as principais tags para construção de um formulário; Criar o layout simples de um formulário.
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
Síntese da aula anterior
Síntese da aula anterior Na última aula, aprendemos a utilizar em html: Tabelas Hiperligações Foi também disponibilizado um formulário de ajuda em html com as tags principais Sítio da aula anterior: http://www.marcosoares.com/aia/11/aula_2010_04_16/
Informática I. Aula 3. Aula 3-03/09/2007 1
Informática I Aula 3 http://www.ic.uff.br/~bianca/informatica1/ Aula 3-03/09/2007 1 Ementa Noções Básicas de Computação (Hardware, Software e Internet) HTML e Páginas Web Internet e a Web Javascript e
Os componentes de um formulário são: Form, Input, Select e AreaText
HTML Formulário O elemento FORM, da HTML, é o responsável por prover documentos interativos no ambiente WWW de forma que uma pagina web exibida a um usuário possa submeter um conjunto de dados, informados
Construção de sites Aula 1
Construção de sites Aula 1 Programa Instrutor Universidade Federal do Paraná Pró-reitoria de Assuntos Estudantis Departamento de Informática 31 de Julho de 2010 Indice Estrutura da Internet 1 Estrutura
HTML - Definição e Conceitos
1 HTML - Definição e Conceitos HTML e uma abreviação para Hyper Text Markup Language ou Linguagem de Marcação de Hipertexto. É uma linguagem utilizada pra criação de páginas para a internet que serão "interpretadas"no
Desenvolvimento Web III. Prof. Felippe Scheidt
Desenvolvimento Web III Prof. Felippe Scheidt Apresentação da disciplina Compreender os princípios do desenvolvimento de sistemas web e da construção de páginas dinâmicas utilizando padrões de projetos,
UFCD 0793 Scripts CGI e Folhas de Estilo Formadora: Sónia Rodrigues
UFCD 0793 Scripts CGI e Folhas de Estilo Formadora: Sónia Rodrigues 0793 Scripts CGI e folhas de estilo Objectivos da UFCD: Desenvolver páginas para a Web, através de scripts CGI e folhas de estilo. UFCD
CSS [10] Desenvolvimento e Design de. Websites. Prof.: Ari Oliveira
![CSS [10] Desenvolvimento e Design de. Websites. Prof.: Ari Oliveira](/thumbs/68/59560005.jpg "CSS [10] Desenvolvimento e Design de. Websites. Prof.: Ari Oliveira")
Desenvolvimento e Design de Websites Prof.: Ari Oliveira Folhas de Estilo em Cascata CSS Localização dos estilos Seletores 2 Faça uma página de trabalhe conosco. Esta página deverá conter um formulário
Introdução. HyperText Markup Language HTML. Formulário. Fluxo do Formulário. Fluxo do Formulário. Fluxo do Formulário. Fluxo do Formulário
Introdução HyperText Markup Language HTML Formulário Prof. Luis Nícolas de Amorim Trigo nicolas.trigo@ifsertao-pe.edu.br http://professor.ifsertao-pe.edu.br/nicolas.trigo/ O usuário interage com os serviços
1) Em um documento separado fora de todos os documentos HTML;
Você pode definir regras de CSS em três lugares. E, por definição, pode utilizar uma combinação dos três métodos nos seus web sites. A maneira como as regras interagem entre si está relacionada à parte
PROGRAMAÇÃO WEB DO LADO DO CLIENTE
PROGRAMAÇÃO WEB DO LADO DO CLIENTE FORMULÁRIO Na linguagem HTML é permitido que o usuário interaja com o servidor através de formulários ligados a scripts desenvolvidos em linguagens como PHP, Servlets,
HTML & CSS. uma introdução
HTML & CSS uma introdução HTML hypertext markup language CSS cascading style sheet linguagem de marcação que dá ao conteúdo estrutura e significado linguagem de estilo que dá ao conteúdo estilo e aparência
Desenvolvimento Web. CSS Conceitos básicos parte I. Professor: Bruno Gomes
INSTITUTO FEDERAL DE EDUCAÇÃO CIÊNCIA E TECNOLOGIA CURSO TÉCNICO INTEGRADO EM INFORMÁTICA CAMPUS CURRAIS NOVOS Desenvolvimento Web CSS Conceitos básicos parte I Professor: Bruno Gomes 2011 INTRODUÇÃO O
Introdução a HTML. André Tavares da Silva.
Introdução a HTML André Tavares da Silva andre.silva@udesc.br HTML HiperText Markup Language Linguagem de marcação para criar páginas Web Formada por textos e comandos chamados tags (etiquetas/rótulos)
PROGRAMAÇÃO EM AMBIENTE WEB I
PROGRAMAÇÃO EM AMBIENTE WEB I Prof. Esp. Fabiano Taguchi fabianotaguchi@gmail.com http://fabianotaguchi.wordpress.com CSS As folhas de estilo em cascata são mecanismos usados para adicionar estilos em
Informática Parte 21 Prof. Márcio Hunecke
Escriturário Informática Parte 21 Prof. Márcio Hunecke Informática CSS 3 É no CSS (Cascading Style Sheets) que se define estilos para páginas web com efeitos de transição, imagem, e outros, que dão um
- os dados entrados fazem parte do corpo da mensagem enviada para o servidor; - transfere grande quantidade de dados.
Formulários Um formulário é um modelo para a entrada de um conjunto de dados. O primeiro passo para fazer formulários é aprender as etiquetas que desenham as janelinhas de entrada de dados, para depois
Coleção - Análises de marketing em clientes de
Coleção - Análises de email marketing em clientes de email Introdução Nesta primeira edição da Coletânea de Análises de Email Marketing em Clientes de email, vamos estudar as peculiaridades dos webmails
Introdução ao HTML e às folhas de estilo (CSS)
MIEEC SIEM ano letivo 2013/14 Introdução ao HTML e às folhas de estilo (CSS) José A. Faria (jfaria@fe.up.pt) FEUP, DEIG Setembro 2013 MIEEC SIEM --- 1 --- José António Faria Introdução ao protocolo HTTP
FORMULÁRIOS HTML (FORMS) E ENTRADAS DE DADOS (INPUT)
FORMULÁRIOS HTML (FORMS) E ENTRADAS DE DADOS (INPUT) Formulários (FORMS): Um formulário é uma área que pode conter elementos de formulário. Elementos de formulário são elementos que permitem ao usuário
Laboratório de Sistemas e Serviços Web
Ministério da Ciência, Tecnologia e Ensino Superior U.C. 21182 Laboratório de Sistemas e Serviços Web Época Normal, 2017/2018 INSTRUÇÕES PARA A RESOLUÇÃO DO EXAME, ACONSELHA-SE QUE LEIA ATENTAMENTE O SEGUINTE:
Desenvolvimento Web CSS Conceitos básicos parte II
Desenvolvimento Web CSS Conceitos básicos parte II Prof.: Bruno E. G. Gomes 2014 Folhas de Estilo Externa Estilos são definidos em um arquivo separado e incorporados à página através da tag link Podem
Web Design Aula 09: Formulários
Web Design Aula 09: Formulários Professora: Priscilla Suene priscilla.silverio@ifrn.edu.br Motivação Roteiro Tag ... Tag Tag ... Rádio Checkbox Atributo name Form Um
Formulários. Objetivo Controles Métodos Linhas de Edição
Formulários Formulários Objetivo Controles Métodos Linhas de Edição Formulários HTML O conjunto de controles de edição é limitado Botões Linhas de Edição Combo-boxes Listas Caixas de marcação(check-boxes)
Redes de Computadores I Seminário Novas Tecnologias em Redes HTML5. Jessica da Silva Hahn Letícia Aparecida Coelho
Redes de Computadores I Seminário Novas Tecnologias em Redes HTML5 Jessica da Silva Hahn Letícia Aparecida Coelho Internet HTTP Dois métodos de requisição HTTP são os mais utilizados: GET e POST Outros
Dreamweaver CS5 -5- CAPÍTULO 1... Iniciando e conhecendo o dreamweaver...8 Interfaces...23 Criando e confi gurando sites...24 Exercícios...
DREAMWEAVER CS5 INTRODUÇÃO O Dreamweaver CS5 é um editor avançado de páginas para Internet, pois possui ferramentas para usuários que não são familiarizados com as linguagens HTML, Java e PHP. Com o Dreamweaver
INTRODUÇÃO ÀS APLICAÇÕES PARA WEB
INTRODUÇÃO ÀS APLICAÇÕES PARA WEB Material cedido pelo prof. Francisco Dantas Nobre Neto Professor: Rhavy Maia Guedes E-mail: rhavy.maia@gmail.com, rhavymg.wordpress.com Sites vs Aplicativos Web Aplicativos
Desenvolvimento Web. Professor: Bruno E. G. Gomes
Instituto Federal de Educação Ciência e Tecnologia Curso Técnico Integrado em Informática Campus Currais Novos Desenvolvimento Web CSS Conceitos básicos parte I Professor: Bruno E. G. Gomes 2013 Introdução
Programação para Internet I
Programação para Internet I Aulas 09 e 10 Fernando F. Costa nando@fimes.edu.br Formulários O formulário representa o modo mais importante de interatividade que a linguagem HTML oferece. Um formulário pode