NEW
Font size
WorksheetsRECUPERAÇÃO - PROGRAMAÇÃO
Total questions: 10
Worksheet time: 15mins
Analise as afirmativas a seguir sobre projetos autorais com HTML e CSS:
I. Um bom projeto autoral deve partir da observação do cotidiano e propor
uma solução digital.
II. Uma das principais aplicações de HTML e CSS em projetos estudantis é a
criação de lojas online.
III. O uso de HTML e CSS pode ser útil para criar páginas que informem,
eduquem ou facilitem o acesso a serviços.
IV. Projetos autorais não podem se inspirar em sites já existentes, devendo
apresentar propostas próprias.
A partir da análise, quais afirmativas estão corretas?
Lucas está criando um site para sua comunidade rural e quer garantir que
ele fique bem projetado e rápido. Ele sabe que usar HTML e CSS pode ajudar,
mas está em dúvida sobre como evitar erros que possam prejudicar a página.
Pensando nisso, analise as afirmações a seguir, considerando (V) para as
verdadeiras e (F) para as falsas.
( ) O CSS pode ser usado para mudar a cor do texto e o fundo da página.
( ) Adicionar muitas imagens e efeitos pode deixar a página mais lenta e difícil
de usar.
( ) O uso de animações CSS é uma boa ideia, independente do contexto.
( ) Usar a tag <div> pode ajudar a organizar a página em seções e facilitar a
aplicação de estilos com CSS.
( ) O uso de diversas fontes diferentes e cores brilhantes pode tornar a página
mais visualmente interessante e fácil de ler.
A partir dessa análise, as afirmativas são, respectivamente:
V – F – V – F – V
F – V – F – V – F
V – F – V – F – F
Com base no uso ético de mídias em projetos web, verifica-se que:
Sobre o uso de tags HTML na construção de páginas web, leia as informações
das colunas a seguir e relacione cada tag a sua função correspondente.
Tag HTML Função
A. <div> 1. Usada para agrupar conteúdo relacionado, como
uma seção de um artigo ou uma parte do conteúdo da
página.
B. <footer> 2. Usada para agrupar links de navegação dentro de
uma página.
C. <section> 3. Usada para definir a seção de rodapé da página,
geralmente contendo informações de copyright, links e
outros detalhes.
D. <head> 4. Usada para agrupar conteúdo sem semântica
específica, geralmente para estilização ou estruturação.
E. <body> 5. Contém o conteúdo visível de uma página HTML,
como texto, imagens e outros elementos.
F. <nav> 6. Contém metadados sobre o documento, como título,
links para folhas de estilo e scripts.
A partir dessa análise, as associações são, respectivamente:
Ana está criando um botão para seu site. Observe a sequência de imagens a
seguir:
Agora, observe o código que define o estilo do botão com as propriedades
indicadas:
button {
background-color: ______;
color: ______;
border-radius: ______;
transition: ______;
}
button:hover {
________________: #2980b9;
}
Ordene todos os blocos a seguir para completar o código:
#3498db White 10px background-color 0.3s ease
background-color
Escreva a sequência correta de blocos nas linhas a seguir:
Analise o trecho de código a seguir.
<!DOCTYPE html>
<html lang=”pt-br”>
<head>
<meta charset=”UTF-8”>
<title>Exemplo</title>
<style>
.header { background-color: #333; color: #222;
padding: 10px; }
.footer { background-color: #333; color: #222;
padding: 5px; }
</style>
</head>
<body>
<div class=”header”>
<h1>Bem-vindo</h1>
</div>
<div class=”footer”>
<p>© 2025</p>
</div>
</body>
</html>
Com base na sua análise, qual boa prática ou melhoria seria recomendada para
esse trecho de código?
Leia as afirmativas a seguir sobre usabilidade e acessibilidade em sites.
I. O uso de imagens sem texto alternativo (alt) impede que pessoas com
deficiência visual compreendam o conteúdo da página.
II. O uso de cores vibrantes pode tornar o conteúdo mais atrativo, mesmo que o
contraste entre o texto e o fundo seja baixo.
III. A navegação por teclado, sem a necessidade de um mouse, é uma boa
prática de acessibilidade para pessoas com deficiência motora.
IV. A ausência de mensagens de erro em formulários pode ser contornada,
desde que o formulário esteja funcional.
A partir da análise, quais afirmativas estão corretas?
Observe o código a seguir:
<form>
<input type=”text” id=”name” placeholder=”Digite seu nome”>
<input type=”email” id=”email” placeholder=”Digite seu
e-mail”>
<input type=”submit” value=”Enviar”>
</form>
Considerando que esse código não está fornecendo um bom feedback ao
usuário em caso de erro, qual a correção indicada?
Sobre práticas de responsividade em sites, analise as seguintes afirmações:
( ) O uso de unidades relativas, como em, rem ou %, costuma ser mais indicado
do que unidades fixas, como px, para criar layouts mais responsivos.
( ) O uso de dimensões fixas em pixels para imagens pode contribuir para
manter a consistência do layout em diferentes tamanhos de tela.
( ) O uso de media queries permite adaptar o layout conforme a largura da
tela, favorecendo a experiência do usuário em diferentes dispositivos.
( ) O uso de max-width: 100% nas imagens assegura que elas permaneçam
com o mesmo tamanho em pixels, mesmo em layouts responsivos.
A partir dessa análise, as afirmativas são, respectivamente:
F – V – V – F
V – V – F – F
F – F – V – V
Pedro decidiu vender alguns dos seus jogos e, por isso, criou um site para
anunciar os títulos e valores. Abaixo de cada título, há um botão chamado
Comprar para que a pessoa interessada possa efetuar a compra.
Para destacar o botão, as propriedades aplicadas foram:
• cor de fundo verde;
• cor da fonte branca;
• borda de 3 pixels de espessura na cor amarela.
Ordene todos os blocos que representam corretamente o estilo aplicado no
botão Comprar.
background-color: green; .botao-comprar{
border: 3px solid yellow;} color: #222;
Escreva a sequência correta de blocos nas linhas a seguir:
