lunes, enero 13, 2014

¿Por qué usar un motor de envío de correos?

Si se cuenta con un alojamiento web, seguro cuenta con el alojamiento de listas de correo electrónico. Ahora, se podría pensar que esta es una buena opción, pero para los negocios, lo que realmente se está buscando es una vía de sentido único donde usted puede enviar mensajes a un grupo de clientes, socios, medios de comunicación, etc. El software que su proveedor de alojamiento ofrece es bidireccional, lo que significa que cualquier persona que es miembro de la lista puede enviar mensajes a toda la lista. Esto probablemente no es ideal si usted está enviando un anuncio del producto, el boletín semanal o comunicado de prensa, pero es posible que le resulte útil en otros escenarios. Por otra parte ¿está seguro de que su anfitrión le permite enviar una gran cantidad de correos electrónicos al mismo tiempo? ¿Es su propio servidor o VPS o un servidor compartido? Un servidor compartido probablemente limite la salida de correo electrónico enviado, lo que significa que va a tomar horas o días enviar un solo mensaje a su lista entera.


Las preguntas que usted debe pensar alrededor cuando usted está eligiendo una solución lista de correo son:
  • ¿Cuántos mensajes se me enviaba cada semana / mes?
  • ¿A cuántas personas voy a tener en mi lista?
  • ¿Quiero que la gente sea capaz de inscribirse a mis listas de correo en mi sitio web?
  • ¿Necesito saber cosas como la cantidad de gente abierta y leer mis mensajes y, ya sea que haga clic en los enlaces en los mensajes?
  • ¿Puedo pagar por un servicio de lista de correo, o tengo que encontrar una opción gratuita?

jueves, enero 09, 2014

Tendencias 2014 en desarrollo web

