SISTEMA DE ENSINO PRESENCIAL CONECTADO

ANLISE E DESENVOLVIMENTO DE SISTEMAS

FULANO DE SOUZA

TRABALHO INTERDISCIPLINAR INDIVIDUAL: Telecine Mozer

Manaus

2014

FULANO DE SOUZA

TRABALHO INTERDISCIPLINAR INDIVIDUAL: Telecine Mozer

Trabalho de Anlise e Desenvolvimento de Sistemas

apresentado Universidade Norte do Paran -

UNOPAR, como requisito parcial para a obteno de

mdia Semestral nas disciplinas de Tpicos em

desenvolvimento de sistemas; Metodologia cientfica;

Processo de negcios e Software; Lgica e tcnicas de

programao.

Orientador: Professores.

Merris Mozer

Reinaldo Nishikawa

Marco Hisatomi

Anderson Macedo

Manaus

2014

SUMRIO

1 INTRODUCAO..........................................................................................................3 1.1 OBJETIVO.............................................................................................................3

2 TELECINE MOZER.................................................................................................3 2.1 DOCUMENTO HTML.............................................................................................4

2.2 COMANDOS HTML...............................................................................................4

2.3 APARNCIA DE UM DOCUMENTO HTML..........................................................5

2.4 INSERIR IMAGENS E LINKS................................................................................6

2.5 INSERIR TABELAS...............................................................................................6

2.6 INSERIR VDEOS..................................................................................................7

2.7 VARIVEIS LOCAIS E GLOBAIS..........................................................................7

2.8 PARMETROS POR REFERNCIA E POR VALOR............................................8

2.9 ORGANOGRAMA................................................................................................10

3 CONCLUSO.........................................................................................................11

REFERNCIAS..........................................................................................................12

3

1 INTRODUO

Sero apresentados conceitos bsicos para o desenvolvimento de pginas

web com a utilizao da Linguagem de formatao de textos. Bem, para desenvolver

uma pgina HTML necessrio um editor de texto simples, como exemplo pode ser

usado o Bloco de Notas. Em toda linguagem, o documento em html possui

comandos chamados de Tags, comandos estes que em sua maioria devem ser

abertos e fechados, ou seja, so escritos em Pares, para que os comandos

funcionem corretamente, sendo que o fechamento o prprio comando repetido

mas precedido de uma barra.

1.1 OBJETIVO

A meta conhecer como desenvolver um documento em HTML (Linguagem

de formatao de texto), desenvolvimento esse que inclui os principais comandos

usados para criao de sites bem elaborados e principalmente funcionais.

2 TELECINE MOZER

O Telecine Mozer uma empresa do grupo Todos, onde o negcio dela

locao de filmes disponveis, alm dos canais que j se paga a assinatura de TV a

cabo. Os valores da locao variam de R$ 2,50 R$ 4,00, onde o servio abrange

todo Brasil.

A maioria das locaes no necessita de uma reserva antecipada, e a

escolha dos filmes feita pelo site. O pagamento feito no boleto da mensalidade.

O site possui um cadastro de seus clientes e est sendo implementado no novo site

de ofertas para os clientes fies, que so amostras antecipadas dos filmes

disponveis.

Existem algumas restries no site onde s poder ser acessado pelo

4

assinante que recebe uma senha junto com seu boleto mensal. Sem essa senha no

possvel fazer compras pelo site. A senha alterada mediante o pagamento.

Para que o site Telecine Mozer funcione corretamente, com todos os

requisitos apresentado, necessrio que se tenha conhecimento dos conceitos

bsicos para o desenvolvimento da pgina web do site.

Ento vamos lembrar os conceitos de HTML que sero aplicados no

desenvolvimento do site Telecine Mozer.

2.1 DOCUMENTO HTML

um documento que possui a extenso HTML ou HTM, onde esse formato

padro em html utilizado para o texto e layouts de criao de pginas web (ou

seja, para criar sites), onde uma linguagem de marcao de hipertexto. HTML a

abreviatura de Hypertext Mark-up Languare. HTML uma linguagem que

possibilita apresentar informaes (documentao de pesquisas cientficas) na

internet, ou seja, aquilo que vemos quando abrirmos uma pgina na internet nada

