DESENVOLVIMENTO DE APLICAÇÕES PARA WEB
PROF. ANDRÉ COSTA
APRESENTAÇAO E INTRODUÇÃO
andre.costa@pro.unifacs.br
ANDRÉ COSTA
• Mestre em Modelagem Computacional e Tecnologia
Industrial
• MBA em Gestão da Informação e Projetos de Busine...
A TURMA
E vocês? Qual o perfil da turma?
HORÁRIO
Com ou sem intervalo?
PLANO DE ENSINO
Apresentação do Plano de Ensino
PLANO DE ENSINO
Apresentação do Cronograma
Disponível no Gamifica*
NOVA METODOLOGIA
Utilização de uma nova “plataforma”:
GAMIFICA
http://andrecosta.info/gamifica
GAMIFICA
• Aulas disponíveis no ambiente
– Slides
– Material de Apoio
– Desafios valendo ponto na plataforma
• Quem atingi...
NOTAS
• NOTA 1:
– Avaliação HTML (em papel) – 8,0
– Gamifica – 2,0
• Quem atingir a meta de 60 pontos até o dia da
avaliaç...
NOTAS
• NOTA 2:
– Avaliação PHP (computador) – 5,0
– AIC – 3,0
– Gamifica – 2,0
• Quem atingir a meta de 120 pontos até o ...
Desenvolvimento Web
DESENVOLVIMENTO WEB
SERVIDOR WEB
Instalação do XAMPP
PHP + MySQL
INSTALAÇÃO DO XAMPP
INSTALAÇÃO DO XAMPP
INSTALAÇÃO DO XAMPP
INSTALAÇÃO DO XAMPP
INSTALAÇÃO DO XAMPP
INSTALAÇÃO DO XAMPP
INSTALAÇÃO DO XAMPP
INSTALAÇÃO DO XAMPP
INSTALAÇÃO DO XAMPP
INSTALAÇÃO DO XAMPP
INSTALAÇÃO DO XAMPP
ATIVIDADE
• Fazer o curso de HTML da W3Schools
– www.w3schools.com/html
• Fazer o seu currículo em HTML
– Utilizar título,...
DESENVOLVIMENTO DE APLICAÇÕES PARA WEB
PROF. ANDRÉ COSTA
HTML – Introdução, Estrutura e Tags
andre.costa@pro.unifacs.br
HTML - História
HTML - História
• HTML - HyperText Markup Language
– Não é uma linguagem de programação
– É uma linguagem de marcação
• Cr...
HTML - História
• Lançado o HTML 3.2 em 1996 em mantido
pela W3C (World Wide Web Consortium)
• Lançado o HTML 4.0 em 1997 ...
HTML - História
Tim Berners-Lee
HTML - História
HTML Cross Browser
HTML - História
Exemplo de Incompatibilidade
HTML - História
HTML - Estrutura
HTML - Estrutura
<tag atributo=“valor”>conteúdo</tag>
ou
<tag atributo=“valor” />
CERTO:
<tag_1><tag_2>texto</tag_2></tag_...
HTML - Estrutura
HTML - Estrutura
HTML - Tags
HTML - Tags
• <h1>Título 1</h1>
• <h2>Título 2</h2>
…
• <h6>Título 6</h6>
HTML - Tags
• <p>Parágrafo 1</p>
• <p>Parágrafo 2</p>
HTML - Tags
• <p>Parágrafo com <b>Negrito</b>,
<i>Itálico</i> e <u>sublinhado</u>.</p>
HTML - Tags
• <p>Parágrafo com <br /><b>Negrito</b>, <br /><i>Itálico</i>
e <br /><u>sublinhado</u>.</p>
HTML - Tags
• texto texto <hr /> texto texto
HTML - Tags
• <center>texto centralizado</center>
HTML - Tags
• <fieldset>
<legend>Legenda</legend>
texto
</fieldset>
HTML - Tags
• <ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
HTML - Tags
• <ol>
<li>Item 1</li>
<li>Item 2</li>
</ol>
HTML - Tags
• <img src=“figura_teste.gif” />
HTML - Tags
• <a href=“pagina.html”>Link para Página</a>
HTML - Tags
Mão na massa!
Desenvolva em HTML um modelo de currículo,
contendo: Foto, Dados pessoais, Objetivo,
Escolaridad...
Próximos SlideShares
Carregando em…5
×

Aula 1 apresentação + html (tags)

1.451 visualizações

Publicada em

apresentação

