O documento introduz o CSS no webdesign, discutindo como ele separa conteúdo, estilo e comportamento, tornando a programação mais organizada e os sites mais acessíveis, rápidos e fáceis de manter. Também explica brevemente como usar seletores de ID, classe e elemento, além de definir cores e fontes no CSS.
6. SEM PADRÕES
✗ Extensão da Mídia Impressa
✗ Layout baseado em Tabelas
✗ Conteúdo, Apresentação e
Comportamento “aninhados”
✗ Código Incompreensível
7. COM PADRÕES
✔ Acessível de qualquer
dispositivo
✔ Layout baseado em CSS
✔ Separação entre
Conteúdo, Apresentação e
Comportamento
✔ Código Acessível
8. VANTAGENS
Carregamento mais rápido
Menores custos com hospedagem
Melhor Consistência Visual
Redesign mais barato e eficiente
Melhores resultados nos
Mecanismos de Buscas
Maior acessibilidade
20. NA PRÁTICA:
Abre e feche os comandos corretamente!
Errado:
<div><p>Aqui um <em>texto!</p></em></div>
Correto:
<div><p>Aqui um <em>texto! </em></p></div>
27. Em web design, um
wireframe ou diagrama
de wireframe é uma
representação visual em
escala de cinza da
estrutura e
funcionalidade de uma
única página web ou uma
tela de aplicativo móvel.
28. Wireframes são usados no
início do processo de
desenvolvimento para
estabelecer a estrutura básica
de uma página antes de
acrescentar o design visual e
conteúdo, e podem ser
criados usando papel, em
HTML/CSS ou usando
aplicativos de software.
29. Wireframes substituem
o caráter abstrato do
mapa do site, que
normalmente é o
primeiro passo para o
desenvolvimento de
sites, com algo mais
tangível e
compreensível.