Una solución sería desarrollar diferentes versiones de nuestro website para dispositivos móviles, tablets y computadoras de escritorio, sin embargo esto nos trae problemas de mantenimiento y se vuelve tedioso al cambiar información. Otra solución son los llamados “responsive layout“, que significa que la estructura de nuestro website cambia dependiendo del tamaño de pantalla en el cual se visualiza.

Les presento Twitter bootstrap, un toolkit de archivos HTML, CSS y JS creado desde cero por personal experimentado de Twitter, que te ayudará a empezar y agilizar tu diseño web. Algunas características que ofrece son:

• Estructura de 12 columnas
• Tamaño pequeño de 10kb (comprimido)
• Diseño adaptable
• Plugins personalizados de Jquery
• Compatible con todos los navegadores modernos incluído IE7
• Soporta HTML5
• Soporta CSS3

Entre otras bondades que tiene, es que ya trae mucha funcionalidad integrada, evitando que tengas que reinventar el hilo negro cada vez que diseñas un website. Puedes agregar una gran variedad de elementos en 1 2 por 3:

• navegación con menús desplegables
• tabs dinámicos
• acordeones
• ventanas modales o popups
• barras de progreso
• tooltips
• botones
• paginación
• carrusel
• autocompletado
• etc.

Todo esto ya viene preparado para verse bien en cualquier navegador, y se degrada correctamente para navegadores antiguos.

Un ejemplo de lo que se puede hacer con bootstrap: podemos tener un diseño de 2 columnas expandidas al 100% normalmente, pero cuando se visualiza a través de un celular, se apila una columna encima de otra y se hacen 1 sola, de manera que resulta mucho más fácil de navegar y sin necesidad de hacer zoom.

Otra de las ventajas es que a las imágenes se les puede agregar una clase de manera que nunca excedan el 100% del tamaño de la columna en la que están, así nunca excederán el ancho de pantalla de un celular. Bootstrap expande cada columna a la proporción correcta, no importa el ancho de pantalla, siempre se verá bien en cualquier dispositivo y aprovechando al máximo toda el área de pantalla.

Pero, ¿cuál es el truco? Bootstrap utiliza los llamados media queries, que básicamente es código CSS condicional, y solamente aplica dependiendo del tamaño de pantalla. Por ejemplo el siguiente código solamente aplica para pantallas celulares menores a 480px:

@media (max-width: 480px) {}

En seguida puede ver un ejemplo de una página que se expande al 100% de la pantalla y en la segunda imagen se adapta dependiendo del dipositivo con el que se visualiza.

1-. Registrar tu dominio

Lo primero que debes hacer es elegir el dominio perfecto para tu negocio (ejemplo.com). Aquí te presentamos algunos tips para elegir tu dominio.

2-. Contratar un plan de web hosting

Necesitarás una cuenta de hosting donde puedas hospedar todos tus archivos, instalar el software necesario para la tienda, y archivar los correos personalizados que manejes.

3-. Instalar PrestaShop o Magento

PrestaShop es un software de código libre para crear tiendas en línea y es uno de los mejores que existen actualmente. En cuanto a funcionalidad tiene más de 275 características en una instalación básica y es muy fácil de utilizar. Magento también es excelente opción, pero se recomienda más para manejo de multi-tiendas, y tiene más opciones que PrestaShop, pero es un poco más difícil de manejar. Al final la elección depende de gustos, pero generalmente con PrestaShop es más que suficiente, y la tendrás en línea rápidamente.

5-. Añadir productos

Si se tienen una docena de productos, lo recomendable sería agregarlos manualmente uno por uno. Sin embargo, si tu catálogo consta de cientos o miles de productos, lo más recomendable sería importarlos desde un documento de excel o documento CSV (comma separated values). PrestaShop tiene una herramienta para hacer justo esto, que te permitirá agregar todos tus productos en poco tiempo.

6-. Elegir una plantilla prediseñada

Lo más probable es que no te guste del todo el diseño predeterminado de la nueva tienda en línea, y para ello existen miles de plantillas para elegir el diseño que más nos guste. Podrás encontrar muchas plantillas en la página de PrestaShop, y una rápida búsqueda en Google nos arrojará miles de plantillas, algunas son premium y hay que pagar por ellas y otras son gratis. Las plantillas son fáciles de instalar desde el panel de administración de nuestra tienda.

7-. Configurar opciones de pago

Al momento de poner una tienda en línea, es obvio que la forma tradicional de pagar en efectivo no funciona. Por ello se deben optar por otras opciones, tales como depósito bancario y transferencias electrónicas. Una opción muy popular para aceptar pagos en línea y tarjetas de crédito es por medio de una empresa intermedia, tales como Paypal o Google Checkout. Ambas opciones son reconocidas a nivel mundial y la gente confía en ellos para realizar sus transacciones con tarjetas de crédito, por lo que es importante considerar alguna como opción de pago para tus clientes. Para configurar las opciones de pago basta con activar o desactivar los módulos correspondientes en el panel de administración de su tienda en línea y configurar 3 o 4 parámetros en cada una.

8-. Configuración de opciones de envío

No todos los clientes quieren o pueden ir físicamente a tu tienda a recoger su pedido, por lo que deberás dar un par de opciones de envío tal como UPS, Fedex, DHL o envíos locales. Su configuración es muy similar a dar de alta opciones de pago, basta con activar algunos módulos de envío.

9-. Tienda en línea lista

Eso es todo desde el punto de vista técnico, tu website está listo para empezar a recibir pedidos. Ahora depende de ti mantener actualizados los precios, implementar un plan de publicidad. No te preocupes si no recibes muchos pedidos al principio, tomará tiempo en que tus productos aparezcan en Google y que la gente empiece a conocerte en este medio. Te recomendamos publicar de vez en cuando contenido de interés para tus clientes en un blog por ejemplo, lo que te ayudará a un mejor ranking de tu website en las búsquedas de Google. ¡Te deseamos suerte en este nuevo mundo del comercio en línea!

Contáctanos si requieres ayuda para implementar tu tienda en línea, nuestros asesores te ayudarán.

border-radius

En antaño, se debía crear imágenes específicas para las esquinas de los recuadros si se quería redondear una caja de contenido, o utilizar JavaScript. CSS3 hace muy fácil crear esquinas redondeadas. Incluso se pueden crear círculos o esquinas con diferente proporción de redondeado individual.

Ejemplos

box-shadow

Para crear sombras, también se tenía que recurrir a editores de imágenes para crearlas y luego introducirlas mediante varias capas de contenedores para dar la apariencia de sombras. Box-shadow creará sombras de todos tipos y tamaños. El formato es el siguiente:

box-shadow:HORIZONTAL VERTICAL DIFUMINACION COLOR;

Ejemplos

text-shadow

Text-shadow nos permite hacer cosas interesantes con sombreado de texto. Puede agregar el aspecto de embebido (color claro abajo y oscuro arriba) o realzado (color oscuro abajo y claro arriba). También se pueden agregar varias sombras separadas por coma para crear efectos interesantes. El formato es el siguiente:

text-shadow:HORIZONTAL VERTICAL DIFUMINACION COLOR;

Ejemplos

Colores RGBA

Aunque no es propiamente una propiedad, vale la pena mencionarlo. Antes de CSS3, existían colores RGB, que son colores con formato Red Green Blue (rojo,verde,azul). Ahora con RGBA se agrega el canal Alpha, que significa transparencia. Se pueden lograr efectos muy interesantes, tal como tener una imagen de fondo, y un recuadro con texto que sea semitransparente. El formato es el siguiente:

rgba(ROJO,VERDE,AZUL,ALPHA)

Ejemplos

@font-face

Técnicamente tampoco es una propiedad, pero ha tenido un auge últimamente al permitirnos embeber nuestra fuente preferida a nuestro diseño. Google fonts también ha popularizado este método al ofrecer una colección considerable de fuentes de uso libre. Puedes buscar una fuente que se adapte a tu diseño en http://www.google.com/webfonts

Ejemplos

Hoy en día el avance de los negocios a través de la red es irremediable, todas las empresas tienen un website en el que desarrollan su negocio; desde los bancos online, pasando por las librerías digitales como Kindle y, por supuesto, las páginas de juego online como gamblingplanet.

Uno de los soportes más utilizados para los websites es WordPress, con el nuevo año llega una versión mejorada, la 3.3.1, que ya se encuentra disponible para su descarga.

Parece que las novedades son muchas y realmente interesantes, entre ellas, WordPress 3.3 mejora su usabilidad ya que permite subir archivos sólo con arrastrar y soltar. Además, a diferencia de las versiones anteriores, la barra y la cabecera de administración aparecen unidas.

Los menús también son novedosos y aparecerá una pantalla de bienvenida cada vez que actualicemos o que instalemos una nueva aplicación. Asimismo, se incluye un mejor soporte para el iPad y demás tablets, obedeciendo al incesante crecimiento del mercado de este tipo de dispositivos.

