O documento discute a contextualização da Web 2.0, focada no usuário e na experiência colaborativa entre os usuários. Também aborda a separação de conteúdo e forma com XHTML e CSS, respectivamente, incluindo vantagens como maleabilidade e acessibilidade. Por fim, fornece exemplos de tags XHTML e propriedades CSS.

1. XHTML/CSS Ana Laura Gomes

2. Contextualização WEB 2.0

3. Contextualização WEB 2.0 - Web como plataforma

4. Contextualização WEB 2.0 - mais colaborativa

5. Contextualização WEB 2.0 – experiência mais rica para os usuários

6. Contextualização WEB 2.0 – experiência mais rica entre os usuários

7. Contextualização WEB 2.0 – foco no usuário

8. Contextualização Usuário

9. Contextualização Usuário - Acessibilidade

10. Contextualização Usuário - Portabilidade

11. Contextualização Usuário - Flexibilidade

12. Contextualização Usuário Usabilidade - norma ISO 9241-11 A capacidade que um sistema interativo oferece a seu usuário, em um determinado contexto de operação , para a realização de tarefas , de maneira eficaz , eficiente e agradável .

13. Contextualização E mais...

14. Contextualização E mais... Web semântica Preparação para o XML Mudanças no Dreamweaver 8 Outras plataformas de criação e gerenciamento de sites (mambo, joomla, drupal, moodle, blogs etc.)

15. Aplicação XHTML / CSS

16. Aplicação XHTML / CSS Para que parte destes objetivos seja alcançada, a primeira medida é separar o conteúdo da forma. Conteúdo (parte editorial) – XHTML Forma (design) – CSS

17. Aplicação XHTML / CSS conteúdo e forma definidos em código Rapidez no acesso (+- 56% de redução no tamanho final do arquivo) Maleabilidade Facilidade na manutenção Regras relacionadas à Navegabilidade / Acessibilidade Boa experiência para o usuário Benefícios econômicos e prazerosos

18. Aplicação XHTML - teoria O que são tags Estrutura básica da página html, head, title, body Diferença HTML/XHTML Regras do XHTML: DTD, boa formatação do código etc. Sites para estudar www.w3.org/ www.w3schools.com/ www.cgi.br www.nic.br

19. Aplicação XHTML - tags parágrafo, quebra de linha, títulos, negrito e itálico régua, comentário, imagem, listas (ordenada, não ordenada, definição), links (horizontal, vertical, email, site, download) tabelas e formulários frames, iframes e tags em desuso

20. Aplicação CSS – teoria O que é Como funciona Vantagens

21. Aplicação CSS – css zen garden

22. Aplicação CSS – declarações seletor tag, class, id declarações comentários, texto (text e font), cor background, margem, padding, borda, lista, link dimensionamento e posicionamento estilo interno, externo e inline herança de estilos aplicações práticas (formatar tabela, formulário, interface)

23. Dúvidas ? Contextualização Web2.0, usuário, e mais Aplicação XHTML, CSS [email_address]

24. Lista de sites www.microsoft.com/windowsvista/ docs.google.com www.blogger.com www.pageflakes.com www.havaianas.com.br delicious.com www.wikipedia.org www.flickr.com www.google.com/webhp?hl=en&complete=1 www.w3schools.com/xml/default.asp www.adobe.com/products/dreamweaver www.mamboserver.com www.joomlabrasil.org drupal.org moodle.com www.w3.org/ www.w3schools.com/ www.cgi.br www.nic.br www.csszengarden.com/tr/portuguese http://www.tiny.cc/pVkSH