Academia de Ensino Superior Prof. André Morais Desenvolvimento de Aplicações Web na plataforma...
Transcript of Academia de Ensino Superior Prof. André Morais Desenvolvimento de Aplicações Web na plataforma...
Academia de Ensino SuperiorProf. André Morais
Desenvolvimento de Aplicações Web na
plataforma Microsoft
Elaborando o design
Academia de Ensino SuperiorProf. André Morais
Elaborando o design• Objetivos
– Como iniciar o processo de design de um site
– Entender o conceito de Master page e Content Page
– Como construir um mapa
– Utilizar um arquivo de configuração (Web.config)
Academia de Ensino SuperiorProf. André Morais
Elaborando o design• Em um ambiente profissional, é preciso
seguir alguns pontos antes do inicio do desenvolvimento:
– Desenvolver o modelo funcional
– Identificar as tecnologias que poderão ser utilizadas
– Desenvolver uma especificação técnica
Academia de Ensino SuperiorProf. André Morais
Master Page e Content Page• Um web site com um bom design inclui,
normalmente, os seguintes elementos:
– Um cabeçalho e um menu para todas as páginas
– Links a esquerda para navegação (explorer)
– Um rodapé com informações de copyright
Academia de Ensino SuperiorProf. André Morais
Master Page e Content Page
• Uma página “Master” define um layout padrão para todas as páginas baseadas nela.
• Uma página “Content” é baseada na “Master”
Academia de Ensino SuperiorProf. André Morais
Master Page e Content Page
• Criando uma Master Page
Academia de Ensino SuperiorProf. André Morais
Master Page e Content Page
• Uma Master Page irá conter:
– HTML básico
– <%@master ... %> na primeira linha
– Uma tag <asp:ContentPlaceHolder> com um ID
Academia de Ensino SuperiorProf. André Morais
Master Page e Content Page
• Criando uma Content Page
Academia de Ensino SuperiorProf. André Morais
Master Page e Content Page
• Um Content Page irá conter:
– <%@ page MasterPageFile= ... %> na primeira linha
– Uma tag <asp:content>
– NÃO é preciso definir o corpo do HTML!!
Academia de Ensino SuperiorProf. André Morais
Master Page e Content Page
• Outras características:
– Master Pages em vários níveis
– Master Pages com múltiplos conteúdos
Academia de Ensino SuperiorProf. André Morais
Mapa
• Criando um mapa
• Acrescentando controles de navegação
Academia de Ensino SuperiorProf. André Morais
Elaborando o design
• Boas práticas para o design de um site:
– Separe a apresentação da informação
– Mantenha um visual consistente
– Mantenha o site simples para navegação
Academia de Ensino SuperiorProf. André Morais
Exercício
• Rent A Car
– Você irá desenvolver um web-site para uma empresa que presta serviço de alugueis de carro;
– Inicialmente as seguintes páginas serão criadas...
Academia de Ensino SuperiorProf. André Morais
Exercício
• Página principal
Menu
Academia de Ensino SuperiorProf. André Morais
Exercício
• Sobre a empresa
Academia de Ensino SuperiorProf. André Morais
Exercício
• Tarifas
• Dica: utilize o recurso de tabelas disponível no menu Layout
Academia de Ensino SuperiorProf. André Morais
Exercício
• Contato