Con la crisis hay que agudizar el ingenio para hacer que los negocios salgan adelante. La web puede ser la manera perfecta de publicitar nuestro negocio y WordPress el soporte ideal para aquellos que quieran empezar a utilizar el mundo virtual en favor de las ventas. Ya sea para vender sofás o publicitar un sitio de blackjack, WordPress puede ser una solución fácil y rápida.

Los programadores web utilizan Joomla y WordPress como base para diseñar el website, ya que el usuario final, el cliente, no tiene nociones de como administrar o actualizar el contenido si fuera puro código HTML o PHP. Joomla y WordPress tienen interfases más amigables para actualizar texto, imágenes y administrar muchas otras funciones de manera gráfica e intuitiva. Sin embargo, cuando el website requiere de secciones muy específicas, se necesita programar en php. Es aquí donde los programadores web tienen un dolor de cabeza muy grande al utilizar Joomla o WordPress, ya están muy lejos de ser amigables a la hora de personalizar su código.

El diseñador web elige la plataforma adecuada dependiendo de las necesidades del cliente, si es un portal para crear una comunidad, probablemente elegirá Joomla. Si es un blog o se desea mucha facilidad de uso, elegirá Wordpress.

Hoy en día Concrete5 está ganando terreno sobre estas dos plataformas. Si pensaba que WordPress es sencillo, Concrete5 lo es todavía más. A diferencia de los otros, que están pensados de desarrollador a desarrollador, olvidando al usuario final, o viceversa… Concrete5 es amigable para el programador, el diseñador, y para el usuario final.

Para el diseñador, puede echar a volar su imaginación y diseñar lo que sea, y cualquier plantilla de Internet se puede convertir a plantilla de Concrete5, en menos de 5 minutos.

Para el desarrollador, Concrete5 destaca mucho sobre otros sistemas. Basta con tomar la plantilla de diseño del diseñador, agregar un par de líneas de código, y listo, la plantilla se vuelve editable vía web con cualquier navegador. Otra gran fortaleza es que se puede combinar PHP en cualquier página de Concrete5 sin interferir con el funcionamiento base de Concrete5, lo cual es muy difícil de hacer en la mayoría de los CMS. Si por alguna razón debes modificar un poco el código fuente de Concrete5, no hay problema puedes realizar una copia y modificarla, el software usará tu copia, y la innovación consiste en que al momento de actualizar la versión del software, respeta todos los cambios que hayas hecho en el código fuente, y no se sobrescribe como pasa en otros sistemas, lo cual era muy tedioso. Otra de las grandes bondades para el desarrollador, es que viene con todo y una API o framework integrada. Es decir que trae sus propias librerías para que puedas usarlas y realizar muchas cosas de manera programática rápidamente, tales como leer información de usuarios, agregar páginas, escalar imágenes, etc. Y por si esto fuera poco, Concrete5 es muy eficiente, siendo más rápido incluso que WordPress salido de la caja, ya que viene con un sistema de caché de manera predeterminada.

Para el usuario final, ya no es necesario entrar a una sección de administración para editar el contenido de cada página, sino que simplemente se navega a la página que se desea editar, clic en el botón de Editar, y el contenido de la página puede ser editado ahí mismo, moverse de lugar, y hacer muchas cosas más como insertar videos, un formulario, una encuesta, comentarios, galería de imágenes, etc. Esto hace que actualizar la información del sitio sea muy intuitivo, fácil y rápido para el cliente.

Aquí se muestra una de las características más fuertes de Concrete5, que es la edición en línea directamente en la página.

Concrete5 tiene otras fortalezas, tal como un gestor multimedia integrado, registro de usuarios complementado con un sistema de permisos muy completo, la estructura de navegación es muy fácil de crear, y se pueden instalar plugins directamente desde su panel de administración. Una desventaja que cabe destacar es que solo hay unos cuantos cientos de plugins. Sin embargo, utilizando su framework, y la habilidad de utilizar php en todas sus páginas, lo hace una opción bastante viable para crear websites muy completos, bastante personalizados, y lo mejor de todo, es open source. Así que si eres un diseñador o programador web y sufres con las restricciones de programación y complejidad de Joomla y WordPress, entonces Concrete5 es para ti.

Si deseas utilizar Concrete5, lo puedes autoinstalar con un clic desde nuestro panel de control, o pregunta a nuestro staff para su instalación. Si eres diseñador web, contacta a nuestro staff, tenemos ofertas especiales para ti.

