Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

wallacejonathan

como fazer Html desktop e html mobile em um só site

Por , em Desenvolvimento frontend

Recommended Posts

wallacejonathan    0

wallacejonathan
Postado

Galera,

 

Eu quero criar um site mobile e desktop. Não irei utilizar o modo mobile first.

Quero criar um html para versão desktop e mobile, usando um certo javascript ou ajax que identifique que o usuário acessou o site pelo desktop ou pelo mobile e automaticamente encaminhe-o para a versão correta.

 

Alguém sabe algum tutorial que possa me ajudar?

 

Abraço a todos desde já

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

A forma correta é não fazer isso.

 

O html é o mesmo, deve ser o mesmo. Dai vc ajusta a experiência, sem esconder ou remover conteúdo.

Compartilhar este post

Link para o post
Compartilhar em outros sites

wallacejonathan    0

wallacejonathan
Postado

Entendi Bruno..

Digamos então, que eu faça 2 sites.

Tipo o da globo.com

 

A globo.com, tem um site para desktop e um site para mobile que quando acessam pelo mobile da globo.com ela redireciona para o m.globo.com

 

Se sabe como faz esse redirecionamento de acordo com as resoluções ?

Ou você ainda sim me aconselha a adaptar o css para diversos dispositivos ?

Abraço e obrigado pelo suporte.

Compartilhar este post

Link para o post
Compartilhar em outros sites

xanburzum    169

xanburzum
Postado

olha este exemplo:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
	<title>Seletor de Visualização</title>
	<link rel="stylesheet" href="http://chocotemplates.com/preview/preview.css" type="text/css" media="all" />
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
	<script src="http://chocotemplates.com/preview/preview.js" type="text/javascript"></script>
</head>
<body class="html">
<div id="customize">
	<div id="customize-holder">
		<h2>Compatibilidade</h2>
		
				<div class="responsive">
			<a href="#" rel="desktop">Desktop</a>
			<a href="#" rel="tablet">Tablet</a>
			<a href="#" rel="mobile">Mobile</a>
		</div>
				
					<h3>Selecione abaixo</h3>
				
		<div class="colors">
			<div class="cl"> </div>
						<ul>
				<li>
					<a href="" class="color" style="color:#">
												<strong>Visualizando...</strong>
					</a>
					<ol>
												<li><a href="fone.htm">Fone</a></li>
												<li><a href="beneficios.htm">Beneficios</a></li>
												<li><a href="associe-se.htm">Associe-se</a></li>
											</ol>
				</li>
			</ul>
						<div class="cl"> </div>
		</div>
		

	</div>
</div>
<div class="iframe-holder">
	<iframe id="frame" src="" width="100%" scrolling="auto" frameborder="0"></iframe>
</div>
</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Pitag346    0

Pitag346
Postado

Amigo, caso você queira criar um 2º site, e fazer com que redirecione caso esteja com um celular, tablet, ou algo do genero...

tem um seguinte script q faz isso...

segue abaixo:

<script type="text/javascript">
var userAgent = navigator.userAgent.toLowerCase();
var devices = new Array('nokia','iphone','blackberry','sony','lg',
'htc_tattoo','samsung','symbian','SymbianOS','elaine','palm',
'series60','windows ce','android','obigo','netfront',
'openwave','mobilexplorer','operamini');
var url_redirect = 'm.seusite.com';
function mobiDetect(userAgent, devices) {
for(var i = 0; i < devices.length; i++) {
if (userAgent.search(devices[i]) > 0) {
return true;
}
}
return false;
}
if (mobiDetect(userAgent, devices)) {
window.location.href = url_redirect;
}
</script>

Compartilhar este post

Link para o post
Compartilhar em outros sites

leandrolions    0

leandrolions
Postado

cara dica de ouro, faz com design responsivo, alem de economizar codigos desnecessarios, vai melhorar e muito a manutencao.

alem de que no minimo você tera que contruir umas 10 paginas pra se adequar bem a todas as telas do mercado, fora como monta nos browsers.

da uma olhada em design responsivo que vai ser sucesso.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Marcelo Marques Meyer    0

Marcelo Marques Meyer
Postado

Boa noite estou iniciando no html, já tenho algum conhecimento, mas o Wallace comentou em usar um html como m 2 CSS fiquei imaginando como vai funcionar, quando o navegador vai identificar o aparelho está sendo usado, é ótimo fazer 1 HTML e deixar a configuração do CSS estabelecer o estilo para cada ... Então alguem pode me dar uma dica ou exemplo?

 

Abraços

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito