Desenvolvimento de Software Com Engenharia Web

Desenvolvimento de software com
Engenharia Web
A engenharia de software da Web foi desenvolvida sob várias abordagens.
Na era do conhecimento é muito importante conhecer o processo de
desenvolvimento de software, identificando Modelagem de Análise e
Modelagem de Design de software web. Nesse processo também deve ser
considerado o teste de software, que não pode ficar de fora do processo de
desenvolvimento. O processo de desenvolvimento de software web deve ser
adotado sob uma abordagem de qualidade, considerando os métodos,
técnicas e ferramentas adequadas para sua geração. A indústria de software
exige todos os dias a criação de sites, páginas web, aplicações web e uma
variedade de softwares no ambiente web, incluindo ambientes virtuais de
aprendizagem. É necessário orientar o desenvolvedor web por um processo
que permita a construção correta e completa do software web. Este livro
fornece uma série de práticas e técnicas para criar cada uma das fases do
desenvolvimento de software web por meio de modelos de engenharia web.
Estão incluídos formatos para documentar um projeto baseado na web e
realizar a aplicação de modelagem de análise e modelagem de design.
Engenheiro de sistemas computacionais. Em 1995, o ITCM obteve a média

mais elevada. Em 1995, premiado pela ANFEI como melhor graduado em
engenharia de ITCM. Em 1995 Mestrado em Ciência da Computação. Em
1998 Mestrado em Tecnologias de Informação. Em Rosa Imelda Garcia Chi
2010, professor do ITV e pós-graduado na UNID e
ALIAT
Desenvolvimento de
software com
Engenharia Web
Editora acadêmica espanhola
978-3-659-65809-9
Rosa Imelda Garcia Chi

Engenharia Web
Rosa Imelda Garcia Chi

Engenharia Web
Guia Prático e Técnicas
Editora Acadêmica Espanhola

Impressum / Aviso Legal
Informações bibliográficas da Biblioteca Nacional Alemã: A Biblioteca Nacional
Alemã verzeichnet esta publicação na Biblioteca Nacional Alemã; Dados
bibliográficos detalhados estão na Internet em http://dnb.d-nb.de abrufbar.
Alle in diesem Buch genannten Marken und Produktnamemen unterliegen
warenzeichen-, markeno- ou patenterechtlichem Schutz bzw. sind Warenzeichen
ou eingetragene Warenzeichen der jeweiligen Inhaber. Die Wiedergabe von
Marken, Produktnamen, Gebrauchsnamen, Handelsnamen,
Warenbezeichnungen usw neste Werk berechtigt auch ohne kissonde
Kennzeichnung nicht zu der Annahme, dass solche Namen im Sinne der
Warenzeichen- und Markenschutzgesetzgebung als frei zu betrachten waren und
daher von jedermann benutzt werden dürften.
Informações bibliográficas da Deutsche Nationalbibliothek: A Deutsche

Nationalbibliothek classifica esta publicação na Deutsche Nationalbibliografie;
Dados bibliográficos detalhados estão disponíveis na Internet em http://dnb.d-
nb.de.
Todos os nomes de marcas e produtos mencionados neste livro estão sujeitos a
marca registrada, marca registrada ou proteção de patente e são marcas
comerciais ou marcas registradas de seus respectivos proprietários. A
reprodução neste trabalho de nomes de marcas, nomes de produtos, nomes
comuns, nomes comerciais, descrições de produtos, etc., mesmo sem indicação
específica, não deve de forma alguma ser interpretada como significando que
esses nomes podem ser considerados sem limitações em termos de marcas
registradas e legislação de proteção de marcas registradas e, portanto, ser usado
por qualquer pessoa.
Coverbild / Imagem da capa: www.ingimage.com
Verlag/Editorial:
Editora Acadêmica Espanhola
ist ein Imprint der/ é uma marca de
ICS Mais livros! Marketing SRL
4, Rua Industriala, 31 00 Balti, República da Moldávia
E-mail/E-mail: info@omniscriptum.com
Herstellung: siehe letzte Seite/

Postado em: veja a última página
ISBN: 978-3-659-65809-9
Direitos autorais/Propriedade literária e policial Rosa Imelda García Chi

Direitos autorais/Propriedade literária © 2017 ICS Morebooks! Marketing SRL
Todos os direitos reservados./Todos os direitos reservados. Saarbrucken 2017
Desenvolvimento
de software
com Engenharia Web:
Guia Prático
e Técnicas
PREPARADO PELA
ISC. Rosa Imelda García Chi, MTI

Engenheiro de Sistemas de Computação
Mestrado em Tecnologias de Informação
Professor do Campus Tecnológico Nacional de Tecnologia do México
de Ciudad Valles
Engenharia Web é a aplicação de metodologias sistemáticas, disciplinadas e
quantificáveis para o desenvolvimento, operação e evolução eficientes de
aplicações de alta qualidade na World Wide Web.
A engenharia Web deve-se ao crescimento desenfreado que a Web está a

ter, está a causar impacto na sociedade e a nova gestão que está a ser dada
à informação nas diferentes áreas em que se apresenta tem feito com que as
pessoas tendam a realizar todas as suas atividades em Por aqui.
Desde que isso começou a acontecer, a Internet passou a ser mais que uma
diversão e passou a ser levada mais a sério, pois o aumento de publicações
e informações fez com que a Web se tornasse um desafio para engenheiros
de software (Engenharia de Software), em consequência disso, disciplinados.
, foram criadas abordagens e metodologias sistemáticas que levaram em
conta aspectos específicos deste novo meio.
Engenharia Web - Guia Prático e Técnicas 2017
Contente
Desenvolvimento de software com Engenharia Web...........................1

Contente.............................................................................................i
1 INTRODUÇÃO.......................................................................11
2 Fases de desenvolvimento da Engenharia Web......................14
3 Objetivo(s) Geral(is) da Engenharia de Software Web.................7
4 Fase 1. Introdução à Engenharia Web.........................................10
4.1.1 O que é?........................................................................11
4.1.2 Quem faz isso?.............................................................11
4.1.3 Por que isso é importante?............................................12
4.1.4 Quais são as etapas?.....................................................12
4.1.5 Qual é o produto obtido?..............................................12
4.2.1 O que é usabilidade?.....................................................12
4.2.2 A usabilidade é realmente necessária para fazer um site?
13
4.2.3 Quais são as 8 regras de ouro sobre usabilidade?........13
4.3.1 Processo........................................................................16
4.3.2 Métodos........................................................................16
4.3.3 Ferramentas e tecnologias............................................17
4.4.1 Defina a estrutura.........................................................18
4.4.2 Comunicação com o cliente:........................................19
4.4.3 Planejamento:...............................................................19
4.4.4 Modelagem:..................................................................19
ING. ROSA IMELDA GARCIA CHI, MTI

4.4.5 Construção:...................................................................19
4.4.6 Implantação:.................................................................20
4.4.7 Refinamento da Estrutura.............................................20
5 Prática nº. 1..................................................................................22
5.1.4 Metodologia.......................................................................23
5.1.5 Sugestões............................................................................23
6 Fase 2. Formulação e Planejamento de Engenharia Web............25
6.1.1 Perguntas de formulação:.............................................25
6.1.2 Reunindo requisitos para WebApps.............................26
6.1.3 A ponte para a modelagem de análise..........................27
6.3.1 Formação de equipe......................................................27
6.4.1 Planejamento de WebApp: Terceirização....................28
6.4.2 Planejamento de WebApp: Engenharia Web em casa. 29
7 Prática nº. 2..................................................................................30
8 Fase 3. Modelagem de Análise de Engenharia Web...................35
8.1.1 A hierarquia do usuário................................................36
8.1.2 Desenvolvimento de caso de uso..................................36
8.1.3 Ajuste de modelo de caso de uso..................................36
8.3.1 Definindo objetos de conteúdo.....................................38
8.3.2 Relacionamentos de hierarquia de conteúdo................38
8.4.1 Casos de uso.................................................................38
8.4.2 Diagrama de Sequência................................................39
8.4.3 Diagramas de Estado....................................................39

8.4.4 Protótipo de IU.............................................................40
8.7.1 Análise de relacionamento: questões-chave.................41
8.7.2 Análise de navegação...................................................41
9 Prática nº. 3..................................................................................43
9.1.1 Mirar.............................................................................43
9.1.2 Introdução.....................................................................44
9.1.4 Metodologia.......................................................................47
9.1.5 Sugestões............................................................................47
10 Fase 4. Modelagem de design de aplicativos da Web...............48
10.1.1 Design de qualidade de uma WebApp......................49
10.1.2 Objetivos de design...................................................49
10.3.1 Diretriz 3.4 do W3C WCAG 1.0..............................52
10.3.2 O que isso significa:..................................................52
em, %, ex, px...............................................................................53
eles..............................................................................................53
%.................................................................................................53
ex.................................................................................................53
pixels...........................................................................................53
a favor.........................................................................................54
contra...........................................................................................54
contra...........................................................................................55
contra...........................................................................................55
contra...........................................................................................55

10.3.6 Fluxo de trabalho no design de interface.........................56
10.5.1 Objetos de conteúdo.................................................57
10.6.1 Arquitetura de conteúdo...................................................58
10.7.1 Semântica de navegação...........................................58
10.7.2 Sintaxe de navegação................................................58
10.8.1 Projeto Conceitual....................................................61
10.8.2 Design de navegação................................................62
10.8.3 Design de interface abstrato......................................63
10.8.4 Implementação..........................................................64
11 Prática nº. 4................................................................................65
11.1.2 Introdução........................................................................66
12 Fase 5. Testando para IWeb.......................................................69
12.1.1 Dimensões de qualidade...........................................70
12.2.1 Dimensões de Qualidade..........................................73
13 Prática nº. 5................................................................................77
Equipamento...............................................................................79
19 Bibliografia................................................................................98
Mais livrosW........................................................................................112

1 INTRODUÇÃO
O Guia Técnico de Engenharia de Software Web (IWeb) integra um conjunto

de práticas que orientam o desenvolvimento e a criação de uma aplicação web.
Na primeira seção, inicia-se com práticas relacionadas aos estratos:

processos, métodos, ferramentas/tecnologia. O Processo IWeb adota a
abordagem de desenvolvimento ágil que enfatiza um ponto de vista de engenharia
“enxuto” e rigoroso, levando à entrega incremental do sistema a ser construído.
Neste ponto é desenvolvida a primeira fase do projeto IWeb, que corresponde à
proposta.
Na segunda secção, denominada Formulação e Planeamento IWeb, integra

