Curso de Web

Curso de web 010: Organizando os arquivos de seus projetos

3

Um projeto com uma estrutura organizada poupa mais de 80% do seu tempo e trabalho. Veremos nesta 10º aula do curso de web como tirar aproveito desse ambiente e como usá-lo na prático em um projeto web.

Muitas pessoas, principalmente quem está começando a estudar neste curso de web, não utiliza um padrão na estrutura de seu trabalho e isso como foi dito, dificulta muito a criação e a modificação no projeto.

Para começar, tenhamos em mente que o objetivo principal da organização de dados é separar os tipos de arquivos. Falando tecnicamente, nosso projeto deverá ter uma pasta para o css, outra para o javascript, uma para as classes php e outras ainda para as imagens. Utilizamos este tipo de organização para qualquer tipo de arquivo.

Quando você usa um framework, provavelmente segue um padrão. Falando dos frameworks mais conhecidos, todos utilizam o padrão MVC, mas isso falaremos em outro post referente ao Curso de Web. :)

Vejamos como ficará nossa estrutura na prática.

Iremos precisar obviamente de uma pasta para guardar as imagens do projeto, portanto vamos criar agora uma pasta para a imagem que irá se chamar ‘img’. Simples não?

… [Diretório]
img/
index.php

Pasta IMG
Nesta pasta poderemos criar subpastas como por exemplo: usuários, layout, noticias, paginas, banners e etc.

Vou descrever como seria cada pasta citada acima.

  • usuarios: Nesta pasta ficará armazenado as imagens dos usuários que fazem upload em seus perfis.
  • layout: Nesta pasta terá somente imagens usadas no layout do site como: logo, menu, rodapé e etc.
  • noticias: Aqui iremos colocar imagens de notícias.
  • paginas: Esta página irá receber imagens específicas de cada pagina (home, contato, quem somos), na mesma poderá ter subpastas para sua melhor organização.
  • banners: Aqui colocaremos os banners do site.

Agora precisamos guardar nossas folhas de estilo CSS. Crie uma pasta chamada ‘css’.
… [Diretório]
img/
css/
index.php

Na pasta CSS terá as nossas folhas de estilo, podemos agora ir para o próximo passo. ;)

Vamos criar agora uma pasta para guardar nossos arquivos Java Script. Crie uma pasta chamada ‘js’.

… [Diretório]
img/
css/
js/
index.php

Está ficando bom! Agora para você que trabalha com php ou outra linguagem de servidor(asp, jsp), crie uma pasta chamada de ‘class’.

… [Diretório]
img/
css/
js/
class/
index.php

Na pasta ‘class’ iremos colocar somente classes dinâmicas que nosso site utiliza.

Para quem trabalha com linguagem dinâmica(php, asp, jsp), crie uma pasta chamada ‘view’.

… [Diretório]
img/
css/
js/
class/
view/
index.php

Na pasta view iremos colocar as paginas interna do site, ou seja, a index que incluirá(include) as páginas pertencentes a view. A pasta view provavelmente terá subpastas.

Se você utilizar outros arquivos como videos, documentos, musicas. Basta criar as pastas com o nome correspondente.

Simples não é? Depois de um tempo isso se tornará um habito, muito produtivo por sinal.

OBS:
Para quem não trabalha com páginas dinâmica, usa-se as seguintes pastas:

… [Diretório]
img/
css/
js/
index.php

Chegamos ao fim de mais uma aula do Curso de Web.

Curso de web 009: CSS – Desenvolvendo um menu simples

9

Nesta vídeo aula estaremos desenvolvendo um menu em css. Trata-se de um menu vertical que quando passamos o mouse ele muda de cor. Vamos analisar alguns dos poderes do CSS.

Curso de web 009: CSS – Desenvolvendo um menu simples
Duração: 14:30
Tamanho: 24 mb
Extensão: wmv
Audio: Sim
Baixar agora

Curso de web 008: Css – Trabalhando com DIVs

5

Nesta video aula vamos ver como funciona as DIVs.

DIVs são elementos que eu gosto de chamar neutros ou conteiner, podemos modificar ele todo e usando para posicionar elementos em nossa pagina. Usamos as DIVs principalmente para substituir as tabelas, e além das divs serem mais leves, elas possibilitam maior controla da sua pagina e uma organização infinitamente maior.

Bem, preparei um video bem rápido, ultimamente não estou tendo tempo. :(

A pedidos, colocarei as video aulas para downloads.

Curso de web 008: Css – Trabalhando com DIVs
Duração: 14 minutos
Tamanho: 20 mb
Extensão: wmv
Baixar agora

Qualquer dúvida ou sugestão, poste aqui.
Até a próxima! ;)

Curso de Web 007: Dicas de CSS

0

Se você assistiu a ultima video aula já está apto a codificar CSS. Hehe
É simples, não tem mistério.

O que você precisa saber agora são os recursos(ou parâmetros) do CSS, é sobre isso que vamos falar aqui.

Há uma organização que controla um padrão universal de códigos na web, se chama W3C. Nela, você pode encontrar tudo sobre as linguagens de programação que ela defende. Vou disponibilizar para vocês um documento com todos seus recursos do CSS.

Não basta somente recursos, mas sim técnicas e essas não têm neste documento, mas fique tranqüilo(a), vou separar umas técnicas interessante e colocar aqui no blog.

Fique agora com o link com a documentação do CSS, está em inglês, se você não for muito bom em inglês, mas tiver uma noção já dá pra entender, a linguagem é simples.

Link: http://www.w3.org/TR/REC-CSS2/

Caso tenha alguma dúvida, comente aqui.

Curso de Web 006: Introdução ao CSS

16

Nesta vídeo aula vamos ter o primeiro contato com o CSS. Vamos ver como aplicar o css em uma pagina web.

Como esta video aula é bem extensa tive que dividi-la em duas partes.

Se quiser saber mais sobre CSS, veja esta pagina no wikipedia: http://pt.wikipedia.org/wiki/CSS

Parte 1
Duração: 8 minutos

Parte 2
Duração: 8 minutos

Ver aula 007

 

Curso de Web 005 – HTML: Trabalhando com Tabelas

0

Chegamos com mais uma video aula sobre HTML, dessa vez vamos trabalhar com tabelas.

Lembre-se de que para aprender a programar você precisa praticar muito, até se sentir confortavel em fazer tal tarefa.

Assim que terminar de assistir este vídeo, pratique muito HTML e teste diversas formas.
Na programação você aprende muito com erros cometidos, então é melhor você errar no treinamento do que em um projeto, pois assim perderia tempo e talvez não terminasse o mesmo dentro de seu prazo.

Tente fazer uma tabela com 5 colunas e 3 linhas, depois misture com as tags aprendidas nas aulas anterior.

Ver aula 006

Curso de Web 004 – HTML: Primeiros passos

1

Agora vamos estudar com VideoAulas! ;)

Vamos iniciar hoje nossa primeira Video Aula sobre HTML. Vamos usar diversas tags que aprendemos nas aulas anteriores e ver como se cria uma pagina em HTML.

Fiquem com o video

Veja a aula 005

HTML – Trabalhando com Tabelas

0

Quem nunca usou tabelas acha inicialmente um trabalho difícil, mas é muito simples, basta praticar bastante. Pensando bem, para você aprender qualquer coisa é necessário que você pratica muito.Deixo aí para vocês a video aula:

Go to Top