Respostas SISTEMAS

Prévia do material em texto

Fórum Avaliativo:
Pesquisar sobre Design responsivo em HTML e identifique como você pode, de forma simples no HTML, usar a TAG <meta> que permite preparar seu site para vários dispositivos moveis.
O design responsivo é uma técnica utilizada para que um site consiga se adaptar em diferentes tamanhos de telas através d reorganização de conteúdos, imagens e simplificação de menus.
A forma simples seria utilizar TAGs para definir os caracteres; e a TAG de meta viewport faz o site ocupar todo espaço disponível na janela, seja em celulares, tablets ou PCs.
Unidade 1
Unidade de estudo de definição de um sistema web.
Identificar as categorias de sistemas.
Reconhecer o funcionamento da Internet.
Conhecer as ferramentas de construção de um sistema.
Desafio:
Entrar em 3 sites e navegar por eles e identificar o de melhor acesso, após isso entrar no W3C Markup Service e realizar o teste de validação com o endereço das 3 lojas e listar quantos erros cada loja apresentava!
Infográfico nos mostra os tipos de tecnologias utilizados no sistemas web:
Tecnologias: PHP Programação, JS Javascript, </> HTML/CSS e SQL Banco de dados.
Tipos de site: Conteúdo, Registro de Dados, Transações e Portal.
Sistema Centralizado e Sistema Distribuido
Sistema centralizados – todas as informações ficam alocadas em um computador local, não precisam da internet, são utilizadas mai sistemas pequenos, tipo folha de pagamento, único problema desse sistema é porque se der pane nele, toda base fica inoperante pois todo esse sistema esta ligado nesse computador.
Sistema distribuído – também conhecido como cliente servidor, as aplicações entre si ficam ligadas em um servidor pela internet, ele acessa pelo seu navegador esse sistema, utilizando por qualquer computador e fara utilização do sistema no servidor.
Camadas de uma aplicação – primeira camada é a interface do usuário, as demais camadas não ficam visíveis para o usuário, onde ficam processamento da aplicação, gerenciamento de dados e o banco de dados.
Objetivo da aplicação – e formos construir um site de conteúdo ele exibira apenas textos magens gráficos e terá uma navegação bem simples, se for um site de dados ou entrada do usuário trabalharemos basicamento por campos de formulário, no caso de um portal ele é um conjunto de paginas e links que convergem para um determinado contexto especifico da sua aplicação, agora se for aplicação relacionada a transação que são processadas no baco de dados, nesse caso é para loja virtuais.
Tecnologia utilizadas por um sistema:
HTML – onde é realizado a construção dos elementos ad pagina
CSS – onde é realizada toda configuração da parte visual.
Javascript – onde é realizada toda interatividade do usuário.
PHP/Banco de dados – onde fara o processamento dos dados com o servidor.
Exercicios:
1. O que caracteriza um sistema do tipo "distribuído"?
C. Que é executado parcialmente no computador local e parcialmente no servidor remoto.
Para ser executado corretamente, ele utilizará tanto a máquina cliente local quanto o servidor remoto.
2. O endereço virtual http://www.lojavirtual.com.br/produtos/promocoes.html compreende quais partes respectivamente?
E. Protocolo, domínio, caminho do arquivo e arquivo.
Essa é a ordem correta das partes.
3. Uma loja virtual se enquadra melhor em qual classificação?
D. Aplicação orientada à transação.
Esse tipo de site atende às necessidades de uma loja virtual. Nesse caso há processamento dos dados e retorno do servidor.
4. O desenvolvimento da interface visual de um sistema Web é muito importante para a utilização pelo usuário. Quais as tecnologias utilizadas para a criação da interface?
B. HTML e CSS.
O HTML e o CSS são os responsáveis pela formatação da interface.
5. Qual a ordem correta das camadas de uma aplicação?
E. Apresentação -> Aplicação -> Gerenciamento -> Banco de dados.
Essa é a ordem correta das camadas. Primeiro temos a apresentação do sistema, depois a sua aplicação em si e depois a busca e salvamento no banco de dados.
Unidade 2 Web 2.0 e Mídia Social
Reconhecer o impacto da Web 2.0 nas organizações.
Identificar formas de utilização das redes sociais no ambiente organizacional.
Explicar o impacto do uso de redes sociais na comunicação e colaboração organizacional.
Infográfico – Redes sociais são meios e canais facilitadores de conexões sociais entre pessas, grupos ou organizações que compartilham dos mesmo valores ou interesses, interagindo entre si.
Principais níveis de operações das redes sociais:
- Redes comunitárias – são estabelecidas em bairros ou cidades com o objetivo de reunir os interesses comuns das pessoas e melhora a situação do local.
- Redes de relacionamento – são ambientes propícios para a construção e manutenção de relações sociais entre pessoas com interesses ou atividades em comum.
- Redes profissionais – objetivam fortalecer a rede de contatos de uma pessoa, visando ganhos futuro profissionais.
- Redes politicas – são criadas para uso especifico relacionado com a politica e com os governos de todas as esferas (municipal, estadual e União).
A história da web 2.0 não se refere a uma estrutura diferente da própria internet ou a eventuais mudanças técnicas na plataforma. Basicamente, a sua principal característica é como ela foi encarada pelos usuários, na perspectiva da troca de informações e no processo colaborativo dos internautas com os sites e os serviços virtuais. Ou seja, foi praticamente uma mudança em termos de visão, pois a plataforma inicialmente percebida como meio, ganhou contornos e passos importantes para a oferta de diversos serviços on-line. Criou-se todo um mundo não mais visto de fora para dentro da internet. Mas um mundo próprio da internet, visto de dentro, voltado para dentro, e que foi ampliando-se e gerando processos, linguagens, mecanismos e todo um modus operandi sistêmico.
Web 2.0 baseia-se no comportamento ativos dos usuários de TI, ela prevê que o ambiente proporcione capacidade que os próprios usuários consigam interagir entre eles, o termo Web 2.0 assume 2 formas: - Ruptura com a web tradicional (web 1.0) e – Evolução natural das tecnologias da web.
Diferencial – mudança no comportamento dos usuários e aumento da interatividade das tecnologias, colaboração entre usuários.
Blogs – Wikis – Redes sociais.
Principal aplicação da web 2.0 são as redes sociais.
Sites de compartilhamento – widgets – tecnologias AJAX
Exercicios:
1. A Web 2.0 é um termo utilizado para descrever a segunda geração da rede mundial de computadores, que consiste no conceito de troca de informações e de colaboração dos usuários com os serviços virtuais oferecidos pelos sites. Espera-se que, a partir da utilização de novas tecnologias para o desenvolvimento de páginas web, o conteúdo virtual se torne mais dinâmico e que os usuários façam parte da sua produção e organização.
Por outro lado, alguns especialistas entendem que o termo Web 2.0 não representa, necessariamente, uma ruptura com os padrões tecnológicos vigentes até então, mas sim uma evolução natural das tecnologias utilizadas pelas empresas para a produção de aplicações web. Independente dessas opiniões, a realidade é que o número de serviços e aplicações que utiliza tecnologias aprimoradas de interatividade vem crescendo e já é considerado como padrão do mercado. Em relação às aplicações da Web 2.0, marque a alternativa CORRETA:
D. Uma rede social é um ambiente em que usuários devidamente identificados por um perfil podem interagir uns com os outros e trocarem informações sobre temas de interesse comum.
Essa interação dos usuários no ambiente da rede social pode acontecer no formato de mensagens postadas, compartilhamento de fotografias e vídeos, compartilhamento de links para materiais on-line, mensagens instantâneas, dentre outras.
2. Quando analisadas coletivamente, as diversas aplicações da Web 2.0 são chamadas de mídias sociais, pois alteram o foco do controle das comunicações de massa para cada usuário que participa das interações. Neste novo entendimento, as organizações e os usuários controlam tanto as mensagenscompartilhadas como o meio pela qual elas são enviadas e recebidas. Esse é o grande diferencial da Web 2.0, uma vez que cria um ambiente favorável para que organizações e usuários individuais compartilhem facilmente ideias, experiências e opiniões uns com os outros.
Neste contexto, analise as seguintes afirmativas:
I. Se antes da Web 2.0 uma grande organização transmitia uma única mensagem para o público de massa, neste novo ambiente acontece um enorme número de conversas entre os participantes.
II. Em função do custo relativamente baixo e pela facilidade de uso, as mídias sociais estão se constituindo em uma poderosa força de democratização.
III. Nas mídias sociais o conteúdo é repassado da tecnologia para as pessoas, enquanto nas mídias tradicionais as próprias pessoas criam e controlam o conteúdo.
A. I e II.
Nos ambientes da Web 2.0, o objetivo é promover maior troca de ideias e geração de conhecimento por meio da participação e interação entre os usuários. Neste aspecto, a estrutura da rede favorece diretamente a comunicação e a colaboração em grande escala, democratizando as opiniões dos diversos atores envolvidos
3. As redes sociais estão virando um canal de comunicação importante entre o consumidor e a empresa. Em alguns casos, assumem funções do Serviço de Atendimento ao Consumidor (SAC). A estratégia mais comum é contratar uma consultoria para monitorar tudo o que se fala sobre a empresa nas redes sociais. Programas de computador são capazes de varrer as redes em busca de palavras e termos específicos. Algumas empresas também usam as opiniões dos consumidores, organizadas nas redes, para aprimorar ou desenvolver produtos.
Esses exemplos fazem parecer que as redes são obrigatórias para as empresas. Mas há os riscos, pois interagir com o público nas mídias sociais deixa as empresas mais expostas e vulneráveis. É importante que a empresa considere o uso das redes como parte de sua estratégia, pois até mesmo quando não faz nenhuma ação virtual específica, ela corre o risco de entrar nas redes à revelia, por exemplo, a partir de comentários negativos de clientes. (Revista Época, 27 maio 2010).
Considerando a aplicação prática das redes sociais no ambiente empresarial, é CORRETO afirmar que:
E. O seu uso adequado deve ser incentivado para criar um ambiente propício à interação e ao compartilhamento de ideias entre a organização e as pessoas, especialmente os clientes.
As redes sociais se apresentam como um importante meio capaz de auxiliar na produção e compartilhamento de ideias por empresas e pessoas.
4. Desde tempos remotos as pessoas se organizam em redes para alcançarem objetivos comuns, mas com o passar do tempo e com a utilização de tecnologias inovadoras a forma com que esta organização é estruturada vem sofrendo mudanças. Nesse sentido, os especialistas organizam as redes sociais basicamente de três formas: centralizadas, descentralizadas e distribuídas.
Analise as afirmativas a seguir que tratam a respeito desses três tipos de redes:
I. Nas redes sociais centralizadas apenas as informações mais importantes para os usuários passam por um dos nós centrais para, em seguida, serem encaminhadas aos demais nós.
II. O funcionamento das redes descentralizadas é caracterizado pela conexão de diversas redes centralizadas conectadas entre si, onde diversos nós podem centralizar e distribuir informações.
III. A principal característica das redes distribuídas é que elas não possuem centros, sendo que qualquer nó da rede é capaz de enviar e receber informações para qualquer outro nó.
Está CORRETO o que se afirma somente em:
C. II e III.Nas redes descentralizadas o controle e a distribuição de informações é exercido por vários centros, enquanto nas redes distribuídas todos os nós podem tanto receber quanto enviar informações para outros nós.
5. Comunidades on-line ou virtuais são similares às comunidades físicas encontradas no mundo real, como vizinhanças, clubes e associações, exceto pelo fato de não estarem ligadas por limites políticos ou geográficos. O aspecto mais interessante dessas comunidades é que elas oferecem diversas formas de interação e colaboração aos seus usuários. Outra característica das comunidades on-line é que elas podem assumir vários formatos. Por exemplo, o YouTube é uma comunidade de pessoas que fazem postagens, assistem e comentam vídeos, enquanto a Wikipedia é uma comunidade voltada para pessoas que, colaborativamente, criam e editam uma base de conhecimento on-line.
Em relação aos tipos de comunidades on-line, marque a afirmativa CORRETA:
A. As comunidades étnicas são específicas de um país ou uma língua.
Essas comunidades focam os participantes que possuem algum tipo de relacionamento com determinado país ou língua, fornecendo conteúdo específico para este público.
Unidade 3 Evolução histórica do HTML
Historia do HTML
Reconhecer as diferenças entre as versões HTML
Identificar as mudanças do HTML5
A sigla HTML sig. Hypertext Markup Language traduzindo linguagem de marcação de hipertexto, a primeira versão do html foi baseada na linguagem SGML, e ele era utilizado para estruturação de documentos e foi dele que o HTM herdou diversas tags.
1990 HTML – a linguagem foi definida em especificações formais, inspiradas nas propostas originais de Tim Berners-Lee em criar uma linguagem baseada em SGML para a internet.
1993 – a primeira publicação foi esboçada por Berners-Lee e Dan Connolly e publicada em 1993 na IETF como uma aplicação formal para o SGML (com uma DTD em SGML definindo a gramatica)
1995 HTML 2.0 – IETF criou um grupo de trabalho para o HTML 2.0
1997 HTML 3.2 – desde 96 as especificações HTML vem sendo mantidas com auxilio de fabricantes de software, pelo World Wide Web Consortium (w3C) e no final de 97 foi publicado o HTML 3.2.
1999 HTML 4.01 – recomendação HTML 4.01 foi publicada pelo W3C.
2000 XHTML – é uma especificação HTML baseada em XML que é considerada pela W3C como um sucessor do HTML.
2004 HTML 5 – em janeiro de 2008 o W3C pulicou a especificação do HTML5 como Working Draft. Em outubro 2014 aconteceu o lançamento oficial da ultima versão da linguagem para paginas web.
Em 2016 foi lnçada a versão HTML 5.1 e em 2017 foi atualizada para HTML 5.2.
Atualizando uma pagina HTML 4 para HTML 5
1. HTML é uma linguagem de marcação inventada por Tim Berners-Lee e se tornou a principal linguagem de criação de páginas web. Em evolução constante, já teve várias versões e a atual é conhecida como HTML5. Assinale a versão do HTML que não foi lançada oficialmente pela W3C.
B. HTML 3.0.
Tecnicamente, o W3C considera oficialmente somente as versões HTML 2.0, HTML 3.2, HTML 4.0, HTML 4.1 e HTML5, 5.1, 5.2 e 5.3. As versões HTML e HTML+ são anteriores à criação do W3C e a versão HTML 3.0 não chegou a ser lançada oficialmente, transformando-se na versão HTML 3.2.
2. As versões do HTML representam aprimoramentos padronizados na linguagem fundamental da World Wide Web. Com a evolução das versões, mudanças foram sendo lançadas. Assinale a alternativa correta em relação às características de cada versão.
C. HTML não faz distinção entre maiúsculas e minúsculas, enquanto XHTML faz.
Dentre algumas das características de cada versão do HTML, pode-se citar:
- O HTML5 é mais adequado para dispositivos móveis, como tablets e telefones, enquanto o XHTML é mais adequado para telas de computador.
- O HTML5 é compatível com todos os navegadores, enquanto o XHTML não.
- Enquanto XHTML faz distinção entre maiúsculas e minúsculas, o HTML não faz.
- O HTML não permite que o JavaScript seja executado no navegador.
- O HTML4 permite que alguns elementos omitam a tag final. XHTML requer que todos os elementos incluam a tag final.
As demais alternativas não estão relacionadas com o contexto.
3. O HTML5 é a nova versão da linguagem HTML. São novos elementos (tags) trazidos pelo HTML5:
E. <article>, <aside> e <nav>
O HTML5 também adiciona novas tags semânticas, como < article > , < aside > e < nav >, que definirão melhor os blocos de conteúdo nas páginas. As demais alternativas apresentam elementosnão relacionados com a nova versão.
4. Há uma tag incluída na especificação do HTML5 que permite a reprodução de arquivos que contenham som ou música. Assinale a opção que apresenta corretamente essa tag.
A. < audio > . A tag < audio > contém informações que o navegador pode usar para interpretar e renderizar o conteúdo multimídia. As tags < phonic > , < sound > e < music > não são tags válidas de HTML. A tag < img > é utilizada para inserção de imagens no documento.
6. No HTML5 o elemento "áudio" admite os seguintes atributos: atributos globais, src, controls, crossorigin, preload, autoplay, mediagroup, loop e muted. Selecione a alternativa correta a respeito da função de cada um dos atributos.
D. O atributo src é destinado a indicar o caminho para o arquivo de som a incorporar na página.
Cada um dos possíveis atributos do elemento "áudio" tem uma finalidade:
- O atributo src é destinado a indicar o caminho para o arquivo de som a incorporar na página.
- O atributo controls é destinado a fazer com que o navegador renderize os controles nativos para o usuário interagir com o som.
- O atributo crossorigin é destinado a indicar a origem do arquivo de som a incorporar na página.
- O atributo preload é destinado a indicar como o autor espera que seja o carregamento do som na página.
- O atributo autoplay executa o som automaticamente.
- O atributo mediagroup exibe o nome do grupo ao qual o som pertence.
- O atributo loop repete a execução do som ao seu final.
- O atributo muted desativa o som.
Unidade 4 Criação e formatação de páginas web com HTML
Reconhecer as declarações de documento HTML.
Identificar e aplicar as TAGs do HTML
Criar paginas web com HTML
Estrutura básica de um código HTML
<html> (inicio do código HTML)
	<head> (inicio do cabeçalho)
 <title> Titulo da Pagina </title>
	</head> (final do cabeçalho)
	<body> (inicio do corpo da pagina)
 <h1>Assunto da pagina</h1>	
 <p>Paragrafo de texto na pagina</p>
	</body> (final do corpo da pagina)
