Planejando e construindo um site habilitado para celular para seu site principal [fechado]

Question

Estamos nos estágios iniciais de planejamento da construção de um site móvel para um de nossos clientes.Este site móvel será um acréscimo ao site principal que já construímos para eles.Determinamos que o conteúdo será uma pequena subseção do site principal e terá como alvo o público principal que deverá usar o site.

Ao examinar alguns exemplos de sites para celular, percebemos que muitos sites que possuem WAP no URL são, na verdade, apenas arquivos HTML simplificados. http://wap.mlb.com não é realmente habilitado para WAP, mas sim HTML simples.

Minha pergunta é: WAP é uma ideia do passado?Com os smartphones e o iPhone tendo a capacidade de renderizar sites como estão, precisamos nos preocupar com WML e WAP ou uma versão html simplificada será suficiente?

Você também pode recomendar um blog ou tutorial ou responder abaixo sobre a melhor forma de verificar dispositivos móveis?Nós, como programadores, precisamos conhecer cada variação do agente do usuário para redirecioná-los para nosso site móvel?

Por fim, você programaria um site móvel para o navegador iPhone/Touch Safari ou simplesmente deixaria o site como está?

Answer 1

Os telefones mais novos vêm com WAP2 que usa HTML Mobile Profile (XHTML MP), que é bastante semelhante ao HTML normal.Os telefones mais antigos usam Wireless Markup Language (WML).

Dependendo do seu público, eu consideraria fazer uma versão do site compatível com celulares usando XHTML MP e abandonar completamente o WML.Por compatibilidade com celulares quero dizer gráficos leves, pouco JavaScript e navegação simples.

Para verificar as capacidades de diferentes telefones manuais, dê uma olhada em WURFL.

Além disso, você pode querer dar uma olhada em Práticas recomendadas para web móvel do w3c.

Answer 2

Aqui estão duas coisas que você pode fazer para melhorar o suporte para iPhones sem muito trabalho:

Faça a página rolar para cima para ocultar a barra de URL:

<script type="application/x-javascript">

  if (navigator.userAgent.indexOf('iPhone') != -1) {
    addEventListener("load", function() {
      setTimeout(hideURLbar, 0);
    }, false);
  }

  function hideURLbar() {
    window.scrollTo(0, 1);
  }

</script>

E defina o dimensionamento para a largura da página (é melhor fazer alguns testes e brincar com isso, procure também outros exemplos que possam usar user-scalable=true):

<meta name="viewport" content="width=320; user-scalable=false" />

Answer 3

Eu recomendo fortemente que você dê uma olhada Cameron Molls livro Web Design Móvel.Não é tanto um tutorial técnico para construir sites otimizados para celular, mas faz você pensar sobre as várias opções disponíveis e resume os prós e os contras de cada uma.Definitivamente fará você pensar sobre qual abordagem você está adotando e se é a correta.Acho que também contém algumas dicas de recursos que ajudam a detectar solicitações de dispositivos móveis para o seu site. Existem várias opções por aí.

Answer 4

A partir de agora (2014)

Talvez não precisemos de um site separado para dispositivos móveis; em vez disso, podemos optar por bibliotecas front-end como Inicialização do Twitter que usa renderização responsivapara que o site se adapte ao tamanho da tela, seja ele Tábua ou Dispositivo móvel ou Área de Trabalho

Uma das principais vantagens é que leva menos manutenção quando comparado a ter sites separados para dispositivos móveis e computadores.

Para saber mais sobre Inicialização do Twitter clique aqui

Answer 5

Acho que a principal diferença entre os telefones 2,5G e os novos telefones 3G é que, embora os telefones 2,5G usassem seus próprios navegadores, os navegadores nos telefones 3G se tornaram muito mais semelhantes/precisos em suas capacidades de renderização.

