Tecnologias para Internet Thyago Maia Tavares de Farias Aula 21
Sumário Desenvolvimento Web para dispositivos móveis Desenvolvimento Web para dispositivos móveis Submissão de dados através de formulários WML; Submissão de dados através de formulários WML; A linguagem de marcação XHTML Mobile Profile; A linguagem de marcação XHTML Mobile Profile; A folha de estilos WCSS; A folha de estilos WCSS;
Formulários WML Através dos formulários WML, podemos fazer com que usuários submetam dados para um servidor remoto; Através dos formulários WML, podemos fazer com que usuários submetam dados para um servidor remoto; Normalmente, os dados submetidos são processados por páginas PHP, JSP, ASP, etc; Normalmente, os dados submetidos são processados por páginas PHP, JSP, ASP, etc; Em HTML, utilizamos as tags form, para a declaração de um formulário, e o input do tipo submit, para criarmos o botão de submissão; Em HTML, utilizamos as tags form, para a declaração de um formulário, e o input do tipo submit, para criarmos o botão de submissão; Em formulários WML, utilizamos as tags go, para a declaração do formulário, e do, para a declaração do botão de submissão; Em formulários WML, utilizamos as tags go, para a declaração do formulário, e do, para a declaração do botão de submissão;
Formulários WML Exemplo: Criação de um formulário WML que permite a submissão de um nome e uma mensagem específica; Exemplo: Criação de um formulário WML que permite a submissão de um nome e uma mensagem específica;
Formulários WML
PHP remoto (exemplo.php): PHP remoto (exemplo.php):
XHTML MP XHTML Mobile Profile (abreviado como XHTML MP) é uma linguagem de marcação de hipertexto desenvolvido para dispositivos móveis; XHTML Mobile Profile (abreviado como XHTML MP) é uma linguagem de marcação de hipertexto desenvolvido para dispositivos móveis; Trata-se de uma evolução da linguagem WML; Trata-se de uma evolução da linguagem WML; Utiliza a especificação WAP 2.0; Utiliza a especificação WAP 2.0; Apenas celulares que trabalham com WAP 2.0 poderão exibir corretamente páginas XHTML MP; Apenas celulares que trabalham com WAP 2.0 poderão exibir corretamente páginas XHTML MP;
XHTML MP XHTML Mobile Profile (abreviado como XHTML MP) é uma linguagem de marcação de hipertexto desenvolvido para dispositivos móveis; XHTML Mobile Profile (abreviado como XHTML MP) é uma linguagem de marcação de hipertexto desenvolvido para dispositivos móveis; Trata-se de uma evolução da linguagem WML; Trata-se de uma evolução da linguagem WML; Utiliza a especificação WAP 2.0; Utiliza a especificação WAP 2.0; A codificação de uma página XHTML MP é similar a uma página HTML; A codificação de uma página XHTML MP é similar a uma página HTML; Mais robusta que WML, pois permite a formatação de conteúdo; Mais robusta que WML, pois permite a formatação de conteúdo; Possibilita o uso de folhas de estilo; Possibilita o uso de folhas de estilo;
XHTML MP Sintaxe básica de uma página XHTML MP: Sintaxe básica de uma página XHTML MP: <head> WCSS Tutorial WCSS Tutorial </head> Aqui ficará o conteúdo da página Aqui ficará o conteúdo da página</body></html>
WCSS – WAP CSS WCSS é a versão mobile do CSS, isto é, são folhas de estilo compatíveis com dispositivos móveis; WCSS é a versão mobile do CSS, isto é, são folhas de estilo compatíveis com dispositivos móveis; A idéia do WCSS é simples: O estilo e informações de layout de um documento são definidos separadamente do conteúdo; A idéia do WCSS é simples: O estilo e informações de layout de um documento são definidos separadamente do conteúdo; As regras de implementação de folhas de estilo WCSS são similares às regras apresentadas anteriormente para CSS; As regras de implementação de folhas de estilo WCSS são similares às regras apresentadas anteriormente para CSS;
WCSS – WAP CSS Exemplo: Deixar o fundo do site XHTML MP apresentado anteriormente com o fundo colorido; Exemplo: Deixar o fundo do site XHTML MP apresentado anteriormente com o fundo colorido; Criaremos 2 arquivos: Criaremos 2 arquivos: O site propriamente dito (exemplo.xhtml); O site propriamente dito (exemplo.xhtml); O arquivo XHTML irá possuir uma ligação para uma folha de estilo; O arquivo XHTML irá possuir uma ligação para uma folha de estilo; Sua folha de estilo (estilo.css); Sua folha de estilo (estilo.css);
WCSS – WAP CSS <head> WCSS Tutorial WCSS Tutorial </head> Aqui ficará o conteúdo da página Aqui ficará o conteúdo da página</body></html>
WCSS – WAP CSS Folha de estilo estilo.css: Folha de estilo estilo.css:body{ background: #00BFFF; }
WCSS – WAP CSS Exemplo 2: Deixar o fundo do site XHTML MP apresentado anteriormente com o fundo colorido e alterar a cor da fonte de um parágrafo; Exemplo 2: Deixar o fundo do site XHTML MP apresentado anteriormente com o fundo colorido e alterar a cor da fonte de um parágrafo; Criaremos 2 arquivos: Criaremos 2 arquivos: O site propriamente dito (exemplo.xhtml); O site propriamente dito (exemplo.xhtml); O arquivo XHTML irá possuir uma ligação para uma folha de estilo; O arquivo XHTML irá possuir uma ligação para uma folha de estilo; Sua folha de estilo (estilo.css); Sua folha de estilo (estilo.css);
WCSS – WAP CSS <head> WCSS Tutorial WCSS Tutorial </head> Aqui ficará o conteúdo da página Aqui ficará o conteúdo da página </body></html>
WCSS – WAP CSS Folha de estilo estilo.css: Folha de estilo estilo.css:body{ background: #00BFFF; }p{ color: #cccccc; }