a atividade de comunicação com o cliente, define as necessidades do negócio, as
metas e objetivos do projeto, as categorias de utilizadores finais, as principais
funções e características e o grau de interoperabilidade com. outras aplicações. A
segunda fase do projeto IWeb está em desenvolvimento.
Na terceira seção são integradas práticas que descrevem a Modelagem de

Análise IWeb, cujo objetivo é descrever a motivação básica (metas) e objetivos de
uma WebApps, definir as categorias de usuários e indicar os requisitos de
conteúdo e função das WebApps para. estabelecer um entendimento básico de
por que os WebApps serão construídos, quem os utilizará e quais problemas eles
resolverão para os usuários, gerando a fase três do projeto, chamada IWeb
Analysis Modeling.
Na quarta seção é abordada a modelagem de design IWeb, que define

qualidade em termos de facilidade de uso, funcionalidade, confiabilidade,
eficiência, facilidade de manutenção, segurança, escalabilidade e tempo de
ING. ROSA IMELDA GARCIA CHI,MTI 11

mercado.
O design da interface descreve a estrutura e organização da interface do

usuário. Inclui uma representação do modelo de tela, uma definição dos modos de
interação e uma descrição dos mecanismos de navegação. O design gráfico
também está incluído aqui, referindo-se à aparência e percepção de Web Apps e
inclui esquemas de cores, modelo geométrico, tamanho do texto, fonte e
posicionamento, uso de gráficos e decisões estéticas relacionadas. Esta unidade
descreve métricas de design para engenharia Web. Neste ponto é solicitada a
geração da fase quatro do projeto, a Modelagem de IWeb Design.
E por fim, são revisados os tópicos relacionados aos Testes IWeb. O

objetivo de testar Web Apps é exercitar cada uma das muitas dimensões da
qualidade para encontrar erros ou descobrir conflitos que possam levar a falhas
de qualidade. Os testes concentram-se no conteúdo, função, estrutura, facilidade
de uso, navegabilidade, desempenho, compatibilidade, interoperabilidade,
capacidade e segurança.
Os testes também incorporam revisões que ocorrem à medida que o

aplicativo Web é projetado. Propõe-se nesta unidade testar o produto obtido pela
aplicação da modelagem de Engenharia Web em cada uma de suas fases. É
solicitada comprovação da aplicação dos testes.
O objetivo deste Guia Técnico é a integração dos diferentes elementos,

critérios e métodos, e inclui a informação básica para resolver um conjunto de
práticas de Engenharia de Software Web da Carreira de Engenharia de Sistemas
Informáticos, que proporciona ao aluno a capacidade e habilidade para conhecer,
compreender e aplicar em profundidade as tecnologias e metodologias presentes
no ambiente profissional para o desenvolvimento de aplicações Web, projetar e

direcionar soluções de qualidade baseadas em aplicações Web, bem como
analisar e avaliar aplicações Web em vigor no quadro legal, social e econômico.
O Guia apresenta uma série de práticas ou fases de projeto que abrangem

cada uma das competências que um engenheiro de desenvolvimento de software
web deve integrar. As práticas são apenas uma sugestão didática para o
professor orientar o aluno na aplicação dos conhecimentos adquiridos em cada
uma das unidades.
São incorporados formatos para desenvolver as fases do projeto IWeb, para

que o praticante ou desenvolvedor integre ao final um documento integrador,
mostrando a aplicação e o resultado de cada uma das práticas ou fases.

2 Fases de desenvolvimento da Engenharia Web
2.1 Fase 1: Introdução à Engenharia Web (IWeb)
Tópicos 1.1 Atributos de sistemas e aplicativos baseados na Web

1.2 Camadas de engenharia de WebApps
1.3 O Processo de Engenharia Web
1.3.1 Definição do quadro
1.3.2 Refinamento da Estrutura
2.2 Fase 2: Formulação e Planejamento de Engenharia Web
Tópicos 2.1 Formulação de sistemas baseados na Web

2.1.1. perguntas do formulário
2.1.2. Reunindo requisitos para WebApps
2.1.3. A ponte para a modelagem de análise
2.2 .Planejamento de projeto de engenharia web
2.3 . A equipe de engenharia da Web
2.3.1. Os atores
2.3.2. Formação de equipe
2.4 . Conflitos de gerenciamento de projetos para engenharia da
Web
2.4.1.Planejamento de WebApp: Terceirização
2.4.2.Planejando WebApps: engenharia web em casa
2.5 Medição para Engenharia Web e WebApps
2.5.1.Medições para esforço de engenharia da Web
2.5.2.Medição do valor comercial
2.3 Fase 3: Modelagem de Análise de Engenharia Web
Tópicos 3.1 Requisitos para análise de WebApps

3.1.1 A hierarquia do usuário
3.1.2 Desenvolvimento de caso de uso
3.1.3 Ajuste de modelo de caso de uso
3.2 Modelagem de Análise para WebApps
3.3 Modelagem de conteúdo
3.3.1 Definindo objetos de conteúdo
3.3.2 Relacionamentos e hierarquia de conteúdo
3.3.3 Classes de análise para WebApps
3.4 O modelo de interação
3.5 O modelo funcional
3.6 O modelo de configuração
3.7 Análise de navegação de relacionamento
3.7.1 Análise de relacionamento
3.7.2 Análise de navegação

2.4 Fase 4: Modelagem de Design de Aplicações Web
Tópicos 4.1 Questões de design para engenharia web

4.1.1 Design e qualidade de uma WebApps
4.1.2 Objetivos de design
4.2 Pirâmide de Web Design
4.3 Design de interface de WebApps

4.3.1 Princípios e diretrizes de design de interface
4.3.2 Mecanismos de controle de interface
4.3.3 Fluxo de trabalho no design de interface
4.4 design estético

4.4.1 Problemas de modelo
4.4.2 Problemas de design gráfico
4.4.3 Design de conteúdo

4.5.1 Objetos de conteúdo
4.5.2 Problemas de design de conteúdo
4.6 Projeto arquitetônico

4.6.1 Arquitetura de conteúdo
4.6.2 Arquitetura de WebApps
4.7 Layout de navegação

4.7.1 Semântica de navegação
4.7.2 Sintaxe de navegação
4.8 Design em nível de componente
4.9 Padrões de design de hipermídia
4.10 Método de design de hipermídia orientado a objetos (MDHOO)

4.10.1 Projeto Conceitual MDHOO
4.10.2 Design de navegação usando MDHOO
4.10.3 Design e implementação de interface abstrata
4.11 Métricas de design para WebApps

2.5 Fase 5: Teste para IWeb
Tópico 5.1. Prova de conceitos para WebApps

5.1.1. Dimensões de qualidade
s 5.1.2. Erros em um ambiente WebApps
5.1.3. Estratégias de teste
5.1.4. Planejamento de teste
5.2. O processo de teste
5.3. Teste de conteúdo

5.3.1. Objetivos do teste de conteúdo
5.3.2. Teste de banco de dados
5.4. Teste de interface do usuário

5.4.1. Estratégia de teste de interface
5.4.2. Testando mecanismos de interface
5.4.3. Testando a semântica da interface
5.4.4. Teste de facilidade de uso
5.4.5. Testes de compatibilidade
5.5. Teste no nível do componente
5.6. Testes de navegação

5.6.1. Testar sintaxe de navegação
5.6.2. Testando a semântica de navegação
5.7. Teste a configuração

5.7.1. Conflitos no lado do servidor
5.7.2. Conflitos do lado do cliente
5.8. Teste de segurança
5.9. Teste de desempenho

5.9.1. Objetivos do teste de desempenho
5.9.2. Teste de carga
5.9.3. Testes de estresse

3 Objetivo(s) Geral(is) da Engenharia de Software Web

^ Proporcionar ao aluno uma visão global e atualizada das principais áreas
relacionadas com a Engenharia Web, bem como das principais linhas de
investigação relacionadas com a referida disciplina.
^ Conhecer, compreender e aplicar aprofundadamente as tecnologias e
metodologias presentes no ambiente profissional para o desenvolvimento
de aplicações Web.
^ Projetar e direcionar soluções de qualidade baseadas em aplicações Web
no ambiente profissional.
^ Analisar e avaliar as aplicações Web atuais no ambiente profissional sob o
enquadramento jurídico, social e económico
3.1 Competências Prévias para desenvolver software com engenharia web
^ Aplica modelos, técnicas e ferramentas para cada uma das etapas do ciclo
de vida de desenvolvimento de software tradicional e orientado a objetos
^ Aprenda sobre sistemas de banco de dados avançados
^ Use alguma linguagem de modelagem (UML)
^ Aprenda sobre programação web avançada
^ Identifica diferentes arquiteturas tecnológicas
^ Programação.
^ Sistemas operacionais.
^ Sistemas Distribuídos.
^ Engenharia de software.
^ Engenharia de Computação.
^ Sistemas de Informação.
^ Tecnologias de informação.
^ Gestão de Tecnologia da Informação
^ Administração e Gestão de Empresas.
ING. ROSA IMELDA GARCIA CHI,MTI I 7
^ Sistemas orientados a serviços.
3.2 Competências específicas a desenvolver por fase de engenharia web
3.2.1.1 Competição Específica da Fase 1
^ Desenvolver a capacidade de identificar os atributos que existem na maioria

das WebApps; Bem como as camadas de engenharia de WebApps e o
processo de Engenharia Web.
^ Desenvolver a capacidade de formular sistemas e aplicações baseados na

Web; Da mesma forma, visualize o planejamento de projetos de engenharia
Web contemplando a equipe de engenharia Web, gerenciamento de
conflitos de projetos e mensuração para engenharia Web e WebApps.
^ Desenvolver a habilidade de formulação, levantamento de requisitos e

análise de modelagem descrevendo a motivação básica (metas) e objetivos
para os WebApps, definir a categoria de usuários, delinear os requisitos de
conteúdo e função para os WebApps, estabelecer uma compreensão básica
do porquê dos WebApps será construído, quem o utilizará e quais
problemas ele resolverá para os usuários.
^ Desenvolver a capacidade de aplicar a qualidade de uma WebApps em

termos de facilidade de uso, funcionalidade, confiabilidade, eficiência,
facilidade de manutenção, segurança e escalabilidade e tempo de mercado
alcançando um bom design com simplicidade, consistência, identidade,

robustez, navegabilidade e aparência visual.
3.2.1.5 Competição Específica da fase 5
^ Desenvolva a capacidade de descobrir erros no conteúdo, função,

usabilidade, navegabilidade, desempenho, capacidade e segurança de
WebApps, aplicando uma estratégia de teste que abrange revisões e testes
executáveis em todo o processo de engenharia da Web.

OLÍA TÉCNICA DA FASE 1
Introdução a
Engenharia web
4 Fase 1. Introdução à Engenharia Web
4.1 Engenharia Web