</html> (final do código HTML)
Criação e formatação de paginas web com HTML
A linguagens são realizadas por uma TAG, com abertura e fechamento.
TAGS básicas
Começamos sempre com a declaração do documento
<!Doctaype html> onde informamos que iremos utilizar a versão mais atual do HTML
<html>
	<head> (informações que não aparecem na pagina)
	 <title> Titulo da pagina </title>
	</head>
	<body>
 			<h1>Cabeçalho de titulo 1</h1>
			<h2>Cabeçalho de titulo 2</h2>
	 Conteúdo da pagina
	</body>
</html>
Quebra de linha no paragrafo é so utilizar a tag </br>
Inserindo uma imagem <img src=”logo_html5.png”/>
Inserindo um link <a href=http://wwww.google.com>Google</a>
Listas ordenada <ol></ol> itens das listas <li></li>
Lista não ordenada <ul></ul> itens da lista <li></li>
1. Quais são as quatro TAGs básicas essenciais do HTML?
D. < html >, < head >, < body > e < title >.
Essas são as TAGs essencias ao HTML.
2. Quais são as TAGs utilizadas como "cabeçalhos de título" dentro de um documento HTML?
B. As TAGs < h1 > até < h6 >.
Correto! < h1 > até < h6 > definem os títulos dentro de uma hierarquia de tamanho.
3. São formatos de imagens que podem ser inseridos no HTML.
C. GIF, JPG e PNG.
Os formatos GIF, JPG e PNG são os compatíveis com imagens em um documento HTML.
4. Qual a TAG indicada para uma quebra de linha dentro de um mesmo parágrafo?
E. < br/ >.
A TAG < br/ > é a indicada quando queremos fazer uma quebra de linha.
5. Quais são os tipos de listas que podemos ter no HTML?
B. Do tipo ordenada < ol > e do tipo não ordenada < ul >.
As listas ordenadas (numeradas) são com a TAG < ol >; e as não ordenadas (com marcadores) são com a TAG < ul >.
Unidade 5
- definir a estrutura de uma pagina web com HTML5
- Aplicar formatação de texto em um a pagina web com HTML5.
- Desenvolver listas e tabela em uma pagina web com HTML5.
HEADER DA PAGINA: contem informações que são representadas no topo da pagina, geralmente possui dados de organização e os inks mais gerais do site como pag inicial, mapa do site e etc.
NAV: é uma área definida para o principais atalhos da pagina.
FOOTER DA PAGINA: contem informações que são representadas no rodapé da pagina, normalmente tem dados de conato da organização ou alguma outra informação relevante.
ASIDE: é uma área que não pertence ao fluxo principal da pagina, ontem links de publicidade ou outros atalhos de menor importância.
SECTION E ARTICLE: <section> define uma área da pagina e <article> representa o coteudo principal dessa área que contem as informações como textos, noticias e etc.
1. Sobre a instrução < !DOCTYPE html > do HTML5, marque a alternativa correta:
C. Indica que o documento hipertexto foi escrito na versão 5 do HTML.
No HTML5, a instrução <!DOCTYPE html> indica que o documento hipertexto foi escrito na versão 5. Nessa versão do HTML não é necessário informar qualquer número, bastando informar a instrução conforme citada.
2. Indique a alternativa correta em relação ao elemento < section > do HTML5:
E. Representa uma ou mais áreas de uma página HTML5. O elemento <section> define uma ou mais áreas de um documento HTML5. Essas áreas podem conter outros elementos, como <article>, <nav> e <aside>, e auxiliam na organização da estrutura de uma página web.
3. Selecione a alternativa correta em relação à formatação de parágrafos com a tag < pre > em HTML5:
A. Exibe o texto formatado tal como foi digitado no código-fonte.
Apresenta no navegador a mesma formatação que foi aplicada no código-fonte, respeitando espaços em branco e quebras de linha.
3. Marque a alternativa correta sobre âncoras em HTML5:
D. Realizam o direcionamento para um ponto da mesma página web.
Âncoras realizam o direcionamento para determinados locais dentro da mesma página web, como atalhos para determinados conteúdos que estão em pontos diferentes.
4. Em relação às listas do HTML5, selecione a alternativa correta:
D. Uma lista pode ser aninhada com outras sublistas, inclusive com tipos diferentes de lista.
Existem três tipos de lista: as ordenadas, as não ordenadas e as de definição, que não aplicam marcadores aos itens. Qualquer tipo de lista pode apresentar itens duplicados e nenhum tipo aplica classificação aos itens, sendo que todos os tipos de listas podem aninhar subitens, inclusive com tipos diferentes de lista.
TESTE
1. Das alternativas abaixo, que comparam HTML ou XHTML, assinale a alternativa FALSA: 
b. O HTML5 e o XHTML são adequados para dispositivos móveis, como tablets e telefones.
2. Um desenvolvedor full stack se caracteriza por :
d. trabalhar tanto com front end quanto backend
3. Considere as afirmativas abaixo
a. Em sistemas para Web, o ideal para um sistema de vendas para cliente final deve ser a utilização da arquitetura Cliente-Servidor, onde o servidor Web não precisa estar conectado à rede para efetivar as vendas
b. Existem sistemas que não necessariamente precisam estar conectados à rede, de forma que a aplicação pode ser processada no computador local.
c. O processamento de um sistema pode ser centralizado ou distribuído
 Assinale a resposta correta
