Em um dispositivo de toque como iPhone / iPad / Android, pode ser difícil pressionar um pequeno botão com o dedo. Não há nenhuma maneira entre navegadores para detectar dispositivos sensíveis ao toque com consultas de mídia CSS que eu conheço. Portanto, verifico se o navegador tem suporte para eventos de toque de javascript.Até o momento, outros navegadores não os suportam, mas o mais recente Google Chrome no canal de desenvolvedoreventos de toque ativados (mesmo para dispositivos sem toque). E suspeito que outros fabricantes de navegadores o sigam, já que laptops com telas sensíveis ao toque estão chegando. Atualização: foi um bug no Chrome, agora a detecção de JavaScript funciona novamente.

Este é o teste que eu uso:

function isTouchDevice() {
    return "ontouchstart" in window;
}

O problema é que isso só testa se o navegador tem suporte para eventos de toque, não o dispositivo.

Alguém conhece a maneira correta de oferecer aos dispositivos sensíveis ao toque uma melhor experiência do usuário? Diferente de cheirar o agente do usuário.

A Mozilla tem uma consulta de mídia para dispositivos touch. Mas não vi nada parecido em nenhum outro navegador:https://developer.mozilla.org/En/CSS/Media_queries#-moz-touch-enabled

Atualização: desejo evitar o uso de uma página / site separado para dispositivos móveis / touch. A solução tem que detectar dispositivos sensíveis ao toque com detecção de objetos ou similar a partir do JavaScript, ou incluir um CSS sensível ao toque personalizado sem que o agente do usuário cheire!A principal razão pela qual perguntei foi para garantir que não seja possível hoje, antes de entrar em contato com o grupo de trabalho css3. Portanto, não responda se você não puder seguir os requisitos da pergunta;)