A World Wide Web e a Internet que a alimenta são possivelmente os

desenvolvimentos mais importantes na história da computação. Estas tecnologias
trouxeram todos para a era da informática; Eles também se tornaram parte
integrante da vida diária nos últimos dias.
Figura 1 Modelo de Engenharia Web. Fonte: (PRESSMAN, 2006)

4.1.1 O que é?
Os sistemas e aplicativos baseados na Web oferecem uma gama completa de
conteúdo e atendem a uma ampla população de usuários finais. A engenharia da
Web é o processo com o qual WebApps de alta qualidade são criados. A
Engenharia Web não é um clone perfeito da engenharia de software, mas utiliza
muitos de seus conceitos e princípios fundamentais.
4.1.2 Quem faz isso?

Engenheiros web e desenvolvedores de conteúdo não-técnicos criam WebApps.

4.1.3 Por que isso é importante?

À medida que as WebApps se tornam cada vez mais integradas nas estratégias
de negócios de pequenas e grandes empresas (por exemplo, comércio
eletrônico), a necessidade de construir sistemas confiáveis, práticos e adaptáveis
torna-se cada vez mais importante.
4.1.4 Quais são as etapas?

Como qualquer outra disciplina de engenharia, a Engenharia Web aplica uma
abordagem genérica que é suavizada por estratégias, técnicas e métodos
especializados. O processo IWeb começa com uma formulação do problema que
será resolvido com as WebApps. O sistema é construído com tecnologias e
ferramentas especializadas associadas à Web.
4.1.5 Qual é o produto obtido?

Muitos produtos de trabalho IWeb são produzidos. O resultado final são as
WebApps operacionais.
4.2 Atributos de sistemas e aplicações Web
4.2.1 O que é usabilidade?

Técnicas que ajudam os humanos a realizar tarefas em ambientes de computação
gráfica.
Três conceitos muito importantes. Trabalhamos para o ser humano, que pretende
realizar uma tarefa de forma simples e eficaz e neste caso particular deve realizá-
la diante de um computador num ambiente gráfico, a Web.
A usabilidade ajuda a realizar esta tarefa de forma simples, analisando o

comportamento humano e as etapas necessárias para executar a tarefa de forma
eficaz. Pode soar um pouco como trabalho industrial, mas quando se refere ao
termo ^^^^^^^^ ^^ refere-se a procurar um programa que você deseja assistir na

TV, a ver informações sobre um time de futebol favorito, a comprar um livro sobre
artes marciais.
4.2.2 A usabilidade é realmente necessária para fazer um site?

Quer o seu site seja um portal ou uma página pessoal, não se esqueça que as
pessoas que visitam o seu site o fazem basicamente porque procuram algo.
Simplificar é uma decisão sua, mas certamente juntos podemos tornar a Internet
um lugar melhor onde as pessoas não se sintam perdidas, deslocadas ou
simplesmente desapontadas.
4.2.3 Quais são as 8 regras de ouro sobre usabilidade?

Talvez amanhã haja 10 regras.
1. Na Internet quem manda é o usuário.
Isso significa que sem usuários sua página morre, então é melhor você cuidar
deles e dar o que eles pedem, caso contrário você ficará sozinho.
2. Na Internet, a qualidade se baseia na velocidade e na confiabilidade.
Na Internet importa que sua página seja mais rápida que bonita, confiável que
moderna, simples ao invés de complexa, direta.
3. Segurança.
Se no mundo real às vezes achamos difícil confiar no banco da esquina, imagine

como as pessoas na Internet se sentem quando acessam seu site. Certifique-se
de que tudo funcione perfeitamente para que as pessoas possam confiar em seu
site.
4. A confiança é algo difícil de conquistar e que se perde com um link ruim.

Isso significa que da forma como está a concorrência na Internet, você não pode
perder um único visitante por ter um link ruim. É melhor sair com algo simples e
complicar aos poucos, do que sair com tudo e ver “o que acontece”. As versões
1.0 são boas desde que o que está em vigor esteja bem estabelecido e gere
confiança. Aos poucos e com o feedback dos usuários, você pode complicar a
página. Mas certifique-se antes de arriscar.
5. Se você quer fazer uma página decente, simplifique, reduza, otimize.
As pessoas não vão conhecer o seu site por mais que você insista, então pelo
menos simplifique, reutilize todos os elementos que puder, para que os usuários
se sintam confortáveis e não se percam toda vez que precisarem encontrar algo
no seu site.
6. Coloque as conclusões no início.
O usuário se sentirá mais confortável se visualizar os objetivos logo no início.

Dessa forma você não terá que procurar o que precisa e perderá menos tempo
concluindo sua tarefa. Se ele concluir sua tarefa em menos tempo, ele se sentirá
confortável e talvez explore seu site ou talvez o recomende a um amigo.
7. Não desperdice o tempo das pessoas com coisas que elas não precisam.
Cuidado ao cruzar promoções, se fizer pelo menos faça com cuidado. Certifique-
se de que a seleção de produtos a cruzar é consistente e não quer “vender tudo”
em todas as páginas. À medida que o usuário avança na navegação, ele tenta
deixar mais espaço livre. Pode acontecer que quando você está prestes a
comprar algo você veja uma oferta que o distraia e você perca a venda.
8. Bons conteúdos.

Escrever bem para a Internet é uma arte. Mas seguindo as regras básicas de (1)
colocar as conclusões no início, (2) escrever cerca de 25% do que colocaria no
papel, você pode ir muito longe.
(3) A leitura na tela é difícil, por isso, no caso de textos para internet, reduza e
simplifique o máximo que puder.
9. Avaliação de conteúdo.
Ao contrário do software aplicativo que evolui continuamente, os aplicativos Web

envolvem uma evolução contínua. Monitorização contínua e detalhada da
informação implícita na aplicação Web. Tudo isso faz com que a aplicação Web
atenda bem ao usuário.
4.3 Estratos de Engenharia Web
O desenvolvimento de aplicações Web incorpora métodos de processos

especializados, métodos de engenharia de software adaptados às características
de desenvolvimento de aplicações Web e um conjunto de tecnologias importantes
que permitem o seu correto desenvolvimento.
Os processos, métodos e tecnologias (ferramentas) fornecem uma abordagem em

camadas para o IWeb que é conceitualmente idêntica às camadas da engenharia
de software.
4.3.1 Processo
Os modelos de processos da Web adotam a filosofia de desenvolvimento ágil. O
desenvolvimento ágil enfatiza uma abordagem de desenvolvimento rigorosa que
incorpora ciclos rápidos de desenvolvimento.
É importante reconhecer que o problema ainda deve ser analisado, um design

deve ser desenvolvido, a implementação deve preceder de forma incremental e

uma abordagem de teste organizada deve ser iniciada. Estas atividades-quadro

devem ser definidas dentro de um processo que:
^ Abrace a mudança: incentive a criatividade e a independência da equipe de

desenvolvimento e fortaleça a interação do usuário.
^ Crie sistemas que usem pequenas equipes de desenvolvimento.
^ Enfatize o desenvolvimento evolutivo ou incremental usando ciclos curtos de
desenvolvimento.
4.3.2 Métodos
Os métodos IWeb abrangem um conjunto de tarefas técnicas que permitem ao
engenheiro Web compreender, caracterizar e então construir uma aplicação Web
de alta qualidade. Os métodos IWeb podem ser categorizados da seguinte forma:
4.3.2.1 Métodos de comunicação:

Métodos de comunicação: Definem a abordagem com a qual a comunicação é
facilitada entre: cliente e desenvolvedor.
As técnicas de comunicação são importantes durante a coleta de requisitos.
4.3.2.2 Métodos de análise de requisitos:

Eles fornecem uma base para a compreensão do conteúdo que será entregue aos
WebApps, a funcionalidade que ele fornecerá ao usuário final e os modos de
interação que cada classe de usuário exigirá enquanto ocorre a navegação pelos
WebApps.
4.3.2.3 Métodos de projeto:

Eles cobrem uma série de técnicas de design que abordam o conteúdo, a
arquitetura de aplicativos e de informações, bem como o design de interface e a
estrutura de navegação de WebApps.

4.3.2.4 Método de teste:

Eles incorporam revisões técnicas formais do conteúdo e do modelo de design e
uma ampla variedade de técnicas de teste que abordam conflitos no nível do
componente.
Testes de navegação, testes de usabilidade, testes de segurança e testes de

configuração.
4.3.3 Ferramentas e tecnologias

As tecnologias abrangem um amplo conjunto de linguagens de descrição e
modelagem de conteúdo, por exemplo: HTML, VRML, XML, etc. linguagens de
programação por exemplo java, php, jsp, etc. recursos de desenvolvimento
baseados em componentes, por exemplo, corba, com, activeX, .net, etc.
navegadores, ferramentas multimídia, ferramentas de auditoria de sites,
ferramentas de conectividade de banco de dados, ferramentas de segurança,
servidores e utilitários de servidor e ferramentas de administração e análise de
sites.
4.4 O Processo de Engenharia Web
Num processo tão rápido como o da Engenharia Web, onde os tempos de

desenvolvimento e os ciclos de vida dos produtos são tão curtos, vale a pena o
esforço exigido pela gestão? A resposta é que dada a sua complexidade é
essencial.
Entre os aspectos que dificultam a gestão destacamos: - elevado percentual de

contratação de terceiros, - o desenvolvimento inclui uma grande variedade de
pessoal técnico e não técnico trabalhando em paralelo, - a equipe de
desenvolvimento deve dominar aspectos tão diversos como software baseado em
componentes, redes, design de arquitetura e navegação, design gráfico e de

interface, linguagens e padrões da Internet, testes de aplicações Web, etc., o que

torna árduo o processo de busca e contratação de pessoal.
4.4.1 Defina a estrutura

A eficácia de qualquer processo de engenharia depende da sua adaptabilidade.
Ou seja, a organização da equipe de trabalho do projeto, os modos de
comunicação entre os membros da equipe, as atividades e tarefas de engenharia
que devem ser executadas, as informações que são coletadas e criadas e os
métodos utilizados para produzir um produto do projeto devem ser de alta
qualidade. ser adaptado às pessoas que realizam o trabalho, ao prazo e às
restrições do projeto e ao problema a ser resolvido.
Antes de definir uma estrutura de processo para o IWeb deve-se reconhecer que:
^ WebApps geralmente são entregues de forma incremental.

^ As mudanças ocorrerão com frequência.
^ Os prazos são curtos.
4.4.2 Comunicação com o cliente:

A comunicação com o cliente é caracterizada por duas tarefas principais: análise e
formulação do negócio. A análise de negócios define o contexto organizacional de
negócios para WebApps e outros aplicativos de negócios.
A formulação é uma atividade de levantamento de requisitos que envolve todos os

