Questão 3

Prévia do material em texto

<p>Questão 1/10 - Web Design</p><p>No plano da estrutura é pensado como o conteúdo será organizado e como será sua</p><p>navegação e a hierarquia das informações no site. Desta forma, é pensado um modelo</p><p>conceitual de como as pessoas irão interagir com o site. Assim, na arquitetura da</p><p>informação, podemos utilizar os modelos de estrutura típicas de site propostos por</p><p>Garret (2011).</p><p>GARRETT, Jesse James. The Elements of User Experience. Berkeley: New Riders,</p><p>2011.</p><p>Com base no conteúdo da Rota 5, o modelo de estrutura que concebe várias ligações</p><p>entre os nós, hierarquicamente ou não é chamada de...</p><p>Nota: 10.0</p><p>A Hierárquica</p><p>B Orgânica</p><p>C Sequencial</p><p>D Matriz</p><p>Você assinalou essa alternativa (D)</p><p>Você acertou!</p><p>Gabarito:</p><p>Conforme a rota 5 e tema 3 a alternativa D está correta.</p><p>Conforme o conteúdo da Rota 5, tema 3, Garret estabelece quatro tipos de modelos de estrutura: Hierárquica, Matriz, Orgânica e Sequencial, sendo que no modelo Matriz são concebidas várias</p><p>ligações entre os nós, não importando se estão relacionadas hierarquicamente ou não.</p><p>E Coreografia</p><p>Questão 2/10 - Web Design</p><p>Observe a imagem abaixo:</p><p>Fonte: PERUYERA, Matias. Webdesign. Aula 5. Uninter, 2021.</p><p>De acordo com a Rota 5, a imagem acima se refere ao modelo de navegação:</p><p>Nota: 10.0</p><p>A global</p><p>B local</p><p>Você assinalou essa alternativa (B)</p><p>Você acertou!</p><p>Gabarito:</p><p>Conforme a rota 5 e tema 4 a alternativa B está correta.</p><p>O modelo apresentado na figura se refere à navegação local, pois demonstra como deve ser o acesso às informações que estarão mais próximas, como a categoria imediatamente acima e às</p><p>páginas a ela subordinadas.</p><p>C suplementar</p><p>D contextual</p><p>E de cortesia</p><p>Questão 3/10 - Web Design</p><p>Até o final dos anos 2000, as únicas ferramentas disponíveis para se criar layouts em</p><p>CSS estavam limitadas no que diz respeito à responsividade do layout. Desta forma,</p><p>surgiram especificações que se baseiam em colunas flexíveis e uso de grids.</p><p>Uma destas especificações, que se encontra ainda em estágio de recomendação da</p><p>W3C e que permite que os elementos responsivos dentro de um contêiner sejam</p><p>organizados de forma automática, de acordo com o tamanho da tela em que a página</p><p>será exibida, é denominada de....</p><p>Nota: 10.0</p><p>A PHP</p><p>B Flexbox</p><p>Você assinalou essa alternativa (B)</p><p>Você acertou!</p><p>Gabarito:</p><p>Conforme a rota 4 e tema 2 a alternativa B está correta.</p><p>O flexbox ou Flexible Box Layout é um módulo completo que foi criado para tornar as tarefas como centralização de elementos, ocupação de espaço, determinação de tamanho de colunas, entre</p><p>outras, mais simples e funcionais. Este modelo de especificações, que faz parte da Web CSS3, se encontra em estágio de recomendação de candidatos do W3C.</p><p>C Layout flutuante</p><p>D Layout fixo</p><p>E AJAX</p><p>Questão 4/10 - Web Design</p><p>Conforme apontado na Rota 6, cada vez mais as páginas web estão sendo acessadas</p><p>por dispositivos móveis. Desta forma, foram criadas técnicas para que o design das</p><p>páginas seja responsivo, projetado para serem visualizadas em qualquer dispositivo, se</p><p>adequando ao formato e tamanho de tela e, com o CSS3, surgiram as media queries.</p><p>Considerando o texto acima e o conteúdo abordado na Rota, escolha a alternativa que</p><p>apresenta um exemplo de linha de código com o formato correto para uma media query:</p><p>Nota: 10.0</p><p>A border: 20px double pack; {@media};</p><p>B @media list-style-type: square only screen;</p><p>C @media only screen and (max-width: 800px) { header { background: blue;}}</p><p>Você assinalou essa alternativa (C)</p><p>Você acertou!</p><p>Gabarito:</p><p>Conforme a rota 6 e tema 4 a alternativa C está correta.</p><p>A linha de código “@media only screen and (max-width: 800px) { header { background: blue;}} “ representa a estrutura correta de uma media query e informa ao navegador que quando a janela</p><p>estiver em 800px a cor de background será alterada para a cor especificada na media query, no caso, azul (blue).</p><p>D @li::before { content: “\00261E” ; color: black; }</p><p>E Display: inline-block @media only screen;</p><p>Questão 5/10 - Web Design</p><p>No plano do esqueleto definimos a forma das funcionalidades de acordo com os</p><p>preceitos definidos no plano da estrutura, pensando no design de interface, no design</p><p>da navegação e no design da informação.</p><p>Considerando o conteúdo da Rota 5 e o texto acima, analise as afirmativas abaixo e</p><p>marque V para verdadeiro ou F para Falso.</p><p>I. ( ) A navegação deve permitir um acesso rápido às diferentes categorias, seções e</p><p>nós determinados na arquitetura da informação.</p><p>II. ( ) A navegação global provê acesso ao que estiver mais próximo, como a categoria</p><p>imediatamente superior e às páginas a ela subordinadas.</p><p>III. ( ) A navegação suplementar está embutida no próprio conteúdo, facilitando acesso</p><p>a links relacionados ao conteúdo.</p><p>IV. ( ) A navegação por cortesia compreende os links para informações não relacionadas</p><p>ao conteúdo e sim ao site em geral.</p><p>Agora assinale a alternativa que apresenta a sequência correta:</p><p>Nota: 10.0</p><p>A V – F – F – V</p><p>Você assinalou essa alternativa (A)</p><p>Você acertou!</p><p>Gabarito:</p><p>Conforme o conteúdo da Rota 5, tema 4, a alternativa A apresenta a sequência correta. A afirmativa II é falsa porque a navegação global fornece acesso às principais seções do site. A afirmativa</p><p>III é falsa porque a navegação suplementar provê atalhos a conteúdos que seriam difíceis de acessar por meio da navegação normal do site ou produto digital.</p><p>B F – V - V – F</p><p>C V – V – V – F</p><p>D V – V – F – F</p><p>E V – F – V – F</p><p>Questão 6/10 - Web Design</p><p>Analise o código a seguir:</p><p>De acordo com a Rota 4, o código acima representa o tipo de layout:</p><p>Nota: 10.0</p><p>A Com grids CSS</p><p>Você assinalou essa alternativa (A)</p><p>Você acertou!</p><p>Gabarito:</p><p>Conforme a rota 4 e tema 3 a alternativa A está correta.</p><p>O tipo de layout gerado pelo código apresentado é denominado de layout com grids CSS, onde a linha display:grid indica qual o conteúdo que se comportará como grid, e a linha grid-template-</p><p>columns: 20% 40% 40% determina que será um grid com 3 colunas, com a largura de acordo com as porcentagens definidas.</p><p>B Flexbox</p><p>C Flexible Box Layout</p><p>D Fixo</p><p>E Flutuante</p><p>Questão 7/10 - Web Design</p><p>Leia as asserções a seguir, baseadas na Rota 4:</p><p>I. O CSS permite sobrepor vários fundos, em que podemos determinar transparência, a</p><p>variação das cores indicando qual a porcentagem ou quantidade de pixels do caminho,</p><p>deixando determinada cor mais ou menos intensa, além de especificar a cor de fundo</p><p>no qual o gradiente será sobreposto.</p><p>PORQUE</p><p>II. Assim, o código:</p><p>Demonstra como estamos especificando um gradiente sobreposto a uma cor de fundo</p><p>amarela.</p><p>A respeito destas assertivas, assinale a opção correta.</p><p>Nota: 0.0Você não pontuou essa questão</p><p>A A assertiva I é falsa e a II é verdadeira.</p><p>B As assertivas I e II são verdadeiras e complementares.</p><p>Você assinalou essa alternativa (B)</p><p>C As assertivas I e II são proposições falsas.</p><p>D A assertiva I é verdadeira e a II é falsa.</p><p>Gabarito:</p><p>De acordo com a Rota 4, tema 5, a alternativa D está correta, a assertiva I é verdadeira e a II é falsa. A assertiva II é falsa porque o código apresentado não está definindo uma cor para</p><p>sobreposição, o código correto para que houvesse a sobreposição seria:</p><p># grad {</p><p>Background-image: linear-gradient (to bottom right, red, yellow), yellow;</p><p>}</p><p>E As assertivas I e II são falsas.</p><p>Questão 8/10 - Web Design</p><p>O CSS é muito útil para a produção de layouts para páginas web e de acordo com a</p><p>Rota, são quatro as maneiras principais para fazer layouts utilizando o CSS. Para que</p><p>um site possua um layout que apresente uma maior flexibilidade nos seus diferentes</p><p>elementos, podemos acrescentar ao código CSS, dentro do seletor, os comandos</p><p>“float:left ou float:right” e “clear:both”, que farão com que os elementos</p><p>fiquem livres de</p><p>outros elementos flutuantes na página.</p><p>Conforme a Rota 4 e o texto acima, este modo de criar o layout em CSS é denominado</p><p>de:</p><p>Nota: 10.0</p><p>A Layout fixo</p><p>B Layout padrão</p><p>C Layout flexível</p><p>D Layout flutuante</p><p>Você assinalou essa alternativa (D)</p><p>Você acertou!</p><p>Gabarito:</p><p>Conforme a rota 4 e tema 1 a alternativa D está correta.</p><p>Um layout flutuante é caracterizado por uma maior flexibilidade nos seus diferentes elementos e, para que isto seja possível, são acrescentados ao código CSS, dentro dos seletores o “float:...”</p><p>e o “clear:both”, determinando que o elemento fique livre de outros elementos flutuantes de ambos os lados.</p><p>E Layout grid</p><p>Questão 9/10 - Web Design</p><p>Observe a imagem a seguir:</p><p>Chaosamran_Studio/shutterstock</p><p>A imagem acima representa o processo de criação de...</p><p>Nota: 10.0</p><p>A Plano de escopo</p><p>B Heurísticas de Nielsen</p><p>C Codificação CSS</p><p>D Wireframes</p><p>Você assinalou essa alternativa (D)</p><p>Você acertou!</p><p>Gabarito:</p><p>Conforme a rota 6 e tema 5 a alternativa D está correta.</p><p>A imagem apresenta a criação de esboços conhecidos como wireframes, no caso de baixa resolução e que servem para a prototipação de um site ou produto digital.</p><p>E Design hierárquico</p><p>Questão 10/10 - Web Design</p><p>Leia as asserções a seguir, baseadas na Rota 5:</p><p>I. Jesse James Garret determinou dez heurísticas que servem para analisar e corrigir</p><p>problemas de usabilidade de qualquer artefato, incluindo sites e produtos digitais, e a</p><p>primeira heurística aborda o controle e liberdade para o usuário.</p><p>PORQUE</p><p>II. De acordo com a primeira heurística, quem utiliza o sistema, ou seja, o usuário, deve</p><p>ser capaz de reconhecer os elementos em uma interface, desde que estes elementos</p><p>sejam reconhecíveis pelo usuário.</p><p>A respeito destas assertivas, assinale a opção correta.</p><p>Nota: 10.0</p><p>A A assertiva I é falsa e a II é verdadeira.</p><p>B As assertivas I e II são verdadeiras e complementares.</p><p>C As assertivas I e II são proposições falsas.</p><p>Você assinalou essa alternativa (C)</p><p>Você acertou!</p><p>Gabarito:</p><p>De acordo com a Rota 5, tema 2, a alternativa C está correta, as assertivas I e II são falsas, pois o autor que determinou as dez heurísticas foi Jakob Nielsen e a primeira heurística trata da</p><p>visibilidade do status do sistema. A assertiva II é falsa porque a proposição apresenta a abordagem relacionada com a segunda heurística e não a primeira.</p><p>D A assertiva I é verdadeira e a II é falsa.</p><p>E A assertiva I contraria a ideia expressa na assertiva II.</p>