O documento discute técnicas para posicionar elementos em uma página web, incluindo posicionamento estático, uso de tabelas e definição de estilo com CSS. Apresenta exemplos de como posicionar uma bola em uma quadra de basquete usando cada técnica e explica propriedades CSS chave como top, left e z-index para posicionamento.
SEO - Melhorando o posicionamento do seu site nos mecanismos de buscasVictor Brunner
O documento discute o que é SEO (Otimização para Mecanismos de Busca), dividindo-o em fatores on-page e off-page. Também aborda técnicas como link building, conteúdo duplicado, black hat SEO e ferramentas para SEO.
O documento descreve conceitos básicos do ASP.NET, incluindo que ele é uma remodelação completa da tecnologia web da Microsoft, usa controles do lado servidor e programação orientada a eventos para criar páginas dinâmicas, e mantém o estado entre requisições para fornecer uma experiência mais semelhante a aplicativos desktop.
Este documento descreve um projeto para criar uma Academia de Jogos Matemáticos com um portal web. O projeto inclui uma sala para ensinar estratégias de jogos matemáticos a alunos e prepará-los para campeonatos, além de oficinas para pais e módulos de jogos no portal para registrar resultados.
O documento introduz as CSS (Cascading Style Sheets) e explica como definir estilos externamente, internamente e localmente. As CSS permitem separar o conteúdo do HTML da formatação e estilo através de seletores, propriedades e valores. São explicados os tipos de seletores como tag, ID e classe para aplicar estilos específicos.
O documento descreve os conceitos básicos de expressões regulares, incluindo seus metacaracteres e como eles são usados para procurar ou substituir strings. Os metacaracteres podem representar qualquer caractere, grupos de caracteres, repetições e âncoras de início e fim de string. Exemplos ilustram como cada metacaractere funciona.
O documento discute conceitos básicos de ASP.NET, incluindo ligação a bases de dados, data binding, e controles como Repeater, DataList, GridView, e DetailsView. Explica como configurar strings de ligação, acessar configurações, e usar esses controles para exibir dados de forma tabular ou lista.
Este documento discute conceitos básicos de web services usando .NET. Web services permitem a execução remota de procedimentos através de HTTP e XML. O documento descreve como criar um web service simples para ler e escrever registros de vendas de um banco de dados remoto.
O documento fornece uma introdução aos principais conceitos da linguagem C# e do framework .NET. Aborda tópicos como: introdução à .NET Framework e programação orientada a objetos em C#; arquitetura CLR e biblioteca de classes .NET; tipos de dados em C# e controlo de fluxo; arrays, herança e encapsulamento; e conceitos como construtores, métodos e sobrecarga.
SEO - Melhorando o posicionamento do seu site nos mecanismos de buscasVictor Brunner
O documento discute o que é SEO (Otimização para Mecanismos de Busca), dividindo-o em fatores on-page e off-page. Também aborda técnicas como link building, conteúdo duplicado, black hat SEO e ferramentas para SEO.
O documento descreve conceitos básicos do ASP.NET, incluindo que ele é uma remodelação completa da tecnologia web da Microsoft, usa controles do lado servidor e programação orientada a eventos para criar páginas dinâmicas, e mantém o estado entre requisições para fornecer uma experiência mais semelhante a aplicativos desktop.
Este documento descreve um projeto para criar uma Academia de Jogos Matemáticos com um portal web. O projeto inclui uma sala para ensinar estratégias de jogos matemáticos a alunos e prepará-los para campeonatos, além de oficinas para pais e módulos de jogos no portal para registrar resultados.
O documento introduz as CSS (Cascading Style Sheets) e explica como definir estilos externamente, internamente e localmente. As CSS permitem separar o conteúdo do HTML da formatação e estilo através de seletores, propriedades e valores. São explicados os tipos de seletores como tag, ID e classe para aplicar estilos específicos.
O documento descreve os conceitos básicos de expressões regulares, incluindo seus metacaracteres e como eles são usados para procurar ou substituir strings. Os metacaracteres podem representar qualquer caractere, grupos de caracteres, repetições e âncoras de início e fim de string. Exemplos ilustram como cada metacaractere funciona.
O documento discute conceitos básicos de ASP.NET, incluindo ligação a bases de dados, data binding, e controles como Repeater, DataList, GridView, e DetailsView. Explica como configurar strings de ligação, acessar configurações, e usar esses controles para exibir dados de forma tabular ou lista.
Este documento discute conceitos básicos de web services usando .NET. Web services permitem a execução remota de procedimentos através de HTTP e XML. O documento descreve como criar um web service simples para ler e escrever registros de vendas de um banco de dados remoto.
O documento fornece uma introdução aos principais conceitos da linguagem C# e do framework .NET. Aborda tópicos como: introdução à .NET Framework e programação orientada a objetos em C#; arquitetura CLR e biblioteca de classes .NET; tipos de dados em C# e controlo de fluxo; arrays, herança e encapsulamento; e conceitos como construtores, métodos e sobrecarga.
O documento introduz o conceito de tabelas em HTML, descrevendo sua estrutura básica com as tags <table>, <tr> e <td>, e seus atributos principais como align, valign e bgcolor para organizar e estilizar o conteúdo.
O documento explica o que é mapeamento de imagens, os tipos de zonas que podem ser criadas (circunferência, retângulo, polígono) e como criar um mapa em HTML especificando as zonas e vinculando o mapa a uma imagem.
O documento introduz os conceitos básicos de HTML, incluindo (1) sua definição como linguagem de marcação para formatar informações na web, (2) sua estrutura básica de tags como <tag>conteúdo</tag>, e (3) exemplos comuns de tags como <b> negrito </b> e <img> para imagens.
O documento discute os métodos GET e POST no protocolo HTTP, explicando que GET é usado para recuperar dados via URL enquanto POST envia dados através de um canal STDIN de forma mais segura, tipicamente usado em formulários.
O sistema LiveQuiz permite que os alunos respondam perguntas em tempo real para aumentar a motivação e incentivar o estudo de maneira descontraída, enquanto o administrador gerencia as perguntas e visualiza as respostas através de um projetor e servidor central. Futuras versões do LiveQuiz trarão novas funcionalidades como categorias de dificuldade, suporte a dispositivos móveis e edição offline de questionários.
O documento discute os conceitos básicos do ADO.NET, incluindo sua introdução como sucessor da tecnologia ADO da Microsoft, com foco em permitir acesso flexível e estável às bases de dados através de classes especializadas na .NET Framework. Também resume os tipos de acesso ligado e desligado, e discute classes e namespaces chave do ADO.NET como SqlConnection e SqlCommand.
O documento discute várias situações práticas para acesso a dados usando ADO.NET, incluindo conexão a bancos de dados, execução de comandos, acesso a dados "connected" e "disconnected", atualização de dados "disconnected" e uso de DataSets.
O documento introduz o conceito de tabelas em HTML, descrevendo sua estrutura básica com as tags <table>, <tr> e <td>, e seus atributos principais como align, valign e bgcolor para organizar e estilizar o conteúdo.
O documento explica o que é mapeamento de imagens, os tipos de zonas que podem ser criadas (circunferência, retângulo, polígono) e como criar um mapa em HTML especificando as zonas e vinculando o mapa a uma imagem.
O documento introduz os conceitos básicos de HTML, incluindo (1) sua definição como linguagem de marcação para formatar informações na web, (2) sua estrutura básica de tags como <tag>conteúdo</tag>, e (3) exemplos comuns de tags como <b> negrito </b> e <img> para imagens.
O documento discute os métodos GET e POST no protocolo HTTP, explicando que GET é usado para recuperar dados via URL enquanto POST envia dados através de um canal STDIN de forma mais segura, tipicamente usado em formulários.
O sistema LiveQuiz permite que os alunos respondam perguntas em tempo real para aumentar a motivação e incentivar o estudo de maneira descontraída, enquanto o administrador gerencia as perguntas e visualiza as respostas através de um projetor e servidor central. Futuras versões do LiveQuiz trarão novas funcionalidades como categorias de dificuldade, suporte a dispositivos móveis e edição offline de questionários.
O documento discute os conceitos básicos do ADO.NET, incluindo sua introdução como sucessor da tecnologia ADO da Microsoft, com foco em permitir acesso flexível e estável às bases de dados através de classes especializadas na .NET Framework. Também resume os tipos de acesso ligado e desligado, e discute classes e namespaces chave do ADO.NET como SqlConnection e SqlCommand.
O documento discute várias situações práticas para acesso a dados usando ADO.NET, incluindo conexão a bancos de dados, execução de comandos, acesso a dados "connected" e "disconnected", atualização de dados "disconnected" e uso de DataSets.
1. Concepção de Websites - Posicionamento de elementos na página - Hélder Oliveira
Concepção de Websites
Posicionamento de elementos na página
2. Concepção de Websites - Posicionamento de elementos na página - Hélder Oliveira
Como se posicionam os conteúdos na Web?
• De forma Estática
• Usando Tabelas (e
alinhamentos)
• Definindo o estilo de
cada elemento
3. Concepção de Websites - Posicionamento de elementos na página - Hélder Oliveira
“Onde está a bola?”
237
192
4. Concepção de Websites - Posicionamento de elementos na página - Hélder Oliveira
Como posicionar a bola?
• Tentativa 1 – Posicionamento estático
<img src="cr.png“/><img src="ball.png”/>
NÃO SATISFAZ!
5. Concepção de Websites - Posicionamento de elementos na página - Hélder Oliveira
Como posicionar a bola?
• Tentativa 2 – Tabela
237
192
<table background="cr.png" width="468" border="0"
cellspacing="0" cellpadding="0">
<tr>
<td width="237" height="192"> </td>
<td> </td>
</tr>
<tr>
<td width="237" height="192"> </td>
<td height="454" valign="top"><img src="ball.png"
width="102" height="101" /></td>
</tr>
</table>
6. Concepção de Websites - Posicionamento de elementos na página - Hélder Oliveira
Como posicionar a bola?
• Tentativa 3 – Definição de estilo (CSS)
237
192
<div style="width:468px; height:646px;
background-image:url(cr.png)">
<img style="position:absolute; top:192px;
left: 237px" src="ball.png"/>
</div>
7. Concepção de Websites - Posicionamento de elementos na página - Hélder Oliveira
Posicionamento por definição de estilo
• Propriedades essenciais:
– top
– left
– z-index
– position Posicionamento AbsolutoPosicionamento Relativo
Top (150px)
Left (200px )
1
2
3
<div style=“top:150px; left: 200px;”></div><div style=“top:50px; left: 240px; z-index: 1;”></div>
<div style=“top:50px; left: 240px; z-index: 2;”></div>
<div style=“top:50px; left: 240px; z-index: 3;”></div>
<div style=“top:40px; left: 40px; position:absolute ”></div><div style=“top:40px; left: 40px; position:relative”></div>
8. Concepção de Websites - Posicionamento de elementos na página - Hélder Oliveira
Posicionamento por definição de estilo
• Outras propriedades:
– bottom
– right
– overflow
9. Concepção de Websites - Posicionamento de elementos na página - Hélder Oliveira
A importância da tag DIV
• Permite agrupar todo o
tipo de elementos
HTML
• Define zonas para
posicionamento
• Substitui o papel das
tabelas em Webdesign
10. Concepção de Websites - Posicionamento de elementos na página - Hélder Oliveira
Aplicações
• Publicidade
• Menus
• Caixas de Diálogo
• Animação ou deslocamento
de elementos
11. Concepção de Websites - Posicionamento de elementos na página - Hélder Oliveira
Questões?