mais do que a interpretao que o navegador (browser) faz do HTML. Para

desenvolver um documento HTML necessrio um editor de texto simples, podendo

ser usado o Bloco de Notas.

2.2 COMANDOS HTML

Assim como em outras linguagens de programao, os comandos possuem

uma sintaxe prpria, que so chamados de Tags. A base de um documento HTML

um TAG.

TAG tudo que comea com o sinal de menor

ficando . Os Tags so etiquetas ou marcas padres para fazer indicaes a um

determinado browser, e que normalmente so usadas em pares.

O TAG principal do documento HTML este: e todo TAG se abre a

se fecha com /, onde pode ser acrescentado o atributo Lang, cuja finalidade

identificar a lngua na qual o documento ser escrito. Fica desta maneira: Abre

, fecha

Existem os TAGs que serve para criar o cabealho no visveis da

5

pgina, mas na aba da pgina; e o TAG que serve para criar o corpo do

documento, onde ser inserido o contedo da pgina. Fica desta maneira: (abre

, fecha ); (abre , fecha ).

Dentro do TAG existe o TAG onde se encontra o ttulo da

pgina.

2.3 APARNCIA DE UM DOCUMENTO HTML

Existem inmeros TAGs usados para melhorar a Aparncia de um documento

HTML, nos quais seguem abaixo:

a) CABEALHO: TAG usado para definir o

cabealho, onde a numerao que acompanha a letra h indica o tamanho das

fontes. medida que o nmero cresce o tamanho das fontes diminui, podendo

utilizar at o h6.

b) PARGRAFO E QUEBRA DE LINHAS: TAG Usado

para quebra de linha ao final do pargrafo, sendo aceito o parmetro (align=) .

Mas, quando necesitar somente de uma quebra de linha sem dar espao entre

linhas pode ser utilizado o TAG , sendo que ese TAG no requer seu

fechamento assim como os demais.

c) ESTILOS DE TEXTOS: TAGs -Negrito; -Itlico; -

Sublinhado; -Sobrescrito; -Subscrito; -Letras com o mesmo

espao (largura); -Letras grandes; -Letras pequenas; -Piscar

fonte (Firefox); -Textos pr-formatados (respeitando o final de linha originado

pela tecla enter).

d) FORMATAO DE FONTE: TAG , Parmetros:

(Size- Tamanho; Face- Nome da fonte; Color- Cor da fonte).

e) FORMATAO DE FUNDO: Parmetro (bgcolor=), dentro do

TAG .

2.4 INSERIR IMAGENS E LINKS PARA NAVEGAO

IMAGEM: O primeiro passo criar uma pasta com o nome imagens dentro

da pasta que est o documento HTML, pois padro os desenvolvedores criarem

6

pastas separadas para armazenar as imagens, fazendo com isso seus documentos

organizados. A incluso de imagem feita dentro do TAG .

Para fazer essa incluso necessrio criar um novo pargrafo utilizando o

TAG , onde img significa imagem e o atributo src significa (source= origem) onde aponta para o endereo da imagem.

LINKS: A palavra Link vem do ingls e significa ligao ou caminho, pois

atravs dos links possvel navegar entre pginas, a partir de palavras ou imagens.

Links so ligaes dinmicas entre os documentos, pois quando o usurio clica

sobre um link, ele levado para uma outra parte ou para um outro documento dentro

da rede.

2.5 INSERIR TABELAS

Para criao de tabelas, necessrio a utilizao do TAG ,

pois tudo o que for inserido dentro deste TAG far parte da tabela. A tabela no html

composta por linhas e colunas. Para cada linha que se deseja inserir usa-se os

TAGs , e os TAGs que define uma coluna so os e sempre deve

estar entre os TAGs .

Para espao entre clulas utiliza-se o parmetro cellspacing que medido

em pixels, e para espao dentro da clula utiliza-se o parmetro cellpadding. Para

mesclar linhas e colunas de tabelas deve-se incluir uma nova linha para identificar o

ttulo da tabela, e utilizar o comando rowspan que a expanso de linhas

acompanhada do nmero que indica o nmero de linhas a serem mescladas.

2.6 INSERIR VDEOS

Na verso HTML 5 to simples quanto usar um tag, pois preciso