Por outro lado, você pode usar CSS para renderizar o mesmo HTML em um formato de tela grande ou pequeno, otimizado para dispositivos móveis, então acho que o que aconteceu é que a abordagem de "HTML simples" parecia ser o caminho menos difícil. pegar.Além disso, os layouts sem tabela permitem que os sites sejam melhor dimensionados, facilitando a renderização de um site em formatos de tela grandes e pequenos.

Portanto, a questão final será a de um mercado-alvo.Você está almejando um público que entende de tecnologia e que tende a ter telefones totalmente compatíveis com 3G?Você está almejando pessoas que podem ter no máximo 2,5G?

Answer 6

Minha experiência é que isso realmente depende do que você está tentando fazer e de quem/onde estão os usuários.

Embora o WAP tenha recebido muita publicidade negativa, seu ponto forte é onde você tem conexões de baixa largura de banda e alta latência.O conteúdo WML é otimizado pelo gateway da operadora para reduzir bastante a quantidade de dados transmitidos pelo ar.Se você possui iPhones e similares, em áreas com cobertura 3G sólida, você pode optar por conteúdo mais rico, mas se quiser que um aplicativo ainda tenha um bom desempenho em áreas mais remotas, o WAP tem uma grande vantagem.

Uma coisa a observar com o WAP é que a qualidade do suporte WAP nos aparelhos varia muito (acho que você também diria o mesmo para navegadores de smartphones).A maioria deles exibe páginas ok, mas o manuseio do formulário é realmente péssimo em alguns navegadores.

Se você variar o conteúdo com base no agente do usuário, também deverá fornecer uma maneira explícita de acessar um tipo específico de conteúdo (por exemplo,uris separados) - a escolha automatizada nem sempre é correta e você deseja que o cliente possa substituí-la.

Se você optar pelo desenvolvimento WAP, dê uma olhada no WinWAP - um navegador WAP baseado em Windows.

Answer 7

Se você quiser gastar uma quantia muito pequena de dinheiro, você pode encontrar uma cópia usada do meu livro "Guia do desenvolvedor de aplicativos da Web para Palm OS" na Amazon por menos de US$ 1.Embora as dicas específicas sobre os antigos dispositivos Palm VII não se apliquem mais, há algumas seções sobre como criar sites para dispositivos móveis que ainda podem ser aplicadas.Meu conselho básico é este:torne as páginas pequenas, primeiro com informações relevantes e depois com links de navegação;enviar conteúdo genérico/padrão para outras páginas;tente otimizar para reduzir a quantidade de tempo que um usuário passa em uma única página;e evite baixar muitos objetos (imagens, arquivos JavaScript) para uma página para reduzir a latência.

Answer 8

O código:Faz com que o validador w3 retorne 11 erros quando eu o uso.Aqui está a página de índice em que foi testado:Você não terá algumas linhas múltiplas, não usadas.São linhas de modelo.

<!DOCTYPE HTML>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Photography Aerial Commercial Portrait Underwater Wedding Tom Szabo</title>
<meta name="description" content="A Thomas Image professional photography serving Cleveland
Northeast Ohio Chagrin Falls Chardon Kirtland Madison Mentor Painesville Perry and Willoughby">
<meta name="keywords" content="A Thomas Image, professional, photography, cleveland, northeast ohio, chagrin falls, chardon, concord, kirtland, madison, mentor, painesville, perry, willoughby,commercial, marketing, advertising, executive, head shot, portrait, baby, children, family, high school senior, family reunion, underwater, scuba diving, pool party, wedding, bride, groom,">
<meta name="y_key" content="7b00158550200c1c">
<meta name="y_key" content="b5a3e0c1d778ff8a">
<meta name="msvalidate.01" content="7C6C4CEC2EB84051B1DCFEC558B77724" />
<meta name="verify-v1" content="G4nmk0aesZsCjneBo0W6kVlv5NpImVnTfsQ+fXEk1fA=" />
<meta name="viewport" content=”width=320,user-scalable=false”>