igmar21
Usuario (Panamá)
Saludos, este post es para aquellos que usan sitios web o tienen algun sitio web, donde tienen acceso a codigo fuente, ya sea de pago o gratuito. Si estas leyendo esto es porque estas interezado en crear un sitio web movil que en su aspecto salga bien en todos los navegadores moviles. LO QUE NECESITAS ES LO SIGUIENTE: 1. Tener un servidor, ya sea de pago o gratuito (recomendable de pago, ya que los gratuitos te agregan publicidad dañando asi nuestro código) 2. Conocer algo de HTML 3. Poder provarlo en varios dispositivos celulares. EMPECEMOS.................. vamos a escribir el código. puedes hacerlo de 2 maneras, usando CSS (hojas de estilo) es mas facil, o por medio de tablas. 1. Abrir el bloc de notas. 2. poner esto de primero: <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> <title> aqui titulo que quieras</title> <head> en esta seccion se colocan los meta. </head> <body> aqui va todo el contenido que sera visto por los usuarios en la web </body> </html> 3. seguir con la creacion. ejemplo: codigo de mi web movil. <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> <title> Online shoping - version mobil</title> <meta name="description" content="realizamos compras en internet en los Estados unidos, a muy vajos costos, no requieres tener tarjeta de crédito, ya que nosotros la aportamos por ti"> <meta name="keywords" content="compras, ebay, amazon, usa, internet, paypal, facebook, contacto"> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> <meta name="author" content="Igmar Montenegro"> <meta name="generator" content="Online Shoping Panamá"> <meta name="msvalidate.01" content="A292FA867D7312320135138C3C0A0F2F" /> <link rel="icon" type="image/ico" href="http://www.online-shoping.net/favicon.ico"> <script type="text/javascript"> //Mobile Detection and Redirecting var device = navigator.userAgent if (device.match(/Android/i)) { //window.location = "AQUI DIRECCION WEB MOVIL"; alert('Descarga la aplicacion de nuestra web en tu Android, compra, cotiza Productos de Estados Unidos y te lo traemos, vende lo que quieras aquí en Panamá completamente gratis. La aplicacion descargala gratis aquí.') } // </script> </head><body link=blue vlink=blue alink=yellow> <img src="http://www.online-shoping.net/images/logo.png" alt="" title="" border=0 width=150 height=65> <marquee><font color="blue">Tus compras por internet económicas y accesibles</font></marquee> <table bgcolor="silver" width="100%"> <tr><th align="left"><font size=2><br> <a href="index.html">Inicio</a> - <a href="tiendas.html">Tiendas</a> - <a href="http://www.online-shoping.net/Clasificados">Vender</a> - <a href="http://www.online-shoping.net/blog">Blog</a> - <a href="contacto.html">Contáctanos</a> - <a href="track.html">Rastrea tu compra </a> - </font><br>. </th><br> </table> <center><img src="http://movil.online-shoping.net/images/compras.jpg.jpeg"width=170 height=100 ><br> <font color="red"> Clic en la imágen para descargar la app en tu android. <br> <a href="http://movil.online-shoping.net/app/online-shoping.apk"></font><font color="green"><b><img src="http://movil.online-shoping.net/images/descargaapp.png"></a></b></font></center> <center>Para otros telefonos. <a href="http://eb6b9d8f-5ea3-4c2f-9b25-8f4a8304a4cb.mobapp.at">Descargar</a></center><br> <font size=2 > <table bgcolor="#0000ff" width="100%" > <tr><th align="left"><font size=2 color="white"><br><b>Bienvenidos a Online Shoping</b></th></table><br> Somos una empresa creada con impulso propio y en crecimiento, donde ayudamos a nuestros clientes a comprar productos en USA por internet. Usted no necesita poseer P.O Box, tarjeta de crédito ni nada de eso, ya que nosotros la aportamos por tí. Puedes comprar desde la comodidad de tu casa, sólo contáctanos para cotizar sin compromiso. Elige el producto de la web a comprar, nos envias en link, y nosotros nos encargamos de completar tu compra. Fácil, rápido y seguro.</font> <table bgcolor="#0000ff" width="100%"> <tr><th align="left"><font size=2 color=white ><br>Elija su tienda</th></table><br> <font size=2 color=""> Elige una de las tiendas para buscar el producto de tu eleccion, nos envias el link directo o el Item number por medio de la zona de contacto, y te hacemos una cotizacion sin compromiso alguno.</font> <br> <center><img src="http://movil.online-shoping.net/images/compras.jpeg"width=170 height=100 ><br></center><center> <a href="http://www.ebay.com"><img src="http://movil.online-shoping.net/images/Ebay.jpg" width=50 height=30></a> <a href="http://www.amazon.com"><img src="http://movil.online-shoping.net/images/Amazon.jpg" width=50 height=30></a> </center> <table bgcolor="#0000ff" width="100%"> <tr><th align="left"><font size=2 color=white><br>Como comprar</th></table><br> <font size=2 color=""> -Usted elige el producto y nos envia el lick directo del producto en la web.<br> - Nosotros se lo cotizamos.<br> - Usted hace el abono estipulado segun cotizacion de 60% 0 70%. - Nosotros hacemos la compra por usted, usando nuestra tarjeta de credito.<br> - Le enviamos una notificacion por email de que su compra ha sido hecha.<br> - Esperar que le enviemos una notificacion de que su compra ha llegado mas el saldo pendiente.<br> - Cancelar el saldo pendiente y Venir a retirar su paquete o se lo enviamos por encomienda por un valor adicional. -</font> <br> <center> <table bgcolor="#0000ff" width="100%"> <tr><th align="left"><font size=2 color=white><br>Teléfonos/Whatsapp</th></table><br <br> <img src="http://movil.online-shoping.net/images/whatsapp.jpg.jpeg" width=25 height=25> <font color="green" size=2><b>6997-6593 - 6743-6686</b></font> <br> <img src="http://movil.online-shoping.net/images/tef.jpg.jpeg" width=25 height=25> <font color="blue" size=2><b>6997-6593 - 6743-6686</b></font><br> Msn: [email protected]<br> <img src="http://movil.online-shoping.net/images/img118849938.jpeg" width=25 height=25"> @onlineshoping21<br> <img src="http://movil.online-shoping.net/images/facebook.jpeg" width=25 height=25"> <a href="www.facebook.com/online.shoping21">www.facebook.com/online.shoping21</a></font> <br><br> <table bgcolor="#0000ff" width="100%"> <tr><th align="left"><font size=2 color=white><br>Horarios de atencion</th></table><br> <center> </center> <font size=2 color="red">Lunes a viernes 9:00 A.M- 6:30 P.M<br> Sábados: 9:00 A.M - 3:00 P.M</font><br> <table border="0" width="100%" ><tr><th> <!-- Codigo contadorgratis.net ver. 4.3 --> <script language="javascript" src="http://www.contadorgratis.net/hit2.php?page=73ae752d3c20f87871271272f2cef2705b95e6ca&digit=bluepl"></script> <br><font size=1><a href="http://www.contadorgratis.net" target="_blank"></a></font> <!-- FIN Codigo contadorgratis.net --> <th> <iframe name="iFrame1" width="172" height="64" src="http://www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fonline.shoping21&width=200&height=258&show_faces=false&colorscheme=light&stream=false&show_border=false&header=false&appId=237447069633551" scrolling="no" frameborder="0"></iframe> </table> <table bgcolor="silver" width="100%"> <tr><th align="left"><font size=2 ><br> Online Shoping. Derechos recervados 2011-2013 <a href="terminos.html">Términos</a> <a href="privacidad.html">Privacidad</a><br>. </font></th></table> <a href="http://www.online-shoping.net/no-mobile-to.PC">Cambiar a vercion PC</a> </body></html> al crear las tablas, colocamos como valor de tamaño: 100%, asi estas se ajustan automaticamente a cada pantalla, ejemplo, <table border="0" bgcolor="blue" width="100%"> <tr><th align="left"> aqui el texto que quieras poner, el margen automatico es centrado pero lo puedes cambiar. en mi caso ordene alineamientoizquierdo, </th> </table> Si gustas puedes ver mi sitio web: version PC http://www.online-shoping.net la version movil es: http://movil.online-shoping.net Claro que si entras desde tu movil te va a dirigir automaticamente al sitio web movil. aqui esta mi post de como detectar si un visitante entra a nuestro sitio web desde un movil y lo redirige a una web movil creada en nuestro sitio. ver mi otro post: http://www.taringa.net/posts/celulares/17335369/Como-crear-una-redireccion-desde-mi-sitio-web-a-web-movil.html Realmente esto es sumamente simple y facil de hacer. sino saves, puedes estudiar mi código de ejemplo. para agregar cosas en el sitio. codigos html 1. una URL: <a href="http://www.direccionweb.com"> Descargar o link</a> 2. Una imágen: <img src="http://movil.online-shoping.net/images/compras.jpg.jpeg"width=170 height=100 > agreas ancho: width="en numeros" altura: heigth="numero deseado" 3. Crear una tabla: <tabla border="0"><tr><th> aqui txto o lo que sea</table> 4. Para dar tamaño a letras, color, alineacion etc: dentro de la etiqueta <font >texto con atributos aplicados</font> se agregan los codigos, ejemplo siquiero que el texto sea gris y no de color negro que sale por defecto, escribo lo siguiente: < font size=3 color=silver> aquitexto</font> 5. Para centrar una imagen, texto o lo que sea. <center> aqi lo que quieres centrar</center> 6. Para dar un salto de linea: <br> Con esto puedes crear tu sitio, guardas el documento y colocas asi: document.html es decir que despues del nombre que des a tu documento deves poner .html para que se guarde como pagina web y lo subes a tu server. con esta informacion básica puedes crear tu web movil. si conoces mas de html, se te ara mucho mas facil, sino tienes que unvestigar un poco mas.width=170 height=100
Hola queridos amigos taringueros y visitantes que leen mis post, y tambien para aquellos que los copian. Anteriormente en uno de mis post di una manera sencilla de hacer un sitio web compatible con celulares, esta es una segunda opcion y mas facil. puedes pasar por el otro post http://www.taringa.net/posts/hazlo-tu-mismo/17339194/Como-crear-un-sitio-web-compatible-con-cualquier-movil.html Para que todo sea factible y facil necesitamos lo siguiente 1. Sofware de diseño web. web page maker descargalo gratis aqui: http://www.webpage-maker.com/files/wpm.exe y esta es laa clave para que lo hagas full como de pago: 78868-17867-62153-10020 2. conocer algo simple de html 3. Copiar esta etiqueta que usaremos en el editor <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> INICIEMOS. COLOCARE YA IMAGENES DE MI SITIO VERSION MOVIL EN EDICION. ahora lo que haremos despues de crear nuestro sitio, es alinearlo todo al centro aqui. ahora lo que deves hacer es publicarla en una carpeta en tu PC, despues que la hayas publicado en forma local, vas a la carpeta y abres las paginas alli publicadas, lo haces una por una, despues das en ver codigo fuente y veras lo siguiente: (yo uso el navegador opera que me ayuda mucho en estos trabajos. al abrirlo con tu navegador, en mi caso opera, se deve ver asi: para poder ver el codigo fuente que vamos a editar haremos lo siguiente, claro esto es para los super novatos. pero para los que ya saben no le es problema. si todo sale bien, es que deve salir bien, al abrir el codigo fuente reemplazaremos lo que esta marcado de azul: en la seccion que seleccionamos de azul, vamos a colocar lo siguiente <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> lo pegamos en la parte seleccionada anteriormente y damos clic en donde dice: APLICAR CAMBIOS y listo: deve quedar asi: este procedimiento lo haces en cada una de las paginas que creaste y luego las subes a tu servidor mediante FTP usando cualquie programa FTP o de forma manual. NOTA: cada vez que la actualices en el sofware, deves hacer lo mismo, sino lo haces, no aparecera bien en el movil. Con esto a crear sitios web. Importante, no agregues flash, ya que los moviles no reconocen eso. que te diviertas haciendo paginas web. puedes visitar mi pagina web desde cualquier dispositivo. http://www.online-shoping.net dar clic en me gusta, requiere facebook y gracias por tomarte tu tiempo en leernos.