Web Design: Os princípios de detecção do navegador e Localização

Ao navegar na Internet em seu telefone móvel, muitos sites exibir automaticamente a sua versão para celular. Nos bastidores, os desenvolvedores colocado um script no site que é executado para determinar que tipo de navegador que você está usando - iPhone, iPad, Android, Blackberry, ou browsers mesmo desktop, como o Firefox e Internet Explorer. Dependendo do resultado consultado, o script, em seguida, redireciona o usuário para o site adequado para garantir uma experiência ideal. Por exemplo, não é incomum ter várias versões de um website. Além de um site específico para celular, você pode ter um site otimizado para navegadores desktop mais recentes, apoiando muitos dos mais recentes recursos de HTML e CSS - e um simplificado para navegadores mais antigos.

detecção de IP e GPS

Dependendo da natureza de seus produtos e serviços, um detalhe útil para detectar é a localização geral do usuário no mundo. Muitos sites, por exemplo, são sites globais que servem um monte de diferentes países e idiomas. É possível criar um único site que exibe o conteúdo totalmente diferente - na língua nativa do usuário - simplesmente usando um IP script de detecção (Internet Protocol) que descobre a localização do usuário. O modo como funciona é que quando alguém recebe serviços de Internet, ele ou ela é atribuído um endereço IP. Existem bases de dados de localizações de endereço de IP que o script pode verificar contra a como um meio de determinar a localização geral do usuário.

O site Monster Energy, por exemplo, funciona dessa maneira. Se você está na Espanha e tipo MonsterEnergy.com em seu navegador, você tem notícias locais espanhol, eventos e imagens legendados em espanhol. O script de detecção de IP diz o site que país e conteúdo de linguagem para puxar a partir do seu sistema de gerenciamento de conteúdo (CMS).

Enquanto o método de detecção IP lhe dará uma região geral associada ao endereço IP, também é possível obter localização GPS específicas de um usuário usando uma combinação de javascript e HTML5. O método javascript, no entanto, exige que primeiro pedir permissão do usuário. Enquanto este método requer a etapa extra de pedir a permissão do usuário, dá-lo a identificar-precisos localização resultados, enquanto o método de detecção de IP são precisas apenas a nível regional em geral. Embora a maioria de nós estão familiarizados com a capacidade de um telefone celular para obter os dados de localização GPS rapidamente, usando dados de hotspots e célula-torre Wi-Fi, você pode estar se perguntando como o seu computador desktop pode obter esses dados. A resposta é que o Internet-conectado casa e computador de escritório compartilha seus dados de IP com as redes sem fio próximas. Além de redes Wi-Fi próximas, a API do Geolocation faz uso de várias fontes de informação de localização, dependendo do dispositivo (smartphone ou desktop) - incluindo dados de satélite, dispositivos de rastreamento de rádio e hardware Internet. Você pode dizer # 147-Big Brother é assistir # 148?;

Web design responsivo

Uma tendência mais recente é a noção de design responsivo em que uma página web pode sentir a resolução tamanho do navegador e tela - mesmo à medida que muda quando um usuário redimensiona a janela do navegador - e dinamicamente reconfigurar seu layout para acomodar o novo tamanho. A magia que torna isso possível é a porção consultas de mídia da especificação CSS3. A consulta de mídia é um código CSS que detecta o tamanho do navegador e, com base no resultado, diz a página carregar a folha de estilo apropriado tal como widescreen.css em oposição a mobilescreen.css. Estas folhas de estilo diferentes contêm diferentes sistemas de layout, tamanhos de fonte e configurações de otimização de imagem. Portanto, em teoria, não importa quantas diferentes dispositivos são introduzidos no mercado, cada um com um espaço de tela única, é possível simplesmente criar um novo documento CSS, que otimiza o seu site para acomodá-lo.

O site Andersson Sábio é um exemplo elegante de design responsivo. O site exibe em dois col
O site Andersson Sábio é um exemplo elegante de design responsivo. O site exibe em duas colunas dentro de grandes janelas do navegador.
O mesmo site Andersson Sábio se reconfigura em tempo real para uma vista de uma única coluna quando a b
O mesmo site Andersson Sábio se reconfigura em tempo real para uma vista de uma única coluna quando a janela do navegador fica menor.
Quando visualizado em um iPhone, o site Andersson-sábio é exibido em um layout de coluna única. [Crédito: &
Quando visualizado em um iPhone, o site Andersson-sábio é exibido em um layout de coluna única.

menu