I need help making my web site mobile friendly, I have tried every suggestion I can find and nothing is working

Question

I have coded in HTML for several years and this is the first time I need to make my website mobile friendly. I have looked up mobile friendly on line and have tried every suggestion but still nothing makes the mobile site work. I have only created about 6 pages for mobile at this time so the entire website is not available for mobile at this time.

When you load the mobile site by entering the M.pagename.html directly into the search bar it loads correctly, but when you enter the desktop pagename on a mobile device it should bring up the m.page name but it does not it brings up the desktop page. I am sure it is something that I am not doing correctly and someone with a lot more experience with mobile sites can look and fix very easily. I am willing to try anything that will make this work.

All help would be greatly appreciated.

Desktop web page index.html the mobile web page example is below this example

<!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>
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-N3SCXB6');</script>
<!-- End Google Tag Manager -->
<meta name="keywords" content="Amigo, Vape, e Cig, Atomizer, Mod, Low Priced Vape, Cheap Vape, Discount Vape, Vape Deals, Ultimate Vape Deals, Vape 101, Your Vape, Vape World, Vape cart, Smok, Wismec, Itsuwa" />
<meta name="description" content="We specialize in the distribution of vape kits from the starter kit to the professional kit, including coils, Mods, Atomizer, e Cigarette, parts." />
<meta name="robots" content="index, follow">
<meta name="msvalidate.01" content="F7D5EB809B0143B3230091FECC3E6E56" />
<meta name="google-site-verification" content="Y_qBasS5tQhExv6mwMA90_Ge12-jY4D_xpz7k3mYeBY" />
<meta name="revisit-after" content="15 days">
<link rel="alternate" media="only screen and (max-width: 320px)" href="M.index.html">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<meta http-equiv="content-language" content="en-us">
<title>Low Priced Vape - Amigo, Vape, e Cigarette, Atomizer, Mod</title>
<!-- Amigo, Vape, e Cig -->
<style type="text/css">
<!--
#Layer1 {
    position:absolute;
    width:131px;
    height:60px;
    z-index:1;
    left:0px;
    top:221px;
}
#Layer2 {
    position:absolute;
    width:131px;
    height:60px;
    z-index:2;
    left:0px;
    top:281px;
}
#Layer3 {
    position:absolute;
    width:131px;
    height:60px;
    z-index:3;
    left:0px;
    top:341px;
}
#Layer21 {
    position:absolute;
    width: 1300px;
    height: 220px;
    z-index:21;
    left:0px;
    top:0px;
}
#Layer22 {
    position:absolute;
    width:46px;
    height:347px;
    z-index:22;
    left:1254px;
    top:221px;
}
#Layer33 {
    position: absolute;
    width: 1090px;
    height: 325px;
    z-index: 33;
    left: 145px;
    top: 228px;
    font-family: Arial;
    font-size: 18px;
    text-align: center;
    margin: 0px;
    padding: 0px;
    border: medium solid #00F;
}
#Layer80 {
    position: absolute;
    width: 524px;
    height: 60px;
    z-index: 80;
    left:458px;
    top:745px;
    }
.style2 {
    font-family: Geneva, Arial, Helvetica, sans-serif;
    color: #FFFFFF;
    font-size: 12px;
}
.style3 {
    font-size: 14px;
    font-weight: bold;
}
body {
    background-color: #3777A3;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: normal;
    color: #FFF;
}
-->
</style>

<script type="text/JavaScript">
<!--
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-96730073-2', 'auto');
  ga('send', 'pageview');

</script>
<link rel="alternate" media="only screen and (max-width: 320px)" href="M.index.html">
</head>

<body onload="MM_preloadImages('images/HomeB.jpg','images/AboutB.jpg','images/vapeB.jpg')">
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-N3SCXB6"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<link rel="alternate" media="only screen and (max-width: 320px)" href="M.index.html">
<h1>Amigo, Vape, e Cig, Atomizer, Mod, Low Priced Vape, Cheap Vape, Discount Vape, Vape Deals, Ultimate Vape Deals, Vape 101, Your Vape, Vape World, Vape cart, Smok, Wismec, Itsuwa</h1>
<div id="Layer21"><img src="images/LP.gif" width="1300" height="220" alt="Vape" /></div> 
<div id="Layer1"><a href="index.html"><img src="images/HomeA.jpg" alt="Home" width="131" height="60" border="0" id="Image1" onmouseover="MM_swapImage('Image1','','images/HomeB.jpg',1)" onmouseout="MM_swapImgRestore()" /></a></div>
<div id="Layer2"><a href="Vape.html"><img src="images/VapeA.jpg" alt="Vape" width="131" height="60" border="0" id="Image2" onmouseover="MM_swapImage('Image2','','images/vapeB.jpg',2)" onmouseout="MM_swapImgRestore()" /></a></div>
<div id="Layer3"><a href="About.html"><img src="images/AboutA.jpg" alt="About" width="131" height="60" border="0" id="Image3" onmouseover="MM_swapImage('Image3','','images/AboutB.jpg',3)" onmouseout="MM_swapImgRestore()" /></a></div>
<div id="Layer22"><img src="images/Welcome.jpg" alt="Welcome" width="46" height="347" /></div>
<div id="Layer33" align="center"><p><font size="+2" face="Courier New, Courier, monospace">We have over 30 years combined marketing experience.  We have operated several businesses over this period and are dedicated to customer satisfaction. Our current business specializes in the vaping industry and we represent some of the largest vaping e-cigarette companies.  If you need, more information please send us a request and we will reply within 24 hours.</font></p><p><a href="Contact.php"><center><font size="+2" face="Courier New, Courier, monospace" color="#FFFFFF">Click here to contact Us.</font></center></a></p><p>&nbsp;</p><a href="http://www.hitwebcounter.com" target="_blank"><img src="http://hitwebcounter.com/counter/counter.php?page=6636199&style=0005&nbdigits=5&type=page&initCount=5000" title="Counter" Alt="Counter"   border="0" ></a></div>
<div id="Layer80">This site built and maintained by <a style="text-decoration: underline;" href="http://www.lowpricedvape.com"><font color="#FFFFFF">www.lowpricedvape.com</font></a><br /> <font color="#3999A9"> Amigo, Vape, e Cig, Atomizer, Mod, Low Priced Vape, Cheap Vape, Discount Vape, Vape Deals, Ultimate Vape Deals, Vape 101, Your Vape, Vape World, Vape cart, Smok, Wismec, Itsuwa</font></div>
</body>
</html>

mobile web page www.lowpricedvape.com/M.index.html

<!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>
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-N3SCXB6');</script>
<!-- End Google Tag Manager -->
<meta name="keywords" content="Amigo, Vape, e Cig, Atomizer, Mod, Low Priced Vape, Cheap Vape, Discount Vape, Vape Deals, Ultimate Vape Deals, Vape 101, Your Vape, Vape World, Vape cart, Smok, Wismec, Itsuwa" />
<meta name="description" content="We specialize in the distribution of vape kits from the starter kit to the professional kit, including coils, Mods, Atomizer, e Cigarette, parts." />
<meta name="robots" content="index, follow">
<meta name="msvalidate.01" content="F7D5EB809B0143B3230091FECC3E6E56" />
<meta name="google-site-verification" content="Y_qBasS5tQhExv6mwMA90_Ge12-jY4D_xpz7k3mYeBY" />
<meta name="revisit-after" content="15 days">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="canonical" href="index.html">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="content-language" content="en-us">
<title>Low Priced Vape - Amigo, Vape, e Cigarette, Atomizer, Mod</title>
<style type="text/css">
<meta charset="utf-8">

<!--
#Layer1 {
    position:absolute;
    width:1px;
    height:1px;
    z-index:4;
    left:1px;
    top:1px;
}
#Layer1 {
    position:absolute;
    width:100px;
    height:46px;
    z-index:1;
    left:0px;
    top:121px;
}   
#Layer2 {
    position:absolute;
    width:100px;
    height:46px;
    z-index:2;
    left:0px;
    top:167px;
}
#Layer3 {
    position:absolute;
    width:100px;
    height:46px;
    z-index:3;
    left:0px;
    top:213px;
}
#Layer4 {
    position:absolute;
    width:1px;
    height:1px;
    z-index:4;
    left:1px;
    top:1px;
}   
    #Layer7 {
    position:absolute;
    width:100px;
    height:92px;
    z-index:7;
    left:0px;
    top:259px;
}
#Layer21 {
    position: absolute;
    width: 320px;
    height: 120px;
    z-index: 21;
    left: 0px;
    top: 1px;
}
#Layer30 {
    position: absolute;
    width: 220px;
    height: 220px;
    z-index: 30;
    left: 101px;
    top: 123px;
}
#Layer41 {
    position: absolute;
    width: 217px;
    height: 110px;
    z-index: 41;
    left: 101px;
    top: 341px;
}
    #Layer42 {
    position: absolute;
    width: 215px;
    height: 430px;
    z-index: 42;
    left: 101px;
    top: 123px;
    font-family: Arial;
    font-size: 18px;
    text-align: center;
    margin: 0px;
    padding: 0px;
    border: medium solid #00F;
}
    #Layer43 {
    position: absolute;
    width: 315px;
    height: 145px;
    z-index: 43;
    left: 0px;
    top: 745px;
    font-family: Arial;
    font-size: 18px;
    text-align: center;
    margin: 0px;
    padding: 0px;
    border: medium solid #00F;
}   
#Layer65 {
    position: absolute;
    width: 220px;
    height: 30px;
    z-index: 65;
    left: 101px;
    top: 463px;
}
#Layer66 {
    position: absolute;
    width: 220px;
    height: 30px;
    z-index: 66;
    left: 101px;
    top: 498px;
}
#Layer80 {
    position: absolute;
    width: 320px;
    height: 100px;
    z-index: 80;
    left: 0px;
    top: 760px;
}
.style2 {
    font-family: Geneva, Arial, Helvetica, sans-serif;
    color: #FFFFFF;
    font-size: 18px;
}
.style3 {
    font-size: 14px;
    font-weight: bold;
}
body {
    background-color: #3777A3;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: normal;
    color: #FFF;
}
-->
</style>