participantes.
4.4.3 Planejamento:
É criado o plano do projeto para o aumento da WebApp. O plano consiste numa
definição de tarefas e num calendário de prazos relativos ao período estabelecido
para o desenvolvimento do projeto.

4.4.4 Modelagem:
As tarefas convencionais de análise e design de engenharia de software são
adaptadas ao desenvolvimento de WebApps, misturadas e depois mescladas em
uma atividade de modelagem IWeb.
A intenção é desenvolver modelos rápidos de análise e design que definam

requisitos e ao mesmo tempo representem uma WebApp que os satisfaça.
4.4.5 Construção:
As ferramentas e tecnologia IWeb são aplicadas para construir o WebApp que foi
modelado. Depois que o incremento WebApp é construído, ele passa por uma
série de testes rápidos para garantir que erros no design sejam descobertos.
4.4.6 Implantação:
A WebApp é configurada para seu ambiente operacional, entregue aos usuários
finais e então inicia um período de avaliação. Feedback sobre a avaliação para
realização dos respectivos processos.
Figura 2 Fase de construção de uma aplicação Web. Fonte: (PRESSMAN, 2006)

4.4.7 Refinamento da Estrutura

A definição das tarefas de engenharia necessárias para refinar cada atividade do
framework fica a critério da equipe de engenharia da Web.
É importante ressaltar que as tarefas associadas à atividade da estrutura IWeb

podem ser modificadas, eliminadas ou estendidas com base nas características
do problema, do produto, do projeto e das pessoas da equipe de engenharia da
Web.
4.5 Melhores práticas em Engenharia Web.
• Reserve um tempo para entender as necessidades do negócio e os

objetivos do produto, mesmo que os detalhes do WebApp sejam vagos.
• Descreva como os usuários irão interagir com o WebApp usando uma
abordagem baseada em cenários.
• Desenvolva um plano de projeto, mesmo que seja muito breve
• Use algum tempo para modelar o que será construído.

• Revise a consistência e a qualidade dos modelos.
• Use ferramentas e tecnologia que permitam construir o sistema com o
máximo de componentes reutilizáveis.
• Não confie em usuários anteriores para depurar o WebApp

5 Prática nº. 1
5.1 Nome da prática: Plano de Negócios da Fase 1 do Projeto

IWeb
Definir o Plano de Negócios como uma
5.1.1 Objetivo
proposta para o desenvolvimento de um Projeto
de Engenharia Web.
Os pontos a considerar em um Plano

5.1.2 Introdução
As empresas são:
1. sumário executivo
2. Descrição do produto e valor distintivo
3. Mercado potencial
4. Competência
5. Modelo de negócios e plano financeiro
6. Equipe de gestão e organização
7. Status de desenvolvimento e plano de
implementação
8. Alianças estratégicas
9. Estratégia de marketing e vendas
10. Principais riscos e estratégias de
saída
5.1.3 Materiais e ^ Computador com acesso à Internet
Equipame ^ Dispositivo de armazenamento
nto
^ Plataforma IT Valles Moodle
^ Processador de texto pe palavras
1. Forme uma equipe de trabalho com

5.1.4 Metodologia
vários papéis
2. Baixe o formato para preparar a fase 1 (Anexo No.
1). Está disponível em plataformas como
www.slideshare.net, www.issuu.com,
www.googledocs.com, www.scribd.com.
3. Resolver cada um dos pontos propostos na fase de
projeto
4. Prepare-o em formato digital
5. Faça upload para a plataforma virtual de
aprendizagem
Você pode revisar vários materiais de referência

5.1.5 Sugestões
para a elaboração de Planos de Negócios.
Na Engenharia de Software aprendemos sobre

Modelagem de Negócios, que pode ser aplicada nesta
fase do projeto.
Da mesma forma, a disciplina Gerenciamento de

Projetos fornece elementos para gerar um Plano de
Negócios no esquema PMBook, que pode ser aplicado
na fase inicial do projeto.

CE TÉCNICO OLÍA FASE 2
Formulação e Planejamento de Engenharia

Web

6 Fase 2. Formulação e Planejamento de Engenharia Web
6.1 Formulação de sistemas baseados na Web

A formulação concentra-se no panorama geral das necessidades e objetivos do
negócio e nas informações relacionadas. Clientes e engenheiros Web desejam
definir o conteúdo necessário, discutir funcionalidades específicas, recursos
específicos e identificar a forma como os usuários finais irão interagir com o
WebApp, tudo isso é formulação e levantamento de requisitos.
6.1.1 Perguntas de formulação:

Nesta fase é bom perguntar e responder o seguinte:
^ Qual é a principal motivação para WebApps?

^ Quais são os objetivos que os WebApps devem satisfazer?
^ Quem usará o WebApp?

Se tivermos uma resposta correta a estas questões, elas implicam objetivos

específicos para o site.
Em geral, são identificadas duas categorias de objetivos:
Objetivos informativos: indicam a intenção de fornecer conteúdo informativo

específico ao usuário final.
Objetivos aplicáveis: indicam a capacidade de realizar alguma tarefa dentro da

WebApp.
6.1.2 Reunindo requisitos para WebApps

Os objetivos gerais da proposta de levantamento de requisitos para engenharia de
software permanecem inalterados. Adaptados para WebApps, esses objetivos
passam a ser:
^ Identifique os requisitos de conteúdo.

^ Identifique os requisitos funcionais.
^ Defina cenários de interação para diferentes classes de usuários.
As seguintes etapas de levantamento de requisitos são direcionadas para atingir
esses objetivos.
1. Peça aos clientes para definirem uma categoria de usuário e descreverem

cada categoria.
2. Comunique-se com os clientes para definir requisitos básicos para WebApps.
3. Analise as informações coletadas e use-as para rastrear clientes.
4. Defina casos de uso que descrevam cenários de interação para cada classe
de usuário.

6.1.3 A ponte para a modelagem de análise

Todas as informações coletadas e processadas são modeladas usando casos de
uso e notação UML.
6.2 Planejamento de projetos de Engenharia Web

Dado o imediatismo das WebApps, é razoável perguntar: você realmente precisa
gastar tempo planejando e gerenciando um esforço de WebApp? Não deveriam
os WebApps se envolver naturalmente, com pouco ou nenhum gerenciamento
explicativo?
6.3 A equipe de engenharia da Web

Uma equipe de engenharia Web bem-sucedida mistura uma ampla variedade de
talentos que devem trabalhar em equipe em um ambiente de projeto de alta
pressão. Os prazos são curtos, as mudanças são inexoráveis e a tecnologia
continua a mudar. Criar uma equipe que se consolide não é uma tarefa simples.
^ Os atores
^ Desenvolvedores/provedores de conteúdo
^ Editores da Web
^ Engenheiro da Web
^ Especialistas em domínios empresariais
^ Especialista em suporte
^ Administrador
6.3.1 Formação de equipe
Para a formação de equipes é particularmente relevante quando uma organização
forma uma equipe IWeb.
^ Um conjunto de diretrizes para a equipe deve ser estabelecido.

^ Uma liderança forte é obrigatória

^ O respeito pelos talentos individuais é crucial

^ Cada membro da equipe deve se entender
^ É fácil começar, o difícil é manter o espírito.
6.4 Conflitos de gerenciamento de projetos para engenharia da Web
Uma vez realizada a formulação e identificados os requisitos básicos da WebApp,
a empresa deve escolher uma das duas opções de engenharia Web:
^ O WebApp é terceirizado: a engenharia web é realizada por um fornecedor

terceirizado com experiência, talento e recursos que a empresa não possui.
^ Os WebApps são desenvolvidos internamente por engenheiros da Web que
são funcionários da empresa.
6.4.1 Planejamento de WebApp: Terceirização

Neste caso uma empresa (o cliente) solicita um preço fixo para desenvolver a
WebApp a um ou mais fornecedores, avalia os preços competitivos e depois
escolhe um fornecedor para realizar o trabalho. Mas o que a organização
contratante procura? Como é determinada a competência de um provedor de
WebApp? Como saber se uma cotação é razoável?
Que grau de planejamento, cronograma de trabalho e avaliação de riscos pode

ser esperado quando uma organização embarca em um esforço para desenvolver
uma excelente WebApp?
Essas perguntas nem sempre são fáceis de responder, mas vale a pena
considerar algumas orientações.
6.4.1.1 Seleção de candidatos a subcontratantes:

Para escolher os candidatos a desenvolvedores Web, o contratante deve realizar
algumas tarefas obrigatórias:

^ Entreviste clientes anteriores para determinar o profissionalismo do

profissional de marketing da Web, bem como sua capacidade de cumprir
prazos e compromissos de custos e sua capacidade de se comunicar com
eficácia.
^ Determine o nome do(s) engenheiro(s)-chefe(s) da Web da empresa
subcontratada para pesquisar projetos anteriores de sucesso.
^ Examine cuidadosamente exemplos de trabalho do subcontratado que
sejam semelhantes em aparência e significado ao WebApp a ser
contratado.
6.4.2 Planejamento de WebApp: Engenharia Web em casa

As etapas a seguir são recomendadas para projetos IWeb pequenos e
moderados.
^ Compreenda o escopo, dimensões de mudança e restrições do projeto.

^ Defina uma estratégia de projeto incremental
^ Realize análise de risco
^ Desenvolva uma estimativa rápida
^ Escolha um conjunto de tarefas
^ Defina um programa
^ Definir mecanismos de acompanhamento de projetos
^ Estabeleça uma abordagem de gerenciamento de mudanças
6.5 Mediação para engenharia Web e WebApps
A mediação de software fornece uma base para melhorar o processo de software,
aumentando a precisão das estimativas do projeto, aumentando o
acompanhamento do projeto e melhorando a qualidade do software.

As medições têm três objetivos principais:
^ Fornecer um indicador de qualidade de WebApps do ponto de vista técnico.
^ Fornecer uma base para estimativa de esforço

^ Fornece uma indicação do sucesso da WebApp do ponto de vista
comercial.
7 Prática nº. 2
7.1 Nome da prática: Fase 2 Formulação e Planejamento IWeb
Preparar a Formulação e Planejamento de um

7.1.1 Mirar
Projeto de Engenharia Web

7.1.2 Introdução
A engenharia da Web formula processos de
acordo com a necessidade subjacente da
aplicação da Web, os recursos e funções
desejados pelos usuários e o escopo do
esforço de desenvolvimento.
O IWeb planeja diretrizes para coisas que

devem ser definidas para estabelecer um plano
de trabalho, considerar riscos, definir um
programa e estabelecer mecanismos para
monitorar o trabalho de como a investigação
avança.
A partir do IWeb existe um processo ágil para