Si quieres crear un portal completo, una comunidad, secciones de acceso con membresía o foros, entonces Joomla es buena opción, ya que fue creado de esa manera. Crear la estructura de navegación es fácil una vez que sabes como funciona y no requiere de conocimientos de html. Si no quieres batallar dándole diseño a Joomla, puedes comprar una plantilla profesional por $35 a $50 dólares en Internet, encontrarás miles.

Tiene demasiadas opciones en su sección de administración, que te pueden marear la primera vez que entras. Si no quieres perder varios días, deberás leer tutoriales antes de aprender a usarlo por completo. Joomla puede ser muy completo, pero su curva de aprendizaje es tediosa y da dolores de cabeza hasta a los desarrolladores más experimentados. Otra desventaja es que es muy demandante al servidor si no se tiene optimizada la base de datos, y si además le agregamos unos cuantos plugins externos, se vuelve algo lento.

En corto, lo que tiene Joomla de poderoso lo tiene de complejo.

Por otro lado, Wordpress es una de las plataformas más sencillas de usar disponibles en Internet. Aunque mucha gente piensa que WordPress es utilizado solamente para blogs, se configura fácilmente para utilizar en otras aplicaciones, instalando plugins de los miles que hay en su repositorio. La instalación en un servidor es muy fácil, ya que WordPress presume de instalarse en un solo paso. WordPress permite crear websites en un par de horas incluso si no tienes conocimientos técnicos, ya que su curva de aprendizaje es muy amigable.

Una gran ventaja de WordPress es que tiene su código estándar, lo que significa que Google lo ama, y para cuestiones de marketing, y ranking en los buscadores, es difícil resistirse. Con WordPress he visto websites aparecer en Google en cuestión de 2 días, cuando otros websites pueden tardar 1 mes.

En conclusión, la opción que elijas entre estos 2 sistemas dependerá del uso que le pretendes dar a tu website y de tu conocimiento en diseño y desarrollo web. Cuando comparas la simplicidad de ambos sistemas, notarás que WordPress es mucho más fácil de usar y administrar.

Si deseas utilizar alguno de ellos, encontrarás el autoinstalador de 1 clic en nuestro panel de control. Adicionalmente podrás autoinstalar más de 200 scripts con Softaculous.

Primero, vamos a hablar sobre lo que es HTML5 y para que se usa. HTML es un lenguaje usado para diseñar y dar estructura a las páginas web. HTML5 es una nueva versión del lenguaje HTML que tiene más etiquetas, y por ende más opciones de diseño.

La mayoría de la gente concuerda que más opciones de diseño es bueno. La controversia recae en que ciertas compañías actuan como si HTML5 fuera el estándar, cuando la realidad es que ningún navegador lo soporta al 100% todavía.

Esencialmente, para los diseñadores web significa que casi nadie verá el website que están creando tal como fue pensado. Definitivamente HTML5 y sus aplicaciones nos darán websites mucho más atractivas y mejores, simplemente todavía no es práctico usarlo para tus diseños web.

Se probaron algunos de los navegadores más populares para ver cuan listos están para HTML5, y los resultados son muy claros. Para ello se usó http://www.html5test.com, el cual ofrece un sistema de puntaje hasta 400 puntos dependiendo de cuantas características de HTML5 soporta tu navegador.

Chrome 14.0 fue el ganador con 340 puntos de 400 posibles. Este navegador ha implementado la mayoría de la funcionalidad para ser compatible con HTML5. Adicionalmente, muchas de las características que no han sido añadidas ya son soportadas parcialmente. Así que Google Chrome está por mucho al frente de la carrera.

En seguida se encuentra Mozilla Firefox 7.0 con 313 puntos, Todavía les faltan ciertos elementos, pero obtuvo puntos bonus por su excelente soporte a video y sus reglas de parsing.

Internet Explorer, como de costumbre, está muy por detrás de los demás. Con su versión Internet 8 obteniendo 32 puntos de 400, y en su versión 9 obteniendo 141 puntos. Es muy mala calificación para lo que alguna vez fue el navegador más popular del mundo. Internet Explorer ha estado tratando de acatar los estándares internacionales en cuanto a CSS se refiere, sin embargo ha dado mucho que desear, ya que ni siquiera soporta al 100% los estándares CSS3, y no parece haber muchos cambios a futuro.

Así que, aquí están las estadísticas. Por el momento el único navegador que te puede llevar lejos es Google Chrome, y, hasta que todos los navegadores se actualicen, es muy recomendable usar HTML5 solo esporádicamente en tus diseños, hasta que realmente sea un verdadero estándar.