<script type="text/JavaScript">
<!--
function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}
//-->
</script>
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-96730073-2', 'auto');
  ga('send', 'pageview');

</script>
<link rel="canonical" href="index.html">
</head> 
<body>
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-N3SCXB6"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<link rel="canonical" href="index.html">
<div id="Layer4"></div>
<div id="Layer1"><a href="M.index.html"><img src="images/HomeA.jpg" alt="Vape" width="100" height="46" border="0" id="Image1"  /></a></div>
<div id="Layer2"><a href="M.Vape.html"><img src="images/VapeA.jpg" alt="Vape" width="100" height="46" border="0" id="Image2" /></a></div>
<div id="Layer3"><a href="M.About.html"><img src="images/AboutA.jpg" alt="About" width="100" height="46" border="0" id="Image3" /></a></div>
<div id="Layer7"><a href="http://Shop.lowpricedvape.com" target="_blank"><img src="images/ShopA.jpg" alt="Shop" width="100" height="92" border="0" id="Image7" /></a></div>
<div id="Layer21"><img src="images/MHeader.jpg" alt="Vape" width="320" height="120"/></div>
<div id="Layer42" style="border: solid; color: navy" align="center"><font color="#FFFFFF" size="+1">We have over 30 years combined marketing experience.  We have operated several businesses over this period and are dedicated to customer satisfaction. Our current business specializes in the vaping industry and we represent some of the largest vaping e-cigarette companies.  If you need, more information please send us a request and we will reply within 24 hours.</font><br><p><a href="M.Contact.php"><font color="#FFFFFF" size= "+2">Click here to contact Us.</font></a></p></div>
<div id="Layer80">This site built and maintained by <a style="text-decoration: underline;" href="http://www.lowpricedvape.com"><font color="#FFFFFF">www.lowpricedvape.com</font></a><br /> 
<font color="#3999A9"> Amigo, Vape, e Cig, Atomizer, Mod, Low Priced Vape, Cheap Vape, Discount Vape, Vape Deals, Ultimate Vape Deals, Vape 101, Your Vape, Vape World, Vape cart, Smok, Wismec, Itsuwa</font></div>
</body>
</html>

With this architecture, you'll need some kind of script to detect the device and redirect accordingly. I don't see any such functionality in the code you've shown. — showdev, Sep 13 '17 at 21:25
Possible duplicate of [Best way to detect mobile device and redirect](https://stackoverflow.com/questions/26649767/best-way-to-detect-mobile-device-and-redirect) — showdev, Sep 13 '17 at 21:28

Sameer · Answer 1 · 2017-09-13T03:34:57.600

0

Try using this script on your desktop page.

<script type="text/javascript">
<!--
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {

document.location = "mobile.html";
}

</script>

edited Sep 13 '17 at 03:34

answered Sep 12 '17 at 23:25

Sameer

383
1
10

1

another suggestion, Its time to learn Responsive web design. This will help you maintain 1 single page and make that page responsive. So its the same page on desktop and on mobile. – Sameer Sep 12 '17 at 23:27
This did not work and now you marked my question with a -1, so most people will not even look at the question and try to help. I am a disabled veteran trying to make a simple living selling product on the internet and not having a lot of luck because I can not get my web site to be mobile friendly. – Dave Sep 13 '17 at 03:29
Sorry about your condition, It was just a suggestion, its up to you if you do it or not, It would be great if you learn it, spend time reading it, w3schools.com is the way to go.. has lot of good content. – Sameer Sep 13 '17 at 03:31
I was getting an error code then added //--> and it worked on the first mobile page. Now I just have to create the other mobile pages. Thanks for your help. – Dave Sep 13 '17 at 04:34

I need help making my web site mobile friendly, I have tried every suggestion I can find and nothing is working

1 Answers1