produtos de trabalho, para formulação e
planejamento eles devem ser coerentes, mas
os documentos devem ser escritos.
A formulação e o planeamento da informação

devem ser revistos com as partes interessadas
para garantir que as inconsistências e omissões
sejam identificadas atempadamente.


Equipamento ^ Plataforma IT Valles Moodle
^ Microsoft Visio ou Concept Draw ou DIA
7.1.4 Metodologia 1. Forme uma equipe de trabalho com

diversas funções
2. Baixe o formato para preparar a fase 2
(Anexo No. 2). Está disponível em
plataformas como www.slideshare.net,
www.issuu.com, www.googledocs.com,
www.scribd.com.
3. Resolver cada um dos pontos propostos
na fase de projeto
aprendizagem

7.1.5 Sugestões
Para desenvolver a Formulação e Planejamento de um

projeto de Engenharia Web é necessário conhecer e
dominar aspectos da Linguagem de Modelagem
Unificada (UML), especificamente os diagramas de
casos de uso e diagramas de classes.
Sugere-se o uso de ferramentas de desenvolvimento de

software como diagramadores ou ferramentas CASE.
Algumas dessas ferramentas são: Microsoft Visio,
Concept Draw ou DIA.

CE TÉCNICA OLÍA FASE 3
Modelagem de Análise de Engenharia

Web
8 Fase 3. Modelagem de Análise de Engenharia Web.
8.1 Requisitos para análise de WebApps

A análise de requisitos para WebApps abrange três tarefas principais:
• Formulação
• Reunindo requisitos
• Modelagem de análise

8.1.1 A hierarquia do usuário

Categorias de usuários finais são identificadas como parte das tarefas de
formulação e coleta de requisitos. As categorias de usuários são relativamente
limitadas e não necessitam de representação UML. Entretanto, quando o número
de categorias de usuários aumenta, às vezes é aconselhável desenvolver uma
hierarquia de usuários.
8.1.2 Desenvolvimento de caso de uso

Os casos de uso são desenvolvidos para cada categoria de usuário descrita na
hierarquia de usuários. No contexto da engenharia Web, o caso de uso em si é
relativamente informal: um parágrafo narrativo que descreve uma interação
específica entre o usuário e o WebApp.
8.1.3 Ajuste de modelo de caso de uso

À medida que os diagramas de casos de uso são criados para cada categoria de
usuário, é desenvolvida uma visão superior dos requisitos do WebApp
observáveis externamente.
Cada pacote é avaliado para garantir que seja:
^ Compreensível.
^ Coeso
^ Fracamente acoplado
^ Hierarquicamente superficial.
Já a análise e modelagem de atividades são atividades iterativas.
8.2 Modelagem de Análise para WebApps

Baseia-se nas informações contidas nos casos de uso desenvolvidos para a
aplicação. O conteúdo que a WebApp irá apresentar é identificado e as funções

que serão desenvolvidas são extraídas das descrições dos casos de uso.
Finalmente, os requisitos específicos de implementação devem ser desenvolvidos
para que o ambiente e a infraestrutura que suportam as WebApps possam ser
construídos.
Quatro atividades de análise, cada uma com sua contribuição para a criação de
um modelo de análise completo, são:
^ Análise de conteúdo
^ Análise de interação
^ Análise de recursos
^ Análise de configuração
O próprio modelo contém elementos estruturais e dinâmicos. Os elementos
estruturais identificam as classes de análise e os objetivos de conteúdo
necessários para criar uma WebApp que atenda às necessidades do cliente.
Os elementos dinâmicos do modelo de análise descrevem como os elementos

estruturais interagem entre si e com os usuários finais.
8.3 O modelo de conteúdo

O modelo de conteúdo contém elementos estruturais que fornecem informações
importantes sobre os requisitos de conteúdo de uma WebApp. Também inclui
todas as classes de análise: entidades visíveis ao usuário que são criadas ou
manipuladas conforme o usuário interage com o WebApp.
Assim como outros elementos do modelo de análise, o modelo de conteúdo deriva

de um exame cuidadoso dos casos de uso desenvolvidos para o WebApp.

8.3.1 Definindo objetos de conteúdo

Um objeto de conteúdo pode ser uma descrição textual de um produto, um artigo
que descreve uma notícia.
Os objetos de conteúdo são extraídos para casos de uso examinando a descrição

do cenário em busca de referências diretas e indiretas ao conteúdo.
8.3.2 Relacionamentos de hierarquia de conteúdo

O modelo de conteúdo pode conter diagramas de relacionamento de entidades ou
árvores de dados que descrevem os relacionamentos entre objetos de conteúdo
ou a hierarquia de conteúdo mantida por um WebApp.
8.4 O modelo de interação

Este modelo de interação é composto por quatro elementos:
^ Casos de uso
^ Diagramas de sequência
^ Diagramas de estado
^ Protótipo de IU
8.4.1 Casos de uso
Um caso de uso é modelado para todos os processos que a WebApp deve
realizar. Os processos são descritos dentro do caso de uso por uma descrição
textual ou uma sequência de etapas executadas.
Os Diagramas de Atividades também podem ser usados para modelar cenários

graficamente. Uma vez capturado o comportamento da aplicação desta forma, os
casos de uso são examinados e expandidos para mostrar quais objetos se inter-
relacionam para que esse comportamento ocorra.

8.4.2 Diagrama de Sequência

Um diagrama de sequência mostra uma interação ordenada de acordo com a
sequência temporal de eventos. Em particular, mostra os objetos participantes da
interação e as mensagens que eles trocam ordenadas de acordo com sua
sequência no tempo.
O eixo vertical representa o tempo, e os objetos e atores participantes da

interação são colocados no eixo horizontal, sem uma ordem pré-determinada.
Cada objeto ou ator possui uma linha vertical e as mensagens são representadas
por setas entre os diferentes objetos. O tempo flui de cima para baixo. Etiquetas
(como restrições de tempo, descrições de ações, etc.) podem ser colocadas na
margem esquerda ou ao lado das transições ou ativações às quais se referem.
8.4.3 Diagramas de Estado

O comportamento em tempo real de cada classe que possui comportamento
dinâmico e significativo é modelado usando um Diagrama de Estado. O diagrama
de atividades também pode ser usado aqui, desta vez como uma extensão do
diagrama de estados, para mostrar detalhes das ações realizadas pelos objetos
em resposta a eventos internos. O diagrama de atividades também pode ser
usado para representar graficamente as ações dos métodos de classe.
8.4.4 Protótipo de IU
Algumas propostas baseiam-se na obtenção de requisitos de protótipos a partir da
definição que, sem possuir todas as funcionalidades do sistema, permitem ao
usuário ter uma ideia da estrutura da interface do sistema com o usuário. Esta
técnica tem o problema de que o usuário deve entender que o que está vendo é
um protótipo e não o sistema final.
Como as ferramentas de desenvolvimento de WebApps são abundantes e

funcionalmente poderosas, é melhor criar um protótipo da interface usando essas

ferramentas.
8.5 O modelo funcional

Este modelo funcional aborda dois elementos de processamento da WebApp,
cada um representando um gráfico diferente da abstração processual:
^ Funcionalidade observável em relação ao usuário e entregue ao usuário final

do WebApp.
^ As operações nas classes de análise que implementam comportamentos
associados à classe.
A funcionalidade observável para o usuário inclui quaisquer funções de

processamento que o usuário indique diretamente. Por exemplo, um site
financeiro pode implementar uma variedade de funções financeiras.
8.6 O modelo de configuração

WebApps devem ser projetados e implementados para acomodar uma variedade
de ambientes, tanto do lado do servidor quanto do lado do cliente. O hardware do
servidor e o ambiente do sistema operacional devem ser especificados. Se os
WebApps precisarem acessar um grande banco de dados ou interagir com
aplicativos corporativos existentes no lado do servidor, as interfaces, protocolos
de comunicação e informações apropriados deverão ser especificados.
WebApps devem passar por testes extensivos de cada configuração de

navegador especificada como parte do modelo de configuração.
8.7 Análise de relacionamento de navegação (ARN)

A análise de navegação de relacionamento fornece uma série de etapas de

análise que buscam identificar relacionamentos entre elementos descobertos

como parte da criação do modelo de análise.
A abordagem ARN está organizada em cinco etapas:
^ Análise dos participantes

^ Análise dos elementos
^ Análise de Relacionamento
^ Análise de navegação
^ Análise de avaliação.
8.7.1 Análise de relacionamento: questões-chave
Esta análise faz uma série de perguntas que nos ajudarão a compreender melhor
o relacionamento.
8.7.2 Análise de navegação

Um dos aspectos mais importantes dos sistemas de informação em WebApps é a
navegação. A grande maioria das propostas metodológicas para sistemas
WebApp destacam este aspecto, oferecendo modelos que permitem desenhá-lo e
implementá-lo garantindo a qualidade do resultado.
Porém, analisando estes modelos e técnicas e vendo os resultados de diferentes

estudos comparativos, pode-se observar que este aspecto, na maioria das
propostas, só é abordado nas últimas fases do ciclo de vida, principalmente na
concepção e implementação.
Os mecanismos de navegação são definidos como parte do design. Nesta fase,

os desenvolvedores devem considerar os requisitos globais de navegação.

9 Prática nº. 3
9.1 Nome da prática: Fase 3 IWeb Analysis Modeling
Prepare a Fase 3 da Modelagem de Análise

9.1.1 Mirar
Engenharia Web utilizando Linguagem de Modelagem
Unificada com auxílio de Ferramentas de Software.

A análise de aplicativos da Web se concentra em

9.1.2 Introdução
três áreas:
^ a informação ou conteúdo apresentado

^ as funções do usuário final a serem executadas
^ Comportamentos de aplicativos da Web que
ocorrem em resposta às ações do usuário.
Engenheiros de rede, especialistas em conteúdo e

partes interessadas desenvolvem o modelo de análise.
As análises de modelo permitem que a equipe de
engenharia da Web crie uma representação concreta
dos requisitos da aplicação Web.
A modelagem de análise de uma aplicação web

concentra-se em quatro aspectos fundamentais do
problema:
^ conteúdo
^ interação
^ função
^ configuração
O produto do trabalho de análise do modelo IWeb é um
conjunto de diagramas UML e um texto descritivo que
descreve os resultados das quatro análises realizadas.
Os Produtos de Trabalho de Análise são revisados
quanto à correção, integridade e consistência.
Condições que favorecem a análise do modelo

^ WebApp grande ou complexo a ser construído

