Design Digital -A2 - Atividade 2

Prévia do material em texto

Pergunta 1
Analise o trecho a seguir.
Para proporcionar um carregamento mais rápido de um
projeto web, além das imagens estarem formatadas
da maneira correta, a aplicação de boas práticas
__________, definidas pelo W3C facilita muito o
trabalho no momento do desenvolvimento e da
manutenção de uma página HTML.
Assinale a alternativa que preenche corretamente a
lacuna.
Resposta
Selecionada:
na
codificaçã
o.
Resposta Correta: na
codificaçã
o.
Coment
ário
da
resp
osta
:
Resposta correta. A
aplicação de boas
práticas na codificação
conforme o W3C facilita
muito o trabalho do
desenvolvedor, além de
proporcionar uma
consistência de código e
nos estilos, otimizar o
tempo e evitar problemas
de visualização, tornar o
carregamento da página
mais rápido e ser
necessário a
manutenção, esse
trabalho se tornará mais
fácil.
Pergunta 2
Analise o texto a seguir.
Na prática, a criação de convenções com normas e
regras simplifica e facilita a organização front-end
de um projeto de design digital que resulta em uma
quantidade menor de tempo para o
desenvolvimento, ganhando maior produtividade e
uma consistência real do trabalho.
Algumas sugestões de regras podem ser definidas
para otimizar a organização front-end , como nome
e conteúdo dos arquivos de algumas pastas
(diretórios) do projeto.
A partir do exposto, associe tais pastas às
características dos arquivos que devem contê-las:
I. components;
II. services;
III. scene.
( ) conter os elementos primários como os buttons.
( ) conter os elementos que podem ser utilizados
em diversas partes do projeto.
( ) conter os elementos que são necessários para
rodar um programa no projeto.
A partir das relações feitas anteriormente, assinale
a alternativa que apresenta a sequência correta.
Resposta
Selecionada:
I, II,
III.
Resposta Correta: I, II,
III.
Coment
ário
da
resp
osta
:
Resposta correta. A pasta
que deve conter os
elementos primários
como os buttons =
components. A pasta que
deve conter os elementos
que podem ser utilizados
em diversas partes do
projeto = services. A
pasta que deve conter os
elementos que são
necessários para rodar
um programa no projeto =
scene.
Pergunta 3
No desenvolvimento de uma página em HTML5, existe
a função conhecida como embed que permite
incorporar informações e conteúdo de páginas ou
sistema de terceiros em um projeto digital. Esse
conteúdo pode ser informações de redes sociais e
até APIs, que aumentam o leque de possibilidades
de desenvolver páginas com diversos conteúdos e
recursos.
Nesse sentido, assinale a alternativa que indique qual
é a definição de APIs.
Resposta
Selec
ionad
a:
Programação que permite
utilizar funções de um
programa externo em uma
página HTML.
Resposta
Corre
ta:
Programação que permite
utilizar funções de um
programa externo em uma
página HTML.
Coment
ário
da
resp
osta
:
Resposta correta. A
alternativa está correta,
pois API - Application
Programming Interface,
Interface de Programação
de Aplicativos, é um
grupo de rotina padrão
determinado por um
programa, que permite
utilizar as funções desse
programa em uma página
ou outros aplicativos, sem
ter a necessidade que
este o programa seja
implementado no
sistema.
Pergunta 4
Analise a figura a seguir.
Fonte: Elaborada pelo autor.
A resolução correta para a imagem ser carregada
mais rapidamente nos projetos de design digital
para web é 72 PPI. Nunca se deve aumentar as
dimensões da imagem ou a resolução; se uma
imagem não estiver nesta resolução correta, existe
um procedimento que é o indicado de ser
executado.
Nesse sentido, assinale a alternativa que indique
qual é o procedimento correto que deve ser
executado no software Photoshop , no menu
Tamanho da imagem – Image Size.
Resposta
Selec
ionad
a:
Tirar a seleção do recurso
Resample Image e depois
alterar a resolução para
72.
Resposta
Corre
ta:
Tirar a seleção do recurso
Resample Image e depois
alterar a resolução para
72.
Coment
ário
da
resp
osta
:
Resposta correta. Ao abrir a
janela do tamanho da
imagem no Photoshop, o
primeiro procedimento é
tirar a seleção do item
Resample Image, depois
inserir o valor correto de
72. Dessa maneira, a
imagem será
redimensionada para o
tamanho no qual a sua
qualidade não será
perdida.
Pergunta 5
Analise o trecho a seguir.
Para se inserir um menu ou barra de navegação em
uma página HTML, deve-se usar a tag __________
. Sua atribuição é de reunir blocos de links de um
mesmo assunto ou links internos do site , indicando
que um determinado bloco é um bloco de
navegação ou menu.
Assinale a alternativa que preenche corretamente a
lacuna.
Resposta
Selecionada:
<nav>
<nav/>
Resposta Correta: <nav>
<nav/>
Coment
ário
da
resp
osta
:
Resposta correta. A tag
<nav> <nav/> indica para
uma página desenvolvida
em HTML que esse menu
faz parte da seção de
navegação do site,
representa uma seção da
página que contém link
para outras páginas ou
partes do mesmo
website.
Pergunta 6
Para inserir uma imagem no HTML utiliza-se a tag img
seguido do atributo src , source traduzindo para o
português é origem; ali deve ser informado o
caminho da pasta que em está salvo o arquivo.
Outra maneira de inserir uma imagem é utilizando o
atributo url, caso a imagem já esteja na internet.
Sobre as configurações de imagens para web , analise
as asserções a seguir e a relação proposta entre
elas.
I. Para uma imagem inserida em uma página HTML,
que será exibida em um navegador, também é
possível mostrar alternativas de visualização
adicionando o atributo alt.
PORQUE
II. O atributo alt
em uma página HTML representa alternate text ,
que exibe um texto alternativo caso não seja
possível a imagem ser visualizada.
A seguir, assinale a alternativa correta.
Resposta
Selec
ionad
a:
As asserções I e II são
proposições verdadeiras,
e a II é uma justificativa
correta da I.
Resposta
Corre
ta:
As asserções I e II são
proposições verdadeiras,
e a II é uma justificativa
correta da I.
Coment
ário
da
resp
osta
:
Resposta correta. As
asserções I e II são
verdadeiras, pois o
atributo alt, de alternate
text, texto alternativo,
exibe um texto, caso
ocorra erros no servidor
ou por outros motivos não
seja possível carregar a
imagem, sendo assim,
uma justificativa correta
da I.
Pergunta 7
Analise o texto a seguir.
No desenvolvimento de uma interface para projetos de design digital, a
aplicação de formatação de textos e imagens é fundamental para manter a
identidade visual da página ou da tela. Caso o projeto seja a criação de um
aplicativo, além da formatação, a aplicação de ajustes se faz necessária
para manter um equilíbrio visual do layout.
Para aplicar os ajustes, existem tags e atributos específicos. A partir do
exposto, associe tais tags ou atributos às suas características.
I. bottom
II. title
III. <hr> <hr/>
( ) Alinha com a base mais baixa dos outros elementos da linha que pode
ser uma imagem, botões etc.
( ) Exibe um texto somente quando é mantido o mouse por alguns segundos
sobre a imagem; caso os botões da página sejam imagens, também pode
ser utilizado esse recurso.
( ) Cria uma linha horizontal como se fosse separador que pode ser
utilizado também entre os botões de menu horizontal.
A partir das relações feitas anteriormente, assinale a alternativa que
apresenta a sequência correta.
Resposta
Selecionada:
I, II,
III.
Resposta Correta: I, II,
III.
Coment
ário
da
resp
osta
:
Resposta correta. Bottom =
alinha com a base mais
baixa dos outros
elementos da linha que
pode ser uma imagem,
botões etc.; title = exibe
um texto somente quando
é mantido o mouse por
alguns segundos sobre a
imagem; caso os botões
da página sejam imagem,
também pode ser
utilizado este recurso.
<hr> <hr/>= cria uma
linha horizontal como se
fosse separador que pode
ser utilizado também
entre os botões de menu
horizontal.
Pergunta 8
Analise a figura a seguir.
Fonte: Elaborada pelo autor.
A figura representa como um site poderá ser
navegado em um browser (navegador),
apresentando a sua forma estrutural de maneira
visual, como deverá ser desenvolvido o projeto,
antes mesmo deiniciar o processo de programação
dos códigos em HTML ou CSS.
Nesse sentido, assinale a alternativa que indique
qual é o nome técnico que representa a figura.
Resposta
Selecion
ada:
Wireframe ou diagrama
de wireframe.
Resposta
Correta:
Wireframe ou diagrama
de wireframe.
Coment
ário
da
resp
osta
:
Resposta correta. A
representação visual da
estrutura de como irá
funcionar uma tela de um
aplicativo ou uma página
é conhecida como
wireframe ou diagrama de
wireframe, que deve ser
criado no começo do
desenvolvimento de um
projeto, antes de iniciar o
processo do design visual
e conteúdo.
Pergunta 9
Analise o trecho a seguir.
As imagens estão presentes em praticamente todos os
projetos de design, e para projetos de design
digital, as imagens são formadas por ______; os
profissionais que trabalham com desenvolvimento
de interface têm a necessidade de saber as
informações técnicas para utilizá-las de forma
correta.
Assinale a alternativa que preenche corretamente a
lacuna.
Resposta
Selecionada: pi
xe
ls.
Resposta Correta:
pi
xe
ls.
Coment
ário
da
resp
osta
:
Resposta correta. As
imagens digitais são
formadas por um conjunto
de pixels, no qual 1 pixel
é o menor elemento que
pode ser exibido em um
dispositivo digital, como
monitores, televisores,
pulseiras digitais, telas
dos smartphones e
tablets. Esses elementos
contêm cor e informação
de brilho e iluminação e
formam a imagem em
bitmap.
Pergunta 10
Front-end é a etapa do desenvolvimento de um projeto de design digital que
converte as informações computacionais dos sistemas em uma interface
gráfica, usando recursos das linguagens como o HTML e CSS, tornado a
compreensão dos usuários mais simples para navegar nos sistemas.
Considerando o texto apresentado sobre a front-end , analise as afirmativas a
seguir.
● A organização front-end é importante em
todos os projetos de design digital, mas é
fundamental em grandes aplicações web
que possuem uma grande quantidade de
dados.
● A organização front-end pode ser
descartada em projetos experimentais
com uma pequena quantidade de
manipulação de dados para poder otimizar
o tempo de trabalho.
● O uso de estruturas similares em todos os
projetos facilita a organização front-end,
ganhando produtividade, pelo fato de o
desenvolvedor estar familiarizado com
esses padrões.
● Para otimizar o desenvolvimento de um
projeto front-end, é necessário criar
padrões próprios e testá-los, e, no
momento que adquirir a prática, iniciar o
desenvolvimento.
Está correto o que se afirma em:
Resposta
Selecionada:
I e III,
apenas.
Resposta Correta: I e III,
apenas.
Coment
ário
da
resp
osta
:
Resposta correta. Uma
boa organização
front-end é fundamental
em grandes aplicações
web, pois desde o início
do projeto é preciso se
preocupar com a
arquitetura da
informação, para não
ocasionar maiores
problemas no decorrer
do projeto. Para
otimizar o
desenvolvimento de um
projeto front-end, o
desenvolvedor pode
utilizar estruturas e
padrões de que já
tenha conhecimento,
não sendo necessário
estabelecer novos
padrões para todos os
projetos.