El tiempo no se detiene y se dice que un año en Internet es como siete años en el mundo fuera del teclado. Así de rápido se mueve la tecnología, y lo que es nuevo el día de hoy, en unas cuantas semanas se queda en el olvido; es así que algunos nos atrevemos a decir que es lo que nos depara el destino. Para el caso de este blog, y tomando fuerza con el impulso de la nueva pagina de facebook (http://www.facebook.com/llanuracom), revisar las tendencias en desarrollo web es lo que nos ocupa.



Vamos pues con la lista:

1. Mobil multiplataformas.

Esta claro que no es novedad, que todo el mundo se mueve hacia el desarrollo móvil, el crecimiento y éxito de las tiendas de IOS, Android, Windows Phone es una muestra de ello. Pero en Llanura.com lo que interesa es la facilidad del desarrollo, y el problema actual, es que una misma aplicación se debe realizar en diferentes lenguajes para las diferentes plataformas, y por supuesto entender las diferentes idiosincrasias de los sistemas operativos. En muchas ocasiones en el pasado se ha intentado que las aplicaciones web sean un común denominador para todos los sistemas operativos, pero con el crecimiento de HTML5, CSS3 (el nuevo CSS4) y las diversas librerías basadas en Javascript, pareciera que esto esta más próximo. Ejemplos de esto: emscript, node-webkit, phonegap, y algunos mas.

2. Computo en la nube privado.

Snowden, el famoso americano que ha divulgado documentos sobre la agencia de seguridad de EEUU, ha puesto a la luz, los problemas que enfrentan los servicios en la nube, por lo que la necesidad de crear nubes de computo privados para empresas de gran tamaño irá en aumento.

3. Perifericos conectados.

Los dispositivos de diverso tipo se están conectando a Internet, desde refrigeradores hasta impresoras en 3D. Los navegadores empiezan a incorporar la interacción con este tipo de periféricos.

4. Herramientas de desarrollo en linea.

Están apareciendo casi todas las semanas diferentes tipos de editores de programación en linea. Con esto el trabajo en equipo, se vuelve mas eficiente y cien porciento accesible en cualquier momento.

5. M2M.

Maquina a maquina. Los servicios web están evolucionando en las maquinas que nos rodean, carros que se pueden conectar a nuestros dispositivos y estos a su vez a servidores remotos que envían los problemas mecánicos o de accidentes automovilísticos. Serán la norma.

6. Maquinas virtuales.

Es imposible contar con una infinidad de equipo de computo destinado a las distintas plataformas que existen en el mercado. Es por eso que la virtualización de maquinas con diferentes sistemas operativos, y en el menor de los casos, con un perfil diferente, no solo la veremos en nuestra pc de escritorio.
Tenemos 12 meses para ver los resultados de estas tendencias. Tal vez veamos cómo algunas, resultan vencedoras y algunas otras terminan en el olvido, pero cierto es que la tecnología y el desarrollo web se mueve muy rápido.

Listo!

miércoles, enero 01, 2014

Crear un sitio de una página con desplazamiento usando Foundation

Tutorial para crear un sitio web de una página (onepage website) con desplazamiento local (smooth scroll) usando el marco de trabajo Foundation de Zurb.



En ésta ocasión me voy a aventurar a crear un pequeño tutorial para crear un sitio web de una pagina, que ahora están muy de moda, usando como base Foundation. 
Foundation es un muy buen marco de trabajo (framework en inglés) para desarrollar sitios de forma rápida y sobretodo que sean ajustables a la pantalla (responsive en inglés).
Es así que empecemos con este tutorial; para comenzar necesitaremos descargar:
  1. Foundation Zurb - http://foundation.zurb.com/  
  2. Jquery Smooth Scroll Plugin - https://github.com/kswedberg/jquery-smooth-scroll

HTML

Comenzaré por crear una página sencilla la cual estará formada por una galería de fotos y un mensaje que será la sección de bienvenida del sitio, para esto usaremos el componente javascript que incluye Foundation llamado Orbit. En la sección siguiente a la bienvenida, irá una barra de navegación que servirá para desplazarse y el resto de la pagina serán las secciones propias del sitio web; en términos generales debe quedar algo parecido a lo siguiente:



CSS

Para el ejemplo se necesita que las secciones de página tengan una altura mínima y además un poco de espacio entre sección y sección, para esto se necesita agregar en la sección de "head" unas cuantas lineas de estilo que darán un poco de forma a la página web:

 <style type="text/css">
 .page-section {padding-top:20px;min-height:650px;border-top:solid 2px gray}
 .page-section-first {padding-top:60px;}
 .page-divider {min-height:100px;}
        </style>

Ahora se debe aplicar la clase de estilo ".page-section" a las secciones en nuestro código de html:


MAGELLAN

Lo siguiente, es configurar el componente de javascript "Magellan" que viene incluido en Foundation. Este componente permite desplazar el contenido de la página y al mismo tiempo se vuelve una barra fija en la parte superior del navegador, es decir es un famoso menú pegajoso (sticky menu en Inglés):

Se ha agregando una clase de estilo "magellan-link" a todos los enlaces de el menú de navegación, esta clase se usará con el javascript smooth scroll.

Ya en este punto se deben crear los destinos de los enlaces de el menú de navegación usando de "data-magellan-destination" en los encabezados (en las etiquetas <h2>) de cada seccion:

<h2 id="section-1" class="page-section-first" data-magellan-destination="section-1">Empresa</h2>
.
.
.
<h2 id="section-2" data-magellan-destination="section-2">Servicios</h2>
.
.
.
<h2 id="section-3" data-magellan-destination="section-3">Productos</h2>
.
.
.
<h2 id="section-4" data-magellan-destination="section-4">Contacto</h2>

En el primer encabezado existe una clase extra, que lo único que hace es agregar un poco de margen superior a la primera sección.

SMOOTH SCROLL

El turno de usar el agregado de Jquery: smooth-scroll, el cual permitirá que el efecto de desplazamiento por la página tenga una mejor animación:

<script src="js/jquery.smooth-scroll.min.js"></script>
<script>
$("a.magellan-link").smoothScroll({offset: -60, speed:1000});
</script>

El numero -60 para el valor offset esta basado en el alto de 65 pixeles que tiene la barra de
El código anterior debe ir al final, antes de cerrar la etiqueta de body. Con esto ultimo el sitio web de una pagina con desplazamiento quedará funcionando.

EXTRA

En muchos sitios que usan esta forma de navegación se presenta un botón al inicio de la pagina, por lo cual en la sección de bienvenida se puede agregar un botón de la siguiente forma:

<div class="text-center">
 <ul class="button-group">
   <li data-magellan-arrival="section-1"><a class="magellan-link button" href="#section-1">ir a sitio</a></li>
 </ul>
</div>

Otra modificación es agregar un enlace al inicio de la página mediante el menú de navegación. Primero habrá que poner un ancla al inicio de la misma despues de la etiqueta body:

<a name="home" id="home" data-magellan-destination="home"></a>

Y finalmente se modifica la barra de menu:


<h1><a data-magellan-arrival="home" class="magellan-link" href="#home">Mi Sitio</a></h1>

Listo!

El código fuente puede ser descargado en https://github.com/vgarcias/onepage-ss-foundation
Y un demo puede ser visualizado en http://vgarcias.github.io/onepage-ss-foundation/