b. B e C estão corretas
4. World Wide Web (que em português significa rede de alcance mundial), também conhecida como Web ou WWW é :
b.um sistema de documentos em hipermídia que são interligados e executados na Internet
5. Cada serviço disponível na Internet possui um identificador único de 16 bits conhecido como:
c. Porta
6. As Tags abaixo criadas na versão HTML5, EXCETO:
d. <body>
7. Dos itens listados abaixo, todos surgiram na conhecida WEB 2.0, EXCETO:
 I. Web services.
 II. Sites de informação coletiva como a Wikipedia. III. Sites corporativos.
 IV. Redes Sociais. V. Sites de busca. a. I e II
7. Quando analisadas coletivamente, as diversas aplicações da Web 2.0 são chamadas de mídias sociais, pois alteram o foco do controle das comunicações de massa para cada usuário que participadas interações. Neste novo entendimento, as organizações e os usuários controlam tanto as mensagens compartilhadascomo o meio pela qual elas são enviadas e recebidas. Esse é o grande diferencial da Web 2.0, uma vez que cria um ambiente favorável para que organizações e usuários individuais compartilhem facilmente ideias, experiências e opiniões uns com os outros. Neste contexto,analise as seguintes afirmações:
I. Se antes da Web 2.0 uma grande organização transmitia uma única mensagem para o público de massa, neste novo ambiente acontece um enorme número de conversas entre os participantes.
II. Em função do custo relativamente baixo e pela facilidade de uso, as mídias sociais estão se constituindo em uma poderosa força de democratização.
III. Nas mídias sociais o conteúdo é repassado da tecnologia para as pessoas, enquanto nas mídias tradicionais as próprias pessoas criam e controlam o conteúdo.
Está correto o que se afirma somente em:
b.III e V
8. Quando analisadas coletivamente, as diversas aplicações da Web 2.0 são chamadas de mídias sociais, pois alteram o foco do controle das comunicações de massa para cada usuário que participadas interações. Neste novo entendimento, as organizações e os usuários controlam tanto as mensagens compartilhadas como o meio pela qual elas são enviadas e recebidas. Esse é o grande diferencial da Web 2.0, uma vez que cria um ambiente favorável para que organizações e usuários individuais compartilhem facilmente ideias, experiências e opiniões uns com os outros. Neste contexto,analise as seguintes afirmações:
I. Se antes da Web 2.0 uma grande organização transmitia uma única mensagem para o público de massa, neste novo ambiente acontece um enorme número de conversas entre os participantes.
II. Em função do custo relativamente baixo e pela facilidade de uso, as mídias sociais estão se constituindo em uma poderosa força de democratização.
III. Nas mídias sociais o conteúdo é repassado da tecnologia para as pessoas, enquanto nas mídias tradicionais as próprias pessoas criam e controlam o conteúdo.
Está correto o que se afirma somente em:	
d. I e II.
9. Considere a URL https://unifaa.edu.br/img/logo_unifaa.png . Qual informação se refere ao protocolo utilizado ?
b.https
10. A porta usada por norma para o protocolo HTTP (WEB) é
b. 80
Unidade 6 Trabalhando com listas e tabelas
Lista é importante no HTML, pois te permite criar tópicos de textos para melhor demonstração de um assunto.
- Descrever os diferentes tipos de listas.
- Desenvolver a formação de vários tipos de tabelas.
- Criar paginas web com listas e tabelas.
Adicionar imagens utilizando tabelas.
Você precisa carregar as imagens em algum lugar na internet, obter o link completo de onde a imagem estiver localizada para poder adiciona-la na tabela.
<img src=”http://yoursite.com/image/filename.jpg” alt=”descrição aqui”/>
Align = alinhamento horizontal / valign = alinhamento na vertical
<br/> = quebra de pagina
1. O HTML tem amplo uso difundido nas páginas publicadas na Internet.
Assinale a opção que corresponde à tag utilizada no caso em que seja necessário utilizar uma lista não ordenada.
D. <ul> (a tag HTML <ul> é usada para criar uma lista não ordenada. As tags <b> e <p> referem-se à formatação de texto em páginas HTML. Já as tags <tr> e <th> são elementos para a manipulação de tabelas em HTML.
2. Tags são rótulos usados para informar ao navegador como deve ser apresentado o site. Ou seja, quando se começa a escrever HTML, estão sendo escritas as tags que serão interpretadas pelo navegador, produzindo, assim, o visual do site. Qual tag representa cada célula da tabela?
B. <td> (as tag <td> significa dados da tabela(tabela dara). É possível representar cada célula da tabela usando <td>, no final, usamos a tag </td>. A tag <tr> é usada para indicar o inicio de cada linha, ou seja, representa a linha da tabela. As informações do cabeçalho estão presentes na tag <th>. As tags <ul> e <ol> referem-se à criação de listas, não tendo relações com tabelas.
3. O cabeçalho de uma tabela tem formatação diferente de uma célula padrão, tendo seu conteúdo centralizado e em estilo negrito. Qual tag deve ser usada para representar uma célula de cabeçalho de uma tabela?
D. <th> (O elemento <th> é usado para representar o cabeçalho da coluna ou uma linha. A tag <td> define uma célula em uma tabela e <tr> define uma linha em uma tabela. A tag <thead> contém o grupo de cabeçalho. <tbody> é usado para agrupar o conteúdo do corpo em uma tabela, e <tfooter> é usado para agrupar o conteúdo do rodapé em uma tabela)
4. Uma das várias possibilidade que o HTML fornece para trabalhar com tabelas, é a possibilidade de criar um título, que geralmente é usado como um breve resumo e uma explicação sobre o que será exibido na tabela. Esse título será agregado, como se fizesse parte da tabela, ficando em sua parte superior. Sendo assim, os títulos das tabelas estão dentro de qual elemento?
A. <thead> (os títulos da tabela estão dentro do elemento <thead>. O rodapé fica dentro do elemento <tfoot>. O corpo da tabela esta dentro do elemento <tbody>. <th> é usado para das cabeçalho para uma linha ou coluna. <caption> define a legenda da tabea. Todo elemento deve ter uma tag de fechamento também, como por exemplo, </thead>, </tfoot>, </tbody>, </caption>
5. Durante a produção de um site ocorre a necessidade de que a célula de uma tabela ocupe mais de uma coluna ou linha, mesclando duas ou mais linhas ou duas ou mais colunas. Qual dos seguintes atributos dividirá uma célula em mais linhas?
E. rowspan. (O atributo rowspan dividirá uma célula em várias linhas; e border-collapse irá recolher a borda. Para especificar o preenchimento para o cabeçalho da tabela e os dados da tabela era utilizado o atributo cellpadding, o qual atualmente está obsoleto. É possível especificar a largura da tabela HTML usando a propriedade CSS width. Se você deseja fazer uma célula abranger mais de uma coluna, é possível usar o atributo colspan.)
Unidade 7 Trabalhando com links e formulários
Elaborar paginas HTML com links e ancoras.
Dsenvolver paginas HTML com formulários
Identificar os diferentes componentes de um formulário.
As pimeira paginas web eram estáticas, permitindo ao usuário apenas leitura de informações. Hoje você não apenas le as informações, mas também envia-las. 
1. Deseja-se criar uma página de contatos em um site empresarial. Você quer que seu formulário envie a data atual em um dos campos. Entretanto, esse campo não pode ser editável, caso contrário o usuário conseguiria fraudar a data de envio. Qual tipo de campo input poderia ser utilizado para isso?
C. Hidden.
A única opção válida seria hidden. Os campos do tipo hidden são ocultos para o usuário final. File é para inserção de arquivos. Hidden é um campo visível para o usuário.
2. Ao criar um site para uma empresa de jornalismo, você utilizou links absolutos. Qual é o problema dessa abordagem?
B. Links absolutos levam em consideração que o endereço do site seja constante. Se ele for alterado, todos os links pararão de funcionar.
Links absolutos requerem o endereço completo, o que pode fazer com que links se quebrem com qualquer alteração. Links podem ser editados, mas isso não pode ser feito facilmente dependendo do tamanho do site. Além disso, links absolutos não levam em consideração o local do arquivo.
3. Ao criar um site, o programador opta por utilizar campos do tipo text para receber senhas. Qual é o problema 
B. Campos text permitem que as senhas digitadas sejam visualizadas.
A melhor opção seria o uso de campos do tipo password, que escondem as senhas. Campos text são visíveis e permitem diversos tipos de caracteres.
4. Ao analisar o formulário criado por um programador iniciante, você notou que o formulário não estava sendo enviado. Observe o código a seguir:
<form action=”processa.php” method=”post”>
<input type=”text” name=”nome”>
<input type=”text” name=”contato”>
<textarea></textarea>
<input type=”button” value=”Enviar”>
</form>
O código apresenta vários problemas. Qual solução a seguir resolveria o problema do envio?
B. Substituir o tipo do botão enviar para submit.
O botão submit permite que um formulárioseja enviado. O método get apenas faz o envio pela url. <textarea>, apesar de ser uma solução importante, ela não resolve o problema da submissão do formulário.
5. Você está desenvolvendo um site com soluções para questões do ENEM (Exame Nacional do Ensino Médio). Para cada questão, você adicionou em seu site um texto explicando a solução e um vídeo. Entretanto, ao clicar no link para o vídeo, a página é redirecionada, fazendo com que o usuário não consiga ler o texto ao mesmo tempo.
Qual atributo e valor poderiam ser adicionados ao link do vídeo para solucionar esse problema?
B. target=”_blank”.
O target=”_blank” permite que o vídeo seja aberto em uma nova página única. As demais opções não resolveriam o problema indicado.
UNIDADE 8 Criação e formatação de páginas web com CSS
Identificar os estilos CSS
Definir estilos CSS aplicando nas paginas HTML
Reconhecer como ocorre a estilização de paginas web com CSS]
- INLINE – que é definida dentro de uma tag de html.
- INTERNA – que é definida no head do documento html
- EXTERNA – QUE É DEFINIDA EM UM DOCUMENTO CSS EM SEPARADO.
- SELETOR DE TAG – utiliza o nome da própria TAG ex.: body{margin:0;}
- SELETOR DE CLASSE – utiliza uma classe na TAG e utiliza um ponto antes do nome da classe, as classes podem ser utilizadas para um grupo de TAGs. Ex.: <h1 class=”titulo”> e na CS: .titulo{background-color:#000; color:#FFF;}
- SELETOR DE ID – utiliza uma class na TAG e utiliza um # antes do nome do ID, os IDS só podem ser utilizadas para um elemento. Ex.:<div id=”rodapé”> e na css:#rodape{margin:auto;padding:20px;}
- SELETROS DE ATRIBUTO – UTILIZA O ATRIBUTO DE UMA TAG E O ATRIBUTO fica entre []. Ex.:<input type=”text” e na CSS: input[type=text]{border:solid 2px #000;}
1. De que formas a CSS pode ser definida no HTML?
B. Inline, interna e externa.
A CSS pode ser definida direto na TAG (inline), no Head da página (interna) ou em um arquivo CSS separado (externa).
2. Como é o "Bloco de declaração" de uma regra de CSS?
D. Seletor｛propriedade:valor;｝
Após o nome do seletor, abre-se chaves e separa por "dois pontos" a propriedade e o valor.
3. São tipos de seletores de CSS:
E. TAG, ID, classe, pseudoclasse e atributo.
Podemos utilizar os seletores para o nome de uma TAG, um apelido (ID), o apelido de um grupo (classe) grupos de links (pseudoclasse) e o atributo de uma TAG.	
4. Que propriedade e valor de um seletor utliza-se para deixar dois elementos "lado a lado" em uma página?
C. float:left e float:right
As propriedades float:left e o float:right vão alinhar os dois elementos lado a lado, um na esquerda e outro na direita.
5. O que é um seletor universal e como é representado?
B. Um seletor que formatará todos os elementos dentro de uma página, representado por um asterisco (*).
Um seletor universal com asterisco (*) formatará TODOS os elementos da página com o valor que foi definido.
UNIDADE 9 Folha de Estilo em Cascatas (CSS)
Conceituar css
Descrever o funcionamento e as vantagens do css
Implementar layouts em html com css
1. Um programador deseja construir um portfólio de fotografias na Internet. Na página principal de seu site, ele desenvolveu um grid com três imagens em cada linha, armazenada em um <div> de propriedade position igual a relative. As imagens foram inseridas com a propriedade float: left, que força imagens a se posicionar à esquerda. Ao todo, 9 imagens foram inseridas na página inicial. Quais propriedades CSS poderiam ser aplicadas às imagens para inserir um espaçamento de 10px entre as imagens?
B. margin-left: 10px; margin-top: 10px;
A propriedade margin-left insere uma margem de 10px da margem esquerda, e a propriedade margin-top insere uma margem em relação ao topo. Apenas essas duas propriedades seriam necessárias para ajustar a margem tanto nas laterais quanto no topo. Todas as outras propriedades inserem margens maiores do que 10px.
2. O vínculo de arquivos externos CSS permite que grandes websites possam ter o leiaute facilmente editado, sem a necessidade de editar página por página. Qual dos itens a seguir representa uma tag utilizada para vincular arquivos CSS a páginas HTML?
B. < link > (As tags < style > e o método inline com o atributo style permitem a inserção de código HTML. Entretanto, apenas a tag link pode ser utilizada para vincular páginas HTML a arquivos CSS. A tag < body > é usada para inserir o conteúdo da página. A tag < css > não é utilizada para a inserção de links.)
3. Apresentado o seguinte código CSS:
body ｛
background-color: black;
color: red;
｝
#div1{
background-color: white;
color: blue;
}
.classe{
background-color: green;
color: yellow;
}
Qual seria a cor do texto em uma div com id = 1 e class = classe presente dentro do body de uma página?
B. Amarelo.
As cores seriam aplicadas em algum momento, mas o conceito por trás da folha de estilo em cascatas prevê a sobreposição de elementos declarados por último. Assim, a última classe declarada é a classe denominada “classe”, logo, a cor do texto seria amarela.
4. Você deseja construir um site com um menu na cor laranja. Que propriedade poderia ser utilizada para colorir o menu dessa cor? Além disso, qual seria a cor mais apropriada para os textos? Marque a alternativa que contém as propriedades CSS para preencher os requisitos apresentados.
B. background-color: orange; color: white;
Para que haja um contraste de cores é necessário que a cor de fundo seja laranja e o texto seja branco. Texto na cor amarela com fundo laranja dificultaria a leitura. A questão exige claramente que o background-color seja laranja (orange), entretanto, o texto na cor laranja impediria a leitura.
5. Você deseja construir um website, entretanto, ele se comporta de maneira diferente em navegadores distintos. No Chrome, uma margem de 10px é inserida na borda esquerda e superior. No Edge, essa margem não aparece. Qual seletor pode ser utilizado para remover configurações básicas aplicadas por navegadores?
A. *
O seletor universal (*) permite a remoção de propriedades padrões de navegadores. O símbolo de (#) é utilizado para IDs; já o (.), para classes. Color é uma propriedade, não um seletor. E all é uma palavra reservada muito utilizada em diversas linguagens de programação, mas não é um seletor.
UNIDADE 10 Criação de páginas com CSS3
Aplicar formatação em elementos de uma página web com CSS3.
Desenvolver classes e seletores de Id com CSS3.
Usar Media Query para diferentes dispositivos.
1. Indique a opção que representa a maneira correta de chamar um arquivo externo CSS em uma página HTML:
D. <link rel=”stylesheet” href=”estilo.css”> (a tag <link> define um link entre um documento é um recurso externo e é utilizada para vincular as folhas de estilos externas. O atributo rel define o relacionamento entre os arquivos, indicando o tipo de arquivo importado pelo href, ou seja, o arquivo responsável pelo estilo da ua pagina: <link rel=”stylesheet. Não é correto utilizar as sintaxes <link type=”stylesheet” ou <link css=”text/css”. O atributo type define o conteúdo do arquivo para qual seja, o link para o arquivo que contem o CSS. Dessa forma, não se utiliza <file=”estilo.css”. Um arquivo CSS externo nomeado como “estilo.css” pode ser importado por meio da instrução href. Essa instrução deve se localizar dentro da tag da pagina HTML, como exemplo:
<head>
<link rel=”styleheet” href=”estilo.css”>
</head>)
2. Marque a opção que indica a alternativa correta em relação às propriedades de uma caixa em CSS3:
C. Content, padding, border e margin.
A resposta correta é Content, padding, border e margin, pois uma caixa pode ter as seguintes propriedades - conteúdo (content), espaçamento (padding), borda (border) e margin (margin) que definem um item das dimensões da caixa:
Descrição da imagem não disponível​​​​​​​As demais propriedades válidas do CSS têm as seguintes funcionalidades: Box-sizing é utilizada para alterar a propriedade padrão da caixa, usada para calcular larguras (widths) e alturas (heights) dos elementos. O box-shadow é utilizado para adicionar efeitos de sombra em volta de um elemento. A regraMédia permitia a aplicação condicional de estilos, dependendo do tipo de dispositivo/mídia (média types) acessado. A propriedade position especifica o tipo de método de posicionamento usados para um elemento (static, relative, fixed, absolute or sticky). A propriedade perspective determina a distância entre o plano z = 0 e o usuário para dar uma perspectiva a um elemento posicionado em 3D. Top, left afetam a posição de um elemento, enquanto que width e height a largura e altura. A propriedade “transform” aplica uma transformação 2D ou 3D a um elemento.
3. Em relação aos seletores de classe, marque a alternativa correta:
A. Pode-se aplicar mais de um estilo de seletor de classe para um elemento HTML.
Seletores de classe permitem aplicar mais de um estilo para um elemento HTML. No caso de sobreposição de estilos, o navegador aplicará o estilo que for chamado primeiro. O nome de um seletor de classe deve ser definido pelo usuário, podendo conter quaisquer caracteres, excetuando-se caracteres especiais e espaços em branco.
4. Indique a alternativa correta em relação ao seletor de Id:
E. Pode ser usado apenas uma única vez dentro de uma página HTML.
Um seletor de Id utiliza o caractere # para declarar seu nome e só pode ser utilizado uma única vez dentro da página HTML, ou seja, há limitação. Além disso, um seletor de Id pode ser chamado simultaneamente com um ou mais seletores de classe em um elemento HTML.
O caractere utilizado para sua identificação é o # e não o @.
5. São operadores lógicos suportados por Media Feature:
B. Only, and, not e or.
Os operadores lógicos de Média Feature são only, and, not e or. Esses operadores lógicos permitem montar expressões complexas para pesquisas em Média Query. Only - aplica os estilos em navegadores que suportam média query. Not - indica uma situação de negação a expressão média query aplicada. Or - une diversas expressões e aplica o estilo se apenas uma for verdadeira. And - une diversas expressões e aplica o estilo se todas elas forem verdadeiras. Os outros itens (all, empty, equal, Less than, greater than, equals e not equals) não são operadores lógicos desse recurso.