academia de ensino superior prof. andré morais desenvolvimento de aplicações web na plataforma...
TRANSCRIPT
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