^ Grande número de interessados
^ Um grande número de engenheiros da Web e
outros colaboradores
^ Metas e objetivos do aplicativo da web afetarão os
resultados financeiros dos negócios
^ Uma aplicação web bem-sucedida terá grande
influência no sucesso da empresa
Requisitos da tarefa de análise de aplicativos da Web
Formulação
^ Identifique as metas e objetivos do aplicativo web

^ Defina categorias de usuários e crie hierarquia de
usuários
Reunindo requisitos
^ A comunicação entre a equipe da Web e as partes

interessadas se intensifica
^ O conteúdo e os requisitos funcionais estão
listados
Cenários de interação (casos de uso) são
desenvolvidos


Equipame ^ Plataforma IT Valles Moodle
nto
^ Microsoft Visio ou Concept Draw ou DIA


9.1.4 Metodologia
vários papéis
2. Baixe o formato para preparar a fase 3 (Anexo No.
3). Está disponível em plataformas como
www.slideshare.net, www.issuu.com,
www.googledocs.com, www.scribd.com.
3. Resolver cada um dos pontos propostos na fase
de projeto
aprendizagem
Para esta fase do projeto é importante

9.1.5 Sugestões
concluíram e credenciaram a fase 1 e a fase 2 do
projeto. Para Modelar a Análise são necessários os
diagramas de casos de uso e os diagramas de classes
UML gerados na fase 1 do projeto.
Nesta fase também é necessária a utilização de

ferramentas de diagramação UML.

CE TÉCNICO OLÍA FASE 44
Modelo de design de aplicativos da Web
10 Fase 4. Modelagem de design de aplicativos da Web.
10.1 Tópicos de design para engenharia da Web

Ao aplicar o design no contexto da engenharia Web, devem ser consideradas
questões genéricas e específicas. O design deve ser muito específico.

10.1.1 Design de qualidade de uma WebApp

Na prática, a qualidade dos websites tem sido avaliada de forma “ad hoc”, com
base no bom senso e na experiência dos desenvolvedores. O estudo da
qualidade de produtos e processos de desenvolvimento para Web é muito recente
e ainda não existem métodos de avaliação amplamente utilizados para este tipo
de ambiente.
Portanto, há uma grande necessidade de metodologias eficazes para a obtenção

de aplicações Web de qualidade. Atualmente, existem duas vertentes de
metodologias de desenvolvimento para a Web: a comunidade de Engenharia de
Software e a comunidade Hipermídia. Estas metodologias, no entanto, carecem
de métricas que possam ser aplicadas a modelos intermédios (por exemplo,
Modelo de Objeto, Modelo de Navegação) usado no processo de
desenvolvimento orientado à Web.
Outros recursos de web design de qualidade são:
• Segurança
• Disponibilidade
• Escalabilidade
• Tempo no mercado
10.1.2 Objetivos de design
Um dos objetivos de design de um WebApp é cobrir o seguinte:
^ Simplicidade
^ Consistência
^ Identidade
^ Robustez
^ Navegabilidade
^ Aparência visual
^ Compatibilidade
10.2 Pirâmide de design IWEB
O design leva a um modelo que contém uma combinação adequada de estética,
conteúdo e tecnologia.
A Figura 3 mostra a pirâmide de design de engenharia da Web.

Figura 3 Modelagem de Web Design. Fonte: (PRESSMAN, 2006)
10.3 Design de interface WebApp

Cada interface de usuário deve ter as seguintes características:
• Fácil de usar
• Fácil de aprender
• Fácil de navegar
• intuitivo
• Consistente
• Eficiente
• Livre de erros
• Funcional
Deve oferecer ao usuário final uma experiência satisfatória e gratificante.
Os princípios e diretrizes essenciais do design de WebApps podem ser
mencionados:

^ Uso justo
^ Flexibilidade de uso
^ Uso simples e intuitivo
^ Informação perceptível
^ Tolerância a erros
^ Esforço físico reduzido
^ Tamanho e espaço para abordar e usar
Em algum momento de nossas vidas, qualquer um de nós pode passar por uma
transição física. Quer se trate de uma deficiência temporária, como um osso
partido, ou de uma incapacidade permanente, seremos confrontados com
mudanças.
O simples processo de envelhecimento nos leva a depender dos outros. O design

universal permite-nos passar por estas mudanças e continuar a desfrutar de
igualdade de oportunidades, autodeterminação e qualidade de vida.
10.3.1 Diretriz 3.4 do W3C WCAG 1.0

Use unidades relativas em vez de absolutas ao especificar valores em atributos de
marcadores de idioma e valores de propriedades de folhas de estilo.
10.3.2 O que isso significa:
O layout, apresentação e conteúdo textual de uma página devem ter possibilidade
de adaptação à interface utilizada pelo usuário, sem sobreposições ou perda de
informações em caso de redimensionamento (ampliação ou redução de exibição
e/ou caracteres).
em, %, ex, px
As unidades relativas

eles
o tamanho da fonte da fonte relevante
H1 {margem: 0,5em}
valor relativo ao valor do elemento pai
P {altura da linha: 140%}
ex
a 'altura x' da fonte relevante
H1 {margem: 1ex}
pixels
pixels, relacionados a dispositivos visuais
P {tamanho da fonte: 14px}
10.3.3 Técnicas de design
10.3.3.1 Layout fixo

Design que utiliza dimensões de tamanho absoluto: polegadas (pol), centímetros
(cm), milímetros (mm), pontos (pt), picas (pc). Seu efeito é bloquear o tamanho de
um elemento em um tamanho fixo.
10.3.3.2 Design líquido (ou fluido)

Design que utiliza a porcentagem (%) como unidade de medida. Seu efeito é a
adaptação dos elementos e sua disposição aproveitando toda a largura da tela
que será calculada com base na resolução do dispositivo utilizado.

10.3.3.3 Design elástico (ou flexível)

Design que usa em como unidade de medida. Seu efeito é adaptar a largura dos
elementos e sua disposição em função do tamanho do texto configurado pelo
usuário.
10.3.3.4 Design híbrido

Design que utiliza unidades de medida absolutas, percentuais e em.
10.3.4 O design (mais) acessível?
10.3.4.1 Layout fixo

a favor
Os designers desfrutam de controle absoluto na determinação do tamanho e

posicionamento dos elementos. Promove legibilidade.
contra
Não adaptado na tela: as características do monitor utilizado pelo usuário não são
conhecidas a priori. “Bloqueia” a página de acordo com o viés do papel.
10.3.4.2 Prós de design líquido
Apresentação de mais informações na tela e redução do efeito scroll. Adaptação

ao meio ambiente.
contra
Provoca linhas de texto muito longas em caso de resoluções de tela muito altas:
dificuldade de leitura.
10.3.4.3 Prós de design elástico

Os designers “controlam” o tamanho e a disposição dos elementos. Evite o

sobreposicionamento de elementos.
contra
Ao aumentar o tamanho do texto, em certos designs pode fazer com que apareça
a barra de rolagem horizontal: dificuldade de legibilidade.
10.3.4.4 Design híbrido a favor
Todas as coisas boas do design fixo, fluido e elástico são fornecidas.
contra
Vamos fazer uma investigação?
10.3.5 Enfim, qual design é (mais) acessível?*
• Não existe design mais acessível que outro.

• O tipo de projeto é escolhido em função das necessidades (projeto).

*O W3C WAI não estabelece qual é o design mais acessível, mas sim que seja
transformável de forma agradável e que o conteúdo seja compreensível e
navegável.
10.3.6 Fluxo de trabalho no design de interface

As tarefas a seguir representam um fluxo de trabalho rudimentar para projetar a
interface WebApp.
1. Revise as informações contidas no modelo de análise e refine-as conforme

necessário.
2. Desenvolva um esboço do modelo de interface WebApp.
3. Correlacione os objetivos do usuário com ações específicas da interface.
4. Defina um conjunto de tarefas do usuário associadas a cada ação.
5. Prepare esboços com imagens de tela para cada ação da interface.
6. Refine o modelo de interface e os esboços com o uso de informações do

design estético.
7. Identifique os objetos da interface do usuário necessários para implementá-la.
8. Desenvolva uma representação processual da interação do usuário com a

interface.
9. Desenvolva uma representação do comportamento da interface.
10. Descreva o modelo de interface para cada estado.
11. Refinar e revisar o modelo de design de interface.
10.4 design estético

O design estético, também chamado de design gráfico, é um empreendimento

artístico que complementa os aspectos técnicos da engenharia Web. Sem ele, um
WebApp pode ser funcional, mas pouco atraente.
10.5 Design de conteúdo

O design de conteúdo concentra-se em duas questões de design diferentes, cada
uma abordada por indivíduos com diferentes conjuntos de habilidades. O design
de conteúdo desenvolve uma representação de design para objetos de conteúdo
e representa os mecanismos necessários para que eles estabeleçam
relacionamentos entre si.
10.5.1 Objetos de conteúdo

O relacionamento entre objetos de conteúdo, definidos como parte do modelo de
análise WebApp, e objetos de layout que representam conteúdo é análogo ao
relacionamento entre classes de análise e componentes de layout.
Um objeto de conteúdo possui atributos que incluem informações específicas do

conteúdo e atributos específicos da implementação que são especificados como
parte do design.
10.6 Projeto arquitetônico

O projeto arquitetônico está vinculado aos objetivos estabelecidos para a
WebApp, ao conteúdo que será apresentado, aos usuários que a visualizam e à
filosofia de navegação que se estabelece.
A arquitetura de conteúdo é baseada na forma como os objetos de conteúdo são

estruturados para apresentação e navegação.

10.6.1 Arquitetura de conteúdo

Centra-se na definição da estrutura hipermídia global da WebApp. O layout pode
ser escolhido entre quatro estruturas de conteúdo diferentes:
^ Estruturas lineares
^ Estruturas de grade
^ Estruturas hierárquicas
^ A estrutura da rede.
10.7 Layout de navegação
O designer deve definir as rotas de navegação que possibilitem o acesso dos
usuários ao conteúdo e funções das WebApps. Para fazer isso você deve:
^ Identifique a semântica de navegação para diferentes usuários do site

^ Defina a mecânica que permite a navegação.
10.7.1 Semântica de navegação
Durante os estágios iniciais do design de navegação, a arquitetura de conteúdo
da WebApp é avaliada para determinar um ou mais FdN para cada caso de uso.
Conforme observado acima, um FdN identifica os nós de navegação e os links
que permitem a navegação entre eles.
10.7.2 Sintaxe de navegação

À medida que o projeto é realizado, a mecânica de navegação é definida, entre
suas possibilidades temos:
^ Link de navegação individual

^ Barra de navegação horizontal
^ Coluna de navegação vertical
^ Guias

^ Mapas do site

10.8 Método de design de hipermídia orientado a objetos (MDHOO)