Publicada em: Educação
0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
1.451
No SlideShare
0
A partir de incorporações
0
Número de incorporações
1.171
Ações
Compartilhamentos
0
Downloads
21
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Aula 1 apresentação + html (tags)

  1. 1. DESENVOLVIMENTO DE APLICAÇÕES PARA WEB PROF. ANDRÉ COSTA APRESENTAÇAO E INTRODUÇÃO andre.costa@pro.unifacs.br
  2. 2. ANDRÉ COSTA • Mestre em Modelagem Computacional e Tecnologia Industrial • MBA em Gestão da Informação e Projetos de Business Intelligence • Bacharel em Sistemas da Informação • Cursos de Gestão de Projetos • Coordenador da Equipe de Desenvolvimento do ITED/SENAI-BA • Professor Universitário (Todos os cursos de TI) www.andrecosta.info
  3. 3. A TURMA E vocês? Qual o perfil da turma?
  4. 4. HORÁRIO Com ou sem intervalo?
  5. 5. PLANO DE ENSINO Apresentação do Plano de Ensino
  6. 6. PLANO DE ENSINO Apresentação do Cronograma Disponível no Gamifica*
  7. 7. NOVA METODOLOGIA Utilização de uma nova “plataforma”: GAMIFICA http://andrecosta.info/gamifica
  8. 8. GAMIFICA • Aulas disponíveis no ambiente – Slides – Material de Apoio – Desafios valendo ponto na plataforma • Quem atingir a pontuação mínima ganha ponto na disciplina
  9. 9. NOTAS • NOTA 1: – Avaliação HTML (em papel) – 8,0 – Gamifica – 2,0 • Quem atingir a meta de 60 pontos até o dia da avaliação HTML ganhará 2 pontos na média • Quem ficar entre 45 e 59 pontos até o dia da avaliação HTML ganhará 1 ponto na média • Quem ficar com menos de 50 pontos não ganhará ponto
  10. 10. NOTAS • NOTA 2: – Avaliação PHP (computador) – 5,0 – AIC – 3,0 – Gamifica – 2,0 • Quem atingir a meta de 120 pontos até o dia da avaliação PHP ganhará 2 ponto na média • Quem ficar entre 90 e 119 pontos até o dia da avaliação PHP ganhará 1 ponto na média • Os 2 primeiros colocados ganharão 1 ponto extra
  11. 11. Desenvolvimento Web
  12. 12. DESENVOLVIMENTO WEB
  13. 13. SERVIDOR WEB Instalação do XAMPP PHP + MySQL
  14. 14. INSTALAÇÃO DO XAMPP
  15. 15. INSTALAÇÃO DO XAMPP
  16. 16. INSTALAÇÃO DO XAMPP
  17. 17. INSTALAÇÃO DO XAMPP
  18. 18. INSTALAÇÃO DO XAMPP
  19. 19. INSTALAÇÃO DO XAMPP
  20. 20. INSTALAÇÃO DO XAMPP
  21. 21. INSTALAÇÃO DO XAMPP
  22. 22. INSTALAÇÃO DO XAMPP
  23. 23. INSTALAÇÃO DO XAMPP
  24. 24. INSTALAÇÃO DO XAMPP
  25. 25. ATIVIDADE • Fazer o curso de HTML da W3Schools – www.w3schools.com/html • Fazer o seu currículo em HTML – Utilizar título, lista, imagem, link e tentar utilizar tabela
  26. 26. DESENVOLVIMENTO DE APLICAÇÕES PARA WEB PROF. ANDRÉ COSTA HTML – Introdução, Estrutura e Tags andre.costa@pro.unifacs.br
  27. 27. HTML - História
  28. 28. HTML - História • HTML - HyperText Markup Language – Não é uma linguagem de programação – É uma linguagem de marcação • Criado pelo Físico Tim Berners-Lee em 1980 • Tornou-se pública em 1991 • Lançado o HTML 2.0 em 1994
  29. 29. HTML - História • Lançado o HTML 3.2 em 1996 em mantido pela W3C (World Wide Web Consortium) • Lançado o HTML 4.0 em 1997 e lançado uma errata em 1999 com o HTML 4.01 • Lançado em 2008 o HTML 5
  30. 30. HTML - História Tim Berners-Lee
  31. 31. HTML - História HTML Cross Browser
  32. 32. HTML - História Exemplo de Incompatibilidade
  33. 33. HTML - História
  34. 34. HTML - Estrutura
  35. 35. HTML - Estrutura <tag atributo=“valor”>conteúdo</tag> ou <tag atributo=“valor” /> CERTO: <tag_1><tag_2>texto</tag_2></tag_1> ERRADO <tag_1><tag_2>texto</tag_1></tag_2>
  36. 36. HTML - Estrutura
  37. 37. HTML - Estrutura
  38. 38. HTML - Tags
  39. 39. HTML - Tags • <h1>Título 1</h1> • <h2>Título 2</h2> … • <h6>Título 6</h6>
  40. 40. HTML - Tags • <p>Parágrafo 1</p> • <p>Parágrafo 2</p>
  41. 41. HTML - Tags • <p>Parágrafo com <b>Negrito</b>, <i>Itálico</i> e <u>sublinhado</u>.</p>
  42. 42. HTML - Tags • <p>Parágrafo com <br /><b>Negrito</b>, <br /><i>Itálico</i> e <br /><u>sublinhado</u>.</p>
  43. 43. HTML - Tags • texto texto <hr /> texto texto
  44. 44. HTML - Tags • <center>texto centralizado</center>
  45. 45. HTML - Tags • <fieldset> <legend>Legenda</legend> texto </fieldset>
  46. 46. HTML - Tags • <ul> <li>Item 1</li> <li>Item 2</li> </ul>
  47. 47. HTML - Tags • <ol> <li>Item 1</li> <li>Item 2</li> </ol>
  48. 48. HTML - Tags • <img src=“figura_teste.gif” />
  49. 49. HTML - Tags • <a href=“pagina.html”>Link para Página</a>
  50. 50. HTML - Tags Mão na massa! Desenvolva em HTML um modelo de currículo, contendo: Foto, Dados pessoais, Objetivo, Escolaridade e Experiência.

×