Plone na plataforma mobile
-
Upload
fabiano-weimar -
Category
Internet
-
view
131 -
download
0
Transcript of Plone na plataforma mobile
![Page 1: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/1.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Plone na Plataforma Mobile
![Page 2: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/2.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Plone na Plataforma Mobile
![Page 3: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/3.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Plone na Plataforma Mobile
Fabiano Weimar dos SantosOs amigos me chamam de Xiru
Mestre em Inteligência Artificial - UFRGSConsultor, Desenvolvedor e Sysadmin Plone
Escritor "Aspira"... e recentemente estudante de Música
Fabiano Weimar dos SantosOs amigos me chamam de Xiru
Mestre em Inteligência Artificial - UFRGSConsultor, Desenvolvedor e Sysadmin Plone
Escritor "Aspira"... e recentemente estudante de Música
Giuseppe RomagnoliConsultoria Tecnológica do SERPRO
Responsável pela adoção do Plone no SERPRO e em vários órgãos de governo
Atualmente no Projeto de Mobile do SERPRO
Giuseppe RomagnoliConsultoria Tecnológica do SERPRO
Responsável pela adoção do Plone no SERPRO e em vários órgãos de governo
Atualmente no Projeto de Mobile do SERPRO
![Page 4: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/4.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Crescimento dos Dispositivos Móveis
”Brasil deve ter 1 bilhão de aparelhos
com acesso à internet em 2020”Paulo Bernardo – Ministro das Comunicações
08/08/2012
![Page 5: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/5.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Crescimento dos Dispositivos Móveis
2020 serão mais de 20 Bilhões em Mundo Todo
![Page 6: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/6.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Crescimento dos Dispositivos Móveis
A realidade é que estamos usando mais tempo os dispositivos móveis para acessar a Internet do que qualquer outro meio !
![Page 7: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/7.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Crescimento dos Dispositivos Móveis
Serviços, aplicações, sites, trabalho, lazer … tudo está sendo feito para dispositivos móveis.
![Page 8: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/8.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
O Grande Desafio
Oferecer serviços que possam atender a todos
![Page 9: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/9.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Porque precisamos de uma versão mobile de um website ?
Melhorar a experiência do usuário ao navergar em dispositivos que tem uma ”usabilidade diferenciada”.
![Page 10: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/10.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Governo já demanda sítios adaptados
- Algumas Apps já foram criadas.
- Ministérios querem seus portais adaptados
- A demanda irá crescer muito nos próximos meses
- É necessário conhecer bem sobre o assunto para orientar o processo de adaptação
- Cidadão já procura pelos serviços e sítios adaptados
** Este é um exemplo apenas ilustrativo
![Page 11: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/11.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Governo já demanda sítios adaptados
** Este é um exemplo apenas ilustrativo
Usabilidade Acessibilidade Segurança
DisponibilidadePortabilidadeInteroperabilidade
![Page 12: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/12.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Adaptação não é miniaturização
- A informação precisa ser simples de acessar e entender
- Segurança e confiabilidade são muito importantes, especialmente em redes ruins
- Velocidade não é tudo. Latência também é importante
- Tecnologia móvel ainda é cara
** Este é um exemplo apenas ilustrativo
![Page 13: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/13.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Adaptar é focar no conteúdo
** Este é um exemplo apenas ilustrativo
![Page 14: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/14.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Boas Práticas
Algumas Recomendações
W3C Mobile Web Best Practices 1.060 Práticas (2008)
W3C Mobile Web Application Best Practices32 Práticas (2010).
![Page 15: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/15.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Dicas
Dada as limitações dos dispositivos móveis Aplicações web simples são sempre melhores Mantenha o DOM pequeno e limite o número de
seletores CSS
Use poucos requests HTTP (cuidado com a ”latência”)
Seja cuidadoso ao utilizar javascript
![Page 16: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/16.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Desenvolvimento Seguro
OWASP – The Open Web Application Security Project
Documentos interessantes sobre desenvolvimento seguro!
OWASP Top 10 (riscos de segurança) Plone segue recomendações muito bem.
Novo: Top Ten Mobile Controls
![Page 17: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/17.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
HTML 5 e CSS 3
Não possuem especificações finais ainda (quem sabe em
2014)
Já são consideradas as tecnologias adequadas para
desenvolvimento Mobile
Aplicativos nativos podem ser criados através de extensões
aos HTML 5 usando javascript (PhoneGap)
![Page 18: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/18.jpg)
3. joulukuuta 2012 18
![Page 19: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/19.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Adaptação de Conteúdo
Algumas questões ainda são polêmicasFormatos de Vídeo (Mp4, Ogv, WebM)
Formatos de Áudio (Mp3, Ogg, Wav)
Formatos Patenteados x Formatos Livres
Adobe Flash está morto (em dispositivos móveis).
Há outros formatos "complicados"...
Suporte "variados" nos engines dos navegadores.
![Page 20: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/20.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Estratégias de Implementação
Web Design Responsivo
Mesmo código fonte HTML é acessado na mesma URI utilizando diferentes plataformas (desktop e móvel)
Conteúdo visualizado é adaptado aos recursos que a plataforma disponibiliza (tamanho da tela, resolução, orientação, etc)
Adoção de um FrameworkAgiliza o desenvolvimento de interfaces especializadas para dispositivos móveis
![Page 21: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/21.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Web Design Responsivo
É a estratégia que o Plone padrão utiliza.
Não é tão simples quanto parece!
Layout flexível, com medidas proporcionais
Imagens adaptativas (ou vetores SVG)
CSS Media Queries
Folhas de estilo que formatam apenas
dispositivos que possuem determinado
recurso (especificação bastante recente)
![Page 22: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/22.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Web Design Responsivo
Todas as medidas devem ser relativas (nada de colocar "px" no css, apenas % ou "em")
float e display: uso pode ocasionar barras de rolagem ou zoom
padding e margin: evitar “espaços vazios”
background-image: substituindo as imagens por versões adaptativas ou vetoriais
![Page 23: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/23.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Web Design Responsivo
http://designmodo.com/responsive-design-examples/
![Page 24: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/24.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Web Design Responsivo (exemplo)
http://designmodo.com/responsive-design-examples/
![Page 25: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/25.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
jQuery Mobile
As vezes CSS não resolve tudo (pelo menos não de uma maneira simples)
Ideal para adaptação de portais com aparência de aplicação nativa.
Baseado no jQuery
Facil de Usar
Não requer uso de javascript
![Page 26: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/26.jpg)
3. joulukuuta 2012 26
![Page 27: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/27.jpg)
3. joulukuuta 2012 27
![Page 28: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/28.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
jQuery Mobile
![Page 29: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/29.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
jQuery Mobile
Tema Diazo com jQuery Mobile
(em 5 minutos)
![Page 30: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/30.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Considerações Finais
● Não existe solução mágica● Conteúdo tem que ser valorizado● Adequação não é reescrever sua aplicação● Desktops vão entrar em extinção. Prepare-se.
![Page 31: Plone na plataforma mobile](https://reader033.fdocumentos.tips/reader033/viewer/2022051320/589cb03e1a28abbe4a8b59e5/html5/thumbnails/31.jpg)
Fabiano Weimar dos Santos e Giuseppe Romagnoli
Contatos
Fabiano Weimar dos Santos
IRC: [Xiru]
@xiru
github.com/xiru
Giuseppe Romagnoli