As metodologias tradicionais de engenharia de software, ou metodologias de
desenvolvimento de sistemas de informação, não contêm uma boa abstração
capaz de facilitar a tarefa de especificação de aplicações hipermídia. O tamanho,
a complexidade e o número de aplicações estão crescendo rapidamente hoje, e é
por isso que uma metodologia de design sistemática é necessária para reduzir a
complexidade e apoiar a evolução e a reutilização.
Produzir aplicações nas quais o usuário possa aproveitar o potencial do

paradigma de navegação em websites, ao mesmo tempo em que executa
transações em bases de informação, é uma tarefa muito difícil de alcançar.
Em primeiro lugar, a navegação apresenta alguns problemas. Uma estrutura de

navegação robusta é uma das chaves para o sucesso em aplicações hipermídia.
Se o usuário entender onde pode ir e como chegar ao local desejado, é um bom
sinal de que o aplicativo foi bem desenhado.
Construir a interface de uma aplicação web também é uma tarefa complexa; Você
não só precisa especificar quais objetos de interface devem ser implementados,
mas também a maneira como esses objetos irão interagir com o restante da
aplicação.
Na hipermídia existem requisitos que devem ser satisfeitos em um ambiente de

desenvolvimento unificado. Por um lado, a navegação e o comportamento
funcional da aplicação devem ser integrados. Por outro lado, durante o processo
de design deve ser possível dissociar as decisões de design relacionadas com a
estrutura de navegação da aplicação daquelas relacionadas com o modelo de
domínio.

A OOHDM propõe o desenvolvimento de aplicações hipermídia através de um

processo composto por quatro etapas: design conceitual, design de navegação,
design de interface abstrata e implementação.
10.8.1 Projeto Conceitual

Durante esta atividade é construído um esquema conceitual, representado pelos
objetos do domínio, pelas relações existentes e pelas colaborações estabelecidas
entre eles. Em aplicações hipermídia convencionais, cujos componentes
hipermídia não são modificados durante a execução, um modelo de dados
semântico estrutural (como o modelo de entidade e relacionamento) poderia ser
usado. Assim, nos casos em que a informação base possa mudar dinamicamente
ou sejam tentados cálculos complexos, o comportamento do modelo de objeto
precisará ser enriquecido.
No OOHDM, o esquema conceitual é construído por classes, relacionamentos e

subsistemas. As classes são descritas como nos modelos tradicionais orientados
a objetos. No entanto, os atributos podem ser de vários tipos para representar
diferentes perspectivas das mesmas entidades do mundo real.
Ele usa notação semelhante à UML (Unified Modeling Language) e cartões de

classe e relacionamento semelhantes aos cartões CRC (Class Responsibility
Collaboration). O esquema de classe consiste em um conjunto de classes
conectadas por relacionamentos. Objetos são instâncias de classes. As classes
são usadas durante o projeto de navegação para derivar nós e os
relacionamentos são usados para construir links.
10.8.2 Design de navegação

A primeira geração de aplicações Web foi projetada para navegar pelo espaço de
informação, utilizando um modelo de dados hipermídia simples. No OOHDM, a

navegação é considerada uma etapa crítica no design da aplicação. Um modelo

navegacional é construído como uma visão de um projeto conceitual, permitindo a
construção de diferentes modelos de acordo com diferentes perfis de usuário.
Cada modelo de navegação fornece uma visão subjetiva do projeto conceitual.
O design de navegação é expresso em dois esquemas: o esquema de classes de

navegação e o esquema de contextos de navegação. No OOHDM existe um
conjunto de tipos predefinidos de classes de navegação:
Nós, links e estruturas de acesso. A semântica dos nós e links é tradicional para
aplicações hipermídia, e as estruturas de acesso, como índices ou visitas guiadas,
representam os possíveis caminhos de acesso aos nós.
A principal estrutura primitiva do espaço de navegação é a noção de contexto de

navegação. Um contexto de navegação é um conjunto de nós, links, classes de
contexto e outros contextos de navegação (contextos aninhados). Podem ser
definidos por compreensão ou extensão, ou por enumeração de seus membros.
Os contextos de navegação desempenham um papel semelhante às coleções e

foram inspirados no conceito de contextos aninhados. Eles organizam o espaço
de navegação em conjuntos convenientes que podem ser percorridos em uma
ordem específica e que devem ser definidos como caminhos para ajudar o usuário
a realizar a tarefa desejada.
Os nós são enriquecidos com um conjunto de classes especiais que permitem a

um nó observar e apresentar atributos (incluindo âncoras), bem como métodos
(comportamento) ao navegar em um contexto específico.
10.8.3 Design de interface abstrato

Uma vez definidas as estruturas de navegação, os aspectos da interface devem

ser especificados. Isso significa definir a forma como os objetos de navegação

podem aparecer, como os objetos de interface acionarão a navegação e o
restante da funcionalidade da aplicação, quais transformações de interface são
relevantes e quando elas precisam ser executadas.
Uma separação clara entre design de navegação e design de interface abstrata

permite que diferentes interfaces sejam construídas para o mesmo modelo de
navegação, deixando um alto grau de independência da tecnologia de interface do
usuário.
O aspecto da interface do usuário de aplicações interativas (particularmente

aplicações Web) é um ponto crítico no desenvolvimento que as metodologias
modernas tendem a negligenciar. No OOHDM, o design abstrato da interface é
usado para descrever a interface do usuário do aplicativo hipermídia.
O modelo de interface ADVs (Abstract Data View) especifica a organização e o

comportamento da interface, mas a aparência física real ou os atributos e a
organização das propriedades dos ADVs na tela real são feitos na fase de
implementação.
10.8.4 Implementação
Nesta fase, o designer deve implementar o design. Até agora, todos os modelos
foram construídos independentemente da plataforma de implementação; Nesta
fase, é levado em consideração o ambiente específico em que a aplicação será
executada.
Ao chegar nesta fase, o primeiro passo que o projetista deve realizar é definir os
itens de informação que fazem parte do domínio do problema. Deve também
identificar como os itens estão organizados de acordo com o perfil do usuário e

sua tarefa; decida qual interface deve ser e como deve se comportar. Para
implementar tudo em um ambiente Web, o designer também deve decidir quais
informações devem ser armazenadas.

11 Prática nº. 4
11.1 Nome da prática: Fase 4: Modelagem de Web Design

Desenvolva a Modelagem de Design da aplicação
11.1.1 Objetivo
Web que você vem resolvendo desde a Fase 1.

Quando o design é aplicado no contexto de

11.1.2 Introdução
Engenharia Web, tanto questões genéricas quanto
específicas devem ser consideradas. O design deve ser
muito específico.
Design de qualidade de uma WebApp
Na prática, a qualidade dos websites tem sido avaliada de

forma “ad hoc”, com base no bom senso e na experiência
dos desenvolvedores. O estudo da qualidade de produtos e
processos de desenvolvimento para Web é muito recente e
ainda não existem métodos de avaliação amplamente
utilizados para este tipo de ambiente.
Portanto, há uma grande necessidade de metodologias

eficazes para a obtenção de aplicações Web de qualidade.
Atualmente, existem duas vertentes de metodologias de
desenvolvimento para a Web: a comunidade de Engenharia
de Software e a comunidade Hipermídia. Estas
metodologias, no entanto, carecem de métricas que possam
ser aplicadas a modelos intermédios (por exemplo, Modelo
de Objeto, Modelo de Navegação) usado no processo de
desenvolvimento orientado à Web.

11.1.3 material e • Computador com Acesso à Internet IT

Valles Plataforma Moodle
eq UIP
uação
• Processador de texto pe Word Microsoft
• Visio ou Concept Draw ou DIA www.mex.tl,
• www.1&1.mx, www.mipaginawebgratis.es,
www.wix.com, entre outras páginas que
• permitem a concepção do site.
Ferramentas de web design

11.1.4 Metodologia
diversas funções
2. Baixe o formato para preparar a fase 4
(Anexo No. 4). Está disponível em
plataformas como www.slideshare.net,
www.issuu.com, www.googledocs.com,
www.scribd.com.
3. Resolver cada um dos pontos propostos na
fase de projeto

5. Gere a página da Web em alguns dos
ferramentas ou ferramentas da web
desenvolvimento web
6. Faça upload para a plataforma virtual

Aprendizado
É recomendado que você use as ferramentas

11.1.5 Sugestões
de desenvolvimento de páginas da Web que são
disponível na Web gratuitamente, pois você poderá
ver sua criação na internet.

CE TÉCNICA OLÍA FASE 5
.
Bimar
ea
15Gs
Testes para Engenharia Web
12 Fase 5. Testando para IWeb
12.1 Teste de conceito para WebApp

Consideramos dimensões de qualidade que são particularmente relevantes em

qualquer discussão sobre testes para trabalhos de engenharia Web. A natureza

dos erros encontrados como resultado dos testes e a estratégia de teste aplicável
à descoberta de tais erros também são consideradas.
12.1.1 Dimensões de qualidade

A qualidade é incorporada a uma aplicação Web como consequência de um bom
design. É avaliado através da aplicação de uma série de revisões técnicas que
avaliam vários elementos do modelo de design e da aplicação de um processo de
teste.
Tanto as revisões quanto os testes examinam uma ou mais das seguintes

dimensões de qualidade:
O conteúdo é avaliado tanto no âmbito sintático quanto semântico
A função de teste para descobrir erros que indicam uma incompatibilidade com os
requisitos do cliente.
A estrutura é avaliada para garantir que entrega adequadamente o conteúdo e a

funcionalidade do WebApp.
A usabilidade é testada para garantir que cada categoria de usuário seja

suportada pela interface.
*A navegabilidade é testada para garantir que toda a sintaxe e semântica da

navegação sejam exercitadas para descobrir quaisquer erros de navegação.
*O desempenho é testado sob diversas condições operacionais, configurações e

cargas para garantir que o sistema responda à interação do usuário.

A compatibilidade é testada executando WebApps em várias configurações de

convidado.
A interoperabilidade é testada para garantir que o WebApp implemente interfaces

apropriadas.
A segurança é testada avaliando vulnerabilidades potenciais e tentando explorar

cada uma delas.
12.1.2 Estratégias de teste

As estratégias para testar uma WebApp adotam os princípios básicos para todos
os testes de software.
1. A modelagem de conteúdo do WebApp é revisada para descobrir erros.
2. O modelo de interface é revisado para garantir que todos os casos
12.2 Testes aplicados a uma aplicação web
O processo de teste da WebApp é uma soma de atividades relacionadas a um

único objetivo: descobrir erros no conteúdo, função, usabilidade, navegabilidade,
desempenho, capacidade e segurança da WebApp.
Isto é conseguido ao longo de todo o processo de engenharia Web, através da

