{"id":1276,"date":"2022-03-25T17:44:50","date_gmt":"2022-03-25T17:44:50","guid":{"rendered":"https:\/\/liag.ft.unicamp.br\/computacaocriativa\/?page_id=1276"},"modified":"2022-04-06T11:36:04","modified_gmt":"2022-04-06T11:36:04","slug":"oficina-css-html","status":"publish","type":"page","link":"https:\/\/liag.ft.unicamp.br\/computacaocriativa\/oficina-css-html\/","title":{"rendered":"ACT – HTML"},"content":{"rendered":"\n

Adapta\u00e7\u00e3o do material<\/span>:\u00a0<\/b><\/span><\/p>\n

Silvia Roberta de Jesus Garcia (Mestranda – ACT)<\/span><\/p>\n

\u00a0<\/p>\n\n\n\n\n
\n

Aula 01<\/b><\/span><\/p>\n<\/td>\n

\n

Internet \/ HTML (P\u00e1ginas \/ Sites)<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

Antes de come\u00e7ar a trabalhar com HTML, esta aula tem por objetivo apresentar os termos b\u00e1sicos que envolvem o HTML – Linguagem de Marca\u00e7\u00e3o de Texto.<\/span><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u00a0<\/p>\n\n\n\n\n\n\n\n\n\n\n\n\n\n
\n

Atividade\u00a0<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

1<\/span><\/p>\n<\/td>\n

\n

Internet – World Wide Web<\/span><\/p>\n<\/td>\n<\/tr>\n

\n

2<\/span><\/p>\n<\/td>\n

\n

Protocolo – TCP \/ IP e\u00a0 HTTP<\/span><\/p>\n<\/td>\n<\/tr>\n

\n

3<\/span><\/p>\n<\/td>\n

\n

HomePage\u00a0<\/span><\/p>\n<\/td>\n<\/tr>\n

\n

4<\/span><\/p>\n<\/td>\n

\n

Site<\/span><\/p>\n<\/td>\n<\/tr>\n

\n

5<\/span><\/p>\n<\/td>\n

\n

Browsers<\/span><\/p>\n<\/td>\n<\/tr>\n

\n

6<\/span><\/p>\n<\/td>\n

\n

URL (Uniform Resource Locator ou, em portugu\u00eas, Localizador de Recursos Uniforme)<\/span><\/p>\n<\/td>\n<\/tr>\n

\n

7<\/span><\/p>\n<\/td>\n

\n

HTML<\/span><\/p>\n<\/td>\n<\/tr>\n

\n

Link do material:<\/b><\/span><\/p>\n

Aula<\/span><\/a><\/p>\n<\/td>\n<\/tr>\n

\n

Modelo:<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

CR\u00c9DITOS:\u00a0<\/b><\/span><\/p>\n


<\/span>Tutorial com comandos das tags de marca\u00e7\u00e3o da linguagem HTML<\/b>. TCDF \u2013 Tribunal de contas do Distrito Federal. Dispon\u00edvel em: Comandos HTML <\/a><\/span><\/span><\/p>\n
\n

Adaptado pelo autor<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u00a0<\/p>\n

\n

\u00a0<\/p>\n\n\n\n\n
\n

Aula 02<\/b><\/span><\/p>\n<\/td>\n

\n

Introdu\u00e7\u00e3o ao HTML – Informa\u00e7\u00f5es b\u00e1sicas<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

Esta aula tem como objetivo dar continuidade aos ensinamentos sobre l\u00f3gica utilizando um jogo um pouco mais aprimorado.<\/span>
<\/span>A ideia \u00e9 que o aluno consiga identificar em um fluxograma qual atividade est\u00e1 errada durante o fluxo e propor uma solu\u00e7\u00e3o para aquele exerc\u00edcio<\/span><\/span><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u00a0<\/p>\n\n\n\n\n\n\n\n\n\n\n
\n

Atividade\u00a0<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

1<\/span><\/p>\n<\/td>\n

\n

Tags – Fun\u00e7\u00e3o de cada Tag<\/span><\/p>\n<\/td>\n<\/tr>\n

\n

2<\/span><\/p>\n<\/td>\n

\n

Estrutura b\u00e1sica<\/span><\/p>\n<\/td>\n<\/tr>\n

\n

3<\/span><\/p>\n<\/td>\n

\n

Regras do HTML<\/span><\/p>\n<\/td>\n<\/tr>\n

\n

4<\/span><\/p>\n<\/td>\n

\n

Partes b\u00e1sicas do HTML<\/span><\/p>\n

    \n
  • Cabe\u00e7alho da p\u00e1gina<\/span><\/li>\n
  • T\u00edtulo<\/span><\/li>\n
  • Script<\/span><\/li>\n
  • Meta<\/span><\/li>\n
  • Corpo do texto<\/span><\/li>\n
  • T\u00edtulos e subt\u00edtulos<\/span><\/li>\n
  • Negrito, it\u00e1lico e sublinhado<\/span><\/li>\n
  • Par\u00e1grafos<\/span><\/li>\n
  • Alinhamento<\/span><\/li>\n
  • Quebra de linha<\/span><\/li>\n
  • Fontes<\/span><\/li>\n<\/ul>\n<\/td>\n<\/tr>\n
\n

Link do material:<\/b><\/span><\/p>\n

Aula<\/a>
<\/span><\/p>\n

Exemplo<\/a><\/span>

<\/p>\n<\/td>\n<\/tr>\n

\n

Modelo:<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

CR\u00c9DITOS: <\/b>
<\/span>Tutorial com comandos das tags de marca\u00e7\u00e3o da linguagem HTML<\/b>. TCDF \u2013 Tribunal de contas do Distrito Federal. Dispon\u00edvel em: Comandos HTML <\/a><\/span><\/span><\/p>\n
\n

Adaptado pelo autor<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u00a0<\/p>\n

\n

\u00a0<\/p>\n\n\n\n\n
\n

Aula 03<\/b><\/span><\/p>\n<\/td>\n

\n

Partes b\u00e1sicas HTML<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

Esta aula tem como objetivo apresentar as TAGS utilizadas para formata\u00e7\u00e3o de fontes, inser\u00e7\u00e3o de links na p\u00e1gina, link especial, inser\u00e7\u00e3o de imagens, associa\u00e7\u00e3o de texto a imagem.<\/span><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u00a0<\/p>\n\n\n\n\n\n\n\n\n
\n

Atividade\u00a0<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

1<\/span><\/p>\n<\/td>\n

\n

Atributos de Fontes:\u00a0<\/span><\/p>\n

    \n
  • Cor<\/span><\/li>\n
  • Tamanho<\/span><\/li>\n
  • Tipo<\/span><\/li>\n<\/ul>\n<\/td>\n<\/tr>\n
\n

2<\/span><\/p>\n<\/td>\n

\n

Imagens:<\/span><\/p>\n

    \n
  • URL absoluto<\/span><\/li>\n
  • URL relativo<\/span><\/li>\n
  • ALT<\/span><\/li>\n
  • Alinhamentos<\/span><\/li>\n
  • Dimens\u00f5es<\/span><\/li>\n<\/ul>\n<\/td>\n<\/tr>\n
\n

Link do material:<\/b><\/span><\/p>\n

Aula<\/a>
<\/span><\/p>\n

Exemplo<\/a><\/span>

<\/p>\n<\/td>\n<\/tr>\n

\n

Modelo:<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

CR\u00c9DITOS: <\/b>
<\/span>Tutorial com comandos das tags de marca\u00e7\u00e3o da linguagem HTML<\/b>. TCDF \u2013 Tribunal de contas do Distrito Federal. Dispon\u00edvel em: Comandos HTML <\/a><\/span><\/span><\/p>\n
\n

Adaptado pelo autor<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u00a0<\/p>\n

\n

\u00a0<\/p>\n\n\n\n\n
\n

Aula 04<\/b><\/span><\/p>\n<\/td>\n

\n

HTML – Listas e Se\u00e7\u00f5es<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

Esta aula tem por objetivo estruturar a elabora\u00e7\u00e3o de p\u00e1ginas na internet utilizado listas e se\u00e7\u00f5es e refor\u00e7ar o aprendizado dos comandos utilizados nas aulas anteriores.<\/span><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u00a0<\/p>\n\n\n\n\n\n\n\n\n
\n

Atividade\u00a0<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

1<\/span><\/p>\n<\/td>\n

\n

Tags para cria\u00e7\u00e3o de listas:<\/span><\/p>\n

    \n
  • Listas ordenadas\u00a0<\/span><\/li>\n
  • Listas n\u00e3o ordenadas<\/span><\/li>\n
  • Listas ordenadas com caracteres especiais<\/span><\/li>\n<\/ul>\n<\/td>\n<\/tr>\n
\n

2<\/span><\/p>\n<\/td>\n

\n

Se\u00e7\u00f5es<\/span><\/p>\n

    \n
  • Id<\/span><\/li>\n
  • Texto<\/span><\/li>\n
  • Imagens<\/span><\/li>\n<\/ul>\n<\/td>\n<\/tr>\n
\n

Link do material:<\/b><\/span><\/p>\n

Aula<\/span><\/a><\/p>\n

Exemplo<\/a><\/span>

<\/p>\n<\/td>\n<\/tr>\n

\n

Modelo:<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

CR\u00c9DITOS: <\/b>
<\/span>Tutorial com comandos das tags de marca\u00e7\u00e3o da linguagem HTML<\/b>. TCDF \u2013 Tribunal de contas do Distrito Federal. Dispon\u00edvel em: Comandos HTML <\/a><\/span><\/span><\/p>\n
\n

Adaptado pelo autor<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u00a0<\/p>\n

\n

\u00a0<\/p>\n\n\n\n\n
\n

Aula 05<\/b><\/span><\/p>\n<\/td>\n

\n

Links<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

Esta aula tem por objetivo explorar as tags para inser\u00e7\u00e3o de links em p\u00e1ginas HTML. Tags para cria\u00e7\u00e3o e formata\u00e7\u00e3o de links, links para arquivos, links para sites externos.<\/span><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u00a0<\/p>\n\n\n\n\n\n\n\n
\n

Atividade\u00a0<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

1<\/span><\/p>\n<\/td>\n

\n

Links:<\/span><\/p>\n

    \n
  • Href<\/span><\/li>\n
  • Atributos de A<\/span><\/li>\n
  • Especificar links<\/span><\/li>\n
  • Link especial<\/span><\/li>\n<\/ul>\n<\/td>\n<\/tr>\n
\n

Link do material:<\/b><\/span><\/p>\n

Aula<\/a>
<\/span><\/p>\n

Exemplo<\/a><\/span>

<\/p>\n<\/td>\n<\/tr>\n

\n

Modelo:<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

CR\u00c9DITOS: <\/b>
<\/span>Tutorial com comandos das tags de marca\u00e7\u00e3o da linguagem HTML<\/b>. TCDF \u2013 Tribunal de contas do Distrito Federal. Dispon\u00edvel em: Comandos HTML <\/a><\/span><\/span><\/p>\n
\n

Adaptado pelo autor<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u00a0<\/p>\n

\n

\u00a0<\/p>\n\n\n\n\n
\n

Aula 06<\/b><\/span><\/p>\n<\/td>\n

\n

Tabelas<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

Esta aula tem por objetivo organizar e distribuir informa\u00e7\u00f5es com o uso de tabelas, atrav\u00e9s de tags para adi\u00e7\u00e3o de linhas e colunas, formata\u00e7\u00e3o de c\u00e9lulas e inser\u00e7\u00e3o de imagens.<\/span><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u00a0<\/p>\n\n\n\n\n\n\n\n
\n

Atividade\u00a0<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

1<\/span><\/p>\n<\/td>\n

\n

Tabelas:<\/span><\/p>\n

    \n
  • Linha<\/span><\/li>\n
  • Coluna<\/span><\/li>\n
  • C\u00e9lulas<\/span><\/li>\n
  • Imagens<\/span><\/li>\n<\/ul>\n<\/td>\n<\/tr>\n
\n

Link do material:<\/b><\/span><\/p>\n

Aula<\/a>
<\/span><\/p>\n

Exemplo<\/a><\/span>

<\/p>\n<\/td>\n<\/tr>\n

\n

Modelo:<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

CR\u00c9DITOS: <\/b>
<\/span>Tutorial com comandos das tags de marca\u00e7\u00e3o da linguagem HTML<\/b>. TCDF \u2013 Tribunal de contas do Distrito Federal. Dispon\u00edvel em: Comandos HTML <\/a><\/span><\/span><\/p>\n
\n

Adaptado pelo autor<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u00a0<\/p>\n

\n

\u00a0<\/p>\n\n\n\n\n
\n

Aula 07<\/b><\/span><\/p>\n<\/td>\n

\n

Desafio: Elabora\u00e7\u00e3o de p\u00e1gina na internet<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

Esta aula tem por objetivo desafiar os alunos do curso para que elaborem uma p\u00e1gina na internet utilizando todos os recursos apresentados em sala de aula. Uma p\u00e1gina pronta \u00e9 apresentada para que tomem como base para a cria\u00e7\u00e3o da p\u00e1gina com o tema livre.<\/span><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u00a0<\/p>\n\n\n\n\n\n\n\n
\n

Atividade\u00a0<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

1<\/span><\/p>\n<\/td>\n

\n

Elabora\u00e7\u00e3o de p\u00e1gina na internet<\/span><\/p>\n

    \n
  • Texto<\/span><\/li>\n
  • Fonte<\/span><\/li>\n
  • Alinhamento<\/span><\/li>\n
  • Par\u00e1grafo<\/span><\/li>\n
  • It\u00e1lico, negrito, sublinhado<\/span><\/li>\n
  • Imagens<\/span><\/li>\n
  • Links<\/span><\/li>\n
  • Tabelas<\/span><\/li>\n<\/ul>\n<\/td>\n<\/tr>\n
\n

Link do material:<\/b><\/span><\/p>\n

Aula<\/a>
<\/span><\/p>\n

Exemplo<\/a><\/span>

<\/p>\n<\/td>\n<\/tr>\n

\n

Modelo:<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

CR\u00c9DITOS: <\/b>
<\/span>Tutorial com comandos das tags de marca\u00e7\u00e3o da linguagem HTML<\/b>. TCDF \u2013 Tribunal de contas do Distrito Federal. Dispon\u00edvel em: Comandos HTML <\/a><\/span><\/span><\/p>\n

Adaptado pelo autor<\/b><\/span><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\u00a0<\/p>\n","protected":false},"excerpt":{"rendered":"

Adapta\u00e7\u00e3o do material:\u00a0 Silvia Roberta de Jesus Garcia (Mestranda – ACT) \u00a0 Aula 01 Internet \/ HTML (P\u00e1ginas \/ Sites) Antes de come\u00e7ar a trabalhar com HTML, esta aula tem por objetivo apresentar os termos b\u00e1sicos que envolvem o HTML – Linguagem de Marca\u00e7\u00e3o de Texto. \u00a0 Atividade\u00a0 1 Internet – World Wide Web 2 […]<\/p>\n","protected":false},"author":42,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":"","_links_to":"","_links_to_target":""},"class_list":["post-1276","page","type-page","status-publish","hentry"],"wps_subtitle":"","_links":{"self":[{"href":"https:\/\/liag.ft.unicamp.br\/computacaocriativa\/wp-json\/wp\/v2\/pages\/1276","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/liag.ft.unicamp.br\/computacaocriativa\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/liag.ft.unicamp.br\/computacaocriativa\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/liag.ft.unicamp.br\/computacaocriativa\/wp-json\/wp\/v2\/users\/42"}],"replies":[{"embeddable":true,"href":"https:\/\/liag.ft.unicamp.br\/computacaocriativa\/wp-json\/wp\/v2\/comments?post=1276"}],"version-history":[{"count":18,"href":"https:\/\/liag.ft.unicamp.br\/computacaocriativa\/wp-json\/wp\/v2\/pages\/1276\/revisions"}],"predecessor-version":[{"id":1354,"href":"https:\/\/liag.ft.unicamp.br\/computacaocriativa\/wp-json\/wp\/v2\/pages\/1276\/revisions\/1354"}],"wp:attachment":[{"href":"https:\/\/liag.ft.unicamp.br\/computacaocriativa\/wp-json\/wp\/v2\/media?parent=1276"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}