Muchas veces, cuando empiezo a laborar con un cliente nuevo, mi relación parte con el propietario de la pyme. La principal ventaja de este proceder es que logro conocer el alma y el corazón del proyecto de negocio y así obtengo una imagen todavía más clara de los objetivos de la empresa.

En el camino de hacer crecer una pyme, a menudo es de vital importancia para los propietarios contratar a un profesional de mercadeo para que les ayude con sus esfuerzos publicitarios en áreas como creación de marca, de papelería promocional, elaboración de boletines y desde luego, la construcción de un website para la pyme.

La importancia de un website para tu pyme, no puede ser desestimada. Es más, contar con un website es señal de que tu pyme está progresando y está creciendo.

Es necesario que el propietario de una pyme comprenda que la transición de estar involucrado con el sitio a no estar involucrado es un proceso que ocurre poco a poco. Comprendo muy bien que la razón de tener un especialista en mercadeo a cargo es para liberar de tiempo al propietario. Pero como has de saber ya, no es igual decirle a alguien: “Necesito que te hagas cargo de elaborar el próximo folleto publicitario”, a decirle a esa misma persona: “Necesito que te encargues del website”, ya que como sabemos, la estrategia para tu website no es tan sencilla como la de un folleto.

Tan solo permíteme darte un ejemplo claro. Digamos que estás en el negocio restaurantero y eres dueño de un pequeño restaurante; has estado operando algunos años y te está yendo bien. Un día, te das cuenta que el local de al lado está disponible. Es una fabulosa oportunidad para ampliar tu local. Contratas a un arquitecto para adaptar el nuevo espacio, decides que la tarea de rediseño está fuera de tu rango de experiencia y dejas todas las decisiones en manos del arquitecto. Lo más seguro es que esta no sea una buena decisión, ya que sabes que el arquitecto no cuenta con la experiencia en el restaurante que tu tienes como propietario.

Lo que trato de decirte con esto es que cuando valoras la importancia de un website para tu pyme, no puedes separarte por completo del website del mismo modo que no puedes separarte de tu negocio.

Tú, como dueño de una pyme necesitas involucrarte y comprender tu estrategia para Internet, ya que nadie más que tu sabe sobre la importancia de un website para tu pyme.

En cuanto a sus clientes no esperaron para reclamar en la página de Facebook de la empresa, o realizar comentarios alusivos al tema en sus cuentas de Twitter. Algunos tweets aseguraban que los comentarios en Facebook desaparecían “misteriosamente” y se quejaban de la poca información que se publicaba al respecto.

1and1 afirmó que a partir de las 5pm la crisis había sido superada, sin embargo al filo de las 8pm CST, algunos usuarios todavía publicaban tweets furiosos que sus websites estaban fuera de línea.

La explicación que da la compañía a este inusual evento es que tuvieron un problema de base de datos combinado con un error de software, lo que llevó a la la penosa falla. Así mismo hicieron énfasis que no afectó del todo a todos sus servicios, sino que se limitó el daño a clientes de servidores dedicados y VPS.

Desde hace ya tiempo que Google utiliza las tecnologías en la nube, y están comprometidos con el medio ambiente. Prueba de ello son todas las medidas que han adoptado para reducir su huella de carbono, y constantemente analizan sus servicios para compararlas con otras alternativas más eficientes.

Más de 4 millones de empresas han cambiado sus servicios de correo a Gmail, el cual no solamente provee una bonita interfase y muchas herramientas, sino que es alrededor de 80 veces más eficiente energéticamente hablando que un sistema de correo hospedado en servidores de la empresa. Esto se debe a que las tecnologías de hosting en la nube (cloud hosting) son hospedados en centros de datos altamente eficientes que operan a un porcentaje mayor de utilización del servidor, y utilizan hardware y software especialmente diseñados para esa aplicación, condiciones que pequeñas empresas rara vez pueden crear por si solas.

Todavía hay mucho que aprender de los impactos globales de la computación en la nube, pero una cosa podemos afirmar con certeza, la utilización de servicios de email, video, o hosting de websites son más eficientes y ecológicas en servidores en la nube, ayudando así a reducir los efectos del cambio climático en nuestro planeta.

Fuentes:
http://gmailblog.blogspot.com/2011/09/gmail-its-cooler-in-cloud.html
https://www.cdproject.net/en-US/WhatWeDo/Pages/Cloud-Computing.aspx