aplicação de uma estratégia de testes que engloba tanto revisões como testes
executáveis.
Engenheiros web e outros participantes do projeto (gerentes, clientes, usuários

finais) participam do processo de teste do WebApp.
Se os usuários finais encontrarem erros que prejudiquem sua confiança no

WebApp, eles irão a outro lugar em busca do conteúdo e da funcionalidade de

que precisam, e o WebApp falhará.
Por esse motivo, os engenheiros da Web devem trabalhar para eliminar o máximo
possível de bugs antes que o WebApp fique online.
O processo de teste começa focando nos aspectos que são visíveis para o
usuário e prossegue para testar a referida tecnologia e infraestrutura.
O teste consiste em sete etapas: conteúdo, interface, navegação, componente,

configuração, desempenho e teste de segurança.
Em alguns casos, é produzido um plano de teste de WebApp.

Em todos os casos, um conjunto de casos de teste é desenvolvido para cada

estágio de teste e um arquivo de resultados de teste é anotado para uso futuro.
Embora você nunca possa ter certeza de ter realizado todos os testes
necessários, você pode ter certeza de que os testes descobriram erros (e que eles
foram corrigidos).
Além disso, se um plano de testes tiver sido estabelecido, ele poderá ser
verificado para garantir que todos os testes planejados foram executados.
Como muitos WebApps evoluem continuamente, os testes de WebApps são uma

atividade de acompanhamento liderada pela equipe de Suporte Web, usando
testes de regressão derivados de testes desenvolvidos quando o WebApp foi
projetado pela primeira vez.
12.2.1 Dimensões de Qualidade
Figura 4 Dimensões de Qualidade

O processo de Teste que deve ser aplicado à página Web que foi construída é
baseado no Design da Página:
Figura 5 Processo de teste
A Figura 6 mostra todos os testes a serem aplicados na Página que foi

desenvolvida:

PROCESSO DE TESTE
Figura 6 Processo de teste

13 Prática nº. 5
13.1 Nome da prática: Fase 5 Aplicação de Testes IWeb

13 11 Objetivo Aplicar todo o processo de teste à Página Web
desenvolvida, apresentando evidências da
aplicação em documento digital.

A estratégia para testar uma WebApp adota o
13.1.2 Introdução
princípios básicos para todos os testes de software e aplicar uma
estratégia e táticas que foram recomendadas para sistemas orientados a
objetos como segue:
^ Revisão do modelo de conteúdo WebApp em busca

de erros
^ Revisão do modelo de interface garantindo que todos
os casos de uso possam ser acomodados
^ Revisão do modelo de design WebApp para erros de
navegação
^ A interface do usuário é testada para descobrir erros
nos mecanismos de apresentação ou navegação.
^ Os componentes funcionais selecionados são testados
individualmente.
^ Testes de desempenho são realizados.
^ O WebApp é testado em uma população controlada e
monitorada de usuários finais em busca de erros
relacionados à facilidade de uso, compatibilidade,
confiabilidade e desempenho do WebApp.

^ Computador com acesso à Internet
13.1.3 Materiais e
^ Navegadores
Equipamento
^ Vários dispositivos para acessar o
página
^ Plataforma IT Valles Moodle
1. Forme uma equipe de trabalho Metodologia
13.1.4 2. Tenha vários dispositivos com acesso à internet
3. Carregue a página da web
que eles desenvolveram
4. Aplique cada um dos testes
IWeb
5. Documente e adicione evidências dos testes
aplicados
6. Entregar o documento comprobatório na
plataforma virtual.

É necessário que toda a equipe participe das
13.1.5 Sugestões
teste do site.
Os testes não podem ser aplicados se você não

estiver
terminei a página da web.
FASES PARA/ATO EE DROJECT IWEB
Integrando Documento


14 Anexo No. 1. Formato do projeto IWeb da Fase 1.


15 Anexo No. 2. Formato do projeto IWeb da

Fase 2.






16 Anexo N.º 3. Formato do projeto IWeb da Fase 3.


17 Anexo N.º 4. Formato do projeto IWeb da Fase 4.


18 Anexo N.º 5. Formato do projeto IWeb da

Fase 5.



19 Bibliografia
1. Cuevas, I., Engenharia Web e Padrões de Design. 2005.
2. Arlow, J. e eu. Neustad, UML 2. Programação. Anaya Multimídia-Anaya

Interativa, 2006.
3. Booch, G., et al., A linguagem de modelagem unificada. 1999: Addison

Wesley Madrid.
4. Cuevas Agustín, G., Gerenciamento de processos de software. 2002.
5. Fowler, M., R. SCOTT e K. Scott, UML gota a gota. 1999: Pearson

Educação.
6. Fuente, AAJ, et al., O Livro Azul da Engenharia da Computação: uma

alternativa ao Livro Branco. I Conferência EUITIO sobre Inovação em
Ensino, 2005: p. 67.
7. García Molina, JJ, G. Rossi, e A. Moreira, UML: a linguagem padrão para

modelagem de software. Novatica: Revista da Associação dos Técnicos de
Informática, 2004(168): p. 4-5.
8. Gênova, G., J.M. Fontes, e J. Llorens, Avaliação de ferramentas CASE para

UML.
9. Grady, R.B., Melhoria bem-sucedida de processos de software. 1997:

Prentice Hall PTR.
10. Guevera, A., Engenharia Web: E-learning. Cultura Científica, 2011(5): p. -

1620.

11. Hernández González, A., Identificação de Processos de Negócios.

Engenharia Industrial, 2010. 25(3): pág. 6 páginas
12. Humphrey, WS, Introdução ao Processo de Software Pessoal (PSP). 2001:

Addison ^ Wesley.
13. Pastor, O. OOWS: Uma Abordagem para Modelagem Conceitual de

Aplicações Web. 2002.
14. Pressman, R.S. e J. M. Trojan,Engenharia de Software: Uma Abordagem

Prática. 6ª edição. 2006: McGraw Hill.
15. Rumbaugh, J. e eu. Jacobson, Grady Booch. Manual de referência da

linguagem de modelagem unificada (série Addison-Wesley Object
Technology), 2001.
16. Senn, J. A. e D. Mercer, Análise e Projeto de Sistemas. 1992: México:

McGraw Hill.
17. Sommerville, I., Engenharia de software. 2005: Educação Pearson.
18. Thomas, D., et al., Desenvolvimento web ágil com trilhos. 2005: Estante
pragmática de Nova York.

Mais
livrosW
Quero mais livros!
Compre seus livros on-line de maneira rápida e simples - em uma das
livrarias on-line que mais cresce no mundo! Ecologicamente correto
devido às tecnologias de impressão sob demanda.
Compre seus livros online em

www.get-
morebooks.com
Compre seus livros de forma rápida e direta pela internet, em uma das
livrarias online que mais cresce no mundo! Produção que protege o meio
ambiente através de tecnologias de impressão sob demanda.
Compre seus livros online em

www.morebooks.es
OmniScriptum Marketing DEU GmbH
Bahnhofstr. 28
D - 66111 Saarbrücken info@omniscriptum.com Escritura'
Telefax: +49 681 93 81 567-9 www.omniscriptum.com

Desenvolvimento de Software Com Engenharia Web

Enviado por

Dados do documentoclique para ver informações do documento

Direitos autorais:

Formatos disponíveis

Desenvolvimento de Software Com Engenharia Web

Enviado por

Dados do documento

Descrição original:

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

Desenvolvimento de Software Com Engenharia Web

Enviado por

Direitos autorais:

Formatos disponíveis

Desenvolvimento de software com

Engenheiro de sistemas computacionais. Em 1995, o ITCM obteve a média

Desenvolvimento de software com

Desenvolvimento de software com

Editora Acadêmica Espanhola

Informações bibliográficas da Deutsche Nationalbibliothek: A Deutsche

Coverbild / Imagem da capa: www.ingimage.com

Herstellung: siehe letzte Seite/

Direitos autorais/Propriedade literária e policial Rosa Imelda García Chi

ISC. Rosa Imelda García Chi, MTI

A engenharia Web deve-se ao crescimento desenfreado que a Web está a

Desenvolvimento de software com Engenharia Web...........................1

ING. ROSA IMELDA GARCIA CHI, MTI

ING. ROSA IMELDA GARCIA CHI, MTI

ING. ROSA IMELDA GARCIA CHI, MTI

ING. ROSA IMELDA GARCIA CHI, MTI

O Guia Técnico de Engenharia de Software Web (IWeb) integra um conjunto

Na primeira seção, inicia-se com práticas relacionadas aos estratos:

Na segunda secção, denominada Formulação e Planeamento IWeb, integra

Na terceira seção são integradas práticas que descrevem a Modelagem de

Na quarta seção é abordada a modelagem de design IWeb, que define

ING. ROSA IMELDA GARCIA CHI,MTI 11

O design da interface descreve a estrutura e organização da interface do

E por fim, são revisados os tópicos relacionados aos Testes IWeb. O

Os testes também incorporam revisões que ocorrem à medida que o

O objetivo deste Guia Técnico é a integração dos diferentes elementos,

ING. ROSA IMELDA GARCIA CHI,MTI 12

O Guia apresenta uma série de práticas ou fases de projeto que abrangem

São incorporados formatos para desenvolver as fases do projeto IWeb, para

ING. ROSA IMELDA GARCIA CHI,MTI 13

2.1 Fase 1: Introdução à Engenharia Web (IWeb)

Tópicos 1.1 Atributos de sistemas e aplicativos baseados na Web

2.2 Fase 2: Formulação e Planejamento de Engenharia Web

Tópicos 2.1 Formulação de sistemas baseados na Web

Tópicos 3.1 Requisitos para análise de WebApps

ING. ROSA IMELDA GARCIA CHI,MTI 14

Tópicos 4.1 Questões de design para engenharia web

4.2 Pirâmide de Web Design

4.3 Design de interface de WebApps

4.4 design estético

4.4.3 Design de conteúdo

4.6 Projeto arquitetônico

4.7 Layout de navegação

4.8 Design em nível de componente

4.9 Padrões de design de hipermídia

4.10 Método de design de hipermídia orientado a objetos (MDHOO)

4.11 Métricas de design para WebApps

ING. ROSA IMELDA GARCIA CHI,MTI 15

Tópico 5.1. Prova de conceitos para WebApps

5.2. O processo de teste

5.3. Teste de conteúdo

5.4. Teste de interface do usuário

5.5. Teste no nível do componente

5.6. Testes de navegação

5.7. Teste a configuração

5.8. Teste de segurança

5.9. Teste de desempenho

ING. ROSA IMELDA GARCIA CHI,MTI 16