Primeiro modulo do curso: Guia do Planejamento do Curso de WebDesign, cronograma instrucional. 01)Planejamento e desenvolvimento de projetos • • • • • • • • • • • • • • • • • • • •
Visão Geral do Designer e da Web O que é Webdesigner , Caminhos para a Criação na Web e Padrões da Web Design com usabilidade Design com Contraste, Cores, Tipologia e Classificação de Tipos. Definindo Navegabilidade e Atingindo o Público Alvo Criando uma identidade Simplicidade, Prioridades no Conteúdo e Prevendo Expansão Background , Página de Abertura , Tamanho dos elementos Distribuição de conteúdo, Senso Crítico, Camadas, Aproveitando o Cache Links Alternativos, Otimizando Gráficos, Teste Prático e Identificação Disponibilize uma forma de orientação, Diferenciando Links e Textos sem monotonia Páginas para qualquer resolução, Ajustando Margens. Determinando Objetivos Escolhendo Público – Alvo Compatibilidade entre Navegadores Organizando a Estrutura do Site Classifique o Site em Categorias Decidindo o Armazenamento de Imagens e Arquivos de Som Como Criar a Aparência do Site Criando Layout Projetando a Navegação Como planejar e reunir as propriedades.
02) Planejamento e desenvolvimento de projetos Construindo Layout de Páginas • • • • • • • • • • • •
A visualização padrão Inserindo uma tabela Modificando uma tabela Mesclando e Dividindo Células Alterando a altura da linha e largura da coluna Adicionando cor a uma tabela Adicionando cor a borda de uma tabela Tabelas com largura relativa Desenhando tabelas na visualização de layout Adicionando células múltiplas Movendo e redimensionando células de layout Adicionando cor a uma tabela de layout Definir uma largura relativa para uma tabela de layout
Segundo modulo do curso: HTML, cronograma instrucional. 01)Introdução ao HTML A visualização padrão Mesclando e Dividindo Células Adicionando cor a borda de uma tabela Adicionando células múltiplas
Inserindo uma tabela Alterando a altura da linha e largura da coluna Tabelas com largura relativa Movendo e redimensionando células de layout
Modificando uma tabela Adicionando cor a uma tabela Desenhando tabelas na visualização de layout Adicionando cor a uma tabela de layout
Definir uma largura relativa para uma tabela de layout
02)Elementos do HTML Elementos Básicos Introdução Atributos gerais de um documento
Tags HTML
Formatando uma página
</H1 | H2 | H3 | H4 | H5 |H6>
<CENTER>...</CENTER> <HR atributos>
<H1 | H2 | H3 | H4 | H5 |H6 atributos> <P atributos> Listas de Definição
Listas Não-ordenadas
Listas Ordenadas
Formatando Textos
Blocos de texto
<PRE> ... </PRE>
<BLOCKQUOTE> ... </BLOCKQUOTE>
<ADDRESS> … </ADDRESS>
Frases
Tag <META>
Estrutura básica de uma página Atributos da Tag <BODY>
</P> <BR>
03) Estilos Estilos Lógicos Mas porque usar esse tipo de formatação? Hyperlinks Caminhos Relativos Imagens O atributo ALIGN Os Atributos WIDTH e
Estilos Físicos Fontes de Cores
Caracteres Especiais A Tag <FONT>
Caminhos de documentos Criando links para seções no documento Inserindo imagens em documentos HTML O atributo ALT Os atributos HSPACE e
Caminhos Absolutos Especificando um destino Atributos da Tag <IMG> O Atributo BORDER Atributo LOWSRC
HEIGHT
VSPACE
Tabelas O atributo ALIGN O atributo BORDER O atributo CELLSPACING
A Tag <TABLE> O atributo BACKGROUND O atributo BORDERCOLOR Os atributos COLS e ROWS
Criando Tabelas
Mesclando linhas e colunas
Ajustando o Alinhamento
Definindo largura e altura
Atributos da Tag <TABLE O atributo BGCOLOR O atributo CELLPPADING Os atributos WIDTH e HEIGHT Ajustando o espaçamento de células
04) Estrutura Trabalhando com Molduras (FRAMES) Atributos da Tag <FRAMESET> A Tag <FRAME> Mesclando as Tags <FRAMESETS> Os campos de entrada Caixa de seleção (Checkbox) Áreas de texto (textarea) Menus POP-UP Sobre as folhas de estilo em cascata
Estrutura básica – Frame Document Atributo ROWS
A Tag <FRAMESET>
Os atributos da Tag <FRAME> Criando links com destino em Frames Campos de texto Botões de Opção (Radiobutton) Listas e Menus (SELECT) Criando um formulário de Cadastramento Benefícios
A Tag <NOFRAME>
Aplicando estilos a documentos Unidades de Medida Propriedades e Valores
Precedência
Atributo COLS
Formulários Campos de senha Botões de Ação Listas de Opções Folhas de Estilos em Cascata
05) CSS Limitações Trabalhando com CSS Especificando um estilo Propriedades e Valores de Estilos para textos Propriedades e Valores de Estilos para Listas Propriedades e Valores de Estilos para Impressão
Propriedades e Valores de Estilos para Background e cores Propriedades e Valores de Estilos para Propriedades e Valores de Estilos para Criação de Filtros
Herança Propriedades e Valores de Estilos para fontes Propriedades e Valores de Estilos para Caixas Posicionamento Glossário
Terceiro modulo do curso: Introdução ao JavaScript Noções Básicas
O que é JavaScript ?
Onde os textos JavaScript podem ser executados ?
Considerações iniciais
Qual a diferença entre JavaScript e Java ?
Quarto modulo do curso: Adobe Dreamweaver Introdução Exibindo e Ocultando Painéis Comuns Molduras Invisíveis Inspetor de Propriedades Organizando a Estrutura do Site Criando um Novo Site
Área de Trabalho Barra de Ferramentas Caracteres (Frames) Especial O Painel Histórico Planejando o Design do Site
Janela do Documento O Painel Objetos Formulários Cabeçalhos Visualização e Layout Trabalhando com Cores Planejando a Navegação
Editando um site Existente
Usando os controles da janela site Servidor Remoto
Trabalhando com Arquivos
Removendo um site da lista de sites Conhecendo a Janela Site Janela do Site
Fazendo Upload e Download de Arquivos Configurando as Propriedades Réguas Criando Tabelas Formatando Linhas, Colunas e Células Criando Listas Inserindo uma imagem Testando um Rollover Gerenciando Links Criando Camadas Mudando a ordem das camadas Criando um formulário Criando Caixa de seleção e botões de opção Criando Botões
Associando um servidor remoto Sincronizando Arquivos
Conectando o Site
Selecionando Elementos
Trabalhando com Guias Visuais Grade Formatando Tabelas e células Inserindo Caracteres Especiais
Imagem de Rastreamento Selecionando Elementos de uma tabela Adicionando e removendo linhas e colunas Inserindo Datas Ajustando as propriedades de um texto Trabalhando com Mapas de Imagens Criando Links Links Rompidos, Externos e Arquivos Ófãos Manipulando Camadas
Criando, Abrindo e Salvando
Inserindo Réguas Horizontais Criando Imagem cambiável Criando um Link de E-mail
Tabelas e Camadas
Ajustando as Propriedades das Camadas Objetos de Formulários
Criando campos de texto Inserindo botão de opção
Criando campos ocultos Criando listas e menus
Criando Botões com imagens
Quinto modulo do curso: Adobe Fireworks Gráficos Vetoriais e Bitmap Criando um documento
Gráficos Vetoriais Abrindo um arquivo
Inserção de objetos Salvando um arquivo
Arrastando Objetos Utilizando o painel Ferramentas Seleção de uma ferramenta
Utilizando o Inspetor de Propriedades Organizando os painéis
Utilizando o Menu Opções do Painel
Gráficos Bitmap Abrindo um documento fechado recentemente Colando no Fireworks Alterando uma opção de ferramenta Utilizando os painéis Botão Exportação Rápida
Barra de ferramentas Modos de Exibição da Área de Trabalho Utilizando Guias Informações de seleção Criando Moldura de Seleção Movendo uma Moldura
Navegando entre documentos Utilizando réguas, guias e a grade Utilizando as Grades
Zoom e giro
Modificando a seleção Removendo a Seleção de Moldura Ajustando a Seleção
Seleção de um pixel Ajustando Molduras
Utilizando a Régua Selecionando um objeto
Transferindo a seleção de moldura Transferindo Objetos Empilhando objetos
Inserindo Bitmap Organizando um objeto Alinhando Objetos
Criando uma seleção de pixel inversa Editando Objetos Selecionados Agrupando um objeto Criando um Objeto Bitmap
Desenhando um Objeto Bitmap Apagando um objeto
Pintando um objeto Bitmap
Amostragem de cor
Enevoamento de seleção de pixels Embaçando uma imagem Convertendo imagem em transparência Formas Básicas
Retocando um bitmap
Desenhando retângulos com cantos arredondados Desenhando Traçados de Forma Livre Desenhando um Traçado Curvo Editando um traçado
Desenhando Polígonos
Operações de Traçados
Combinando um objeto de traçado Cortando um traçado
Embaçando e Aguçando Efeito localizar bordas Desenhando Objetos Vetoriais Retângulos e Elipses Desenhando Estrelas Desenhando um Seguimento de traçado reto Inserindo e Excluindo um ponto em um traçado Redesenhando um traçado Criando objetos a partir de interseção Digitando um texto Utilizando um bloco de texto
Removendo Partes de um objeto Criando um bloco de texto Editando o texto
Aplicando cor ao texto Configurando Entrelinhas Configurando o Recuo do texto Aplicando Traços, Preenchimentos e efeitos Convertendo texto em traçado Preenchimento sólido
Aplicando cor a todo o texto Orientação do Texto Espaçamento de Parágrafo
Preenchimento padrão
Padrão Personalizado
Adicionando Textura
Adicionando Textura a um traço Aplicando efeitos ao vivo
Adicionando uma textura personalizada Aplicando relevo Reordenando efeitos ao vivo
Anexando texto ao traçado Verificando a Ortografia Preenchimento degradé
Aplicando sombras e brilhos Removendo efeitos ao vivo
Aguçando uma imagem
Desenhando Linhas
Desenhando Traçados por plotagem de pontos Convertendo Segmentos Distorcendo um traçado
Movendo um bloco de texto Alterando Fonte, tamanho e estilo Configurando o Kerning Alinhamento de Texto Suavizando bordas do texto Alterando a Orientação e Direção Trabalhando com preenchimentos Editando um preenchimento degradé Transformando e distorcendo um preenchimento Adicionando Textura a um preenchimento Aplicando bordas chanfradas Editando efeitos ao vivo Personalizando efeitos ao vivo
Como trabalhar com camada
Ativando uma camada
Exibindo Camadas Tipos de Máscaras Criando Máscaras Mistura de Transparência
Organizando Camadas Máscaras Vetoriais Comando colar como mascara Modos de Mistura
Criando e Editando Fatias
Criando Objetos de Fatia
Visualizando Fatias Inserindo interatividade simples a fatias Removendo um rollover
Editando Fatias Rollovers
Criando símbolo de botão Criando um botão com três ou quatro estados Criando Menus Pop-up Criando submenus Configurando a guia de posição Construindo animações Fazendo um símbolo “caminhar Mostrando e Ocultando Molduras para a Reprodução Otimizando uma animação Visualizando a Exportação Removendo cores não usadas Embaçando ou aguçando um detalhe Usando o botão de Exportação Rápida
Trabalhando com Pontos Ativos Os estados do Botão Efeitos de chanfro em estados de botões Editor de menu pop-up Aparência do menu Pop-up Trabalhando com Símbolos Alterando Propriedades de animação Trabalhando com Molduras Adicionar, Copiar e Excluir Molduras Definindo Transparência
Inserindo e Removendo camadas Mascaramento de imagens Máscaras Bitmaps Comando Colar em Ajustando a Opacidade e a Aplicação Criando Fatias Não – retangulares Movimentando guias de fatias Criando um rollover simples Criando Mapas de Imagem Criando um botão simples Criando Barra de Navegação Criando Menu Pop-up Básico Configurando a Guia Avançada Criando um símbolo de animação Removendo uma animação Configurando o retardo de uma moldura Visualizando uma animação
Otimizando GIF, PNG, TIEF, BMP e PICT Otimizando um JPEG
Usando o Assistente de Exportação Configurando a intensidade da cor Ajustando a Qualidade
Exportando uma imagem simples
Exportando moldura ou camada
Sexto modulo do curso: Adobe Flash Introdução Animações interativas Bitmap Palco Filmes
Arte Gráfica Gráficos vetoriais e bitmaps Área de Trabalho Biblioteca Visualizando
Teste Usando Painéis Linha de Tempo Trabalhando com Pastas Atualizando itens importados Movendo o Palco Sobreposição de Formas Desenhando com a caneta Ferramenta Ajustando traço e preenchimento Balde de tinta O Painel Misturador Sobre Bitmaps
Salvando Usando a barra indicadora Sobre as Cenas Editando itens da Biblioteca Visualizando o Palco Ferramentas Desenhando com Lápis Desenhando linhas retas Apagador Caixa de Ferramentas
Editando Bitmaps Sons em filmes Compactação para Exportação de som Seleção de Objetos Movendo, Copiando e Excluindo Girando Ponto de Registro Edição de Camadas Propriedades da Camada Ajustando o Texto
Deslocamento da linha base, controle e espaçamento entre letras. Transformando Texto Comportamentos Instâncias Edição de símbolos Substituindo Instâncias
Tinteiro Tipos de Arquivo Convertendo para gráfico vetorial Ajustando Propriedades Sons em botões
Sombreador Arquivos do Illustrator Desmembrando um Bitmap
A Ferramenta Laço
Importação Reproduzindo e Parando Som Agrupamento
Excluindo objetos no Flash
Dimensionando
Invertendo Criação de Camadas Camada Guia Fontes de Dispositivos e incorporada Definindo tamanho, estilo, cor e fonte
Inclinação Exibindo Camadas Camada de Máscara Criando Texto no Flash
Sobre fontes de entrada e dinâmicas Caixa de texto dinâmica Modificando a Forma de um Texto Criando Símbolos Criando Botões
Camadas de Animação Animação Interpolada
Propriedades de Instâncias Alterando o comportamento de uma instância Informações sobre instâncias no Palco Quadros chave Taxa de Quadros Criando uma animação
Interpolação de forma Edição
Sobre referência de Forma Movendo uma animação
Desmembrando instâncias
Animação Vetor Linha do Tempo Painéis Visualizando no ambiente de trabalho Caixa de Ferramentas Usando menu de contexto Trabalhando com Bibliotecas Localizando itens não usados Aplicando Zoom Formas Formas Básicas A Ferramenta Pincel Modificando Formas Painel Preenchimento
Alinhamento, Recuos, Espaçamento entre linhas e margens Caixa de texto de Entrada
Criando Links com blocos de texto Duplicando símbolos Editando, testando e Ativando Botões Cor e Transparências Definindo animação em instâncias Gráficas Diferenciando Animações na linha do tempo Imagens Estáticas Utilizando guias de movimento Animação Quadro-a-quadro
ActionScript Sobre o modo especialista Atribuições de ações para quadros Parando a Reprodução de Todos os Sons Utilizando ações para carregar e descarregar filmes Dicas de Otimização de Filmes do Flash Publicando filmes no formato Flash Player Visualizando as Configurações de uma publicação
Painel Ações Atribuições de ações para objetos Navegando e Interagindo com Ações Básicas Saltando para uma URL diferente Controlando Clipes de Filmes
Edição no Modo Normal Eventos do mouse
Calculando o tempo de download Publicando HMTL necessário para Exibição de Arquivos do Flash Visualizando um filme no Exibidor independente
Publicação
Indo para um quadro ou cena de um filme Controlando o Flash Player Verificando o carregamento de quadros específicos
Player em páginas web
Preeencha os campos abaixo com conteudos programáticos e exercicios aplicados nos laboratórios
Curso de
Duração:
aulas (duração de hora cada aula)
Curso: Aulas 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24
Objetivos
Conteúdo
Exercícios
Obs: Seguir a risca todo processo do material oferecido ao aluno, trabalhar sempre embasado no conteudo do livro mas dando diversas explicações durante o treinamento bem como sites antigos que podem ser mostrados na web utilizando o site http://www.archive.org e mostrando a evolução dos sites ao longo do tempo e como hoje é desenvolvido, dizendo que o foco das empresas não é apenas em ter um site na web, mas sim vender seu produto, buscar lucratividade com a web.