apenas ter o vdeo disponvel em uma pasta do site e colocar no documento o

TAG apontando para ele.

Segue os principais atributos do tagvideo: Width e Height Onde definem a largura e a altura do vdeo em pixels; Controls Define que para mostrar os controles ao usurio, como play/pause e volume; Autoplay Define que o vdeo

7

deve iniciar a sua reproduo assim que for carregado na pgina.

Dentro do tagvideo deve ter um ou mais tags , onde cada tag

representa um arquivo de vdeo em determinado formato. O padro HTML 5 suporta

apenas os formatos de vdeo MP4, WebM e Ogg.

2.7 VARIVEIS LOCAIS E GLOBAIS

Variveis locais: Para facilitar o entendimento do conceito de variveis locais,

imagine um grande programa (com vrios procedimentos) escrito simultaneamente

por diversos programadores. Cada programador no precisa preocupar-se com os

nomes das variveis que outro esteja utilizando para desenvolver o seu

procedimento. Cada varivel s vale dentro do seu respectivo procedimento e deve

ser declarada cada vez que se fizer presente. Os valores contidos em variveis

locais perdem-se aps a execuo do procedimento.

Variveis Globais: Estas variveis valem para qualquer parte do programa,

exceto no caso de ser novamente declarada como varivel local dentro de um

procedimento. Toda declarao de variveis feita no incio do programa.

2.8 PARMETROS POR REFERNCIA E POR VALOR

Na maioria das vezes precisamos passar argumentos (informaes) do

programa principal para uma funo(para saber mais sobre funes clique aqui),

para tanto utilizamos parmetros, que nada mais so do que os valores de entrada

de uma funo. Os parmetros so definidos no cabealho da funo e podemos

passar quantos parmetros forem necessrios. Existem duas maneiras de se passar

os argumentos por valor e/ou por referncia.

Qual a diferena entre um argumento passado por valor e por referncia? Quando passamos um parmetro por valor funo recebe uma cpia do

argumento que est sendo enviado, enquanto que quando passamos o valor por

referncia, passamos na verdade a referncia do argumento, ou seja, seu endereo

na memria. Na prtica, quando passamos o argumento por valor, mesmo que haja

8

uma alterao do argumento dentro da funo, essa alterao no reflete na varivel

externa, enquanto que na referncia quando existe uma alterao dentro do

argumento da funo ela refletir diretamente na varivel externa, alterando seu

valor.

Passagem por valor: 1 2 3 4 5 6 7 8

function NomeDaFuncao(Parmetro1: Tipo; ParmetroN: Tipo): Tipo de retorno; var {declarao de variveis locais, quando necessrias} Begin {bloco de instrues} end;

Passagem por referncia: Em pascal para passarmos um parmetro por referncia devemos preced-lo da palavra reservada var.

function NomeDaFuncao(var Parmetro1: Tipo; var ParmetroN: Tipo): Tipo de retorno; var {declarao de variveis locais, quando necessrias} Begin {bloco de instrues} end;

9

2.9 ORGANOGRAMA

Vendas

Assistente de Vendas

Gerente de

Locao de Filmes

Design em Marketing

Programador Web

Assistente de

Programao

Gerente de

Vendas Ruth

Jonas

Paladino

Janderson

Caio

Moiss

10

3 CONCLUSO

A realizao do trabalho de pesquisa referente ao exemplo de estudo

Telecine Mozer possibilitou o aprendizado terico envolvendo vrios conceitos para

o desenvolvimento de pginas web, criando documentos com extenso em HTML e

utilizando seus inmeros comandos chamados de TAGs. Usando como exemplo o

estudo de caso Telecine Mozer, esse site ter grande oportunidade de sucesso no

mercado de locao de filmes na internet, sendo que utilizando e aplicando o

conhecimento aprendido sobre os conceitos de HTML, podemos tanto desenvolver

um site funcional bem como melhorar a aparncia dele por acrescentar cores nas

fontes e fundos, criar links para navegao, inserir imagens, vdeos e tabelas que o

tornaro atraente para os clientes navegarem em suas pginas.

Portanto, esses conceitos de HTML nos ajudaro a criar e a desenvolver

excelentes pginas web.

11

REFERNCIAS