Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/pedroeuzebiojs/dw1-tii-ifce

Repositório da disciplina de Desenvolvimento Web 1 do curso Técnico em Informática para Internet do IFCE.
https://github.com/pedroeuzebiojs/dw1-tii-ifce

css css-animations css-flexbox css-flexbox-grid-layout css-flexbox-layout css-framework css-grid css-grid-layout css3 desenvolvimento-front-end desenvolvimento-web front-end-development html html-css html-semantico html5 html5-css3 programacao-web web-development web-programming

Last synced: about 1 month ago
JSON representation

Repositório da disciplina de Desenvolvimento Web 1 do curso Técnico em Informática para Internet do IFCE.

Awesome Lists containing this project

README 

        


  Desenvolvimento Web 1




- [Sobre a disciplina](#sobre-a-disciplina)

- [Unidade 1 – Introdução a Web e Tópicos de Design](#unidade-1--introdução-a-web-e-tópicos-de-design)

- [Unidade 2 – Construção do Design de Páginas Web com Figma](#unidade-2--construção-do-design-de-páginas-web-com-figma)

- [Unidade 3 - Introdução ao HTML e GitHub](#unidade-3---introdução-ao-html-e-github)

- [Unidade 4 – Sintaxe do HTML](#unidade-4--sintaxe-do-html)

- [Unidade 5 – Layouts HTML e Introdução ao CSS](#unidade-5--layouts-html-e-introdução-ao-css)

- [Unidade 6 – Definição do Design de Páginas Web com CSS](#unidade-6--definição-do-design-de-páginas-web-com-css)

- [Unidade 7 – Responsividade de Páginas Web com CSS](#unidade-7--responsividade-de-páginas-web-com-css)

- [Unidade 8 – Frameworks CSS](#unidade-8--frameworks-css)



![Banner da disciplina de Desenvolvimento Web 1 do curso Técnico em Informática para Internet do Instituto Federal de Educação, Ciência e Tecnologia do Ceará (IFCE).](./.github/banner.jpg)



## Sobre a disciplina



Nesta disciplina, iniciaremos nossa jornada no mundo do desenvolvimento web. Conheceremos o ambiente da Internet, veremos noções de design e aplicaremos esses conceitos na prática utilizando HTML e CSS.



## Unidade 1 – Introdução a Web e Tópicos de Design



Nesta unidade, vamos fazer uma introdução às tecnologias Web e descrever os principais conceitos aplicados ao Design de Interface de Usuário.



**Conteúdo:**



- Introdução à Internet e World Wide Web (WWW)

  - O Ambiente Web: Histórico da Internet e Web

  - Conceitos Básicos da Arquitetura Cliente-Servidor

  - Serviços da Internet

- Design de Interface de Usuário

  - Princípios de IHC

  - Princípios de Diagramação

  - Princípios e elementos da UX

  - Requisitos de usabilidade



## Unidade 2 – Construção do Design de Páginas Web com Figma



Nesta unidade, vamos finalizar os conceitos de design e aprender a construir o layout de uma página web com o Figma.



**Conteúdo:**



- Design de Interface de Usuário

  - Acessibilidade na Web

  - Padrões de interação e navegação na Web

  - Layout e composição

  - Avaliação de usabilidade

- Construção de Layout com Figma

  - Página Inicial

  - Página Interna

  - Formulários



## Unidade 3 - Introdução ao HTML e GitHub



Nesta unidade, vamos fazer uma introdução a páginas web estáticas e principais linguagens: HTML, CSS e Javascript. Aprenderemos a sintaxe básica do HTML e seus principais elementos. Também faremos uma breve introdução a sistemas de controle de versões e como armazenar e publicar nossas páginas web estáticas no Github.



**Conteúdo:**



- Introdução ao HTML

  - Sintaxe básica do HTML

  - Elementos de Texto, Imagens e Links

  - Prática das tags em ferramenta online de edição

  - Tags semânticas

  - Instalação de uma ambiente de Desenvolvimento Local

- Uso do Github

  - Criar repositório

  - Enviar os arquivos

  - Ligar Github pages



## Unidade 4 – Sintaxe do HTML



Nesta unidade, vamos continuar o estudo da linguagem HTML, discutindo as melhores práticas e a criação de formulários e tabelas.



**Conteúdo:**



- Sintaxe da Linguagem HTML:

  - Boas práticas

  - Formulários

  - Tabelas



## Unidade 5 – Layouts HTML e Introdução ao CSS



Nesta unidade vamos aprender a construção de layouts HTML com Iframe e fazer uma introdução à sintaxe básica do CSS e seus principais elementos.



**Conteúdo:**



- Boas práticas de construção de layout com HTML

- Introdução ao CSS

  - Sintaxe básica

  - Incorporação ao HTML (inline, interno, externo)

  - Cores e Background

  - Tipografia

  - Borda

  - Margem

  - Padding



## Unidade 6 – Definição do Design de Páginas Web com CSS



Nesta unidade vamos continuar aprendendo as tags de estilo do CSS.



**Conteúdo:**



- Posicionamento

- Flex

- Grid



## Unidade 7 – Responsividade de Páginas Web com CSS



Na unidade 5, você aprendeu o básico sobre CSS, que possibilitou a descrição do visual do seu site. Na unidade 6, você aprendeu a posicionar os elementos lado a lado, ocupando mais espaço, ideal para telas maiores, como a de um computador. Nesta unidade, aprenderemos técnicas para tornar o visual do seu site responsivo, ou seja, que ele seja fácil de ler e usar em qualquer tamanho de tela.



**Conteúdo:**



- Desenvolvimento de projeto com responsividade

- Media Queries



## Unidade 8 – Frameworks CSS



Durante essa jornada você aprendeu como a Internet funciona, viu noções de design e criou suas primeiras páginas web estáticas, usando HTML e CSS.



Nesta unidade, vamos conhecer alguns frameworks CSS, criados para agilizar e padronizar o desenvolvimento web. Discutiremos as vantagens e desvantagens de frameworks como Bootstrap, Tailwind e Open Props.