Curso taller de gestin y configuracin de tiendas online

MDULO 1. INTRODUCCIN A LA GESTIN ONLINE DE CONTENIDOS DIGITALES. Internet como modelo econmico. El desarrollo y la evolucin de Internet ha permitido el nacimiento de un nuevo modelo econmico, basado en la desmaterializacin de la economa, y que permite su utilizacin en todos los procesos de la empresas. En contadas ocasiones un medio de comunicacin ha supuesto tal revolucin en el mercado, modificando los cnones y actores que han intervenido en la ley sobre la oferta y la demanda. Internet ha supuesto para la economa lo que otros revolucionarios avances ya lo fueron en su poca, como puede ser el caso del ferrocarril. Actualmente, la inversin en nuevas tecnolgas y la renovacin de la infraestructura tecnolgica se convierte en una pieza clave para que las empresas y organizaciones empresariales, pues adems de aumentar significativamente su productividad, puedan llevar sus productos hasta sectores de mercado en los que antes era impensable poder llegar. Por todo ello, la competitividad de las empresas se ve mejorada. La mayor influencia de la red dentro del entorno de la empresa, se produce dentro de los canales de comunicacin, pero no solo en lo que se refiere a la posibilidad de vender el producto en cualquier lugar del mundo, sino en la ventaja de la retroalimentacin. Con los nuevos formatos que surgen fruto de la evolucin de Internet, como el caso de blogs o redes sociales, el cliente ayuda a configurar los servicios e influye en el desarrollo de los mismos.

Por este motivo, ya no solo se habla de la influencia que pueda tener sobre la economa, sino de la configuracin de un nuevo modelo econmico con sus propias leyes reguladoras. Internet y sus beneficios para los negocios. Desde el correo electrnico al comercio electrnico, Internet ha recorrido un largo camino y por todos son conocido los beneficios y ventajas estratgicas que puede aportar a la empresa. Sin embargo todava queda un largo camino por recorrer y este requiere que las empresas que lo sigan posean una base tecnolgica y conocimiento para poder adaptar estas soluciones dentro de sus organizaciones. Cada da surgen nuevas plataformas que posibilitan a la empresa el descubrir las funcionalidades y servicios que Internet ofrece, posibilitando que estas ventajas no sean slo para una pequea elite. La evolucin de los modelos de negocio en internet han venido marcadas en el tiempo por el grado de complejidad tecnolgico que implican frente a las funcionalidades que aporta cada uno de los distintos modelos. Podemos hablar de los inicios de la empresa en internet comenzando por el descubrimiento de las ventajas que el uso del correo electrnico represent para las comunicaciones de la empresa. Siguiendo por las primeras presencias de la empresa en Internet, a travs de webs corporativas, en la mayora de los casos con informacin esttica y de escaso valor aadido y con el nico objetivo de la presencia publicitaria. Ms all de esta simple presencia corporativa o del estar por estar, sin objetivos ni estrategias definidas, se encuadran las actuaciones dentro de lo que entendemos por estrategias de comercio electrnico, dentro de las cuales encontramos desde catlogos electrnicos de productos a plataformas ms avanzadas en cuanto a funcionalidades y herramientas de contenidos. La gran capacidad del comercio electrnico en la reduccin de costes de distribucin, la posibilidad de acceder a nuevos mercados, el rpido retorno de la inversin y la posibilidad de un gran impacto en el mercado,

han sido las grandes bazas por las que la empresa ha realizado presencias ms activas en internet. Estas grandes ventajas aportadas por internet a la empresa no han hecho ms que vislumbrar el futuro de posibilidades para la adopcin de nuevos modelos empresariales basados en internet. Es de la experiencia de la pequea y mediana empresa en internet, donde esta se plantea el uso de este medio no solo como herramienta para el ensanchamiento del mercado potencial, sino tambin como herramienta para la mejora de los procesos de negocio, tanto en su operativa interna (escasamente planteada por la empresa hasta ahora), como en su operativa externa (cubriendo no slo los procesos de negocio en internet sino toda la red de venta, distribucin y logstica que rodean a la empresa). Justo en este punto entraramos en el terreno del negocio electrnico y las soluciones B2B, que conducirn a una empresa ms racional que pretende adaptarse a las nuevas formas de comercio que el nuevo mercado demanda. Esta transicin del e-commerce al e-business, implica de los directivos encargados de evaluar estas actuaciones, un cambio de mentalidad: de estrategias centradas en el producto y la venta, a estrategias centradas en el cliente, el valor aadido y la optimizacin de todos los procesos de negocio. La perspectiva empresarial de internet se ensanch y se pas de verlo como un medio para comprar, vender, comunicar y publicitarse, a verlo como una herramienta de gestin empresarial global, que acerca al pblico a la realidad de una empresa que interacta con proveedores, clientes, procesos productivos y con otras empresas al mismo tiempo. Si el comercio electrnico o e-commerce, ha sido la evolucin del propio comercio, el e-business es la evolucin lgica de los modelos de gestin tradicionales. De la urgencia para la comprensin y adopcin de modelos de e-business por parte de la empresa, nos da buena cuenta el hecho de que la industria del software, Microsoft y Oracle entre ellas, empezase a implantar en todas sus plataformas estndares como XML, en bsqueda de mejoras en los sistemas transaccionales de interaccin con terceros. Esta tendencia llevar al uso generalizado de soluciones empresariales de gestin global basadas en internet para todo tipo de empresas, con independencia del tamao y sector en el que desenvuelvan su actividad, y esta dinmica, de una empresa interconectada con

su medio ambiente, si ser la autntica revolucin de internet, la revolucin que llegue a todos independientemente del posicionamiento o predisposicin a adoptar las nuevas tecnologas, pues la empresa que no este en internet en unos aos, prcticamente no ser empresa, y estar no significara disponer de una web corporativa y un catlogo de productos, significar aprender a interactuar y relacionar los procesos de negocio.

El tipo de soluciones empresariales que aporta el e-business no son algo nuevo y muchos de los conceptos han sido introducidos por los sistemas EDI (Intercambio Electrnico de Datos) tradicionales, usados por las grandes corporaciones para la gestin de sistemas de compra-venta en sus cadenas de suministro. Pero la implantacin de sistemas EDI, resulta todava hoy demasiado costosa, debido a la tecnologa sobre la que estn basados, y es aqu donde se imponen las soluciones de e-business, por su poder de implantacin en entornos empresariales donde antes resultaba prohibitivo. La ventaja competitiva de soluciones e-business basadas en internet sobre los sistemas EDI tradicionales, ha venido propiciada por la propia evolucin de internet y de los lenguajes de desarrollo de aplicaciones como el ya mencionado XML. Las nuevas tecnologas han proporcionado a la Pyme soluciones empresariales ms econmicas y viables que le permitirn conseguir los necesarios niveles de eficacia para competir al mismo nivel que antes lo hacan slo las grandes corporaciones. Internet y sus posibilidades estn por encima de modelos de comercio electrnico y del impacto meditico que ha sufrido la propia palabra Internet. Debemos diferenciar claramente entre internet como medio y los modelos de negocio (tanto

e-commerce como e-business) que puedan surgir basados en l. No cabe ninguna duda de que en los ltimos aos, internet ha aumentado enormemente la competitividad y productividad de las empresas, en especial aquellas que han sabido trasladar sus procesos de negocio tradicionales a internet, convirtindose en pieza fundamental dentro de la estrategia empresarial. La planificacin e implantacin de sistemas e-business y sus ventajas no siempre resultan sencillas de comprender y requieren por parte de los responsables de implantarlos, de una observacin detallada del medio ambiente donde la empresa desarrolla su negocio, tanto interna como externamente para poder as reflexionar sobre qu se quiere conseguir o mejorar, y evaluar las distintas soluciones disponibles. Modelos de negocio basados en la tecnologa de Internet. El e-business, o negocio electrnico, engloba a toda una serie de modelos de negocio basados en tecnologa Internet encaminados a mejorar las relaciones comerciales entre empresas, cadenas de aprovisionamiento, mercados verticales y un largo etctera de posibilidades. En ltima instancia un sistema de e-business puede tomar mltiples formas y es la empresa quien debe decidir la mejor o ms adecuada segn sus necesidades. A continuacin describiremos brevemente los modelos que con toda seguridad ms tendrn que aumir las empresas en los prximos aos: ERP (Enterprise Resuorce Planning). Podemos considerar este software como la tecnologa subyacente de gestin interna sobre la cual basar el resto de modelos de negocio de e-business. El trmino ERP deriva de MRP (Material Requirement Planning) herramienta para el control de procesos productivos. Los sistemas ERP administran los procesos internos del negocio para la optimizacin de la cadena de valor que sirve a todos los departamentos dentro de la empresa. El software ERP incluye diversas funcionalidades: facturacin, contabilidad, compras, produccin, transporte, informes de gestin y recursos humanos entre otras.

SCM (Supply Chain Management). Gestiona los procesos de negocio tanto internos como externos de la empresa implicando a todos los agentes que directa o indirectamente estn dentro del proceso, desde la produccin a la distribucin. El SCM incluye el aprovisionamiento de materias primas, proveedores, la atencin al cliente, la logstica y en general todo la cadena de valor de la empresa, optimizando los procesos ms que automatizndolos, como es el caso del ERP. CRM (Customer Relatinship Management). Dirigido a todos los aspectos relacionados con la atencin y el servicio al cliente, coordina a todos los departamentos involucrados en esta atencin: departamentos de ventas, marketing y relaciones con los clientes. Las soluciones CRM gestionan conjuntamente el servicio de reclamaciones, la gestin de incidencias, vendedores y seguimiento de ventas. Al funcionar sobre sistemas de Datawarehouse permiten obtener perfiles de usuario, preferencias y hbitos de compra. Marketplaces. Mercados virtuales para la venta, compra e intercambio de informacin entre mltiples participantes. Bsicamente consiste en un directorio de empresas con informacin sobre los productos de cada una donde compradores y vendedores buscan productos o servicios, solicitan ofertas y procesan pedidos. E-procurement. Abastecimiento electrnico de productos y servicios va internet. Bajo estas plataformas se gestionan los procesos de compra a proveedores bien sean compras de productos directos (implicados en el proceso de produccin del producto final): materias primas, o indirectas (no implicadas en el producto final): papelera, informtica, servicios varios. La principal ventaja del uso de estas plataformas radica en el ahorro de tiempo en la gestin de compras, la comodidad y la reduccin de los precios

de adquisicin de productos y la posibilidad de acceder a nuevos proveedores. Otros. Existen ms modelos de e-business como el BI (Business Intelligence) centrado en el apoyo a la toma de decisiones y la evaluacin de indicadores de negocio. El KM (Knowledge Management) para la gestin del conocimiento y cuyo objetivo es lograr que la informacin dentro de una organizacin llegue a todo aquel que la necesite, procesada de forma tal que sea posible llevarla a la prctica. Es preciso comentar que la empresa debe comprender estas mltiples de llevar un negocio electrnico a cabo y conocer las posibilidades para poder as aplicar modelos personalizados basados en las necesidades de cada organizacin. Esto es lo que se denomina la convergencia en los distintos modelos de e-business para llegar a la e-organizacin. Como vemos, este nuevo uso de internet como herramienta de apoyo a la gestin global de la empresa no se presenta como la nueva solucin para obtener grandes beneficios. Lo que nos muestran estas soluciones son una nueva visin de internet como un terreno de enormes posibilidades para el desarrollo y fortalecimiento de las empresas. El comercio electrnico en Espaa. El entorno tecnolgico en Espaa para la implantacin de soluciones e-business dista an mucho de lo deseable. A pesar de que la gran mayora de las empresas disponen de conexin a internet, la escasa infraestructura tecnolgica, el desconocimiento de las potencialidades que internet tiene para la empresa y la falta de visin e inadaptacin a las nuevas formas de mercado se configuran como los principales factores que retraen a la empresa para implementar este tipo de soluciones. Adems, si lo que la empresa busca es la integracin total de todos sus procesos y la adaptacin de estos a soluciones de e-business, la curva de adaptacin a las nuevas formas de trabajo y el alto costo en formacin y medios, resultan en un significativo esfuerzo por parte de la empresa para la adopcin de las nuevas mecnicas de trabajo. El reto de los desarrolladores es mostrar a la empresa los

servicios concretos y herramientas que internet puede ofrecer, dejando que el empresario y el trabajador se beneficien de ellos. A medida que las empresas adquieran el necesario bagaje tecnolgico y conocimiento de las reglas de la nueva economa, comenzarn a establecer las relaciones interempresariales que propicien la explosin de estos modelos de negocio entre las empresas y su entorno. La pequea y mediana empresa espaola adaptar estos modelos al igual que adopt internet en su momento, pero el ritmo de implantacin ser sin duda bastante ms corto.

El futuro de la empresa en internet pasa por el desarrollo de soluciones personalizadas de e-business. Un ejemplo: breogan.com. Un ejemplo sobre todo esto que estamos viendo es el sitio breogan.com. Este sitio es principalmente una plataforma de e-procurement pero que ana bajo un mismo interface web, las funcionalidades ms inmediatas que una empresa puede necesitar en internet. As, Breogan.com presenta en forma de agenda de tareas personalizada, el acceso a un mercado invertido de productos y servicios, sistema de subastas, gestin de recursos humanos y freelance, viajes y encuestas de mercado. La idea es poner al alcance de la empresa las herramientas bsicas para comenzar a beneficiarse de las posibilidades que internet puede ofrecerle. Ya no es necesario el movernos de una a otra web en busca de distintas herramientas: una web donde subastar nuestros productos, otra donde gestionar recursos humanos, varios marketplaces y mercados verticales donde interactuar. Lo que se

ha hecho es poner todas estas funcionalidades bajo una misma plataforma de acceso gratuito. Surgida como sistema de e-procurement al servicio tanto de compradores como de vendedores la idea ha ido evolucionando a medida que se agregaban nuevas funcionalidades. La plataforma resultante es una extensin de los sistemas de e-procurement cerrados para compras directas, que alcanza a cualquier persona dentro de una organizacin para la adquisicin de forma rpida y eventual de productos indirectos. La idea era crear un sistema de abastecimiento electrnico pero al mismo tiempo proporcionar las herramientas necesarias para ser ms competitivos y entrar en un mercado interconectado y global. Las conclusiones del e-commerce. No cabe duda de que la empresa espaola (un 90% de la cual es considerada Pyme) tiene en mente la adaptacin a los modelos de negocio de la Nueva Economa, tanto en la vertiente de gestin interna como en la externa en sus relaciones con los nuevos mercados y competidores. Sin embargo, no todas disponen de la capacidad suficiente para adoptar los modelos de negocio que la hagan ms abierta y competitiva. La base tecnolgica de la gran mayora de las empresas espaolas tiene todava mucho que evolucionar y es necesario el cambio de mentalidad hacia posiciones ms abiertas y flexibles respecto a las Nuevas Tecnologas. Es por ello necesario demostrar a las empresas las ventajas de los distintos modelos disponibles para que comiencen a pensar en como cada una de ellas puede beneficiarse de esta tecnologa. La implantacin de estas soluciones ser paulatina pero inevitable, conduciendo a la empresa y a la sociedad a la verdadera revolucin tecnolgica que abrir un enorme campo de posibilidades a todos por igual. Conceptos como innovacin, gestin del cambio y mejora continua medirn a partir de ahora la velocidad con que la empresa detecte y haga suyos los modelos ms

adecuados a sus organizaciones para encontrar las oportunidades de negocio y crecimiento que marcarn las diferencias en los prximos aos. La gestin de las tiendas online. Alternativas de las tiendas online. A la hora de montar una tienda online son muchas las dudas que pueden surgir a la hora de elegir entre distintas alternativas. Formas de montar una tienda online existen muchas y lo que tendremos que hacer es buscar la ms adecuada para nuestro negocio. Es importante mantener un criterio en la eleccin y para ello en este punto mostramos cuatro alternativas de gestin para montar una tienda online.

Lo primero que deber tenerse en cuenta es cmo se va gestionar y sobre todo quin va a gestionarla. Al igual que cuando emprendemos la aventura de gestionar un negocio se requieren unos conocimientos previos mnimos a la hora de poder gestionar la tienda, tambin se requieren para renovar los productos que ofrecemos a travs de la misma, etc. En la actualidad no es necesario ser un experto en diseo web, pero s se necesita una base de conocimiento y ciertas nociones en el tema que se maneja.

10

Diseo a medida. Es una buena opcin para todos aquellos que no tienen los conocimientos mnimos a la hora de gestionar el catlogo de productos de una tienda online. Se busca un profesional que disee y cree la tienda, que aada los productos que se quieran tener disponibles en el catlogo online y que monte la pasarela de pago de manera que el dueo de la empresa pueda despreocuparse y confiar en un trabajo bien hecho por un profesional. El mayor inconveniente que se tiene es que son tiendas estticas, es decir, que no renuevan el catlogo. Por lo tanto si se quieren hacer cambios se tendr que volver a contratar a este gestor para que vuelva a introducir ms artculos y sacar los que ya no se quieren vender. No se depende de un nico profesional ya que el diseo de la tienda puede ser continuado por otro profesional del sector, aunque dependiendo de la limpieza y anotaciones del mismo muchas veces es mejor partir de cero a la hora de volver a retocar la tienda online o nuestra pgina web corporativa, que por lo general van ligadas. Contratacin con proveedor de alojamiento. En este caso realizamos un acuerdo con la empresa que nos facilita el alojamiento de nuestra pgina web corporativa. Efectuamos un pago de cierta cantidad al mes y podemos crear nuestra tienda online de manera sencilla. Son necesarios unos mnimos conocimientos de diseo, no muy elaborados y que estn al alcance de casi todo el mundo. La parte positiva es que los asistentes automticos en lnea para crear la tienda online suelen ser bastante intuitivos de manera que se hace sencillo cargar artculos, darles una descripcin y borrarlos en caso de ser necesario. La integracin de la pasarela de

11

pagos es igualmente sencilla y slo tendremos que proporcionar unos cuantos datos. Esta es la gran virtud que tienen este tipo de tiendas. Otra de sus ventajas es que no requieren una inversin inicial alta. La parte negativa es que si no se obtienen buenos resultados o se est descontentos, ser imposible migrar la tienda a otro proveedor de alojamiento y tendremos que partir de cero. Muchas veces quedamos prisioneros y aunque no nos acaba de convencer nuestra tienda la mantenemos porque la migracin o es inviable o muy complicada. Contratacin con mensajera. Es otra alternativa que tenemos a la hora de contratar una tienda online. Se trata de un modelo similar a la de los proveedores de alojamiento, solo que facilitado por las empresas de transporte. Su punto fuerte, como es lgico, es la facilidad en la distribucin de los productos de nuestra tienda. Se trata de una solucin que integra el proceso de venta con el transporte al cliente final. Con ello se aceleran los tiempos de entrega, y se mejoran los mrgenes comerciales, en lo que se refiere a los gastos de transportes. Adems facilita un control de stock, almacenaje o envo y manipulacin de pedidos de manera que podemos externalizar toda la logstica de nuestra tienda online. La parte negativa, como en el caso anterior, es que una vez dentro de una estructura de este tipo es complicado cambiar de proveedores de alojamiento o de mensajera, teniendo prcticamente que partir de cero si el servicio no es de nuestro agrado. Lo mejor es la potencia de esta plataforma que nos permitir crecer sin preocuparnos de la logstica. Gestor de contenidos. Esta es una de las alternativas ms positivas por la facilidad de gestin que ofrece a la hora de crear el catlogo online, tenerlo siempre al da y, en definitiva, gestionar la tienda de forma sencilla. Si utilizamos un gestor de contenidos para hacer nuestra tienda online, ya sea Magento, PrestaShop, Joomla, Drupal o incluso WordPress, por citar algunos ejemplos, siempre tendremos el control de nuestro producto.

12

Lo mejor de esta cuestin es que no quedamos atados con nadie. Si hemos contratado un diseador web para poner en marcha la tienda o una empresa que nos lo realice y no nos ha gustado el trabajo podremos migrar fcilmente de alojamiento y contratar a otra persona que contine el trabajo sin mayor problema. Mantener la tienda y la pgina siempre actualizadas depende ya de nosotros. Adems los costes de actualizacin, una vez montada toda la estructura los costes de mantenimiento no son elevados, ya que crear productos nuevos, eliminar antiguos y gestionar el catlogo es realmente sencillo y rpido, prcticamente al alcance de cualquiera que sepa utilizar un procesador de textos y tenga unos mnimos conocimientos de edicin de imgenes. El modelo que ms se ajuste y se adecue a cada empresa tiene que evaluarse de manera personal. Al igual que no existen dos empresas iguales, el modelo de gestin para montar la tienda online para una pequea empresa no tiene que ser igual que para un restaurante que quiere realizar pedidos a domicilio. De nada nos sirve tener un gestor de contenidos para actualizar la tienda online si carecemos de los conocimientos o el tiempo necesario para realizarlo.

13

Etapas previas a la creacin del sitio web. Conectarse a Internet. Es importante estar conectado, si es posible con banda ancha y tarifa plana. Existen diferentes tipos de conexin a Internet y diferentes proveedores. Deben estudiarse bien las diferentes ofertas de los proveedores para obtener la mejor eleccin. Comprar un nombre de dominio. Los proveedores de acceso suelen ofrecer espacio para alojar sitios web. Las direcciones que proponen son difciles de recordar y, adems, usted hace publicidad a su proveedor lo cual no resulta interesante para su empresa.

Es preferible disponer de un nombre de dominio propio. Sus clientes recordarn ms fcilmente la direccin y usted mostrar una buena imagen de la empresa. Elegir un nombre de dominio: Un nombre de dominio debe ser nico. Normalmente los nombres de dominio terminan en ".com" o ".es". Elija nombres fciles de recordar para sus clientes. Comprar un ".com": Puede comprarse el nombre a INTERNIC directamente o bien a otros proveedores. Todo el procedimiento se puede hacer on-line en el sitio: http://www.nic.com. El precio ronda los 60 euros para dos aos.

14

Comprar un ".es": La peticin de compra debe hacerse al ESNIC. Es necesario presentar: el CIF y un certificado de registro de marca. Declarar el sitio en la AGPD. Deben declararse: La recogida de datos personales de clientes. La finalidad de esta recogida. Esta declaracin puede efectuarse on-line en el sitio de la AGPD: http://www.agpd.es. Encontrar un proveedor. Para tener un sitio Internet hay que tener un proveedor. Un proveedor es una empresa que aloja todos los ficheros que constituyen su sitio web. Existen muchas empresas que ofrecen alojamiento Web a diferentes precios y que proporcionan distintos servicios complementarios. Los servicios proporcionados normalmente por los proveedores son: Cortafuegos. Estadsticas. Acceso FTP (File Transfert Protocol). Cuentas e-mail. Herramientas de comunicacin para el sitio. Hasta ahora hemos visto una pequea introduccin al comercio y los negocios a travs de internet y hemos dado algunas pistas sobre la creacin de tiendas online. A lo largo de este curso desarrollaremos la idea de la creacin de una tienda online, tanto su configuracin como su gestin. Para ello, nos basaremos primordialmente en el gestor de contenidos Pretashop, a travs del cul veremos los pasos a seguir para configurar y gestionar nuestra tienda online.

15

MDULO 2. ANTES DE EMPEZAR: OBJETIVOS DE NEGOCIO Y ESTRUCTURA DE LA CARTERA ONLINE. Crear una tienda online a partir de una idea empresarial no es tarea fcil. Deben tenerse una estructura de la estrategia muy bien definida, comprender todos los mbitos en los que queremos meter a nuestra empresa y comenzar a disear los propios objetivos del negocio onlines, pensando siempre en los clientes. As, en este mdulo aclararemos algunos conceptos sobre qu es una pgina web corporativa y de qu elementos est compuesta, cmo desarrollar la propia tienda online, teniendo presentes en todo momento los objetivos de negocio. Y por ltimo nos centraremos en cmo enfocar la Web a los clientes, como captarlos y lo que es ms importante, cmo mantener esta cartera de clientes. Pgina web corporativa. La pgina web oficial de una empresa constituye su presencia en el mundo virtual, donde los clientes o posibles consumidores pueden acudir a recibir informacin de la empresa, consultar productos o servicios, encontrar cmo contactar, etc., y no debe de convertirse en una extensin de la empresa fsica, sino formar parte de una misma concepcin, y tratar la web corporativa como si del local o entorno fsico donde se encuentra ubicada la empresa se tratase.

16

Para conceptualizar nuestra pgina y poder definir su funcionalidad, existen multitud de clasificaciones tipolgicas que atienden a diferentes tipos de criterios, las ms clsicas para realizar la distincin entre las webs aludan a la complejidad en la elaboracin de las mismas, cuando el uso de la tecnologa marcaba una gran distancia entre unas pginas y otras. Otra que ha sido ms utilizada hasta que se produjo la nueva configuracin de la wev, y ms cercana a la que realizaremos a continuacin, es la que clasifica en funcin del contenido publicado. Utilizando como base esta clasificacin, vamos a distinguir entre tres tipos de pginas corporativas: Web corporativa esttica. Web corporativa dinmica. Web corporativa participativa. Uno de los errores frecuentes en los que se suele incurrir, es en la sobreutilizacin de elementos que no son necesarios para realizar la comunicacin que desde la emprea se pretende emitir. La configuracin de la misma debe estar acorde con la filosofa empresarial tanto en el diseo como en la presentacin de la informacin, si no necesitamos incluir videos, imgenes o zonas para promover la partecipacin, no hay que forzar su integracin porque estaremos desperdiciando esfuerzos y perjudicando la comunicacin que pretendemos, todo lo que no debera de estar, se considera ruido. Igual suele ocurrir con la actualizacin del contenido, si no es necesario no es recomendable sobresaturar de informacin y contenido sin sentido. A continuacin hacemos una breve descripcin de los tipos de webs en las que fijarnos para poder desarrollar nuestro propio sitio corporativo. Web esttica. La mayora de los sitios web que las empresas utiliza para comunicarse con su pblico, son totalmente estticas, donde el contenido es actualizado a travs de profesionales con conocimientos especficos en informtica y programacin. Cualquier cambio, por minsculo que fuera, necesita de su intervencin.

17

Aunque se considera que este tipo de pginas denota cierta desactualizacin, todava sigue siendo usado por aquellas organizaciones que por filosofa o estrategia definida desde la direccin no centra sus esfuerzos en la red, ya sea por falta de conocimiento del beneficio que ello supone para su marca en la mayora de las ocasiones, por desconfianza o falta de presupuesto. En cualquier caso, como hemos estado viendo resulta una decisin un tanto equivocada. El objetivo que se pretende cubrir con este tipo de proyectos web consiste normalmente en mostrar solamente la presencia de la empresa en la red, prestando especial importancia a los sistemas y medios de contacto con la empresa fsica. Web dinmica. Este tipo de web corporativas est formado por aquellas pginas que utilizan para configurar su contenido tanto secciones estticas que no suelen ser modificadas con asiduidad, como secciones dinmicas que suelen ser modificadas para renovar la informacin expuesta o para la introduccin de nuevos elementos.

Aquellas zonas de la web que son calificadas de estticas, suelen estar relacionadas sobre todo con la estructura de la propia pgina y con la distribucin de sus contenidos. Mientras que las zonas dinmicas suelen utilizarse para las secciones dedicadas a los servicios y productos, lgicamente porque la oferta presentada al consumidor pueda variar en funcin de la estacionalidad, presentacin de ofertas, etc. de forma que a la hora de disear la pgina web es recomendable utilizar sistemas de

18

programacin que permitan que un miembro de la plantilla pueda realizar los cambios de forma ms sencilla y rpida posible, sin necesidad de acudir al servicio profesional de un programador externo a la organizacin. Dentro del grupo de pginas webs dinmicas se suelen incluir tambin aquellos sitios utilizados como tiendas virtuales, portales, etc. Web participativa. Se incluye dentro de este tipo de web a aquellos sitios corporativos que de alguna forma permiten que el usuario publique contenido, exprese su opinin, interacte con otros usuarios, etc. Las empresas que desarrollan este tipo de recursos suelen mostrar una muy marcada orientacin al cliente. Cuando hablamos de Web participatiba corporativa, hay que ser muy cuidadoso con el tipo de informacin que los usuarios pueden publicar, porque puede convertirse en un lugar donde los posibles cliente descontentos expresen su opinin con el objetivo de desmejorar nuestra imagen y daar a nuestra empresa. La recomendacin para que nuestra pgina Web se convierta en un lugar de peregrinacin de los usuarios, un lugar en el que puedan conocer la empresa, sus valores, los servicios, es recomendable utilizar un contenido dinmico que se actualice de forma peridica y que se configure de acuerdo a los principios que hemos planteado en la definicin de la estrategia de nuestro negocio, reservando un espacio dentro de la misma para la presentacin de la comunidad y mostrando a los usuarios, la existencia de la empresa en diferentes medios sociales a travs de iconos, que permitan enlazar directamente con los dems perfiles sociales desarrollados desde nuestra organizacin. Ser este lugar donde s se pueda dialogar directamente con los usuarios sin tener la necesidad de poner en peligro nuestra base de operaciones en la red, es decir, nuestra pgina web corporativa.

19

Recomendaciones para la creacin de la web. Dada la importancia que la pgina web corporativa de una empresa tiene en Internet, hay ciertos puntos que se deben tener en cuenta al comenzar a trabajar en un nuevo sitio. Parecen aspectos simples, que supuestamente ya son conocidos, y que probablemente as sea, pero que en el proceso de creacin de un nuevo proyecto es recomendable recordar: Debe formar parte de la integracin del marketing online. La pgina web oficial de una empresa se convierte en la fuente de todos los dems enlaces y acciones de Marketing 2.0, hacia ella vamos a tratar de remitir todo el trfico de usuarios ya que es en sta donde realmente la empresa tiene su existencia, y los individuos que acudan a ella lo harn de forma voluntaria y con inters por el contenido que en este espacio se publica. Palabras clave, ttulo y etiquetas. Completar estos datos a la hora de crear nuestra pgina web resulta de vitar imporancia para que los buscadores puedan localizar el sitio e indexarlo entre sus resultados de bsqueda. Aporta una imagen muy poco profesional introducir una palabra clave en un motor de bsqueda y encontrarnos con un sitio que tiene como ttulo documento sin ttulo. Indexado de la Web. Igual que hemos realizado con el ttulos y las etiquetas, debemos hacer con el contenido. En muchas ocasiones, como suele ocurrir en su mayora con los blogs corporativos, el usuario accede a travs de los buscadores a un artculo concreto o a un comentario determinado. Compatibilidad con los navegadores. A la hora de definir el documento deberemos compatibilizar el contenido del sitio web con los diferentes buscadores, o al menos, comprobar tras el diseo y la publicacin en Internet que la visualizacin en los principales navegadores es correcta y que toda la informacin aparece sin ningn tipo de error. Compatibilidad de resoluciones. La gran variedad de pantallas de las que disponen los usuarios, hace que sea recomendable disear la Web para que pueda ser visualizada con las resoluciones ms estandarizadas, como puede ser la 800x600 o la 1024x768, resulta muy incmodo para la lectura tener que desplazar la barra horizontal del navegador para leer al completo la Web.

20

Facilidad en la navegacin. La distribucin del contenido se debe realizar de forma lgica y sin demasiadas divisiones, ya qe cimplica la navegacin y fomenta la desubicacin del usuario. Para facilitarla podemos recurrir a los mapas del sitio o a los breadcrumbs.

El trmino breadcrumb que se traduce al espaol como desmigado, es un recurso similar a los conocidos mapas del sitio, y su objetivo consiste en ayudar al usuario a localizar en qu parte de la Web se encuentra si el entramado, la informacin y el contenido pueden inducir a la confusin. Rapidez del loading. La mayora de los usuarios que encuentran problemas en la carga del contenido de la pgina acaban por cerrar la ventana y seguir buscando la informacin deseada a travs de los dems resultados de los buscadores. Habr por lo tanto que evitar que los recursos incluidos en la Web pesen en demasa, huyendo de las cargas interminables. Diseo atractivo. El diseo de la Web debe estar en consonancia con la identidad corporativa, ayudando a comunicar los valores predefinidos en nuestra estrategia y adems favoreciendo la identificacin de todos los elementos de nuestro sitio. Actualizacin del contenido. Es uno de los principios bsicos del Marketing 2.0, hay que ofrecer al usuario un contenido til, que satisfaga sus necesidades, creativo y adems que se actualizado regularmente. Si nos esforzamos por crear este tipo de informacin, pero no la actualizamos, el usuario solo visitar nuestra web una sola vez, en cambio si a travs del RSS

21

(Rapid Signal Service) va recibiendo informacin, dinamizaremos la relacin con l, acercndolo a nuestra propia Web. Cabecera corporativa. La cabecera es el primer elemento que los usuarios vern cuando accedan a la Web, debe ser perfectamente representativa de la empresa. Feeds. Hoy en da y con la actual configuracin de la red, un sitio no estar completo si no incorpora las diferentes opciones de suscripcin. Cmo desarrollar una tienda de comercio electrnico. Una de las principales diferencias entre el comercio electrnico y el comercio fsico es el uso de la tecnologa. Como ya dijimos en el mdulo anterior, en la mayor parte de las ocasiones, la principal barrera de entrada al comercio en internet es el desconocimiento de las tecnologas y funcionalidades que conforman la tienda y el propio medio en el que se va a desenvolver la empresa a la hora de vender sus productos o servicios. En este mdulo revisaremos, no solo las distintas opciones tecnolgicas a la hora de lanzar una tienda en internet, siendo stas muy variadas y adaptndose a las distintas necesidades, sino tambin los propios objetivos de negocio y la estructuracin de la cartera de clientes que se pretende para nuestra tienda online. En la eleccin de la tecnologa para nuestra tienda veremos cmo uno de los principales factores a la hora de decidirnos sern las funcionalidades que la tecnologa nos ofrezca y sus posibilidades de adaptarse a nuestro negocio segn ste vaya incrementado sus ventas (objetivo de negocio) y su tamao (cartera de clientes). Seleccin de la tecnologa. Uno de los puntos crticos a la hora de vender en internet es la seleccin de la tecnologa que vamos a utilizar. Esto es porque ser un condicionante del crecimiento de nuestro negocio, y por tanto es necesario tomarse el tiempo suficiente para evaluar las distintas opciones existentes en el mercado y decidir en funcin a criterios objetivos del negocio que nuestra empresa espera alcanzar.

22

Por tanto, antes de elegir la tecnologa, es necesario realizar una ejercicio de anlisis de hasta dnde queremos llegar en la venta en internet. Con slo dos preguntas que nos realicemos podremos tener una idea bastante clara de hacia qu solucin tecnolgica debemos tender: Queremos introducirnos como una primera fase de test de aceptacin de nuestros productos en internet? Si la respuesta es S, tendremos que utilizar una solucin que pueda permitirnos vender de forma rpida y con la suficiente visibilidad de nuestros productos al menor coste posible. Sabemos que nuestro producto tiene una alta aceptacin y que internet es una gran oportunidad?. En este caso tenemos un enfoque de venta a largo plazo y con una inversin mayor. Las necesidades tecnolgicas tambin sern mayores, ya que probablemente para ser eficientes en el proceso de venta necesitaremos integrar los sistemas de contabilidad, gestin de clientes, gestin de proveedores etc. No obstante, previo a desarrollar toda la fase que precede a la creacin y configuracin de una tienda online y a comentar los principios de su gestin deberemos tener claras las implicaciones en el mbito empresarial, los objetivos de negocio y el pblico al que va dirigida nuestra tienda de manera primordial. Implicaciones en el mbito empresarial. Sin duda, el mundo de la empresa es uno de los que ms ha asimilado e incorporado a su forma de gestin y desarrollo todo lo relativo a estrategias, herramientos, recursos y espacios 2.0, tanto lo orientado a los clientes como a sus propios empleados.

23

Las caractersticas principales de las empresas 2.0 (empresas con presencia en la Web) son las que a continuacin especificamos: 1. Horizontalidad. Habiendo las mnimas jerarquas posibles. El empleado de una empresa en la que manda el conocimiento sabe que l es una pieza clave de todo el entramado y, por tanto, debe exigir una mayor participacin en todas las decisiones. Esto se debe traducir, sobre todo, en que sus posibilidades de expresarse sean totales. El jefe debe seguir existiendo pero debe ser una persona plenamente disponible y, sobre todo, debe ser un lder que se gane esa posicin. Al mismo tiempo, los empleados tambin deben absorber muchas ms responsabilidades para justificar esa horizontalidad. 2. Diversin. S, el empleado 2.0 quiere que su trabajo sea creativo y enriquecedor no debe hacer de la empresa el centro latente de su vida. 3. Innovacin. Relacionado con lo anterior, la empresa 2.0 debe estar permanentemente buscando nuevos retos para que sus miembros no se aburran o distraigan. Desde la empresa debe fomentarse la inquietud del empleado para que explore nuevas formas y metodologas para llevara a cabo su trabajo. Tambin los empleados 2.0 deben corresponder con un espritu crtico que permanentemente les lleve a sugerir cambios y mejoras. 4. Colaboracin. La empresa 2.0 debe fomentar el trabajo en equipo, porque de l salen decidisiones y productos mucho ms polivalentes y enriquecidos. Lo mismo respecto a su colaboracin con el entorno y, sobre todo, con sus clientes y proveedores. Sin embargo, tambin hay que reivindicar el trabajo individual. 5. Transparencia. Esto resulta fundamental para cualquier organizacin 2.0 y est relacionado con la horizontalidad. Es importante que los empleados tengan toda la informacin necesaria para poder participar en las decisiones. Sin embargo, en la empresa 2.0 tambin hay diferencias salariales e informacin que no puede salir de determinados crculos. Ciertamente, estas caractersticas haran de la empresa, una emprea ideal, aunque si bien es cierto, es complicado de llevar a cabo. La tendencia general de las empresas va en esta lnea, pero no slo se ha de cimentar sobre un cabio de

24

ideologa desde la directiva, sino tambin desde los empleados quienes son la fuerza real a desarrollar para llevar a cabo estos cambios. Sus actitudes, su forma de actuar, su implicacin con el proyecto corporativo, etc., son elementos fundamentales para llegar al xito. Esta necesaria transformacin hacia la 2.0, trae consigo otra acuciante necesidad y es la de analizar y escoger aquellas herramientas, recursos y estrategias de carcter, que pueden ayudar a la empresa en su desarrollo, en su evolucin, en la implantacin y ampliacin de su imagen, producto actividad, a una forma de aplicacin donde el espacio virtual se est conformando como una cuestin esencial y una va de desarrollo a tener en cuenta. Espacios como la pgina Web, supone un autntico escaparate para el servicio o producto de una empresa; un blog puede ser un canal de informacin y comunicacin con los usuarios de la empresa, adems de ser fiel reflejo de la filosofa de la misma, de su ideologa y de sus estrategias; foros, chats, que junto con los blog, permiten interaccionar con los usuarios, resolver dudas y consultas, etc.; del mismo modo el correo electrnico es uno de los recursos ms utilizados por los usuarios, espacios donde colocar documentos, catlogos, videos de la empresa, etc., constituyen un elemento que ofrece una imagen muy innovadora de la empresa. Todos estos espacios y recursos, requieren de la adquisicin, por parte de directivos y trabajadores, de cierta habilidades y conocimientos que hasta ahora no se haba dado. Implica la actualizacin y reciclaje formativo constante de la plantilla. Todo tiene un lado menos motivador. Por otra parte, la empresa ha visto en las redes sociales un recurso esencial, otorgndole un papel fundamental en su desarrollo hacia la empresa 2.0. Las redes sociales implican un proceso de socializacin del negocio, de la empresa, que va mucho ms all que simplemente crear un blog o un foro.

25

La idea de generar una empresa conlleva de forma implcita fomentar en los miembros de la misma, la implicacin, la pertenencia y el sentido de comunidad. Aunque este proceso no es tan sencillo, no se consigue con tan solo utilizar las herramientas disponibles. Como miembro de la comunidad (tu empresa, tus clientes, tus compaeros, etc.), trae consigo la necesidad de compromiso con mi comunidad, estar abierto a la participacin, promocionarla, ser accesible, generar confiaza a los clientes, etc., y sobre todo entender que la comunidad es un ente vivo, que crece cada da, que est viva y que hay que atenderla. De forma simple, la empresa 2.0 se caracteriza por una serie de elementos que vemos a continuacin: Transforma sus operaciones y forma de trabajo, creando redes sociales entre clientes, empleados y asociados. Esto permite que todos aquellos involucrados en los procesos ante y post venta estn comunicados. De esta manera cada uno puede aportar desde sus perspectivas mejorando el producto final. Extiende su presencial y alcance ms all de los lmites locales y regionales. Al estar conectados, se es miembro de una red. Esto da acceso a todos los hogares que poseen un ordenador. Solo se necesita delimitar bien el pblico objetivo para realizar una campaa innovadora. Converge voz, datos y video a travs de un solo medio, Internet. Los medios de comunicacin convencionales no permiten explotar todos los sentidos de las personas para que reciban el mensaje. Utiliza blogs y wikis para documentar en tiempo real la operacin del negocio. Todas las personas interesadas en la empresa pueden enterarse de los acontecimientos o noticias en tiempo real sucedidos con relacin a la organizacin. Puede disfrutar de las ventajas competitivas de una empresa grande. El gran margen de accin que otorga Internet permite elaborar estrategias y compaas de gran envergadura con bajos presupuestos. Anteriormente, las estrategias ms importantes eran exclusivas de las empresas grandes por su gran poder de inversin, pero con la Web, este hecho queda anclado en el pasado.

26

Libertad para sus empleados, que pueden trabajar en cualquier lugar, slo les basta estar conectados. El trabajo, aos atrs, estaba destinado a una oficina gastando recursos innecesarios como alimentacin, espacio, transportes. Con la Web 2.0 las personas solo necesitan tener conexin a Internet para desempear diversas funciones con la misma o mayor eficacin de antes.

Estas son las bases que conforman a las empresas 2.0. Pasemos a continuacin a meternos ms de lleno en lo que conforman los propios objetivos de negocio de las empresas. Los objetivos de negocio. El anlisis interno y objetivos del negocio. Es tan necesario conocer los factores externos que nos rodean como el anlisis interno y objetivos del negocio, conocer los factores internos que van a influir en el desarrollo de la iniciativa. La importancia de conocer y analizar los factores internos de la empresa, de manera independiente, sin ser ni excesivamente indulgentes ni extremadamente estrictos, nos dar una idea de nuestras posibilidades y capacidades, as como de nuestros puntos fuertes a potenciar y los dbiles a cubrir y enmendar. Hay que dedicar un apartado a identificar nuestras debilidades, es decir, todo aquello en que es menos fuerte la iniciativa y nosotros mismos, puede que sea la situacin financiera (muy comn en las nuevas iniciativas) la inexperiencia, la falta de clientes, etc., hay que consignar todo y no obviar nada, no hay que temer sacar a la luz los puntos dbiles, pues se deben primero conocer para luego compensar. Igual proceso hay que realizar con los puntos fuertes, sea alguna de nuestras capacidades personales, la imagen que damos, la red de aliados, nuestra ventaja

27

competitiva, lo que sea que tenga nuestra empresa y nos favorezca habr tambin que especificarlo y ponerlo por escrito. Tenga en cuenta que para todos los casos habr que detallar slo aspectos relevantes, si se detallan temas sin importancia se producir mucho ruido en el anlisis. Deben determinarse los puntos clave positivos y negativos tanto internos como externos, relevantes para su iniciativa, que se deben sacar a la luz ordenadamente. La formulacin de objetivos. Gracias a los pasos anteriores ya conocemos nuestra misin, nuestras limitaciones y potencial, los puntos que juegan a nuestro favor y en contra, etc. con todo ello ya debera comenzar a ser capaz de desarrollar unos primeros objetivos para su actividad y en eso consiste este paso. La cuestin es plantearse metas, objetivos a los que llegar y cumplir. Estos objetivos deben siempre cumplir las siguientes condiciones: Adecuados: que expresen lo que realmente quiere conseguir, recuerde su misin y su visin. Realistas: vuelva a su anlisis, tanto interno como externo y no ponga cifras que no sean reales. Se debe ser coherente con lo que ha descubierto en los pasos anteriores, si nuestra posicin no es la de lder, no podemos aspirar a ponernos los mismos objetivos que ese lder. Oportunos: hay que aclarar cuando se pretenden conseguir dichos objetivos, tanto los crticos finales, como los intermedios: qu hay que saber, en qu tiempo queremos conseguir el objetivo, por qu si no ponemos la dimensin temporal como lmite se vuelven difusos. Medibles: hay que establecer cifras concretas, 100, 200, 300, lo que sea, pero que luego pueda contrastar con la realidad y modificar si es necesario, porque si no nunca sabremos si llegamos o si nos pasamos. Alcanzables: Hay que apuntar alto, porque se deben tener aspiraciones y luchar por ellas, pero no se deben poner cifras de sueos imposibles en un tiempo

28

igualmente imposible. Repase la lista de objetivos que se ha planteado, compruebe que cumplen las condiciones anteriores y que se basan en suposiciones (porque esta parte siempre ser una estimacin) que son reales y estn fundamentadas en sus anlisis anteriores y no slo en su intuicin. La tarea ms importante de un analista web es tener claros los objetivos del site. Sin conocer estos objetivos, ser imposible crear y manejar una cultura de negocios basada en la analtica web. Es la base de nuestra estrategia. Los objetivos deben ser especficos, realistas y sobre todo, se deben poder medir. El analista web debe ser responsable de facilitar el proceso de la definicin de los objetivos de negocio, junto con los responsables de negocio. De qu manera se puede participar en este proceso? Conociendo nuestro site y preguntndonos: Por qu existimos en Internet? Qu estamos aportando al negocio? Qu pretendemos sacar y cmo podemos hacerlo? Los objetivos pueden focalizarse en el propio negocio, o en las necesidades de los clientes. Los que se refieren al negocio se clasifican en dos grandes grupos. Los que hablan de bajar costes y los que hablan de incrementar beneficios, as como cualquier combinacin entre ambos. Este tipo de objetivos pueden referirse a: Dirigir trfico a otros canales offline y explotar la venta cruzada (conseguir un 30% de las ventas o llevar un 20% de clientes a pedir ms informacin en el call center).

29

Testar nuevos productos o promociones o diseos o usabilidad (incrementar un 2% las solicitudes de contratacin de un nuevo producto). Generar leads o contactos (obtener 1.000 nuevos clientes). Monetizar contenido y marketing (disminuir 5% el coste de un nuevo cliente por la web, aumentar 1% el ROI de cada campaa). Construir imagen de marca (relevancia de la marca en el sector, en buscadores, en redes sociales). Rebajar los costes de servicio al cliente y del call center (reducir en un 20% el nmero de clientes que llaman al call center mediante la resolucin de incidencias online). Ahorrar tiempo y dinero al facilitar tareas que forman parte de nuestra rutina (disminuir 15% el coste de material de papel y sellos y un 10% los costes de dedicacin de personal). Los objetivos que se centran en el cliente tienen como reto conseguir un canal eficiente para los visitantes, y proveer de un alto nivel de personalizacin y relevancia a nuestra web: Incrementar el nivel de servicio al cliente, centrndonos en el antes (aumentar 5% el paso de potenciales a clientes), el durante (informacin de los productos y servicios), y el despus (garantas, reparaciones, atencin al cliente). Comunicar informacin de la compaa, exponer catlogo de productos (incrementar 5% el trfico a nuestro site). Fidelizacin del cliente y apoyo a la venta (aumentar 30% la recompra del cliente en el mismo mes de la adquisicin). Crear experiencia de producto y de cliente (conocer las preferencias de nuestros usuarios para dar mejor servicio).

30

Permitir el feedback de nuestros clientes (subir un 10% el ndice de satisfaccin de clientes). La medicin de los objetivos. Cuando tengamos claros los objetivos de nuestra organizacin en general, y de cada departamento en particular, nuestra tarea ser definir las KPIs (Key Performance Indicators), es decir, definir las mtricas necesarias para saber cmo de cerca o lejos estamos de alcanzar los objetivos propuestos, estableciendo un plazo de control sobre los mismos. Ser el momento de decidir cmo vamos a medir cada objetivo, qu mtricas estn implicadas y cmo podemos alcanzar el objetivo. Como ejemplo, podemos tomar el objetivo de aumentar un 30% la recompra de un cliente en un semestre. Qu mtricas pueden ser importantes a tener en cuenta para formar la KPI que mejor defina si estamos teniendo xito en nuestro objetivo? Vamos a comentar algunas que, a cualquier negocio que tenga este objetivo, pueden resultarle interesantes: Nmero de visitas de clientes en el periodo. Tanto por ciento de visitas de clientes en el periodo respecto al total de las visitas. Nmero de visitas de clientes que repiten en el periodo. Tanto por ciento de clientes que repiten respecto al total de clientes. Recency (cuanto tardan los clientes en volver). En nuestras manos est el decidir qu composicin haremos para medir en qu punto estamos. Esto depende del negocio y del propio objetivo en s. Definir los objetivos y recopilar mtricas constituye la base de todo buen guin. Sin embargo, el convertir los objetivos de negocio en mtricas web, es una tarea dura. A continuacin exponemos un modelo que refleja el proceso a seguir. Disear mtricas para medir objetivos de negocio. El modelo. Un negocio puede tener muchos objetivos. El propio canal web puede ser parte de un nico objetivo o formar parte de varios. Es imprescindible tener los objetivos del

31

negocio bien definidos, de esta manera ser ms fcil definir en qu aspectos puede ayudar el site. Si el site es de ventas, es fcil saber los objetivos del mismo. No obstante, si el objetivo de negocio no es especficamente de ventas, no ser tan fcil determinar los objetivos, pues pueden ir desde la reputacin de la empresa hasta la fidelizacin de clientes. La tctica ms simple que podemos emplear, para tener cada objetivo ms claro, es definir qu accin debe hacer el visitante para considerar que tenemos xito. Debe rellenar un formulario? Llamar a algn telfono? Descargarse un pdf? Terminar de ver un video? Este objetivo es importante fijarlo junto a alguien que forme parte del propio negocio y que est pendiente de los informes.

Una vez se tenga definido el objetivo del site se deber seleccionar la mtrica (o mtricas), que determine/n el xito al alcanzar dicho objetivo. Para comenzar, tendremos que determinar cuntas visitas hemos tenido y cuntas han llegado al xito. Habiendo tantos tipos de mtricas, puede tomarse la decisin de elegir algunas, como las que hemos comentado ms arriba, seguirlas durante distintos perodos de tiempo y decidir si son efectivas y nos transmiten informacin vlida o no se ajustan del todo al objetivo marcado y en este caso elegir nuevas mtricas que nos ayuden de manera ms efectiva y nos puedan llevar al xito.

32

Igual de importante es monetizar la mtrica, definir un valor en euros para el evento de xito. No tiene por qu ser un valor preciso, pero es bsico tomar un marco de referencia para tomar decisiones sobre el site. Si tenemos 10 objetivos en el site y todos tienen un valor cuantitativo, ser ms fcil comparar el xito que estamos teniendo en cada uno, adems de saber cmo de cerca o lejos nos encontramos de alcanzarlos. Cunto nos cuesta generar un lead? Y lograr una venta? Y derivar una llamada? Y solicitar informacin sobre un producto o servicio? Es decir, cmo asignamos este valor? Hay que identificar todas las acciones que pueda realizar el usuario en la web y priorizarlas. As, cuando se comparen entre s, se podr ver el efecto que tiene cada una en el logro de nuestro mayor objetivo, y de esta manera optimizar nuestra web. Veamos algunos ejemplos de lo que se quiere decir con mtricas a las que aadimos un valor, es decir, a las que monetizamos: Objetivo de negocio: Incrementar el nmero de suscriptores a nuestro catlogo online. Objetivo de la web: Lograr nuevos leads a travs de nuevos visitantes. Mtricas: visitantes nicos, tasa de conversin (mandar relleno el formulario). Valor: 2.000 nuevos suscriptores, a 50 euros el lead = 100.000 euros. Si los datos son cuantitativos podremos presentar a los implicados en el negocio los resultados que se estn consiguiendo, de manera que lo vean ms claro y entiendan el grado de impacto con mayor precisin. Adaptacin de los objetivos a las necesidades. Conocer al pblico objetivo es de gran importancia para obtener un sitio web de xito, sea cual sea la temtica que tratemos o el objetivo que deseemos cumplir. Ahora vamos a dar algunas ideas que podemos desempear para conseguir esos datos de nuestros usuarios, de modo que podamos identificar nuestro pblico objetivo.

33

Est claro que con nuestro propio sentido comn podemos saber qu tipo de pblico nos va a visitar, adems de adaptar nuestro sitio para que lo puedan usar con comodidad el mayor rango de usuarios posibles. Pero, cuanta ms informacin dispongamos, ms fcil ser tomar las decisiones correctas y para ello podemos poner en marcha varias estrategias. Analizar el perfil de los usuarios que nos contactan. Una de las maneras ms fciles, asequibles y directas de conocer quin nos visita es analizar el perfil de las personas que se ponen en contacto con nosotros, sea cual sea la va de comunicacin que utilicen. Por ejemplo, podemos analizar todo el correo electrnico que recibimos, los formularios de contacto que nos envan, o incluso las llamadas de telfono a nuestras oficinas. Todos estos datos nos darn un perfil de usuario/s que entran en nuestro sitio. Otro dato muy interesante que podremos deducir de este anlisis es el grado de utilizacin de nuestros contenidos o servicios, ya que muy probablemente las personas que se han puesto en contacto nos harn solicitudes de informacin o nos reportarn problemas que han encontrado en la utilizacin del sitio. Todas estas informaciones nos darn pistas sobre lo que tenemos que hacer para mejorar nuestra web, los contenidos y la facilidad de uso de los servicios que ofrezcamos. Para obtener una informacin completa sobre el perfil de usuario, tenemos que solicitar, en la medida de lo posible, de los usuarios ciertas informaciones personales. Por ejemplo ser til conocer el sexo, edad, localizacin del visitante, grado de utilizacin de Internet, relacin con nuestra marca (y nuestros productos o servicios), cmo nos ha conocido, etc. Analizar nuestro servicio de estadsticas. Hasta las webs ms bsicas tienen un servicio de estadsticas. Muchas veces lo ofrece nuestro propio servicio de hosting y, en caso que no sea as, podemos instalar un servicio gratuito en pocos minutos como Google Analytics. En nuestro servicio de estadsticas podemos obtener muchas informaciones interesantes y de lo ms variadas. No nos ofrecern datos personales de nuestros usuarios, pero al menos podremos saber otras cosas, como los recorridos que

34

realizan en el sitio para llegar a las informaciones, los puntos de entrada y los de fuga de visitantes, los tramos de horas o de das que ms nos visitan, los pases de donde provienen las personas, etc. Todos estos datos, bien analizados nos darn pistas sobre qu es lo que ms se consulta, si es fcil la navegacin o donde se quedan parados los usuarios en el recorrido de uso del sitio. O bien nos servir para cuantificar nuestros esfuerzos de comunicacin de nuestra marca en Internet por medio de enlaces o banners. Estas pistas las podremos utilizar para reestructurar el sitio, los mecanismos de compra o nuestras actividades de promocin. Encuestas de uso. Otro mtodo que podemos poner en marcha es la creacin de encuestas para que los usuarios que nos visitan nos cuenten cul es su experiencia con el sitio y el grado de satisfaccin al usarlo. En estas encuestas debemos recabar toda la informacin posible que nos ayude a decidir futuras actualizaciones. No se trata simplemente que nos diga si algo le parece bien o mal, sino que nos pueda dar su opinin en qu se podra mejorar, los problemas que pueda haber encontrado y con ello podremos obtener soluciones a los asuntos ms habituales. Podemos hasta preguntar sobre ideas que hayamos tenido, para ver el grado de inters de las personas y as saber hasta qu punto merece la pena desarrollarlas. Las encuestas pueden enviarse por correo electrnico a nuestra lista de usuarios o se pueden colocar en la propia pgina avisos pidiendo su realizacin. Como sabemos que lo ms fcil es que los usuarios no quieran otorgarnos un poco de su precioso tiempo para rellenar la encuesta, podemos compensarlos con pequeos beneficios, sorteos o cualquier cosa que se nos ocurra y que anime a la participacin.

35

El mundo offline tambin nos puede dar datos. Casi siempre, para nuestra empresa o nuestro sitio web, tenemos ciertas personas a las que preguntar en el mundo offline, es decir, personas que tenemos a mano en el mundo real y que nos pueden dar una visin sobre lo que hacemos bien o mal y sobre lo que esperan que nuestra pgina web les ofrezca. En este sentido podemos preguntar a clientes actuales de nuestra empresa qu es lo que esperan que la pgina les proporcione. Esta misma pregunta tambin podemos hacrsela a nuestros proveedores, que tambin deben saber bastante sobre el negocio que desempeamos y nos pueden dar ideas o metas a realizar. La empresa debe conocer a diversas personas que se incluyen dentro del pblico objetivo del sitio y podemos preparar un correo para que nos digan qu les parece el sitio, si lo han sabido manejar y qu les gustara que se mejorase. En caso que nuestro correo no reciba muchas respuestas podemos llamar a estas personas para intentar recabar cuantas ms informaciones mejor. Estudiar los competidores que han tenido xito. Otro modo de saber hacia donde dirigir nuestros esfuerzos es el estudio de la competencia. Claro que debemos centrarnos en aquellas empresas que han tenido xito y cuyas pginas, es de suponer, que estn bien realizadas. Las pginas de las grandes empresas suelen estar realizadas por agencias que tienen buenos mecanismos para definicin de objetivos, anlisis y adecuacin de los contenidos a la audiencia. Por ello pueden ser un lugar muy til donde recabar ideas. Aunque debemos admitir que no siempre grandes empresas tienen las mejores pginas, pero eso cabe analizar un buen nmero de webs y ver cules son las que mejor han desarrollado las soluciones. De modo que, no slo podremos tomar buenas ideas, sino tambin detectar puntos flacos de los competidores, que debemos realizar de una mejor manera para intentar comer un pedazo del mercado online. Estos son algunos de los mtodos, ms al alcance de cualquier desarrollador o empresa para definir el pblico objetivo, que ser fundamental para construir una

36

pgina web que de verdad solucione las necesidades de las personas que van a visitarla. Pero no hay que olvidarse de utilizar nuestro propio sentido comn y experiencias en el mercado donde estemos trabajando. Gestin de clientes. La fidelizacin de los clientes requiere un proceso de gestin de clientes que parte de un conocimiento profundo de los mismos. La investigacin comercial de los clientes nos facilita la informacin que nos permitir adaptar el servicio al cliente concreto y gestionar el proceso para conseguir una alta satisfaccin con el servicio. Partiendo de la informacin sobre los clientes podemos agruparlos en funcin de su respuesta a las actividades de marketing. Realizamos una segmentacin de los clientes formando grupos internamente los ms homogneos posible. La fidelizacin no trata de mantener a todos los clientes como consumidores durante aos. Se trata de mejorar la rentabilidad a largo plazo de la empresa y generalmente esto implica eliminar a muchos de los clientes menos rentables. Por tanto, tenemos que retener a los clientes ms rentables y que se mantengan fieles a la empresa, realizando compras repetidas por mucho tiempo. Y conseguir que la mayora de las compras del tipo de producto o servicio al que nos dedicamos sean en nuestra empresa. Pero debemos conseguir que los clientes menos rentables se pasen a la competencia. La idea de mantener durante mucho tiempo los clientes ms rentables es una primera aproximacin al tema. En realidad se tratara de atraer y mantener en la empresa a los mejores clientes. Por ejemplo, si un cliente no es rentable pero trae a otros muchos clientes rentables puede ser interesante conservarlo.

37

Satisfaccin del cliente. La fidelidad de los clientes depende de tres factores fundamentalmente: 1. La satisfaccin del cliente. Es la satisfaccin del cliente lo que le mantendr como cliente durante aos. 2. Las barreras de salida. Los costes de cambiar de entidad o empresa pueden mantener fiel a los consumidores aunque no estn satisfechos y desearan cambiarse. 3. El valor percibido de las ofertas de la competencia. El cliente hace una evaluacin de nuestro servicio al consumidor comparndolo con su valoracin del servicio ofrecido por los competidores. Por ejemplo, la valoracin que realizamos de un bar depende de las opciones que tenemos y de cmo percibimos los productos y servicios del resto de bares. Factores fundamentales de la fidelidad. Hemos comentado como la Fidelidad dependa de tres factores fundamentales: la satisfaccin del cliente, las barreras para el cambio y la percepcin de la deseabilidad de las ofertas de la competencia. Y esa satisfaccin que comentamos como primer factor fundamental depende a su vez de la comparacin que realiza cada cliente entre las expectativas que tena antes de consumir y la percepcin post-compra. El consumidor compara lo que esperaba antes de comer en un restaurante con lo que percibe despus de comer en el restaurante. Son por tanto valoraciones subjetivas relacionadas con lo que espera recibir antes de ser atendido con lo que ha recibido despus de la compra. Las barreras de salida son el segundo aspecto fundamental en la retencin de clientes. Por ejemplo, pensemos simplemente en lo sencillo que resulta adquirir una lnea telefnica y lo complicado que resulta darla de baja. La fidelidad tambin depende de las barreras o costes del cambio. No se trata de una fidelidad tan autntica cuando el cliente se mantiene con nosotros por los altos costes de cambio.

38

El tercer factor fundamental en la fidelidad de los clientes es el valor percibido de las ofertas de la competencia. El consumidor valora distintas opciones que le ofrecen las empresas competidoras. Un cliente fidelizado mantiene la relacin con nuestra empresa sin evaluar cada vez que compra todas las posibles opciones que ofrece la competencia. En el momento que la competencia consiga que el cliente fidelizado evale alternativas, su satisfaccin con mi empresa ms el coste de cambiar debe ser mayor que la valoracin de la competencia para mantenerlo fiel. Por ejemplo, si cierro mi bar por vacaciones durante unos das, los clientes seguramente probarn bares de la competencia y al final de las vacaciones evaluarn si mantenerse fieles a mi negocio. Debemos mantener una vigilancia sobre las ofertas de la competencia, analizando sus puntos fuertes y dbiles. Y diferenciar nuestra oferta de la oferta de los competidores. Si nuestro producto se percibe por parte de los consumidores como absolutamente igual al de la competencia, entraremos en una competencia por el precio. Es importante que el consumidor perciba nuestro producto o servicio como distinto de la competencia si no queremos competir por precio.

Eso en lo que somos mejores que la competencia, ese esfuerzo marginal que realizamos debe ser resaltado para que se transforme en una fuente de ventaja competitiva sostenible. Por ejemplo, el director de oficina que realiza las declaraciones de hacienda a los mejores clientes est fidelizando a la clientela con un servicio adicional que a los competidores les resulta difcil de copiar. Estos clientes fidelizados son menos sensibles al precio, se les puede cobrar ms y proporcionan un mejor margen durante mayor tiempo. La clave de la fidelizacin consiste en ofrecer ms al cliente por lo que paga y sobre todo, que lo perciba.

39

Causas de la Fidelidad. Existen una gran multitud de causas que llevan a un cliente a mantenerse fiel a un producto o servicio. Entre las principales causas de fidelidad que las investigaciones sealan se encuentran: El precio. La calidad. En la mayor parte de los productos y servicios la decisin de compra no se gua estrictamente por el precio. Incluso aunque el producto fsicamente sea el mismo, el consumidor puede percibirlo como distinto, como seguramente es el caso de muchos detergentes y de las gasolinas. El valor percibido. Es ese valor percibido subjetivamente por el consumidor el que emplea para seleccionar ofertas. La imagen. El consumidor no es estrictamente racional sino que muy al contrario se suele guiar por percepciones subjetivas, por sentimientos, emociones y por diferentes rasgos de personalidad que asigna a los productos o servicios. La confianza. La credibilidad es uno de los aspectos fundamentales en la evaluacin de alternativas de compra por parte del consumidor. De especial importancia es la confianza en los servicios. Los servicios son intangibles y su produccin y consumo se produce al mismo tiempo. Por ejemplo, podemos probar un coche antes de comprarlo pero no podemos hacer lo mismo en el dentista. Si queremos extraernos una muela no podemos visitar 20 dentistas y despus optar por el mejor. Si queremos una hipoteca no podemos probarla por unos das como si fuera un coche. Tenemos que confiar en que el ttulo del dentista es autntico, que sabe lo que hace, que el instrumental est desinfectado, que la anestesia har efecto y que es tcnicamente competente. Inercia. La comodidad o los obstculos a la salida son una de las razones para mantenerse fiel a un servicio aunque sea de un modo artificial. Por ejemplo, las compaas de televisin por cable saben que muchos abonados no se dan de baja por inercia. Incluso cuando un abonado muestra sus quejas o pide la baja, alargan el proceso e incluso lo obstaculizan de modo que muchos de los que piden la baja se mantienen mucho tiempo slo por inercia.

40

Conformidad con el grupo. El hombre es un ser social y muchas compras se ven fuertemente influidas por consideraciones sociales. Las relaciones personales, amistades, pertenencia a un grupo determinan en buena medida sus comportamientos de compra. Cuando se organiza por ejemplo una fiesta en una discoteca, el conseguir la aceptacin de unos pocos lderes de grupo supone el xito de la misma. Evitar riesgos. Uno de los grandes frenos para la compra por parte del consumidor son los riesgos percibidos. Pero una vez que el cliente conoce nuestro servicio, el cambiarse a otro desconocido supone psicolgicamente un riesgo. No hay alternativas. La fidelidad en muchos casos se produce porque el consumidor no conoce o dispone de alternativas. El incremento de la competencia, el ser Espaa uno de los pases del mundo con ms oficinas por mil habitantes, hace que los consumidores tengan muchas alternativas y esto dificulta el mantenerlos fieles. Costes Monetario del cambio. Cambiar de proveedor puede tener un coste directo. Por ejemplo, el coste de cambiar la hipoteca de banco. Cuando una empresa utiliza un proveedor informtico y descubre el altsimo coste que supone cambiar de base de datos por las incompatibilidades informticas. Costes no monetarios. En muchas ocasiones el coste es ms el coste psicolgico, de tiempo y esfuerzo para realizar el cambio. Ventajas de la Fidelidad. La fidelidad representa ventajas tanto para la empresa como para el cliente. Entre las ventajas para la empresa de la fidelidad de los clientes podemos destacar los siguientes aspectos significativos: Facilita e Incrementa las ventas. El mantener los clientes fieles facilita el venderles nuevos productos. Una gran parte del marketing de las entidades financieras se dirige a sus propios clientes para venderles productos que no poseen. Es lo que se denomina Venta Cruzada. Al que tiene la nmina le ofrecen un seguro y al que tiene nmina y seguro se le ofrece un fondo. Al mantenerse fieles y repetir las compras aumenta la cifra de ventas.

41

Reduce los costes de promocin. Es muy caro captar un nuevo cliente. Es mucho ms barato venderle un nuevo producto a uno de nuestros clientes fieles. El mantener una gran base de clientes fieles nos permite incrementar las ventas, lanzar nuevos productos, con un coste en marketing reducido. Retencin de empleados. El mantenimiento de una base slida de clientes favorece la estabilidad del negocio y la estabilidad laboral. La motivacin y retencin de empleados puede mejorar cuando disponemos de una gran base de clientes conocidos que proporcionan un negocio estable y slido. Menor sensibilidad al precio. Los clientes fieles y satisfechos son los que permiten un margen sobre el precio base del producto indiferenciado. Los clientes satisfechos son mucho menos sensibles al precio. Estn dispuestos a pagar un sobreprecio por el servicio diferenciado que reciben y por la satisfaccin obtenida. Los consumidores fieles actan como prescriptores. Uno de los aspectos ms importantes de tener clientes fieles es que comunican a los dems las bondades de nuestra empresa. Esto es especialmente verdad en los servicios que tienen un elevado componente social y se basan en la credibilidad. Por ejemplo, de donde proceden casi todos los clientes de un dentista, de otro cliente que lo recomend. Ventajas de la fidelizacin para los consumidores: Reduce el riesgo percibido. El consumidor que tiene que elegir entre varias alternativas de servicio tiene miedo a equivocarse. Produce una cierta ansiedad el tener que ir a un dentista que no se conoce. El cliente que va regularmente a un dentista en el que confa reduce esa sensacin de riesgo, ese miedo a equivocarse. Recibe un servicio personalizado. Los clientes fieles pueden recibir un servicio personalizado. El dentista al que vamos siempre conoce nuestro historial mdico. Los camareros que conocen a los clientes pueden adaptar su servicio a los gustos particulares de cada cliente sin necesidad de muchas preguntas.

42

Evitar los costes de cambio. El cambiar de proveedor tiene un coste psicolgico, de esfuerzo de bsqueda, de riesgo percibido e incluso monetario como cuando queremos cambiar la hipoteca. Una vez hemos visto la importancia y el proceso para la fidelizacin de los clientes, es hora de estudiar la manera de estructurar y gestionar una cartera de clientes. La cartera de clientes. El proceso de compra de un usuario en el comercio electrnico. En primer lugar, es importante conocer cul es el proceso de compra de un usuario en un mbito electrnico, de esta manera podremos adaptar nuestra web mejor a sus necesidades. La llamada Pirmide de Maslow procede del mbito de la psicologa y en la actualidad se aplica con acierto tanto a los negocios tradicionales como al terreno de las tiendas online. En el fondo, no hay diferencia a la hora de identificar determinados patrones de conducta bsicos que determinan nuestros comportamiento como consumidores, aunque algunos detalles s se han desarrollado de

forma especfica en el mundo online.

Generalmente, los usuarios llegarn a nuestra tienda online con una necesidad muy concreta en la mente. Es cierto que la navegacin por Internet posibilita el vagar por las tiendas durante horas, simplemente consultando el catlogo, pero lo normal es que tengan una cierta idea de lo que estn buscando. La seguridad en la compra siempre ser el aspecto fundamental que un usuario mire en cualquier tienda online. Igual que nos marchamos de un comercio tradicional si consideramos que no tiene buena pinta, si entramos en una tienda online y no vemos a simple vista, de forma accesible, los trminos y condiciones, no se nos ofrecen diferentes opciones de pago, no se garantiza la seguridad de

43

nuestros datos a la hora de registrarnos, etc., todo este cmulo de aspectos puede redundar en que el cliente no nos considere de confianza y se marche. Del mismo modo, es recomendable que ofrezcamos diferentes vas de contacto. Si el usuario ha encontrado el producto que buscaba y considera que nuestra tienda online es de fiar, ser cuando llegue el momento de formalizar la compra. En este punto, es deseable ofrecer la mayor facilidad posible: que el checkout sea intuitivo y en pocos pasos, y por supuesto que se enve una confirmacin de la compra con todos los datos. No hay nada que vuelva a un cliente ms reticente a regresar a una tienda online que un proceso final dificultoso. Si tratamos con mimo los aspectos indicados, dedicndoles el tiempo que sea necesario, terminaremos conformando nuestra cartera de clientes habituales y consiguiendo ese bien tan preciado, el compromiso de nuestros compradores. Estructurar la cartera de clientes. Como ya hemos comentado anteriormente, uno de los puntos que conviene tener controlado dentro de cada empresa es el tiempo y nmero de visitas que los vendedores dedican a cada uno de sus clientes. sta funcin corresponde a los jefes de venta, debern estructurar las carteras de clientes de cada uno de sus vendedores. La frecuencia de visitas a cada uno de los clientes debe estar controlada y planificada con bastante antelacin. En caso contrario podemos estar dedicando demasiado tiempo a clientes que tienen poco consumo y poco tiempo a otros clientes de mayor consumo o que cuentan con un mayor potencial de compra. Se puede estructurar a los clientes en seis categoras segn su consumo anual. De esta forma podramos denominar a los de mayor consumo como clientes de 6 estrellas, que seran los de mayor consumo. Las siguientes denominaciones seran de 5, 4, 3, 2, 1 y 0 estrellas. Podemos establecer unos baremos que nos sirvan de ejemplo aunque todo cambia en funcin de cada sector y cada compaa. As podramos estructurar la cartera de cualquier empresa. Los clientes de 6 estrellas seran aquellos que tienen un consumo anual superior a 60.000, los de 5 estrellas de consumo superior a 50.000, los de 4 estrellas superior a 40.000 y as sucesivamente.

44

Segn el nmero de visitas de cada sector se establece una media de visitas diarias que puede hacer cada vendedor y establecemos unos 200 das laborales por ao. Finalmente obtenemos la cifra de visitas que nuestros vendedores pueden hacer por ao. Del resultado obtenido podemos determinar si nos faltan o nos sobran vendedores para mantener la cartera de clientes actual y poder abrir nuevas cuentas para crecer o simplemente sustituir a los clientes que por diversos motivos se caen de nuestra cartera. El tiempo a invertir en el nmero de visitas a clientes nuevos lgicamente vara en funcin de la madurez de la empresa o del vendedor. Podemos establecer un parmetro de prospeccin para captar nuevos clientes y emplear entre un 15% y un 20% del tiempo disponible de visitas dentro una empresa con una cartera consolidada y para un vendedor experto. La frecuencia de visitas se podra establecer en, por ejemplo, 2 mensuales para los clientes de 6 estrellas, 1 al mes para los 5 estrellas y 4 estrellas, 1 cada dos meses para los 3 estrellas, 1 cada cuatro meses para los 2 estrellas y 1 cada seis meses para los clientes de una estrella. Se debe estudiar a parte a los clientes 0 estrellas y los aquellos que no son clientes o potenciales clientes, segn sus posibilidades de compra y expectativas de ventas, podemos clasificarlos segn la estructuracin anterior. Tambin podemos utilizar esta estructuracin para segmentar vendedores dedicados a clientes de gran consumo. Claves para aumentar la cartera de clientes. Todo negocio debe de tener una estrategia de ventas dentro de la cual debe de plantearse metas de crecimiento para vender ms. Para ello, debe hacer clientes, mantenerlos y seguir haciendo nuevos clientes. La parte ms difcil, quiz, sea la de mantener los clientes que ya se tienen, pero antes de ello veamos algunos consejos para lograr captar clientes.

45

Ser el mejor. Todo emprendedor sabe que su supervivencia depende primero y principalmente, de su producto. Por ello hay que procurar ser el mejor, causar una gran impresin, tener confianza en lo que se hace y dedicar todas las energas a conquistar el xito. La impresin que causamos y la calidad de nuestro trabajo es nuestra mejor tarjeta de visita, y la que va a generar un mayor boca a boca. Definir el nicho de actuacin. De nuevo hacemos hincapi en saber cul es nuestro pblico objetivo. Uno de los grandes errores del emprendedor es creer que su producto es para todos. Si bien todo el mundo puede beneficiarse potencialmente de tu producto o servicio, define claramente quin es tu cliente y organiza todo tu mensaje y esfuerzos de comunicacin para captar su atencin. El mensaje adaptado es ms efectivo que el generalista. Ver donde est el cliente. Ya que tienes claro quin es tu cliente, no basta con anunciarte y esperar que suene el telfono. En el cambiante y dinmico mundo que vivimos, los emprendedores que triunfan son aquellos que establecen una relacin personal con su nicho de mercado: participan activamente de eventos, foros online, conferencias, y visitan con frecuencia pginas web, redes sociales, lecturas y clases en torno a las temticas que interesan a su nicho de mercado. Cuanto ms cercano eres, ms confianza ofreces a tus clientes en potencia. Aprovechar lo que ya se tiene. Ya tienes una pgina web? Y correo electrnico? Ofreces a tus clientes ventajosos descuentos si te recomiendan a terceros? Cuentas con un lugar donde nuevos clientes puedan leer acerca de tus casos de xito y testimonios de personas satisfechas con tu producto? Ofreces productos gratuitos en tu web para que el pblico se familiarice contigo antes de comprar? Muchas veces, las mejores estrategias de promocin son las ms cercanas y obvias. No dejes pasar cada e-mail, tweet, visita, amistad y cliente como puentes hacia una nueva oportunidad.

46

Probar algo nuevo. Muchas veces caemos en la rutina de repetir las mismas estrategias de promocin una y otra vez. Tenemos la tendencia de volver a lo conocido. El autor motivacional y empresario Brian Tracey comparte un mtodo para combatir esta repeticin, que consiste en forzarnos a hacer una lista de 20 cosas que podemos hacer para conseguir clientes.

Por lo general, las 10 o 15 primeras suelen ser una versin reciclada de mtodos que ya estamos empleando pero, una vez pasado ese filtro inicial, no veremos forzados a crear de cinco a diez ideas que an no habamos tenido y que podremos poner en prctica de forma inmediata. En resumen, cntrate en tu esfuerzo personal y crea una gran impresin en todos aquellos que conoces. Utiliza tus redes sociales, tanto humanas como digitales, para llegar a tu pblico y comunicar tu mensaje. Ofrece algo de manera gratuita y nunca dejes de tener nuevas ideas y probar nuevos mtodos para llegar a tus potenciales clientes.

47

Inspirar confianza. Radica en generar tranquilidad en el cliente. Para que un "escaparate online" gane adeptos existen una serie de sellos que corroboran que la pgina cumple con los parmetros idneos de calidad. Crear un diseo accesible. Ofrecer una navegacin sencilla al consumidor es esencial para retenerle en la pgina y evitar la fuga de clientes. La primera toma de contacto crear una sensacin positiva o negativa difcil de cambiar. Facilitar el proceso de compra. La transaccin debe ser sencilla para evitar que el consumidor abandone la navegacin sin que culmine la compra. Adems, los precios deben aparecer de manera clara junto a cada artculo que se ofrezca. Mecanismos anti-fraude. El sistema de pago es una de las principales preocupaciones del cliente. Es indispensable contar con una pasarela de pagos segura, que pueda proveer el banco y que sean las entidades bancarias las que almacenen la informacin de las tarjetas de crdito, para que las dudas por la amenaza de posibles hackers se desvanezcan. Buscar trfico de calidad. La informacin de la pgina debe conquistar a todos los consumidores, por lo que es muy importante contar con un buen posicionamiento en internet, insertando en los contenidos las palabras clave para que un producto determinado se localice de manera inmediata. Impactar al usuario para que acte. Incitar a los clientes a adquirir los artculos que se promocionan en la web es crucial, as que no pueden faltar los botones de compra o elementos grficos que persuadan a hacer clic en el elemento solicitado.

48

Buscador de productos. En la mayora de los casos, las personas que acceden a una tienda online buscan una referencia concreta por lo que es necesario ofrecer un localizador que permita visualizar el artculo deseado. Disponer de una tienda fsica. A pesar de que no es esencial, contar con un local fsico aporta un gran valor al espacio online, puesto que el cliente asocia los productos a una empresa que ya conoce. Actualizaciones. El dinamismo informativo de la pgina crea una gran interaccin en el consumidor. Una web desactualizada genera desconfianza y rechazo, ya que le crea dudas en lo que se refiere a la veracidad de los contenidos. Informacin de contacto. Una de las principales recomendaciones es ofrecer un email y un nmero de telfono de contacto que provoquen en el usuario una sensacin de confianza. El cliente debe saber que sus dudas y consultas sern satisfechas. Utilizar bien los colores. De sobra es conocido el distinto efecto que ejercen los colores en nuestro estado de nimo. No hay reglas generales, y todo depender del tipo de web, nuestro pblico objetivo y el producto ofertado, pero a grandes rasgos, no debe abusarse de los colores estridentes, grandes dosis de amarillo o rojo y debe evitarse representar el texto en negativo (texto en blanco sobre fondo oscuro). Usar imgenes. La parte visual activa ms regiones del cerebro que ninguna otra. Es mucho ms fcil que recordemos algo si lo hemos visto, por ello no se debe tener miedo a utilizar gran profusin de material fotogrfico si es preciso.

49

Corre que se acaba! Asociado al concepto de prdida, es una prctica comercial muy comn jugar con la escasez. A todos nos suenan frases como ltimas unidades, date prisa antes de que se agote o slo disponible hasta el.... Muy efectivo, aunque no demasiado tico. Experimenta con los precios. Un interesante aspecto del neuro-marketing postula que los consumidores asignamos un precio a un producto determinado. De modo que si veo unos auriculares de 150, es mucho ms probable que me compre luego un modelo de 90, que si el primer precio que veo es, por ejemplo, de 30. Recomendaciones. Los testimoniales son un poderoso reclamo. Si no tienes presupuesto para contratar a un personaje clebre, procura publicar referencias o frases de clientes satisfechos o de una autoridad en la materia. Ofrecer algo desinteresadamente. Si publicas informacin valiosa, la gente volver a tu sitio con frecuencia para documentarse. Si ofreces una muestra de producto, puntos o cupones canjeables, descuentos, etc., los usuarios sern ms proclives a devolverte el favor comprando ms, rellenando largos formularios o recomendando la web a terceras partes. El orden importa. Para terminar, una curiosa prctica: quieres que tus clientes elijan un producto determinado de un catlogo? Entonces ensalo el primero de la lista. Experimentos realizados por Alexander Felferning en 2007 muestran un elevado ratio de eleccin a favor del producto listado en primer lugar. Al ser preguntados ms adelante, los sujetos entrevistados intentaron ofrecer una justificacin coherente a esta decisin arbitraria, inventndose los motivos.

50

Todas estas tcnicas y consejos deben aplicarse de manera racional, de acuerdo a nuestro tipo de empresa y los objetivos de negocio que hemos marcado desde un principio. Si se hace de esta manera se llegar ms rpidamente al xito esperado.

Para alcanzar el xito: Define tu estrategia empresarial. Establece los objetivos de negocio. Empatiza con el cliente. Mantnte permanentemente actualizado de acuerdo a las necesidades del cliente.

51

MDULO 3. LA INTERFAZ DE CONFIGURACIN. BACKEND. Backend y Frontend. Ds trminos en relacin. No podemos comenzar a explicar el Backend sin mencionar lo que es el Frontend. Ambos son trminos del mbito informtico que hacen referencia a un mismo proceso del diseo y desarrollo web. La creacin de un sitio web o una pgina de internet en general implicaa a estos dos factores, el frontend y el backend, tambin llamados backoffice o frontoffice.

El frontend en diseo de software y desarrollo web hace referencia a la visualizacin del usuario navegante o, dicho de otra manera, es la parte que interacta con los usuarios (los clientes). De una manera prctica, el frontend sera todos esos formularios que rellenamos en las webs, las aplicaciones que manejamos y todas esas cosas que tengan que realizar los usuarios. De esa manera el backend es la parte que procesa la entrada de datos que se efectua desde el frontend, es decir, son los procesos que utiliza el administrador del sitio con sus respectivos sistemas para resolver las peticiones de los usuarios. De manera conjunta, el frontend y el backend interactan en un sistema web o software para resolver las necesidades de los usuarios.

52

La idea de esta abstraccin es mantener separadas las diferentes partes de un sistema web o software con el fin de tener un mejor control. En pocas palabras el objetivo es que el frontend recolecte los datos y el backend los procese, es decir, el frontend forma la parte inicial del proceso y el backend la parte final. La separacin de los sistemas de software en frontend y backend, es una abstraccin que sirve para mantener separadas y controladas las diferentes partes de un sistema. La interfaz Backend es un conjunto de elementos (programas) que sirven como complemento de una interfaz Frontend. Ayuda en la administracin, control y configuracin de los sistemas teniendo un acceso directo a los recursos (base de datos, comunicaciones, servidores, etc.), que el sistema requiere. Entre sus funciones principales se tienen: Administracin de la memoria. Seguridad. Manejo de base de datos. Procesamiento remoto. El Frontend, como ya hemos apuntado, se refiere a lo que uno ve en una pantalla, y backend a la programacin tcnica que hay detrs de eso que uno ve. La relacin que existe entre ambos constituye un tipo de interfaz. El diseo de la interfaz. La interfaz web son elementos grficos que permiten al usuario acceder a los contenidos, navegar e interactuar. Para lograr que un usuario se quede y vuelva, el diseo de la interfaz es importante. Cuando accedemos a alguna de las muchas fuentes de informacin, desde los simples libros hasta los ordenadores, encontramos que la informacin contenida est organizada de forma tal que puede accederse a los contenidos con facilidad. En algunos casos, como en los libros, por ejemplo, el uso continuo por generaciones ha hecho que dicha organizacin se encuentre estandarizada y sea muy sencillo para los lectores encontrar cada uno de los elementos que lo constituyen.

53

Siguiendo el ejemplo de los libros, el orden en que aparecen los contenidos est descrito en el ndice, que generalmente se encuentra al principio o al final del mismo. Adems, la propia forma fsica del libro, la forma en que se encuentran ordenadas las pginas, hacen que la interfaz sea muy sencilla e intuitiva. En las pginas web, esta forma de ordenar las pginas no es posible, por lo que el ordenamiento y la clasificacin de las secciones, pginas y contenidos deben realizarse empleando otros mtodos, pero que permitan acceder a cada uno de ellos con la misma facilidad. Qu es la interfaz? El concepto de interfaz es muy amplio y se refiere a todo sistema que permite el contacto y la funcionalidad entre dos sistemas diferentes. Por ejemplo, los botones y la pantalla del telfono celular conforman la interfaz, ya que permite que el usuario pueda emplear las funciones que este aparato ofrece. Sin embargo, en este mdulo nos referimos a la interfaz web, que es un sistema grfico que permite a los usuarios acceder a los contenidos, realizar tareas, comprender las funcionalidades y navegar por las diferentes pginas del sitio. En definitiva, la interfaz web es el conjunto grfico que permite la presentacin y la navegacin del sitio. Esto se consigue con la inclusin de elementos grficos comunes a toda la web que son estndares, haciendo que los usuarios tengan completo control sobre las funcionalidades del sitio desde el momento mismo de entrar a l sin que para ello deba tener amplios conocimientos ni preparacin anterior alguna. Una pgina web puede contar con los mejores contenidos en el gnero que se desarrolla, pero indefectiblemente fracasar si su interfaz no permite un rpido y cmodo acceso a los mismos por parte de los usuarios. Por el contrario, una

54

pgina web cuyos contenidos sean de menor calidad (sin que stos sean malos, por supuesto) pero cuya interfaz permite que sus usuarios naveguen en forma sencilla, tengan acceso en forma inmediata al contenido que desean e interactuen en forma sencilla, tendr un mayor xito. Simplicidad y coherencia. La facilidad y comodidad con que los usuarios acceden a los servicios que brinda una web est fundado en dos principios fundamentales para el desarrollo de una interfaz efectiva: la simplicidad y la coherencia. La simplicidad con que se desarrolle esta interfaz es crucial para determinar que un usuario se sienta satisfecho y desee regresar a un sitio. El hecho de que una persona deba realizar una extensa navegacin por el sitio para hallar lo que busca en l es totalmente contraproducente. Por el contrario, si alguien que visita un sitio cuenta con varias herramientas que le permiten acceder rpidamente a aquello que le interesa, seguramente volver. La simplicidad est dada por varios factores a tener en cuenta. El primer concepto importante es que los elementos grficos o textuales que componen la interfaz deben ser claros y de fcil identificacin. Un ejemplo: el flujo de vehculos por las calles de una ciudad se encuentra regulado por una serie de sencillos elementos grficos (la interfaz) que permiten un trnsito ordenado. Qu sucedera si dichos elementos grficos fueran de comprensin compleja? El caos dominara el trfico de la ciudad, ya que, mientras algunos conductores no respetaran la sealizacin, otros se detendran a intentar adivinar que significa cada uno de aquellos jeroglficos. Con el mismo ejemplo, si en esa ciudad se encontrara uno con una autopista cuyos smbolos fueran de difcil comprensin y una angosta calle pero con elementos grficos que permitan un trnsito descongestionado y ordenado, muchos de los usuarios optaran por esta ltima opcin. Un ejemplo de simplicidad lo encontramos en la pgina principal del buscador Google. Si un usuario llega a un sitio cuya navegacin se le hace compleja, terminar por volver al buscador para seleccionar otro sitio que trate de temas similares.

55

Tambin es importante que la relacin que exista entre los diferentes elementos que componen el sitio, como ttulos, subttulos, enlaces, mens, etc., sea coherente. Todos los elementos que permitan al usuario identificar y navegar deben ser coherentes con el cometido que desempean, de forma que la comprensin y bsqueda de los contenidos sean accesibles por el usuario sin que deba realizar complejos razonamientos. Calidad del diseo y estabilidad funcional. Si ingresamos a un saln comercial y nos encontramos con que el piso est sucio, cuelgan telas de araa del techo y los dependientes se encuentran desaliados, seguramente permanezcamos poco tiempo, no compraremos nada y no volveremos a entrar. Lo mismo sucede con los sitios web. La primera impresin que un usuario recibe de un sitio web es extremadamente importante, por lo que el diseo debe ser cuidadoso en extremo, de forma tal que logremos convencerlo de que se trata de un sitio ordenado, cuidado y profesional. Lo mismo sucede con el funcionamiento del sitio. Nada ms desagradable que encontrarse con un sitio donde abundan los mensajes de error, con enlaces rotos, formularios que no funcionan, etc. La funcionalidad del sitio debe permanecer siempre cien por ciento o si no, lo ms cerca posible. El usuario debe tener claro que siempre que realiza una accin, esta tiene la respuesta que desea. Conclusin. Para que un diseo web sea efectivo, debe lograr que los usuarios del sitio puedan acceder con facilidad a los contenidos, interactuar con eficacia con todos los componentes y sentirse cmodo en forma permanente, y todo ello sin siquiera pensarlo. El elemento que consigue que esto sea posible es la interfaz, en cuya preparacin y diseo se debe poner especial atencin. Una parte importante de los xitos o fracasos de los sitios depende en gran medida de este elemento del diseo. Cmo simplificar la interfaz. Cuando realizamos la planeacin de un sitio, en principio, el diseador siempre busca conservar una interfaz limpia, fcil de usar, amigable e intuitiva. Pero esto se

56

va perdiendo conforme la elaboracin del sitio va avanzando y la complejidad va aumentando. Una interfaz compleja puede llevar consigo una desorientacin del usuario, provocando confusin y falta de iniciativa para interactuar con el sitio, llegando incluso a provocar el abandono del sitio por parte del visitante.

Para evitar esto debemos tomar las medidas necesarias y reducir la complejidad real del sitio, para despus combatir la complejidad percibida por el usuario y minimizarla, de tal manera el usuario ser recompensado con una experiencia gratificante al navegar por nuestro sitio. En este punto se mostrarn varias tcnicas que te ayudarn a simplificar las aplicaciones complejas, permitiendo crear buenas experiencias de usuario. Eliminacin de elementos innecesarios. Una de las primeras cosas que debemos hacer al evaluar nuestro sitio, es buscar utilidades y aplicaciones que la gente realmente no usa. Esta demostrado que la mayora de los usuarios que ingresan a un sitio slo utilizan la llamada columna vertebral de este, dejando de lado aplicaciones pequeas y complementos que se pueden ir creando a la marcha para tratar de solucionar ms problemas de los que en principio se plantearon.

57

Muchas veces pensamos que estas propiedades aumentan el valor del sitio, ya que estamos proporcionando una gama ms amplia de opciones, por lo que el usuario estar satisfecho con lo que le ofrecemos. Pero el efecto producido puede decepcionarnos, ya que en la gran mayora de las ocasiones estos complementos disminuyen el valor de nuestro sitio, ya que agregan complejidad a su uso. Las webs que intentan hacer todo en una mismo lugar, generalmente no terminan haciendo nada bien. Para que una web sea exitosa se debe aislar un solo problema y tratar de resolverlo de la mejor manera posible y con el mayor ingenio que se pueda aplicar, facilitando la vida al usuario, no ponindoselo ms difcil. Para llegar a obtener sitios y aplicaciones eficientes se debe recurrir a la eliminacin de propiedades y funciones innecesarias. Siempre debemos plantearnos que nada es necesario, de esa manera nos veremos obligados a buscarle una real utilidad a cada parte de lo que hemos planeado, y si no encontramos suficientes razones para elaborarlo, podemos eliminarlo del proyecto y terminaremos ahorrando tiempo de desarrollo. Si algo no ayuda a la mayora de los usuarios a realizar sus tareas en el sitio web, entonces probablemente se debe dejar fuera del proyecto. Al principio esta actividad te puede resultar difcil, ya que todo parecer necesario, pero cuando empieces a observar la manera sencilla en que los usuarios se mueven a travs de tu web, te dars cuenta que fue necesario eliminar dichos complementos. Ocultar la complejidad. En aquellos casos en donde no puedas eliminar la complejidad dentro de tu sitio, puedes recurrir a maquillarla. Si tienes una serie de aplicaciones que raramente son utilizadas por el usuario, pero que realmente le aaden un valor funcional a tu sitio, entonces puedes optar por esconderlas de la interfaz general, encasillndolas en un men desplegable o reduciendo su uso de espacio de pantalla. Una buena interfaz de usuario siempre debe resaltar las tareas ms comunes y ocultar las funciones menos utilizadas, para que de esa manera no interfieran con el flujo normal de las operaciones del usuario.

58

Por ejemplo, si tuvieras una herramienta dentro de un CMS que abarca muchsimo espacio de la interfaz, que es poco usada por los usuarios pero que tiene un gran potencial de ayuda, lo que se puede hacer es meter todos sus elementos dentro de una seccin que slo se despliegue cuando el usuario da clic sobre un icono. Esto ahorrar una gran cantidad de espacio e impide que la mayora de los usuarios se distraigan de su tarea principal. Disminuir el ruido visual. Hasta este punto hemos tratado de disminuir la complejidad real del sitio, eliminando y escondiendo aplicaciones que interfieren con el flujo de la interfaz y la operacin de los usuarios, pero tambin existe la necesidad de combatir la complejidad percibida. La cantidad de ruido visual en una interfaz tiene un gran impacto en la complejidad percibida por el usuario, mantener el ruido visual al mnimo har que una interfaz parezca ms fcil y sencilla de usar. Las dos herramientas principales para reducir dicho ruido visual, son los espacios en blanco y el contraste, de los que hablaremos ms adelantes cuando propongamos algunas tcnicas para mejorar el diseo de la interfaz. Reutiliza cdigo. Conforme va avanzando un proyecto, el sitio empieza a tomar forma y los problemas se tienden a repetir, nos encontramos con situaciones que se pueden resolver de manera similar y la reutilizacin de cdigo empieza a ser un factor importante. La reutilizacin de elementos para diferentes propsitos tiene dos ventajas, la primera es que se requiere menor tiempo de desarrollo y la segunda es que se logra una interfaz de usuario ms consistente mejorando la experiencia de la persona que va a utilizar el sitio. El xito de la reutilizacin se basa tambin en el aprendizaje, si un usuario aprende a realizar las funciones en una parte de la aplicacin, le resultar mucho ms sencillo realizarlas en otra si mantenemos un estndar y reutilizamos estructuras.

59

Conclusin. Al momento de desarrollar un proyecto siempre recuerda, se debe reducir la complejidad real mediante la eliminacin de las caractersticas innecesarias y despus buscando ocultar lo que no puede eliminar. Como segundo paso se debe tratar de reducir la complejidad percibida minimizando el ruido visual y haciendo uso de la reutilizacin de elementos.

Disminuir la complejidad de la interfaz de usuario ayudar a las personas a comprender el sitio ms rpidamente, y de esa manera podr utilizar todas sus propiedades y aplicaciones de de manera ms eficaz. Tcnicas para mejorar el diseo de la interfaz. En la actualidad, el diseo de interfaces para usuarios se ha convertido en un tema tan relevante, que la mayor parte del tiempo destinado para llevar a cabo las tareas de diseo web, se asigna para buscar mejorar la experiencia del usuario y tratar de obtener las mejores formas de presentar informacin. Todo el tiempo invertido en esta clase de proyectos tiene su justificacin, ya que el diseo de interfaces es uno de los factores pilares para determinar si es correcto o no el desempeo de un sitio web. Es por esta razn, que para encaminar

60

adecuadamente el diseo de un sitio, se debe optar por tcnicas que permitan la elaboracin de interfaces atractivas y funcionales. En este punto presentaremos una serie de tcnicas que sern de gran utilidad para los proyectos de diseo de interfaz de usuario. En s, estas tcnicas no estn vinculadas a un tema especfico, simplemente son sugerencias que permitirn mejorar la experiencia que tenga el usuario al navegar por el sitio. El color atrae la atencin. El utilizar el color como herramienta para llamar la atencin es una de las tcnicas ms fundamentales en el diseo de interfaces. El objetivo de utilizar esta tcnica es centrar la atencin del usuario sobre los elementos importantes, estableciendo sobre ellos un color que resalte sobre el resto, claro, siempre respetando el patrn con el que diseamos el resto del sitio para que no desentone y cause una sensacin de desconfianza. Se debe tener mucho cuidado con los colores que se eligen para ciertos elementos y secciones de la pgina, ya que si no se hace una eleccin correcta se puede terminar dando ms relevancia a ciertas partes que realmente no lo requieren, y dejando en segundo plano secciones donde muestras contenido que se consideran relevante para el usuario. Por ejemplo, si en tu sitio manejas una paleta de colores oscura, digamos utilizas negro y gris en el 80% de la estructura, y un da deseas agregar un botn de registro o uno para realizar donaciones, no debes utilizar el color negro o un gris fuerte para el nuevo elemento, ya que la relevancia del botn se perder. Para esa situacin, un botn de color rojo servir mejor, ya que atraer ms la vista y es muy probable que aumenten los registros o las donaciones gracias a ello. Los colores en tonos clidos como el rojo, amarillo y naranja son llamativos por naturaleza, por lo que tienden a atraer ms la atencin y el ojo del usuario tiende a buscarlos. Adems de esto, cuando se ponen en contraste con colores fros como el azul o el verde, tienden a crear la ilusin de ampliar el elemento que cuenta con colores clidos. Esto significa que un botn de color naranja sobre un fondo azul se ve como si estuviera fluyendo hacia fuera y toma el primer plano del espectador. Por el

61

contrario, un botn azul en un fondo naranja crea la sensacin de que el elemento desea permanecer en el fondo. Contraste para administrar la atencin. El simple hecho de manejar distintos colores hace que el usuario pueda hacer distincin entre elementos, pero si a esto le aunamos la propiedad del contraste, esto nos permitir crear un patrn jerrquico dentro de nuestro diseo. Lo que nos permitir crear una sensacin de jerarqua, ser el uso de colores en tonalidades similares, dando colores en escala mayor a los que son ms relevantes, e ir disminuyendo la escala segn la importancia el elemento. Una de las maneras ms adecuadas de llevar a cabo esta prctica, es aadiendo contraste mediante el uso de colores oscuros para resaltar los elementos importantes, y utilizar colores ms claros para los que siguen en relevancia. Si por ejemplo, tuviramos un blog donde publicamos un artculo a diario, nuestra portada lucir sobrecargada de informacin si no aplicamos un contraste adecuado. Para ello, podemos optar por asignar un color negro para los ttulos, mientras que las fecha de publicacin, el nmero de comentarios, el nombre del autor, o algn otro meta data, puede ir de color gris; esto indicar que el ttulo es mucho ms relevante que el resto de la informacin. Este efecto se logra gracias a que el color oscuro crea la ilusin de que el ttulo esta enfocado, mientras que el resto de la informacin parece desvanecerse en el fondo. Si por ejemplo quisiramos agregar ms relevancia al nombre del autor, podemos utilizar un color gris ms fuerte, que sea intermedio entre el color del ttulo y el resto de los datos. El nivel de contraste es una herramienta muy poderosa, si decidiramos invertir los colores y utilizar el negro para la meta data y el gris para el ttulo, veramos como los titulares se desvanecen y esto puede hacer perder inters al usuario. Como ya mencionamos esta tcnica se puede utilizar en blogs, pero no es exclusiva, cualquier sitio de grandes contenidos, como foros o las redes sociales, pueden

62

hacer uso de ella para resaltar elementos fcilmente entre un montn de informacin. Enlaces en bloques. Los elementos de tipo enlace, por defecto son desplegados de manera inline dentro de la estructura DOM de un sitio, es decir se muestran como un elemento alineado cuya rea seleccionable slo abarca la altura y el ancho del texto que contiene el link. Esta rea es la nica parte donde el usuario puede realizar el clic para poder llegar al destino, lo que puede causar molestas en caso de que el enlace sea muy pequeo. Se puede buscar incrementar el rea de clic de los enlaces para crear una mejor experiencia de usabilidad en nuestro sitio, para lograrlo basta con agregar unas cuantas propiedades CSS a este tipo de elemento. Primero podemos optar por aadir un cierto padding para agregar espacio alrededor de la palabra, y posteriormente, de ser necesario, podemos convertir a bloque la manera en que se despliegan los elementos de tipo enlace.

Obviamente una mayor rea de clic, hace que resulte ms sencillo para el usuario el llegar al destino que apunta el enlace, ya que hay menos oportunidad de fallar. Este factor se debe tener en total consideracin al momento de realizar mens y desplegar listas con enlaces en barras laterales, ya que el encontrarnos con enlaces que contengan palabras muy largas y muy cortas en una misma lista, puede causar mal aspecto en el diseo y confusin en el usuario al no poder dar clic sobre toda una rea que se encuentra vaca pero al mismo nivel que la palabra. Generalmente cuando creamos una lista de enlaces dentro de nuestro sitio, omitimos el factor de la uniformidad, por lo que simplemente dejamos los elementos desplegarse en su forma natural, sin importar que a veces puede resultar confuso para el usuario.

63

A continuacin nos enfocaremos en tcnicas un poco ms minuciosas, las cuales nos ayudarn a continuar mejorando la interfaz de usuario de nuestro sitio web, enfocndonos en detalles que muchas veces pasamos por alto. El espacio en blanco para relacionar. Uno de los elementos que tiene ms influencia sobre la apariencia de una interfaz, es el espacio en blanco que existe entre los elementos de la pgina. Ese tramo que dejamos libre, y que se encarga de separar los elementos es muy importante para que el usuario pueda intuir relaciones. Mediante la manipulacin de los espacios en blanco, podemos indicar las relaciones entre ciertos elementos o grupos de elementos. Por ejemplo, si ponemos un ttulo arriba de un prrafo, y estos se encuentran separados por un espacio normal, estamos dndole a entender al usuario que ese ttulo corresponde al texto que le sigue en la parte inferior. Pero si repetimos este proceso para otras secciones compuestas por ttulos y prrafos, puede resultar confuso para el usuario si no agregamos un espacio adecuado. Por ello, debemos agregar un espacio considerado entre cada seccin, para que de esa manera nuestro contenido sea ms legible. De esta manera definimos bloques de secciones nicamente modificando pequeos detalles de la interfaz, esto permitir que las relaciones entre elementos sean identificadas ms fcilmente por el ojo del usuario. Espacio entre letras. Si tu eres un amante de la tipografa puede que el diseo web te resulte una profesin bastante frustrante, ya que por defecto son pocas las opciones con las que se cuenta para elegir la fuente con la que se mostrar el contenido de nuestro sitio. Pocas fuentes web son seguras, ya que habr algunas que se muestren bien en alguna mquina y otras no, dependiendo de varios factores que van desde el navegador hasta el sistema operativo.

64

A eso, tenemos que aunarle el hecho de que no existen muchas variantes para modificar su estilo, pero a pesar de eso tenemos la ventaja de que cada letra esta bajo nuestro nivel de control, por lo que podemos utilizar el espacio como aliado para tratar de dar un estilo ms decente, y por consecuencia una mejor presentacin. Tracking es el trmino utilizado en el campo de la tipografa para describir el ajuste del espacio entre las letras que forman parte de una palabra, y gracias a la propiedad letter-spacing de CSS, tenemos la oportunidad de llevar a cabo esta tcnica. Si la utilizamos con moderacin, esta propiedad puede resultar muy eficaz para mejorar el aspecto de nuestros ttulos y cabeceras, pero si lo aplicamos en el cuerpo de un prrafo o bloque de texto muy largo, puede causar el efecto contrario. Si se utiliza con letras muy pequeas o en textos de lectura contina, puede que los haga perder la legibilidad que la distancia por defecto agrega. Esta tcnica puede resultar til si se quiere elaborar ttulos con esttica ms agradable u original. Un par de pxeles de espacio entre las letras hacen una gran diferencia en el estilo de la fuente, por lo que tienes que ser cuidadoso y no utilizar grandes distancias.

Botones ms ricos en contenido. Es comn que al desarrollar una aplicacin hagamos uso de ventanas emergentes, dilogos y cuadros, para condicionar una accin. En su mayora, estos dilogos cuentan con botones de opcin, los cuales al ser seleccionados determinan las operaciones que prosiguen al llamado, es por ello que la informacin que se despliega en ellos toma una relevancia considerable.

65

Por ejemplo, si en nuestra aplicacin incluimos un bloque de cdigo para que al momento de encontrar una decisin despliegue una ventana de confirmacin, lo que generar por defecto ser un pop up con opciones cortas y muy sencillas como S y No. Esto causar que el usuario tenga que leer completamente el mensaje de la ventana, para estar seguro que el botn que esta presionando es el correcto. Esto no tiene nada de malo, pero podramos mejorarlo y sobre todo acelerar el proceso para el usuario, agregando cierta descripcin para que enriquezca el contenido. De esa manera, en lugar de mostrar solamente un S podemos agregar algo como Guardar y en vez de un No utilizar No Guardar, de esta manera el usuario no necesita confirmar la manera en que hicimos la pregunta dentro del dilogo. Como punto final para esta tcnica, debes recordar que slo estamos recomendado su uso para ventanas de opciones, los botones en una interfaz normal deben permanecer cortos en texto. Estilos a los elementos enfocados. Es comn manejar varios tipos de elementos a lo largo de un formulario, por ello es fcil que la atencin del usuario se pierda si no incluimos una ayuda visual. Podemos agregar un estilo individual para el campo donde actualmente se encuentra colocado el puntero, esto ayudar al usuario a identificar la parte que sigue en el proceso, y donde debe de introducir la informacin.

El personalizar tus elementos de formulario agregar una cierta estandarizacin que persistir en todos los navegadores, permitindote garantizar una imagen homognea de tu sitio.

66

Como ya dijimos, en este curso vamos a tomar como modelo de gestor de sitios a Pretashop. A continuacin introduciremos el tema, para despus centrarnos en la configuracin del Backend de este gestor.

67

Pretashop: La solucin e-commerce. PrestaShop es una herramienta utilizada por ms de 40.000 tiendas que permite construir de manera simple y eficaz un sitio de venta en lnea sin tener grandes conocimientos ni de programacin o diseo de pginas web de antemano. Esta herramienta es de fcil funcionamiento, intuitiva y eficaz. PrestaShop propone un backend muy potente que le permite administrar en tiempo real su tienda (catlogo, historial de pedidos, gastos de envo, clientes, carritos llenos, etc.). Sus clientes podrn as, disfrutar de una tienda agradable a su medida. PrestaShop ofrece un panel de administrador completo, de utilizacin simple, que propone ms de 200 aplicaciones en estndar, y permite una gran adaptacin y personalizacin respondiendo as a todas sus necesidades. Instalacin de Pretashop. Descarga del software. La primera etapa para utilizar la solucin e-comercio PrestaShop consiste en instalarla en su hosting. Debe descargar la ltima versin del software de tienda en lnea en la siguiente direccin: http://www.prestashop.com/es/downloads/

68

Una vez que haya terminado la descarga, aparecer un archivo en formato zip., extrigalo con un programa de extraccin de archivos. Si no tiene ninguno, le aconsejamos que utilice Winrar, Winzip o incluso una versin libre 7zip. (http://www.7-zip.org/ ). Cuando haya extrado el contenido del archivo, deber colocarlo en el servidor que alojar su tienda. Para ello, debe poseer un hosting o solicitar uno directamente a PrestaShop. Consiga un software FTP para transferir la totalidad de la carpeta PrestaShop. Utilice por ejemplo Filezilla que es Open Source y totalmente gratuito: http://www.filezilla.fr/ Lance el programa FTP y conctese a su servidor para comenzar a transferir la carpeta PrestaShop. Coloque la carpeta en la raz.

69

Creacin de una base de datos. Para poder almacenar el conjunto de la informacin de su tienda, PrestaShop utiliza una base de datos MySQL. Al crear esta base de datos puede encontrar diferentes posibilidades que dependen de su hosting. Por ejemplo, PhpMyadmin, una de las herramientas de bases de datos ms utilizadas. En la pgina de inicio aparece una pestaa Crear una base de datos. Elija el nombre que quiere darle. Por ejemplo, PrestaShop. Una vez que le haya puesto nombre, pulse en Crear para validar. Entonces aparece el siguiente mensaje: La base de datos PrestaShop ha sido creada. Ver la siguiente imagen:

70

Instalacin. Una vez que haya creado la base de datos, ya puede lanzar la instalacin de su tienda en lnea PrestaShop. En su navegador elija la URL de su nombre de dominio o la direccin de su servidor y aada /install. Ejemplo: mitienda.com/install. Despus aparecer la ayuda de instalacin:

71

Seleccione el idioma que quiera y pulse en siguiente. La pgina Sistema y permisos aparece. Esta le indica si la configuracin de su servidor es totalmente operacional. En ese caso todos los puntos deben aparecer con un icono verde y circular de OK a la izquierda.

Si aparecen iconos rojos, puede ser debido a diferentes problemas. En lo que respecta a la categora Parmetros PHP puede ser debido a una incompatibilidad o a una configuracin incorrecta de su servidor. Transmita el punto incorrecto a su hosting para que le ayude a corregirlo. En lo que respecta a los Derechos en escritura, vuelva a su software FTP, pulse clic derecho en las carpetas que aparecen no vlidas y pulse en Permisos de archivos. Seleccione otros permisos aplicando la funcin recursiva. (Ejemplo de permisos de archivos: 777, 755, 705, etc.). Ver la siguiente imagen:

72

Despus, pulse en comprobar de nuevo en el asistente de instalacin de PrestaShop. Cuando todos los elementos sean vlidos, pulse en siguiente, llegar a la pgina de configuracin sistema. Conexin a la base de datos.

73

Se requieren varios campos que le proporcionar su hosting. Introduzca el nombre de la base de datos que acaba de crear en el campo Nombre de la base. Despus pulse en Hacer test SQL para comprobar que los parmetros son correctos, en cuyo caso aparece el mensaje Se ha encontrado la base de datos. Si no es el caso, significa que los datos que ha introducido no son correctos, comprubelos en su hosting y renueve la operacin. Pulse en Siguiente. Encontrar la pgina de configuracin de la tienda. Proporcionar datos generales.

Rellene el conjunto de los datos que le conciernen. Seleccione el logo de su tienda pulsando en Elija un archivo, despus bsquelo en su ordenador. Posteriormente podr modificarlo en el Backend de su tienda una vez instalado. A ttulo indicativo, el logo aparecer: En todas la pginas de su tienda. En su backend. En los correos electrnicos transmitidos a sus clientes.

74

En sus documentos contractuales (facturas, vales de devolucin, etc.). Si desea conservar una huella de los datos que acaba de introducir, marque la opcin Recibir mis datos por correo electrnico (aconsejable). Despus pulse en Siguiente para terminar la instalacin de su tienda. Fin de la instalacin.

En este momento, aparecer una pgina recapitulativa que le recuerda los datos que ha introducido. En la parte inferior, aparecen los temas y mdulos que le permiten personalizar su tienda a su conveniencia.

75

Los temas servirn para personalizar el aspecto grfico de su tienda, mientras que los mdulos le permiten aadir nuevas aplicaciones. Puede consultarlas directamente en el siguiente link: http://addons.prestashop.com/es/ Su tienda ya est instalada! Pulse en Descubrir mi tienda para acceder al escaparate de su tienda. Supresin de la carpeta Install/Renombrar carpeta admin.

Para terminar la instalacin, utilice el software FTP para suprimir la carpeta Install. Por otra parte, cambie el nombre de la carpeta admin por otro. Al aadir el nombre Admin es posible acceder a su Backend, y puesto que admin es el nombre de base comn a todas las tiendas, es necesario modificarlo para que sea inaccesible a personas ajenas a su servicio. Para modificarlo, pulse clic derecho en la carpeta Admin, despus seleccione el nombre que desee.

76

Memorice este nombre ya que lo necesitar para acceder a su Backend.

Fin de la instalacin/conexin al Backend.

Una vez haya renombrado la carpeta, introdzcala a continuacin de la URL de su tienda directamente en su navegador. Por ejemplo: http://www.mitienda.com/adminprestashop. En este momento, llega a la pgina de conexin del panel de administrador. Introduzca los datos de

77

conexin, es decir la direccin de correo electrnico y la contrasea. Validar pulsando en Conexin. En este momento aparece la pgina de inicio del Backend o panel de administrador de su tienda, a partir de la cual puede empezar a configurar su tienda para proponer productos a sus clientes. Descubrir y configurar el Backend PrestaShop. Una vez la tienda ha sido correctamente instalada y est libre de errores procederemos a descubrir y configurar el Backend o Backoffice de Pretashop. La pgina de inicio del Backend de PrestaShop se divide en tres partes: Navegacin: Agrupa el conjunto de las pestaas tiles para recorrer los diferentes apartados de su tienda. Panel de control: Incluye el conjunto de los datos ms importantes de su tienda como el nmero de pedidos, el volumen de ventas realizado, etc. Novedades de PrestaShop: Le informa sobre las novedades del software PrestaShop como las actualizaciones. Debe consultar regularmente este apartado para estar al tanto de las nuevas aplicaciones de su tienda y poder actualizarla.

78

El primer contacto con su tienda se hace a travs del Backend, o Panel de administrador. La navegacin en el interior del Back-Office se efecta con ayuda de las pestaas, situadas en la parte superior de la ventana. Encabezado del Backend. A lo largo de la parte superior de cada pgina del Back Office se encuentra con el siguiente encabezado que se compone de una serie de elementos que explicamos a continuacin.

Buscar. Buscar por producto, categora, o ID de pedido (slo referencia numrica). Idioma. Clic en el icono de una bandera para cambiar el idioma del Back Office. Acceso Rpido. De la lista desplegable, seleccione: Inicio para volver a la pgina principal del Backend. Mi Tienda para ir a la pgina principal de su Frontend. Nueva categora para crear una Categora nueva. Nuevo producto para aadir un Producto nuevo al catlogo. Nuevo pedido para crear un nuevo Pedido. Salir. Clic en junto al nombre de usuario para salir. Fichas del Backend. La Tienda Virtual tambin muestra en la parte superior de cada pgina, varias fichas del Backend que a continuacin explicamos.

Catlogo. Utilice la ficha Catlogo para acceder a su catlogo de productos. Desde la ficha Catlogo, puede crear y gestionar lo siguiente:

79

Categoras y Subcategoras. Ordene sus productos por categoras y subcategoras. Los productos pueden pertenecer a mltiples categoras y subcategoras. Las categoras se clasifican automticamente por orden alfabtico, pero tambin las puede ordenar numricamente. Productos. Introduzca toda la informacin relacionada con el producto que est vendiendo, incluyendo texto, imgenes, especificaciones, dimensiones, y combinaciones de caractersticas (por ejemplo: color/peso/precio). Fabricantes. Gestione los fabricantes de los productos que quiere vender. Proveedores. Gestin de proveedores y lugares de abastecimiento de los productos de su catlogo. Atributos y grupos de atributos. Creacin y gestin de los diferentes atributos que deben utilizarse y combinarse para crear los diferentes modelos de sus productos. Caractersticas. Aada y gestione las caractersticas utilizadas para describir sus productos a travs de la asociacin de los grupos/modelos de atributos. Las caractersticas son estrictamente informativas. Utilice los atributos cuando las modificaciones de un producto afecten a diferencias de precio o cantidad entre modelos. Clientes. Ver y gestionar las cuentas de todos sus clientes, incluidas las de aquellos que se registraron pero todava no han comprado. Dar seguimiento a todas sus acciones, el estado de sus carritos de compra y otras acciones que dan al Prestashop una potencia increble a la hora de la gestin de usuarios.Tambin se puede aadir cuentas de clientes manualmente. Pedidos. Ver y gestionar todos los pedidos realizados a travs del Front Office, incluidos los incompletos y los errores de procesamiento. Tambin puede gestionar desde aqu las devoluciones de Mercancas (RMAs), hojas de Crdito, estado de los Pedidos, y las facturas PDF. Pago. Es una de las partes fundamentales de nuestro sistema, es la parte que debemos monitorear constantemente, en este se muestran todos los pedidos de nuestros clientes, de esta forma usted sabr qu debe enviar y cuando, ver si

80

est pagado todo o no, como dijimos al principio recuerda que el xito de nuestro negocio est en la seriedad que le demos al tema. Podr gestionar adems: albaranes de entrega, devoluciones de productos, vales, entre otros. Esta ficha incluye: Mdulos. Configure o desinstale los mdulos encargados de recibir y procesar los pagos online. Monedas. Gestione las monedas aceptadas para las transacciones realizadas a travs del Frontend. Impuestos. Configure los impuestos aplicados a las transacciones realizadas a travs del Frontend. Descuentos. Gestione los vales de descuento que pueden ser canjeados por sus clientes a travs del Frontend. Transporte. Organice todo lo concerniente al envo de sus productos a sus clientes, incluyendo los siguientes elementos. Es importante que antes de configurarlo todo obtengamos datos claros y concisos de nuestro agente de envo. Transportistas. Establezca los transportistas que sus clientes pueden escoger cuando efectan un pedido. Pases. Seleccione aquellos pases a los que vaya a efectuar envos. Zonas. Cree zonas para agrupar los gastos de envo. Por ejemplo, si usted opera desde Espaa y los gastos de envo a Francia y Portugal son similares, podra crear una nueva Zona llamada Vecinos que incluya a Francia y Portugal. Rangos de Precios. Determine los rangos de precios a utilizar en funcin del peso para el clculo de los gastos de envo. Rangos de Peso. Determine los rangos de peso total de los paquetes a utilizar en funcin del precio para calcular los gastos de envo.

81

Estadsticas: En esta seccin podremos revisar todas las estadsticas de nuestro sitio. Un consejo importante es siempre estar pendiente a las estadsticas: qu es lo que ms se vende, las votaciones de nuestros usuarios y todo lo que se mueva en ese contexto, de ah sacaremos nuestras propias cuentas y ver lo ms aceptado y lo menos, categoras ms visitadas, entre otras conclusiones. Mdulos. Es donde estn instalados o por donde se pueden instalar todos los mdulos de nuestra tienda. Para los usuarios bsicos de Internet, los mdulos son funcionalidades que se les acoplan a un sistema para lograr un objetivo determinado; ejemplo de esto lo constituyen los mdulos de pagos. Su mayor funcionalidad es dotar a nuestro sistema de varias formas de pago. Posiciones. Trasplante (mueva) Mdulos de una seccin de la pgina del Front Office a otra. Empleados. Aada, edite y borre a los empleados que pueden acceder al Back Office de Tienda Virtual. Permite gestionar todos nuestros empleados y sus permisos dentro de nuestro sistema. Preferencias. Establezca las preferencias tanto del Back como del Front Office, incluyendo idioma, pas y moneda por defecto, y cambie el tema del Front Office. Apariencia. Seleccione el logo de su cabecera, Favicon y metadatos. Configuracin de Producto. Escoja como se vern sus productos en el Front Office. Configuracin de correo. Determine cmo enviar sus emails el Back Office (por medio de la funcin de correo de PHP o a travs del servidor SMTP). Ajustes de Imagen. Configure los distintos tamaos que usar Tienda Virtual para presentar sus imgenes, y regenere las imgenes en miniatura. Ajustes de la Base de Datos. Configure los parmetros de conexin entre Tienda Virtual y su base de datos MySQL.

82

Herramientas. Herramientas que nos ayudan a la administracin y construccin de nuestro sistema, con ella ocurre lo mismo que con las preferencias, ya en su momento detallaremos cada una. Perfiles. Cree tipos de usuario para el Back Office de Tienda Virtual (p.ej., Administrador, Empleado de Ventas, Gerente de Inventario, etc.). Permisos. Determine que Perfiles de Empleados tienen acceso a determinadas funciones del Back Office, y si pueden ver, aadir, editar y/o borrar informacin. Contactos. Cree y gestione los Contactos a los que se les enviarn emails una vez usen el formulario Contctenos del Front Office. Idiomas. Aada idiomas para hacer accesible a los clientes su Front Office. (El idioma que quiera usar puede que ya exista; compruebe del Foro de la Comunidad de Tienda Virtual > Idiomas para disponibilidad de idiomas.) Traducciones. Modifique, exporte o duplique los idiomas instalados, o importe un nuevo fichero de idiomas. Pie del Backend. A lo largo de la parte inferior de cada pgina del Backend se observan los siguientes elementos:

Enlaces al Foro de la Comunidad de Tienda Virtual y a la pgina de Contacto con Tienda Virtual. Para informar de un fallo, utilice por favor, la seccin adecuada del Foro de la Comunidad. Nmero de Versin. Presenta la versin actualmente instada del programa Tienda Virtual.

83

Primeras configuraciones de Prestashop. Antes de comenzar la publicacin de artculos y otros elementos en una tienda online, hay una serie de pasos que debemos cumplir antes, con el objetivo que cuando llegue ese momento todo est configurado y listo para asumir la carga de los productos. Aadir o editar toda nuestra informacin empresarial (Herramientas/CMS). En esta aadir elementos como las condiciones de uso, quienes somos y otros elementos que lo ayudarn a orientar al usuario sobre su identidad y sus polticas. Idiomas (Herramientas/Traducciones): le permite establecer su idioma principal y todos los idiomas secundarios, con esto mucho cuidado, si elige ms de un idioma deber tener condiciones para sostener esto. Es un error comn creer que si elige otro idioma las cosas se traducen solas y es incorrecto, el sistema de gestin solo trae traducido los elementos nativos del Front y BackOffice como son menes, mensajes y otros elementos, el resto de los elementos van por usted. Logo e imagen empresarial (Preferencias/Aspecto): En esta seccin podr configurar lo referente a su imagen comercial, logotipo y tema grfico de su tienda. Configurar tiendas (Herramientas/Tiendas): En caso de tener una tienda fsica configurarla en este apartado. Configurar informacin de contacto (Preferencias/Datos) Configurar unidades de medida a utilizar (Preferencias/Ubicacin): En esta seccin debe configurar todas las unidades de medida. Configurar moneda a utilizar (Pago/Divisas): Se configura la/las monedas que se van a aceptar en el sitio, lo ms importante de esto es que desde el principio se defina bien esto, sino luego manualmente deber cambiar cada uno de los valores en los productos.

84

Establecer rgimen fiscal (Pago/Reglas de impuestos): Se establece el rgimen fiscal al que est sujeto. Establecer detalles bancarios (Mdulos): Buscar los mdulos de pago y establecer los elementos de pago. Rellenar elementos del catlogo. Antes de insertar un producto se deben rellenar elementos como atributos, fabricantes, proveedores, etc., con el fin de que todo est listo. Ya familiarizados con los principales mens de Prestashop, estamos en condiciones de comenzar a trabajar con el mismo. Para obtener ms informacin sobre toda la configuracin completa del Backend de Pretashop pestaa a pestaa, recomendamos el siguiente manual en PDF que se pueden descargar en la siguiente direccin. http://www.mervir.es/manuales/Manual-Tienda-virtual-mervir-Prestashop.pdf

85

MDULO 4. EL DISEO. Principios del diseo Web. La cantidad de pginas web existentes se pueden contar en miles de millones. Sin embargo, un bajo porcentaje de ellas tienen un buen diseo, debido fundamentalmente a que muchos diseadores web no siguen los principios bsicos del diseo web, a lo que puede sumarse que la mayora de estos diseadores web no son profesionales ni conocen en profundidad el terreno en el que se desenvuelven. El diseo web es mucho ms que la aplicacin del buen gusto. El diseo web es una tcnica que se basa en una serie de reglas, ms o menos definidas, que sirven para crear algo que resulte til y atractivo a la vez.

Y de la mano del diseo puramente grfico del sitio, va toda una planificacin de los contenidos del sitio, las estructura de los mens, cmo ser la interaccin con el usuario, rutas de navegacin, arquitectura de informacin y en definitiva, todo un dilogo que ha de establecerse entre el sitio web y el visitante, que debe pensarse y planificarse para que ste ultimo entienda el contenido del sitio y sepa usarlo. Por lo que el diseo web es mucho ms que darle color y estilo a una pgina web.

86

Durante la planificacin de un proyecto, debe tenerse en cuenta que es muy probable que exista algo similar en la web, lo que hace que el diseador se vea obligado a hacer un buen diseo para poder competir. El diseo web tiene dos partes bien diferenciadas: la funcionalidad o usabilidad y la esttica. Ambas son imprescindibles, ya que una pgina funcional pero con mala esttica no atraer la atencin de posibles usuarios o visitantes, mientras que una pgina muy bonita pero que funciona mal har que los visitantes que lleguen atrados por la buena esttica del sitio no regresen a l por no encontrar lo que necesitan o les resulte difcil. En esta introduccin vamos a referirnos exclusivamente al diseo web desde el punto de vista esttico para realizar una pgina atractiva y efectiva. Seleccin del tipo de diseo. El diseo de una pgina web debe estar acorde con el contenido de la misma. Esto quiere decir que la seleccin del tipo de diseo que va a llevar nuestra web debe estar acorde con lo que el usuario busca en ella y con el producto o servicio ofrecido por la misma. Por ejemplo, una pgina destinada a juegos y un peridico digital, implican estticas totalmente diferentes, ya que mientras que en la primera prevalecern los colores fuertes y estar basada en imgenes, el peridico digital deber ofrecer un aspecto ms sobrio, elegante, ordenado y se basar en imgenes y contenidos escritos. El diseador deber analizar estos factores y planificar su trabajo, haciendo una maqueta. Esta maqueta no es ms que un dibujo de lo que programar posteriormente. Para hacer una maqueta primero se piensan y deciden los contenidos que va a tener el sitio, con papel y lpiz se estructuran y bocetan las secciones principales, posicionando cada elemento de la pgina en el sitio que se considere apropiado, y una vez se tiene en papel un boceto de como ser la pgina web, se pasa a disear la parte grfica empleando programas de dibujo. El Photoshop es muy usado para tal efecto, aunque tambin hay otros programas como Gimp, que pueden ayudar igualmente en el proceso.

87

Esta maqueta hecha en Photoshop tendr adems otra funcionalidad, ya que podr extraerse de ella las imgenes para crear fondos, mens, botones, etc. Los principios del diseo web. El diseo web debe seguir los mismos principios que rigen cualquier clase de diseo. Una pgina web, la portada de un libro, una revista, un peridico o cualquier otra publicacin deben estar diseados bajo los mismos principios, entendiendo las diferencias que corresponden a cada medio. Esto quiere decir que, para tener ejemplos de buenos diseos, podemos observar y analizar publicaciones exitosas y atractivas para saber cmo se deben ordenar y decorar los elementos componentes de nuestra web. Otra forma de observar buenos diseos es visitar pginas que se destaquen por ello, como puede verse en las siguientes pginas: http://www.webbyawards.com/ http://designdisease.com/ Los principios que rigen el diseo web son: Balance. Es el equilibrio que debe existir entre los diferentes elementos que componen la pgina. Imgenes y texto, elementos grandes y pequeos, zonas oscuras y claras, etc., deben estar balanceadas de forma tal que la pgina no solo resulte atractiva, sino que adems logre enfocar la atencin del usuario sobre aquellos elementos que nos interesa que lo haga. Contraste. El contraste es una forma de distinguir los elementos que deseamos resaltar. Diferencias en la tipografa, diferencias en las formas (crculos, cuadrados, rectngulos, etc.), diferencias de tamao (una imagen ms grande con otras ms pequeas, por ejemplo), texturas y fondos diferentes, etc., son algunos de los contrastes que pueden emplearse para enfocar la atencin del usuario sobre los elementos ms importantes de la pgina.

88

nfasis. Es una forma de distinguir algo dentro de un elemento. Un ejemplo de esto es lo que sucede con este texto, donde los ttulos se encuentran resaltados as como algunas palabras o frases, de forma que facilita la comprensin de lo que se quiere transmitir.

Repeticin o ritmo. El ritmo o repeticin es una forma de establecer patrones con los que se ordenan los elementos de la pgina. Si los elementos de una pgina web siguen un patrn determinado, es mucho ms sencillo para las personas comprender el contenido y acceder a la mayor parte del mismo en poco tiempo. Este punto es clave para mantener la usabilidad del sitio. Proximidad o unidad. Este concepto se refiere a colocar juntos o prximos los elementos que estn relacionados, formando unidades visuales que brindan coherencia al contenido de la pgina. Utilidad de los principios de diseo web. El diseo de una pgina web debe hacer que el usuario que ingresa a la misma sea guiado hacia la informacin que nos interesa que vea.

89

El logo de una pgina web suele colocarse en el extremo superior izquierdo debido a que hay estudios que indican que ese es el sitio que miran los internautas cuando ingresan a la pgina, y al que vuelven a mirar para saber dnde estn. Adems, los logotipos suelen ser grandes y llamativos. De ah en ms, el usuario debera ser guiado mediante una secuencia de pasos por las zonas del documento que nos interesa que vea. La atencin que prestan quienes navegan por internet a cada pgina que visitan es apenas de unos pocos segundos, por lo que cada instante que el usuario de la pgina desve su atencin de lo que nos interesa comunicar, estaremos perdiendo la oportunidad de mostrarle lo que realmente nos interesa que vea. Un aspecto importante a tener en cuenta es la legibilidad y la amenidad de los contenidos aplicados en el diseo. Esta atencin sobre las partes esenciales del contenido es la meta que debe seguir todo diseo. En los breves segundos que el usuario presta atencin antes de irse de la pgina, el diseo debe lograr que se quede y guiarlo por el contenido de la pgina para cumplir los objetivos de la misma. Otra misin importante del diseo web es colaborar en convencer al usuario de la pgina que el servicio o el producto ofrecido es lo que necesita o le conviene. Para ello es necesario que el diseo web se ajuste a los requerimientos del producto o servicio, sin descuidar los principios del diseo. Todo esto, que parece complejo, resultar mucho ms sencillo en la medida que se vaya ahondando en el diseo de pginas web, ya que la puesta en prctica de estos principios har mucho ms sencilla su comprensin. Iniciarse en el diseo Web. Qu se necesita para ser diseador web? Iniciarse en el diseo web implica necesariamente un proceso de aprendizaje. Todo diseador web debe conocer al menos dos lenguajes de programacin web (HTML y CSS, que son indispensables y complementarios), saber como elegir un servidor, contratar un dominio, pagar y cobrar por medios electrnicos, emplear editores HTML, editar imgenes, usar editores WYSIWIG y una larga lista de etcteras.

90

Sin embargo, muchas de estas tareas son realmente sencillas, y las que no lo son, resultan realmente divertidas, por lo que a quien se sienta atrado por el diseo Web, no le costar ningn trabajo aprender todo esto. La primera tarea que se debe emprender, es aprender el lenguaje HTML (Hyper Text Markup Language), para lo que recomendamos leer la gua que pueden encontrar en el siguiente enlace: Manual de HTML. http://profesores.fi-b.unam.mx/cintia/Manualhtml.pdf A pesar de que posteriormente se tome la decisin de emplear editores WYSIWYG como Dreamweaver, que para personas inexpertas facilitan mucho la tarea, puesto que tiene un editor visual que te permite crear tu pgina web sin necesidad de profundizar en el cdigo. No obstante, conocer el lenguaje HTML es indispensable, ya que en la mayora de las veces el diseador web tiene que retocar el cdigo producido por estos editores. Una vez que se han obtenido los conocimientos fundamentales de HTML, el siguiente paso es aprender a utilizar CSS (Cascading Style Sheets u Hojas de Estilo en Cascada). CSS es un lenguaje que permite al diseador web dar la apariencia visual desea a sus pginas. Con un correcto marcado html, puedes crear pginas muy diferentes usando tan solo CSS. Adems, CSS permite mantener separados los contenidos de la presentacin, emplear el mismo cdigo en varias pginas, modificar la presentacin de la pgina sin afectar a los contenidos y viceversa y da un mayor control al diseador sobre los estilos y formatos de sus pginas. En el siguiente enlace recomendamos un manual de introduccin al CSS. http://www.jesusda.com/docs/ebooks/introduccion_css.pdf

91

El lenguaje CSS es algo ms complicado que HTML, pero tambin es ms entretenido. Llegar a tener un conocimiento avanzado sobre CSS requiere mucha experiencia y tiempo, uno se da cuenta conforme va aprendiendo que en realidad le queda mucho por entender y a veces el lmite slo lo pone la imaginacin. Se pueden hacer cosas increbles slo con CSS. Como decamos, conseguir tener control total sobre CSS es algo que va a llevar ms tiempo, mucha prctica y requerir constancia. El aprendizaje del lenguaje CSS tiene una utilidad adicional, y es que puede considerarse un paso intermedio antes de comenzar a estudiar otros lenguajes ms avanzados. Qu es HTML? El lenguaje HTML consta de una serie de comandos u rdenes que los navegadores pueden interpretar, por lo que puede decirse que una pgina web es un documento donde se escriben contenidos y una serie de instrucciones para indicarle al navegador como debe mostrarlos. A travs del lenguaje HTML podemos comenzar los primeros pasos en el diseo web. Tal como se describe en el manual bsico sobre HTML, para comenzar a realizar nuestras primeras prcticas solo es necesario emplear un editor de texto y un navegador. El lenguaje HTML est compuesto por etiquetas que no son ms que instrucciones que le indican al navegador qu hacer. Algunas de estas etiquetas son instrucciones puntuales, por lo que se componen de una sola instruccin o etiqueta, mientras que otras pueden tener una extensin ilimitada, por lo que es necesario introducir una etiqueta de apertura y otra de cierre, limitando la extensin de la instruccin. A la mayora de las etiquetas HTML se le puede agregar atributos y un valor para ste. Para poder comprender mejor estos conceptos, daremos un ejemplo sencillo.

92

La etiqueta <hr> produce una lnea horizontal que se extiende por todo el ancho del documento y que tendr un grosor de 1 pxel. Sin embargo, es posible crear lneas de distintos grosores empleando esta etiqueta, para lo que deberemos agregar el atributo SIZE, al que le podremos dar el valor que deseemos:

Todos estos conceptos se vern ms claros en la medida que nos vayamos introduciendo en el aprendizaje del lenguaje HTML. Es aconsejable tener a mano un listado de las etiquetas HTML para realizar cuantas consultas se necesiten hasta que se vayan memorizando los cdigos bsicos. Qu es CSS? Al igual que el lenguaje HTML, el lenguaje CSS solo requiere el empleo de un editor de texto y un navegador, si bien es cierto que resultan de mucha utilidad algunos programas que estn creados exclusivamente para crear hojas de estilo. HTML y CSS son lenguajes complementarios, ya que, a pesar de que pueden realizarse pginas web slo con HTML, esto no es lo ms conveniente ni lo ms aconsejable, la presentacin visual del sitio dejar mucho que desear. El lenguaje CSS se emplea exclusivamente para definir como se va a presentar el contenido de la pgina. Esto puede llevarse a cabo dentro del documento HTML, dentro de cada etiqueta de ese documento o bien como parte de un documento anexo a la pgina web. Mediante el empleo de CSS, se puede organizar la pgina disponiendo el lugar y la extensin que ocupar cada elemento y el formato de los mismos e incluir imgenes, videos y sonidos (como consejo, no uses sonidos en las pginas web,

93

son molestos, resultan poco profesionales y no aportan nada al sitio) y definir como se mostrarn cada uno de ellos. Otros lenguajes. En la medida que las exigencias del diseo van avanzando, se har necesaria la inclusin de otros lenguajes, como javascript, php, asp y otros, ya que con HTML y CSS se consiguen pginas estticas, donde el usuario se encuentra limitado a ver o escuchar el contenido. Algunas pginas web requieren que los usuarios interacten, enven datos, llenen formularios, etc., lo que solo es posible incluyendo otros lenguajes, al menos en parte de las pginas. Si bien es cierto que hoy en da la mayora de pginas web funcionan gracias a gestores de contenido (CMS), que son aplicaciones prefabricadas en las que la parte de programacin y diseo est ya creada por defecto, y normalmente se personalizan/modifican para usarse. En este punto el diseador puede plantearse dar el salto al desarrollo web, y aprender estos lenguajes de programacin, o bien puede comenzar a trabajar mano a mano con programadores que tendrn muchos ms conocimientos que l en estos lenguajes, y poder aprender de primera mano las bases del diseo y a la vez impulsar su negocio. Conclusin. A pesar de que la lista parezca un poco extensa, una vez que se introduzcan en el mundo del diseo web, el aprendizaje de cada uno de estos lenguajes los ir llevando a introducirse en otros, por lo que el conocimiento lo irn adquiriendo en la medida que lo vayan necesitando y no como mtodo forzado de estudio. El aprendizaje del diseo web se produce en una forma muy entretenida, ya que normalmente, los que se dedican al diseo web lo hacen por vocacin y muchos de forma autodidacta. La prctica les har ver los resultados de lo que se va aprendiendo, aplicando los conocimientos adquiridos desde el mismo momento en que este aprendizaje se inicia, lo que resulta muy estimulante y satisfactorio.

94

Pasemos a continuacin a ver algunos elementos concretos del diseo de nuestra tienda online, como va a ser la seleccin del tema o plantilla, la configuracin de los elementos del Frontend y la estructuracin en secciones y pginas de nuestra pgina web.

95

UNIDAD DIDCTICA 1. LA SELECCIN DE PLANTILLA BSICA. La coherencia visual que todo sitio web debe tener, hace que el diseo deba estar basado en una plantilla o tema, sobre la cual se harn las variaciones que cada pgina requiera. Un sitio web no es una unidad real, sino que se trata de una serie de pginas independientes. El concepto de unidad de un sitio est dado por la unidad conseguida a travs del diseo. Esta unidad implica necesariamente que el diseo tenga coherencia visual. En la prctica, adems de ser deseable, salvo pequeos detalles en la estructura y algunos pequeos cambios visuales, es poco prctico y una gran prdida de tiempo establecer diseos diferentes para pginas o secciones de un mismo sitio. Dentro de los objetivos que debe trazarse un diseador a la hora de iniciar el diseo de un sitio web, est la identidad institucional, o lo que es igual, lograr que los usuarios identifiquen cada pgina del sitio como parte de una unidad. Esto se logra empleando plantillas de diseo, o sea, la repeticin de un mismo diseo con variacin casi en forma exclusiva en los contenidos. Sin embargo, existe la posibilidad de que algunas secciones o pginas del sitio requieran un tratamiento especial, por lo que seguramente el diseador necesitar realizar ms de una plantilla, que generalmente son variaciones de una misma plantilla original. Dnde comenzar el diseo de la plantilla. Todo diseador novel tiene la tendencia natural de iniciar el diseo de un sitio construyendo la pgina inicial. Sin embargo, la pgina inicial es una pgina con caractersticas especiales, por lo que si lo que se desea es establecer una unidad

96

visual del sitio, lo correcto sera comenzar por las pginas cuyo diseo se repetir. Esto quiere decir, que lo mejor es comenzar diseando las pginas interiores. Luego, el mtodo debera continuar con las variaciones que algunas de las pginas interiores requieren, para finalizar en el diseo de la pgina inicial. Las pginas interiores deben ser diseadas teniendo en cuenta cules son sus funciones, las que para todos los sitios son las mismas: 1) Navegacin local e insercin de la pgina dentro de la estructura jerrquica del sitio. 2) Establecer el marco del diseo, introduciendo los contenidos en forma coherente con el resto del sitio. 3) Establecer el marco grfico, dndole al sitio una coherencia visual, aunque lo suficientemente flexible como para adaptarse a las necesidades de cada seccin o contenido. En casos de sitios muy complejos, puede ser necesario establecer plantillas secundarias para diferentes niveles de estructura. Tambin es conveniente en estos casos, establecer pginas de submen, que facilitan la navegacin interna dando al usuario nuevos puntos de apoyo para la navegacin. Algunas pginas web, por razones de marketing necesitan establecer entradas alternativas al sitio. Por ejemplo, la pgina web de una cadena de supermercados, durante el perodo que dura una oferta especial, necesita que sus visitantes ingresen por otra pgina de inicio, que contiene los detalles de la oferta. Esta pgina que funciona como entrada alternativa, necesita tener una clara vinculacin visual con el resto del sitio, y adems debe orientar al visitante para que acceda a la pgina principal del sitio. En sitios de grandes corporaciones internacionales o negocios con varias sucursales, tambin es posible que deseen que cada una de las ramas tenga una seccin destinada a cada una de sus divisiones. Esto puede realizarse estableciendo secciones o sitios independientes, los que deben, al igual que en los casos anteriores, mantener una unidad visual con el sitio principal, adems de la mayor vinculacin que sea posible.

97

La pgina de inicio. El diseo de la pgina de inicio, si bien tiene caractersticas especiales que hay que tener en cuenta, una vez que los pasos anteriores ya han sido resueltos, resultar sensiblemente ms sencilla de realizar que si se hubiera comenzado el diseo por ella. Y esto est relacionado con que gran parte del trabajo de diseo ya ha sido realizado. La pgina de inicio tiene cuatro elementos por los que est compuesta. Cada uno de estos elementos es importante, aunque la importancia y la relacin que tienen entre ellos es variable de un tipo de sitio a otro. Los elementos son los siguientes: 1) 2) 3) 4) Principio de identidad. Navegacin. Enfoque del contenido. Herramientas.

El diseo de una pgina de inicio debe siempre contemplar estos cuatro elementos constitutivos, aunque la importancia que debe darse a cada uno de ellos est relacionada con lo que el visitante querr encontrar en el sitio cuando ingrese. Un ejemplo notable es la diferencia que existe entre las pginas de inicio de los buscadores Google y Yahoo!. Mientras que la pgina de inicio del buscador de Google se centra casi exclusivamente a la navegacin, la pgina de inicio de Yahoo destaca otros elementos, como noticias destacadas (contenido) y otros servicios (herramientas). Otras pginas se deben centrar ms en la imagen corporativa (principio de identidad), aunque en el caso de que no se trate de marcas plenamente identificables por tener una gran presencia, debe agregarse adems breves comentarios explicativos que orienten al usuario en lo que encontrarn en el sitio. Si no se posee una marca reconocible a simple vista por cualquier usuario, la simple presencia de un logotipo, por bien diseado que est, no ser suficiente para que el usuario sepa que es lo que encontrar en el resto del sitio. Distribucin de los contenidos en la pgina principal. Algunos sitios, como los destinados a las noticias, necesitan introducir una gran cantidad de contenidos de todo tipo en su pgina de inicio. Esto necesariamente

98

requiere que haya una distribucin ordenada de forma tal que los principales contenidos se encuentren en los lugares ms destacados. Siguiendo con el ejemplo de una pgina de noticias, las noticias principales deberan tener acceso desde un lugar cercano a la esquina superior izquierda.

En cambio, en los sitios en cuya pgina principal puede introducirse poco o ningn contenido, en los lugares ms relevantes debera colocarse elementos que generen un impacto visual en el usuario, de forma que se sienta atrado a buscar contenidos en pginas secundarias. Uso de mens desplegables. Para la mayora de los usuarios normales, los mens desplegables suelen ser difciles de manejar, y en muchos casos ni siquiera descubren que se encuentran all. Este tipo de mens por lo general implican que el usuario debe posar el puntero en una zona de espacio bastante limitado, lo que puede generar alguna complicacin a usuarios inexpertos o personas con algn tipo de problema motriz. Menos aconsejable an es el empleo de mens desplegables que usan javascript o similares, ya que los enlaces contenidos en estos mens no son detectados por los motores de bsqueda, que no ejecutan los scripts. Contenido de los mens. Los mens principales, aquellos ms visibles, generalmente ubicados cerca de la cabecera de la pgina, debe estar destinado a mostrar las secciones ms apetecibles por los visitantes que ingresan a la pgina por primera vez. Esto se debe a que los usuarios habituales de un sitio, generalmente conocen en qu secciones pueden encontrar la informacin que buscan, mientras que los usuarios

99

que ingresan por primera vez, deben ser rpidamente orientados a las secciones que necesitan. Pginas de bienvenida. Salvo algunos sitios muy especiales, la mayora de los sitios no solo necesitan una pgina de bienvenida (mucho menos con imgenes grandes o animaciones flash que llevan mucho tiempo de carga u obligan al usuario a buscar un botn de salida y hacer click en l), sino que constituye un verdadero problema, ya que se trata de la misma pgina a la que llegarn los motores de bsqueda, donde no encontrarn contenidos con informacin clasificable y muy pocos enlaces.

100

Introduccin al diseo de plantillas en Prestashop. Cuando decidimos utilizar algn CMS, es decir, algn gestor de sitios web donde crear nuestra tienda virtual, una de nuestras principales preocupaciones es la construccin de un tema personalizado, que muestre en todo momento los detalles que nos interesan y se ajusten a nuestras necesidades. Prestashop nuevamente nos sorprende, no solo haciendo ms fcil este proceso sino dndonos la libertad de ajustar nuestra interfaz al 100% a nuestro negocio. Para flexibilizar el proceso de gestin de plantillas Prestashop utiliza el Motor de Plantillas para PHP Smarty el cual, entre otras cosas, permite la separacin entre el cdigo PHP de la lgica y el HTML de la presentacin, adems de ayudar en un rpido desarrollo y despliegue de las aplicaciones realizadas con l. Para ms informacin se pueden consultar los siguientes enlaces. Pgina principal de Smarty. http://www.smarty.net/ Documentacin en espaol de Smarty. http://www.smarty.net/docsv2/es/ Detalles iniciales: disear temas para Prestashop. Para crear un tema en PrestaShop, tambin llamado theme o plantilla, tienes que conocer CSS, HTML y PHP. Si cumples estas premisas, antes de empezar a codificar un nuevo theme PrestaShop es preciso conocer tambin algunas cosas como el funcionamiento de un Theme PrestaShop, su estructura o algunas prcticas recomendadas.

101

A la hora de crear una plantilla en PrestaShop es importante conocer que PrestaShop se compone de distintos archivos que podrs modificar segn tus necesidades o lo que quieras mostrar. Algo que tenemos que tener en cuenta a la hora de crear un theme en PrestaShop: Cada uno de los temas estn ubicados en la carpeta /themes, cada tema posee su propia carpeta; por lo que si creas una plantilla llamada mitema la direccin fsica sera /themes/mitema. Los temas estn compuestos por: los archivos templates (.tpl), las imgenes (.jpg, .png, .gif), los archivos de estilo (.CSS) y si es necesario los de JavaScript (.js). Cada tema tiene una imagen llamada preview.jpg donde se muestra un vistazo de cmo debe verse nuestro sitio una vez instalado. Para una mejor comprensin de la estructura interna de una plantilla, veamos la siguiente imagen:

La carpeta /css contiene todos los archivos CSS del tema. La carpeta /img contiene todas las imgenes. La carpeta /js contiene todos los ficheros JavaScript. La carpeta /lang contiene todas las traducciones. Un elementos a remarcar en esta carpeta es que debe tener permisos de lectura/escritura

102

para que de esta forma el mdulo de traduccin pueda modificar los elementos necesarios. La carpeta root incluye todos los archivos .tpl generados por Smarty as como el preview.jpg. Manejo de las traducciones en un tema de Prestashop. Una de las funciones de Prestashop que le dan tal flexibilidad es el manejo dinmico de traducciones. Para resolver esto, Smarty orienta que todos los elementos traducibles (son los elementos que se mostrarn en alguna interfaz y a criterio del autor deba ser traducible) estn con la siguiente estructura:

Cuando la herramienta de traduccin de Prestashop detecte esto, automticamente nos brindar la opcin de traducir este texto a todos los idiomas deseados. Antes de empezar con la creacin del tema, vamos a hacer un listado con la lista de las mejores prcticas: No mezcles XHTML y cdigo PHP. No mezcles XHTML y cdigo CSS. Los CSS deben ir en un archivo a parte. Valida tu cdigo XHTML y CSS. Asegrate de crear cdigo legible para un mejor mantenimiento. Comenta el cdigo. Al editar un theme, primero ponlo en modo Mantenimiento en el backoffice. Cuando sea posible, usa CSS Sprites. Mecanismos de transmisin de datos en Prestashop. Prestahop presenta una estructura de transmisin de datos muy similar al resto de los CMS y aplicaciones desarrolladas con la arquitectura Modelo-VistaControlador, es decir separa las capas del modelo, la vista y las controladoras,

103

adems de definir algunas variables globales y mecanismos de transmisin de datos bien establecidos. Veamos como maneja Prestashop la transmisin de los datos:

Ntese como en el controlador hello.php se inicializan las variables $surname y $lastname, al invocar a la vista hello.tpl este da la opcin de imprimir Hello world my name is. Una de las conclusiones a las que debe llegar es que en Smarty el comando / (Barra inclinada) es el que ordena que se muestre algo y se adjunta las variables transmitidas desde el controlador. Personalizando un tema de Prestashop. Para lograr un tema nico de Prestashop hay dos formas fundamentales: crear un tema desde cero y personalizar uno ya creado. En primer lugar daremos los pasos necesarios para personalizar uno. Para personalizar un tema debemos seguir los siguientes pasos: 1. Copiar el tema que vamos a modificar. Copiamos para la carpeta /themes la carpeta con el tema que vamos a modificar, en caso de ya estar en la misma carpeta deberemos duplicarlo y renombrarlo.

104

2. Modificando la hoja de estilo. Localizamos la carpeta CSS y podemos modificar el estilo de nuestro tema tanto como deseemos. Dependiendo de los conocimientos de CSS de que disponga el diseador, se podrn realizar cambios en mayor o menor medida. Dentro de la carpeta CSS el archivo global.css es el que contiene todo el estilo de nuestro sitio. Recuerde que si incluye alguna imagen nueva esta debe ser copiada en la carpeta /img. 3. Crear preview.jpg. Una vez finalizado los cambios al tema, debemos hacer un screenshoot al tema nuevo, este nos servir para que el mdulo de gestin de temas de Prestashop pueda mostrarlo. Crear un tema desde cero en Prestashop. Para crear un tema en PrestaShop hay que dar un paso ms para que funcione, no basta con copiar la carpeta y seleccionar el tema en las preferencias. Ahora, dentro de Preferencias/Temas, tenemos que aadir nuestro tema desde el botn que hay en la parte superior derecha Aadir Nuevo.

105

Y en la ventana que se nos muestra, debemos indicar el nombre de la plantilla y el nombre del directorio, que en nuestro caso, ser para los dos campos: RentalOnline

106

Hacemos clic en Guardar y ya nos aparecer nuestro tema para seleccionarlo.

Crear Captura y probar. Para ayudar a visualizar el tema en el panel de administracin, es necesario que todos los temas tengan un archivo preview en la carpeta raz del tema con el siguiente nombre: preview.jpg con un tamao de 100100 pxeles. Para verificar que hemos hecho las cosas bien, vamos a nuestro panel de administracin, accedemos a la pestaa Temas y la subpestaa Aspecto/Preferencias, seleccionamos nuestro nuevo tema RentalOnline y Guardamos. Si todo ha ido bien, deberamos ver nuestra plantilla funcionando en la parte frontend de nuestra web. Estructura de un tema en PrestaShop. Hemos creado un tema sin cambiar absolutamente nada del cdigo aun, tan slo lo hemos preparado con unos archivos bsicos copiados del tema por defecto y ahora procederemos a modificar los que nos hagan falta para darle nuestro estilo. Para ello antes tenemos que conocer un poco la estructura de un tema en PrestaShop.

107

108

109

110

Integracin de un tema en PrestaShop. Para poder modificar o crear un tema en PrestaShop hay que saber ubicar los mdulos y hooks, as que primero vamos a explicar que es cada cosa y despus veremos donde se ubican. Hooks: Son parte de cdigo que te permite crear mdulos para interactuar con los displays o eventos. Estos Hooks, que en realidad con contenedores, permiten recuperar eventos o cambiar la pantalla.

111

Para usar un hook, hay que ir a la clase del mdulo y crear un mtodo esttico pblico a partir de la palabra hook seguido del nombre del hook, por ejemplo hookRentalOnline. Hay dos tipos de hooks, Hooks de Accin (por ejemplo enviar un mail cuando el cliente crea un usuario) o Hooks de Vista (por ejemplo, para mostrar un mdulo en una columna). Mdulos: Los mdulos nos permiten aadir funcionalidades a nuestra tienda los cuales podrn ser colocados en contenedores de nuestra pgina web, los conocidos Hooks.

Existen distinos tipos de mdulos, entre otros se pueden mencionar: Forma de Pago. Columna Izquierda. Columna Derecha. Pgina Principal. Cabecera. Pi de Pgina. Pi del Producto. Factura. Aplicando todos estos conocimientos y tcnicas seremos capaces de implementar, retocar o disear una plantilla para nuestra tienda online que se adapte a las necesidades que esta requiere. Recuerda ser paciente y cuidadoso en estos primeros detalles.

112

UNIDAD DIDCTICA 2. CONFIGURACIN ELEMENTOS BSICOS DEL FRONTEND. Estructura de una pgina Web. Estructura del diseo.

DE

LOS

La estructura del diseo de una pgina web tiene una serie de reglas que se encuentran estandarizadas gracias al uso continuo. Los usuarios conocen estas reglas y esperan encontrar cada cosa en su sitio. Un sitio web es una serie de pginas individuales, que pueden o no tener alguna conexin temtica. Sin embargo, como ya hemos mencionado, tendemos a pensar en los sitios web como si se tratara de una unidad. Esto est sustentado en base a dos grandes criterios, que son los enlaces que permiten la formacin de cierta cohesin, y la unidad visual, que en definitiva es lo que brinda al usuario la sensacin de unidad del sitio. Al igual que en otras disciplinas, el diseo web ha ido evolucionando hasta llegar a ciertos criterios estndares. Desde el punto de vista del usuario, tiene la ventaja hacer predecibles a los sitios, permitiendo un rpido acceso a todo sin necesidad de realizar bsquedas por toda la pgina. Desde el punto de vista de los diseadores, salvo pequeos cambios que pueden realizarse, por regla general esta importante parte del diseo ya se encuentra prcticamente resuelta. Estructura del diseo web. La gran mayora de las pginas web tienen divisiones o secciones similares. Lo usual es que, en la parte superior de la pgina se encuentre un encabezado, seguido de un cuerpo principal que suele estar flanqueado por una columna lateral (tanto a la izquierda como a la derecha) o dos columnas laterales, seguidas al final de la pgina por un pie de pgina. La imagen siguiente es un esquema tpico de una pgina web. Se debe tener en cuenta que este esquema sufre variaciones, aunque normalmente son pequeas.

113

Este diseo se compone, en primer lugar, de la cabecera o el encabezado, en el que profundizaremos ms adelante. A continuacin, el cuerpo principal de una pgina web, en el diseo moderno se le encuentra dividido. Una de estas divisiones, consiste una o dos columnas de exploracin. Este tipo de columnas, se le emplea para ubicar algunos elementos

114

importantes de la pgina, como enlaces externos, navegacin interna, publicidad, informaciones adicionales y contenidos secundarios. Cuando se emplea una nica columna, es indistinto para los usuarios, de acuerdo a estudios sobre el comportamiento de usuarios de sitios web, ya que su ubicacin no plantea dificultad alguna. En el caso de que el diseo requiera el empleo de dos columnas, pueden ubicarse una a cada lado del cuerpo principal de la pgina o ambas a uno de los lados, siendo tambin indiferente en este caso si se ubican a la derecha o a la izquierda del contenido principal. Los usuarios, dado el uso continuo de estos elementos para esta funcin, suelen buscar la informacin de contacto en este tipo de columnas, por lo que resulta uno de los mejores lugares para ubicar los datos de contacto. A continuacin, vemos algunos ejemplos de columnas de exploracin.

115

El rea de contenido es la zona del diseo de la pgina en la que menos reglas hay respecto de su diseo, ya que el hecho de que en ella se encuentren los contenidos principales de la pgina, el diseo depende en gran medida de los mismos, sobre todo en lo que respecta al tipo de contenidos, la cantidad, la disposicin que se desea emplear, etc. Sin embargo, hay que considerar algunas reglas importantes y que, salvo muy raras ocasiones, deben ser seguidas al pie de la letra. En la parte superior de este rea se debe emplazar el ttulo entre etiquetas <h1>, ya que este ttulo tiene las palabras clave que los usuarios luego emplearn en sus bsquedas y ser de gran importancia para que los buscadores indexen la pgina en forma correcta. Adems, los usuarios buscarn en este punto el ttulo de lo que se expone, siendo de extrema importancia que el mismo sepa a qu contenidos est accediendo. En caso de que los contenidos sean muchos y haya que hacer desplazamientos importantes hacia abajo, es de mucha utilidad colocar al final del rea algn tipo de salto al inicio, para evitar que el usuario deba realizar grandes desplazamientos. En el caso de que se empleen varias pginas para albergar contenidos relacionados, tanto al inicio de la pgina como al final de la misma es de gran utilidad colocar un navegador de pginas (del tipo Pgina anterior 1 2 3 Pgina siguiente) para que la navegabilidad entre ellas sea sencilla. Finalmente, debajo de todas las secciones, se coloca una franja horizontal o pie de pgina en cuyo interior se colocan algunos elementos importantes, como el autor, copyright, acceso a diversas polticas del sitio y asuntos legales, datos de contacto, enlaces a sitios relacionados, enlaces internos, etc. Lo importante en primer lugar. La forma en que se decida maquetar la pgina, no impide que podamos colocar los contenidos en el orden que creamos ms conveniente, empleando adecuadamente las propiedades CSS. Cuando nos encontramos optimizando una pgina web para los buscadores, una de las cosas que debemos tener en cuenta es que aquellos contenidos de mayor importancia deben ser los primeros en aparecer, no solo visualmente, sino adems

116

en el cdigo HTML. Esto est relacionado con el funcionamiento de los robots de bsqueda. Los buscadores necesitan clasificar las pginas web de acuerdo a su contenido, lo que implica necesariamente un anlisis de los mismos. Pero estos robots que hurgan en las pginas web no analizan la totalidad del cdigo de cada pgina, sino que tienen un lmite y solo analizan los primeros contenidos. Es por ello que resulta muy importante que las pginas web cuenten dentro de sus primeras lneas aquellos contenidos que resulten ms relevantes. Sin embargo, esto que parece sencillo, muchas veces se contradice con la intencin de los diseadores de maquetar la pgina siguiendo cierto orden. Por ejemplo, si un diseador desea que la pgina tenga una cabecera, dos columnas a la izquierda y el cuerpo principal con el contenido a la derecha, podra parecer que es imposible hacer que el contenido principal aparezca entre las primeras lneas del cdigo HTML. Sin embargo, empleando algunas caractersticas de CSS, esto es posible. Cmo maquetar una pgina para que el contenido importante aparezca primero. A continuacin mostraremos como es posible hacer que los contenidos ms relevantes de la pgina aparezcan en los primeros lugares del cdigo HTML, empleando para ello el float de CSS. Sin entrar en demasiados detalles, ya que no es la finalidad de este punto explicar cmo funciona la propiedad float, podemos resumir que esta propiedad hace que el elemento salga del flujo del HTML para posicionarse a la izquierda o derecha de otros elementos adyacentes, alterando el orden en que se encuentran escritos en el cdigo HTML. Para poder explicarlo de mejor forma, escribiremos un cdigo de ejemplo y su resultado visual, que podrn probarlo utilizando el mismo cdigo escrito en bloc de notas, guardando el archivo como .html o .htm y abrirlo en su navegador para visualizar los resultados.

117

Cdigo bsico. Lo primero que haremos ser ordenar los contenidos dentro del HTML en el orden que deseamos. Luego, empleando CSS le daremos el orden visual. El cdigo de ejemplo es el siguiente:

Como se puede apreciar, adems del cdigo HTML, deberemos escribir, en otro archivo aparte, una hoja de estilo independiente, a la que llamaremos estilo.css y que contendr el cdigo CSS. En este cdigo HTML podemos ver que el contenido principal de la pgina, se encuentra inmediatamente despus de la cabecera, es decir, en los primeros lugares del cdigo. En el archivo CSS, daremos los primeros atributos a los diferentes divs, de forma que la pgina adquiera una forma visible y donde los contenidos aparezcan separados. El siguiente cdigo es el que aparecer en el archivo estilo.css:

118

Con esto, ya es posible visualizar la pgina, que se encuentra diagramada en una nica columna y los diferentes contenidos aparecen alineados en forma vertical. Esto se debe a que el proceso de maquetacin an no ha comenzado, y la pgina se ver de la siguiente manera:

119

Empleando el ejemplo anterior, si deseramos maquetar la pgina con una columna a la izquierda y el contenido principal a la derecha, deberamos dejar el tercer contenedor debajo de los anteriores y ocupando todo el ancho, para lo que podramos escribir, debajo del CSS bsico que ya hemos escrito, las siguientes lneas de cdigo (debe observarse que en cada uno de los ejemplos que daremos, el cdigo HTML no ser modificado).

La siguiente imagen es el resultado del cdigo descrito. En la caja de color rosa aparece el contenido principal, aunque visualmente no ocupe esa posicin, ya que la columna de la izquierda aparece antes.

120

A continuacin veremos un ejemplo donde la columna aparece a la derecha y el contenido principal de la pgina estar a la izquierda:

121

Teniendo en cuenta que los contenidos se encuentran jerarquizados en tres escalas diferentes, es posible organizarlos en tres columnas, como en los dos casos que exponemos a continuacin, donde las dos columnas se colocan sobre uno de los lados (en un ejemplo a la derecha y en el otro a la izquierda) y el contenido principal en el opuesto:

122

123

La forma en que se decida maquetar la pgina, no impide en modo alguno que podamos colocar los contenidos en el orden que creamos ms conveniente. Empleando adecuadamente las propiedades CSS, es posible establecer el diseo deseado sin necesidad de realizar grandes modificaciones en el cdigo HTML. Un buen sistema de navegacin es imprescindible en toda pgina web. Es una parte importante de la organizacin de la estructura de la web. Que el usuario sea capaz de moverse con soltura y facilidad por las distintas pginas del sitio, que encuentre lo que busca rpidamente, que no se pierda yendo de un enlace a otro sin saber donde est, que no quede colgado en una pgina concreta sin poder navegar por otras o volver atrs, etc., son algunas de los aspectos que hay que cuidar en la navegacin de un sitio web. Veamos algunas estructuras importantes a tener en cuenta. Men principal. El men de una pgina web es la principal herramienta de navegacin que le podemos facilitar al visitante para que encuentre lo que busca. Es imprescindible para que las personas encuentren las dems pginas de la web, adems del ndice.

124

Los mens de navegacin son bsicamente listas de enlaces a las diferentes pginas o secciones de la web. De su estructuracin depender en gran medida que los visitantes encuentren lo que buscan, por lo que es conveniente pensarse dos veces cmo hacerlo antes de implementarlo en la web. Hay varios tipos de mens de navegacin. Podemos encontrarlos en disposicin horizontal o vertical, como los ejemplos que vemos a continuacin:

125

Por otro lado, se pueden crear mens desplegables, tanto horizontales, como verticales. Veamos los siguientes ejemplos.

Como mencionamos antes, para sitios web con un nmero de pginas pequeo puede ser bueno enlazar a todas ellas desde cada pgina para que el usuario tenga en todo momento la informacin disponible en la web a su alcance. Por ejemplo, si es una pgina web informativa sobre tu empresa y no tiene otra finalidad, puede que cuente con 10 15 pginas en total, las cuales pueden perfectamente ser enlazadas desde cada pgina individual. Sin embargo, cuando una web contiene mucha informacin este tipo de mens tiene poco sentido, porque entonces tendramos mens con cientos de enlaces, algo excesivamente

126

largo para ser usable. Lo normal en estos casos es enlazar desde la pgina principal a las secciones ms importantes, y desde cada una de ellas a sus contenidos concretos. Tcnicas para elaborar mens adaptables. El diseo adaptable (responsive design), se ha convertido en una consideracin casi obligatoria al momento de elaborar la estructura de un sitio web. Actualmente son muchos los usuarios y clientes potenciales que acceden a travs de algn dispositivo mvil, a alguna de las pginas que hemos desarrollado para presentar un proyecto o producto, como tal debemos de proporcionar el soporte adecuado a estos dispositivos para no tener una fuga de inversin. Una parte fundamental de todos los sitios web, es el men de navegacin, gracias a l, el usuario puede moverse a travs de las secciones y localizar contenido relacionado de manera ms sencilla. Es por esto, que es de vital importancia mantener nuestros mens adaptables. Para ello podemos hacer uso de una o varias tcnicas, las cuales nos permitirn manejar y alterar nuestros mens adaptndolos a pantallas pequeas. En este apartado mostraremos algunas de estas tcnicas, mencionando sus ventajas y desventajas. Vale destacar que slo haremos uso de CSS para llevar a cabo estos ejemplos, pero nos respaldaremos con una pequea lnea de cdigo JavaScript. Uso de elementos que ocupen toda la horizontal. Esta es la tcnica ms sencilla para elaborar un men adaptable, ya que simplemente consiste en crear los elementos en forma de lista y darles un ancho para que abarquen totalmente la pantalla en sus distintos tamaos.

127

Con este cdigo cuando la ventana se haga pequea o la pgina se visualice en una pantalla de dispositivo mvil, los elementos del men tomarn un ancho de 100% para desplegarse de manera horizontal. Las ventajas de este mtodo son que no te utilizamos JavaScript, no es necesario aadir cdigo HTML extra y el CSS se mantiene sencillo. Por otro lado, la mayor desventaja es que ocupa mucho espacio. Desplegar elementos en un selectbox. Con este mtodo nos encargaremos de ocultar el men cuando la pantalla sea muy pequea, y en vez de l mostaremos un elemento de tipo select donde desplegaremos todos elementos que componen dicho men. Para poder lograr esto necesitaremos agregar un nuevo elemento HTML par as crear el select. Adems de esto, haremos uso de JavaScript para redireccionar a la pgina que se seleccione de la lista.

128

Para las pantallas y ventanas grandes ocultaremos el select:

Mientras que para las pequeas ocultaremos el men y desplegaremos el select:

129

De igual manera mediante el pseudo elemento :after agregamos la palabra Men para que el usuario sepa que debe dar clic ah para acceder a las secciones. Las ventajas de esta tcnica es que no se necesita mucho espacio y se utilizan controles nativos, mientras que las desventajas son la necesidad de usar JavaScript, el duplicado de contenido y que el elemento select no puede ser muy estilizado. Crear nuestro propio dropdown. Una variacin a la tcnica anterior, sera crear nuestra propia lista dropdown, la cual se desplegara al momento de dar clic sobre un input con un label. Para poder llevar a cabo esta tcnica se realiza un hack sobre el elemento checkbox, por lo que veremos en nuestro cdigo algunas sentencias semnticamente incorrectas. Para poder hacer funcionar este cdigo para iOS es necesario agregar un atributo onclick vaco, mientras que para hacerlo funcionar en Android es necesario aadir una falsa animacin de Webkit a nuestro elemento body.

130

Para pantallas grandes ocultaremos la lista:

Mientras que para pantallas pequeas ocultaremos el men y mostraremos el label. Para ayudar al usuario a reconocer el men, aadiremos el texto para simular el icono que comnmente se utiliza en los mviles para representar un men.

131

Las ventajas de esta tcnica es que no necesita mucho espacio cuando la lista se encuentra contrada, se le puede aplicar los estilos que deseemos y no necesita JavaScript. Pero tiene como desventajas, el uso de mala semntica, poca compatibilidad nativa, y el uso de HTML extra. Cabecera. De todas las partes de la estructura del diseo web, el encabezado es la que mayor tendencia tiene a repetirse entre pginas de un mismo sitio. Aun cuando el sitio tenga grandes diferencias en estructura y contenido entre sus pginas, si mantiene una unidad en su encabezado los usuarios percibirn la sensacin de unidad que el sitio requiere. El encabezado es una franja horizontal que ocupa todo el ancho de la pgina en la parte superior de la misma.

132

A la izquierda del encabezado suele ubicarse el logotipo del sitio, que ocupa un rea importante dentro del mismo, aunque suelen haber diferencias importantes de un sitio a otro. Esta imagen debe tener un enlace a la pgina principal del sitio, ya que es uno de los estndares ms respetados por los diseadores y una de las formas que tienen los usuarios de volver al inicio. Desde el final del logotipo, ocupando el centro y la zona derecha del encabezado, frecuentemente se sitan una serie de franjas de diferentes grosores: En la franja superior, se encuentran algunos enlaces generales de la pgina, como acceso a usuarios registrados, registros de usuarios nuevos, acceso a perfiles, salidas, etc., as como ayudas y buscadores internos. La zona ms ancha generalmente se encuentra ocupada por el ttulo de la pgina, nombre de empresa, slogan, etc. La zona inferior del encabezado se emplea para ubicar los links de navegacin y las etiquetas de navegacin, uno de los elementos ms importantes a la hora de ayudar a los usuarios a encontrar las pginas componentes del sitio web. Dependiendo de la complejidad del sitio, puede encontrarse solo uno de estos sistemas de navegacin o los dos; por ejemplo, cuando el sitio est dividido en secciones, uno de ellos est destinado a estas divisiones, mientras que el otro sirve para navegar dentro de cada seccin, aunque pueden emplearse otros mtodos de clasificacin de los contenidos y por consiguiente, otros mtodos de organizar la navegacin interna. Otra forma de colaborar con la exploracin del sitio por parte de los usuarios es la instalacin de un buscador interno. Tambin es aqu donde los usuarios buscan este tipo de elementos, ya que convencionalmente es aqu donde la mayora de los diseadores los ubican, aunque en algunos casos, puede encontrarse en la parte superior de alguna de las columnas laterales. A continuacin, mostramos un ejemplo de la aplicacin de un buscador interno en el encabezado.

133

Destacados de la pgina de inicio. La pgina de inicio de tu web es la puerta principal de acceso a tu web. Por ella entrarn la mayor parte de visitantes, por lo que hay que cuidar al mximo cada detalle. Como ya dijimos, en muchas ocasiones slo existe una oportunidad para cautivar a un usuario que visita nuestra web. No hay segundas oportunidades, si no hemos gustado, no volver. Por ello, es muy importante cuidar la imagen y usabilidad de la primera pgina de nuestra web. Para conseguirlo deberamos determinar cuales son las cuatro o cinco tareas principales de nuestra web y asignarles una ubicacin destacada en el layout de la pgina, por ejemplo en la parte central superior. El espacio que reservemos para los enlaces a las tareas principales debe de estar libre de otros elementos que puedan distraer al visitante. Si tu sitio web es pequeo, puedes permitirte el lujo de enlazar a todas las pginas de tu web desde la pgina principal, as el usuario tiene a su alcance toda la informacin disponible en el sitio. Pero en muchos casos incluir un enlace a cada pgina convertira en un caos a la portada del sitio debido a la gran cantidad de pginas internas. En estos casos lo ms conveniente sera enlazar a las secciones principales de la web, desde las cuales se enlazara al contenido de esa seccin concreta, etc. La pgina de inicio debe poseer un diseo distinto al resto de la web. Sera recomendable la incorporacin de un sealizador de ubicacin (qu indique en todo momento en que seccin se encuentra el visitante) en un lugar destacado de la pgina. En la pgina inicio son indispensables las secciones Acerca de y Contacte con nosotros. En Acerca de, debemos proporcionar toda la informacin referente a quin es quin dentro de la web. Informacin sobre la empresa, el producto, etc.

134

En Contacte con nosotros debemos ofrecer la posibilidad de que los usuarios puedan transmitirnos sus consultas, quejas o sugerencias a travs de un telfono de contacto, un correo electrnico o un formulario online. Si se solicita informacin al visitante de nuestra web, se deber incluir un enlace a Normas de Privacidad. Con algo parecido a la siguiente declaracin: De acuerdo con el contenido de la Ley Orgnica 15/1999, de 13 de diciembre, sobre Proteccin de Datos de Carcter Personal, se informa a los usuarios que tenemos el firme propsito de proteger su privacidad en la red, por lo que hemos tomado medidas para proteger los datos que usted nos facilite. Nos reservamos el derecho de cambiar esta declaracin en cualquier momento anunciando modificaciones en este sitio web. Con estas normas de privacidad, no se crean ni se pretenden crear derechos contractuales o de otro tipo a favor de alguna de las partes.

En principio una buena pgina de inicio posee estos elementos: Un ttulo que le dice al lector "donde" est. 1 o 2 elementos grficos para ilustrar el tema (marca, lugar, actividad, etc). Una frase que explique brevemente lo que el visitante puede esperar.

135

Una descripcin breve de la actividad mencionando los rasgos especficos de los servicios ofrecidos. Una descripcin ms larga, pero an corta, del contenido que alude a la organizacin del sitio, con enlaces directos hacia la(s) pgina(s) relevantes colocados en las correspondientes palabras claves. Un pie de pgina con la repeticin de un enlace o informacin importante, o una simple mencin de donde est el lector. Veamos algunos de estos elementos con algo ms de detalle. Crear la pgina de inicio de abajo hacia arriba. De la misma forma en que creaste tu sitio empezando por definir el contenido y luego su organizacin. O de la misma manera en que definiste tus ttulos una vez habas terminado de documentar el bloque o la pgina a la cual pertenecan, es desde el contenido de tu sitio y desde los ttulos de las pestaas desde donde deberas crear el contenido de tu pgina de inicio. Cuando ests creando tu pgina de inicio, trata de crearla (literalmente) desde abajo hacia arriba. Mira en la parte inferior de tu pgina de inicio, all encontrars el comienzo. El ttulo del sitio. Un ttulo que le dice al lector "donde" est. A menudo el ttulo incluye un nombre y un lugar. Este ttulo, como ves, trata ms acerca de la identidad y del lugar que del uso de palabras del usuario. El ttulo de tu pgina. Una frase que explicar brevemente qu esperar. Por supuesto las palabras claves ms importantes estn presentes. Han sido elegidas especficamente para darle la bienvenida al lector y transmitirle un sentimiento de comodidad y al mismo tiempo confirmar que ha encontrado lo que estaba buscando. Elementos grficos. Una foto o imagen en la pgina de inicio debe ser para dar una atmsfera. Se trata de darle a tus lectores un sentimiento relacionado con el tema que ests tratando de presentar.

136

Ten cuidado: si la primera imagen que presentas es demasiado descriptiva, el visitante puede crearse una opinin de tu tema antes de haber explorado tu contenido. Una presentacin corta acta como una introduccin a tu contenido. Encima del plano descriptivo de tu sitio, tendrs una presentacin de tu actividad. Esto debe hacerse al final, cuando la comprensin del contenido ha sido madurada. La parte principal de tu pgina de inicio podra ser como un plano de tu contenido o el men de un restaurante con un poco ms de informacin que lo usual. Es una descripcin del contenido de tu sitio. Puedes ver que esto es una versin desarrollada de lo que t propones con tus pestaas, o una versin comprimida de cada pgina de tu sitio. Quizs una oracin o un captulo corto sobre cada grupo de pginas. Te interesa usar las palabras claves ms significativas de cada pgina. Escribir la pgina de inicio te dar una buena oportunidad de volver a pensar en la organizacin y estructuracin del contenido y revisar que est en un orden lgico para tu lector. Por supuesto no olvides los enlaces directos hacia las pginas relevantes, colocados en las palabras claves y expresiones claves. Esto le da a tu lector una eleccin adicional a la hora de navegar por tu sitio. El pie de pgina. El pie de pgina provee la misma informacin en la parte inferior de cada pgina del sitio. Como se ya hemos dicho anteriormente, el pie de pgina es una parte importante de un sitio web debido a su habilidad de presentar enlaces o informacin que estn siempre visibles. Un buen uso del pie de pgina puede ser un enlace a la pgina de contacto, a un nmero de telfono, a un peridico para ver las ltimas noticias, a otro de tus sitios o simplemente un eslogan.

137

Errores a evitar al disear una pgina de inicio. En la actualidad, los usuarios estan acostumbrados a obtener respuestas de forma rpida, precisa y eficiente, a encontrar lo que buscan con el menor esfuerzo posible y a resolver sus problemas con poco razonamiento. Es por esto que uno de sus mayores deseos al ingresar a un sitio web, es encontrar una pgina de inicio lo suficientemente bien elaborada como para permitirle encontrar lo que busca rpidamente. Esto significa, que solo tienes unos cuanto segundos para convencer a un usuario de que tu sitio contiene lo que l esta buscando, y para lograrlo, debes empezar por evitar caer en los errores ms comunes que se cometen al disear una pgina de inicio. Si una portada tiene demasiada informacin y hace difcil el desplazamiento y navegacin del usuario, el usuario no permanecer por mucho tiempo en el sitio. Tu pgina de inicio es el punto de partida hacia el ascenso o descenso en la popularidad de tu sitio, por lo que su diseo debe recibir una especial atencin, para de esa manera lograr un balance entre lo atractivo y lo intuitivo. Sobercargar la pgina de informacin. El hecho de presentar muchsimos datos en una pgina no la hace mejor, pero qu hacer cuando se tiene que disear una pgina cuyo propsito es informar? Una pgina de inicio es comnmente utilizada para atraer al espectador, promover ofertas y eventos, aclarar el rbol del sitio, permitir al usuario realizar bsquedas, mostrar o inducir a un rea de registro, enlazar a secciones importantes, entre

138

otras cosas. Esto hace que sea difcil determinar el espacio en el que irn todas esas cosas y se termine sobrecargando de informacin la pgina. Cuando una empresa trata de poner todo en la pgina de inicio, el resultado es un poco entendimiento sobre cul es el verdadero objetivo del sitio, y en vez de convencer al usuario slo se termina confundiendo ms. Para evitar esto se puede optar por optimizar la informacin, piensa en alternativas de espacio como el uso de mens, no trates de abarcar tantos temas, manten un cierto flujo donde las cosas relacionadas vayan juntas y recuerda utilizar imgenes o colores especiales para las partes donde hables de tu principal servicio. Exagerar en los estilos. Muchos diseadores web, cometen el error de querer aplicar todas las tcnicas nuevas que han aprendido recientemente en slo una pgina. Debido a este fenmeno, es muy comn ver pginas de inicio que mezclan muchos elementos que no van acorde con lo que se trata de transmitir. En ellas se hace uso de sliders, presentaciones en flash, efectos de animacin con javascript, textos con sombras, secciones tridimensionales y hasta algn canvas.

Es comn que con todas las posibilidades que existen actualmente para disear un sitio, quieras hacer resaltar el tuyo utilizando las mejores herramientas, pero si mezclan las cosas sin orden y slo por el simple hecho de querer utilizarlas, terminars teniendo un sitio lleno de cosas inecesarias que harn que el usuario se abrume.

139

Siempre hay lugar para la originalidad, pero prolongar demasiado la estilizacin de un sitio sin tomar un rumbo adecuado, har que los usuarios que lleguen a entrar, se vayan inmediatamente. Cuando un usuario entra a un sitio, espera ver las cosas de cierta manera, no tiene nada de malo ser inovador, pero si tratas de reinventar la rueda solo encontrars problemas. Olvidarte de tu objetivo. Cuando se tiene tanta informacin por mostrar, es fcil olvidar cul es tu principal objetivo. Si tu sitio es una comunidad o red social, entonces tu objetivo es que el usuario se registre y empiece a utilizar la aplicacin, si tu objetivo son las ventas entonces debes buscar propiciar la operacin facilitando las herramientas para ello, si te dedicas a la elaboracin contenido debes resaltar que el rubro en el que te especializas, pero si olvidas cual es tu objetivo el usuario slo terminar confundido y por lo tanto abandonar tu sitio. Una vez que tienes bien definido cual es el objetivo de tu sitio, se te facilitar la estructuracin y elaboracin de la pgina de inicio, ya que tendras en mente el tipo de elementos que necesitas para lograr que el usuario interacte. No olivides proporcionar siempre lo necesario para que el usuario lleve a cabo la accin que buscas. Con mucha frecuencia, nos encontramos con una pgina de inicio que parece tener todo lo que estamos buscando, pero no encontramos la manera de llegar a la parte que nos interesa dentro del sitio. Es por esto que es importante incluir formularios, botones o secciones que atraigan la atencin del usuario, le permitan realizar las acciones rpidamente y lo dirijan al contenido adecuado. No utilizar palabras claves. Puede que nuestro sitio tenga todo, un buen diseo, buena organizacin y un buen contenido, pero que an as sea muy difcil de encontrar en los navegadores. Esto se puede solucionar utilizando las palabras claves adecuadas. El uso de keywords en la pgina de inicio es fundamental para que el sitio sea obtenido por las bsquedas realizadas a travs de Google. Si por ejemplo, tenemos un sitio de fotografias, tenemos que asegurarnos de que hemos includo en alguna parte las palabras fotgrafo, fotografa, servicios, el nombre del

140

responsable y la locacin, de esa manera si alguien busca un fotgrafo en tu ciudad le ser ms fcil encontrarte. Todos estos consejos y tcnicas van nicamente encaminados a mejorar el diseo de la web y a hacerte ms fcil la configuracin de los elementos bsicos de la pgina de inicio. Tenlos en cuenta y medita sobre ellos, tratando de adecuar tus necesidades conforme a las claves del diseo. Copys de atraccin. Un copy es sencillamente, una frase publicitaria. Sin embargo, lo que parece tan simple en la definicin, no lo es en la realidad. Un buen copy debe conectar al anunciante con su pblico, debe comunicar de forma clara, breve y brillante aquello que el anunciante desea transmitir. El arte de escribir copys es una actividad profesional con alto dominio de la retrica; las frases suelen ser exquisitas metonimias, inteligentes metforas o poderosas hiprboles. El talento de un copywriter es demandado por agencias de publicidad que se precien de ser serias y por peridicos en general, especialmente aquellos que gustan de titulares impactantes. Los ms brillantes eslogans, as como las cabezas ms inolvidables de la prensa, casi siempre son obra de copywriters. Como ejemplos podemos citar Just Do it, Keep Walking, A que no puedes comer solo una, Priceless (No tiene precio) o Es un pequeo lujo, pero creo que lo valgo. En este contexto, el banner aqu presente, diseado para el canal de suspenso Calle 13, no sera tan mordaz y a la vez tan hermoso en su creatividad, de no ser por su sombro copy: Tiene los ojos de su padre.

141

Un Eslogan, un lema publicitario, un strapline, un copy, etc., son frases clave que identifican tu negocio, tu producto, tu empresa. Si deseas que el cliente te recuerde y vuelva a tu pgina el uso de copys de calidad te proporcionar un alto grado de retorno. Los copys quedan anclados en la memoria del cliente y de manera cada vez ms profunda. Asociar determinadas situaciones a esta frase, y otras circustancias le recordarn a l, lo que hara que nuestra marca est presente permanentemente en su vida, aumentando as la probabilidad de xito en nuestros objetivos (clientes, ventas, suscripciones, etc.)

142

UNIDAD DIDCTICA 3. SECCIONES Y PGINAS. Las secciones en una pgina web. La correcta organizacin del contenido es la base de la actividad de planificacin de pginas web y al mismo tiempo una de las mayores dudas de quienes solicitan emprender el diseo de una pgina web. Recae en la decisin de qu colocar y cmo incorporar la informacin disponible sobre una actividad o negocio en el documento web a desarrollar para Internet. Dicho de otro modo y ms simple: corresponde a la correcta decisin de estructuracin del sitio web. La estructura de un sitio web tiene principalmente dos componentes, la estructura grfica del sitio (aquella que define las zonas que componen el diseo grfico de la pgina web) y la estructura de contenido. Teniendo claramente definida la informacin a utilizar, la primera sugerencia siempre ser determinar esa estructura de contenido, para luego aplicar la creatividad que el diseo aade. El diseo como hemos visto anteriormente, en su materializacin grfica, buscar el objetivo de hacer visible los objetivos de la organizacin que est detrs de la pgina web. La estructura de contenido le otorgar al visitante los elementos necesarios para evaluar la utilidad de esa web adems de que, a nivel tcnico permitir su registro en buscadores. Recomendaciones tcnicas que ayudan al posicionamiento. Los buscadores se basan en la estructura de contenido o secciones del sitio web, para seguir vnculos o links y registrarlos. De ah la importancia de estructurar eficientemente el contenido.

143

Los nombres de las secciones muchas veces son pensados como "resumen", cuando en realidad (al igual que los nombres de los archivos), deben ser pensados en funcin como palabras clave. De ese modo, lograremos un mayor impacto. La definicin de la estructura de navegacin no es otra cosa que, una vez definido el volumen de informacin se sepa clasificar en partes coherentes, identificables claramente, diferentes en s mismas (sin repeticin ni duplicacin conceptual) y organizadas de acuerdo a un nivel de importancia. Esto tambin aade relevancia al sitio web como documento registrable para buscadores. Si no es posible utilizar "nombres extendidos" basados en "keywords" utilice etiquetas "alt" o "title" segn corresponda para informar a los buscadores las palabras clave que identifican a sus secciones. La vinculacin con el negocio o actividad debe ser clara, toda vez que el navegante utiliza menos de 5 segundos para evaluar visualmente, si la web es o no lo que satisface su bsqueda de informacin. Ejemplos de secciones de pginas web. Tome en cuenta que hemos utilizado nicamente nombres simplificados. Estas secciones son de carcter general y siempre deben ser adaptadas a los contenidos de nuestra web: Inicio / Home / Presentacin Nosotros / Nuestra Empresa / Quines Somos / Nombre de la empresa Objetivos / Misin - Visin - Planes (temas que pueden formar parte de "Nosotros" como subsecciones). Catlogo de productos / Productos / Galera de Productos / Lneas de producto / Portafolio de productos / Portafolio de servicios (Las imgenes de los productos deben ser identificadas con etiquetas "alt" para comunicar a los exploradores los keywords que identifican cada producto).

144

Servicios / Servicios brindados Ofertas / Promociones Contctenos / Formularios: Recomendar / Solicitar Cotizaciones / Enviar Consultas / Consultar / Contactar / Contacto / Registrarse / Desuscribirse / Aplicar al boletn / Darse de alta Eventos / Participacin en eventos / Nuestro Quehacer / Conferencias Artculos / Gua de contenidos / Sumillas / Catlogo de Artculos / Notas breves Clientes / Rubros atendidos / Principales Clientes Reconocimientos / Premios / Certificaciones / Nuestros xitos / Nuestros logros La correcta distribucin del contenido de nuestro sitio web en secciones principales y secundarias eficientemente nombradas y clasificadas generar mejores resultados en buscadores. En secciones complementarias podramos aadir las siguientes: Polticas del Sitio Mapa del Sitio Son de naturaleza complementaria a simple vista, sin embargo definen en s mismas el cumplimiento de normativas para la creacin de documentos web. Por ejemplo, en el "Mapa del Sitio" debemos colocar todos los accesos a secciones o subsecciones con dos objetivos: 1) El primero tiene que ver con brindar al navegante una seccin de orientacin gil cuando nuestro web tiene mucho contenido. Ello estimula la visita y permanencia en la pgina web, un factor determinante para evaluar la importancia de un sitio web (atractividad de visitantes y niveles de tiempo de lectura).

145

2) El segundo y ms importante en realidad, tiene relacin con el hecho de brindar a los buscadores la posibilidad de "seguir" todos los vnculos internos de nuestro web y maximizar el nmero de secciones que se indexan en sus listados. Una seccin que aparece bajo un combo de javascript por ejemplo, jams ser indexada, slo si en alguna pgina de nuestro web, tiene un vnculo. El mapa del sitio suple esta necesidad tcnica. El men de una pgina web. La definicin de la estructura de un web se materializa en la definicin del men de un sitio web. El entendimiento de la estructuracin web, es uno de los secretos que mejor funcionan para incrementar la coincidencia con keywords y por tanto, el xito de los documentos en Internet. La estructura en pginas de una pgina web. Como hemos repetido ms atrs en este mdulo, antes de empezar a disear el sitio web hay que organizarlo y para ello hay que tener claro cul va a ser el propsito del mismo, sus contenidos y la audiencia potencial de la que dispondr. Lo que va a determinar la estructura de la web van a ser en gran medida los contenidos; ellos nos deben indicar cual de los siguientes tres tipos de estructura es el ms adecuado: Estructura de rbol o jerrquica: A partir de una pgina de bienvenida o portal (raiz) se abren unas secciones (ramas) que a su vez contienen mltiples pginas web (hojas). Estructura lineal: a partir de una pgina de bienvenida o portal se suceden las siguientes pginas una tras otra como si se tratara de un libro. Estructura en red: Las pginas que forman el sitio web se enlazan unas con otras segn sus contenidos en una especie de red en la que no se aprecia ningn tipo de jerarqua. Para la web de un centro educativo parece ms conveniente una estructura en rbol, con una presentacin, unas secciones (administracin, departamentos,

146

alumnos, apa, etc.) que daran paso a las pginas que elabore cada colectivo. Esta organizacin permite al visitante conocer en qu lugar de la web se encuentra y se le facilita la navegacin mediante botones que ascienden o descienden en la estructura del rbol para alternar entre secciones.

La eleccin del tipo de estructura va a determinar tambin el emplazamiento de los archivos y directorios. Esto nos permite organizar la web de una forma lgica facilitando mucho el trabajo del diseador, pero tambin es algo que afecta al visitante ya que slo por la direccin de la pgina que visita puede hacerse una idea de dnde est. Para simplificar las cosas es recomendable usar en los nombres de archivo y de carpeta slo letras minsculas, sin caracteres especiales y sin espacios en blanco, adems de elegir nombres cortos y representativos. Con marcos o sin marcos? Este es otro dilema que afecta a la estructura de la web y que hay que decidir al principio ya que va a tener consecuencias tanto para el diseador como para el visitante. Supongamos una web con la siguiente estructura: Un marco superior con el ttulo principal (nombre del centro, localidad, etc.), un marco a la izquierda con la barra de navegacin y un gran marco principal donde se cargan las pginas que se llaman desde dicha barra. Esta estructura tiene las siguientes ventajas: El ttulo y la barra de navegacin, por muy complejos que sean, se cargan una sola vez y despus permanecen en su marco acelerndose mucho la descarga de las dems pginas.

147

Si hay que modificar un enlace, slo hay que hacerlo en la pgina del marco de navegacin y no en todas las pginas como si cada una llevara la barra en s misma. Las pginas se disean de una manera mucho ms rpida porque no llevan ni ttulo ni barra de navegacin. Frente a estas ventajas tenemos dos inconvenientes: La direccin de cada pgina no se corresponde con lo que se observa en pantalla ya que si tecleamos una direccin concreta (por ejemplo la pgina del departamento de filosofa), nos aparecer sin los marcos de ttulo y barra de navegacin y el visitante no sabr dnde ha entrado. Por otro lado, si tecleamos la direccin de la pgina de marcos, se carga la presentacin del sitio web y no la pgina de filosofa. Los visitantes que quieran agregar una pgina a favoritos no podrn hacerlo por la misma razn: o guardan la pgina aislada o guardan la presentacin sin la pgina. Si optamos por una pgina sin marcos, tampoco hay que renunciar a las ventajas antes citadas ya que hay dos posibles soluciones: La barra de navegacin comn a todo el sitio web se pone en un javascript (en un archivo adjunto .js) y cada pgina lo manda cargar al principio, en la seccin <head>. Despus de la primera carga, ya lo tendremos en cach y no har falta volverlo a descargar. Desde el punto de vista del diseador, cuando haya que cambiar un enlace, slo se cambia en el archivo .js. Dreamweaver tiene la opcin de crear plantillas de diseo. Un cambio en la plantilla se actualiza automticamente en todas la pginas que se han creado a partir de ella. Por ltimo, si se opta por marcos, hay que tener cuidado con los enlaces externos ya que est muy mal visto que se carguen como otro marco ms dentro de la web.

148

Estructurar la tienda online en secciones y pginas es una tarea rdua que debe, por el contrario, rezumar simpleza y efectividad. Recuerda que la primera impresin de la pgina, junto con su estructuracin, sern la clave para una fidelizacin ptima de los clientes.

149

MDULO 5. EL CONTENIDO. Normalmente pensamos que el diseo de pginas web est referido al diseo de las versiones que usualmente vemos en los monitores de los ordenadores personales, tanto de escritorio como porttiles (en realidad se trata del mismo medio). Sin embargo, el diseo de las pginas tambin debe comprender a los usuarios de los mviles, y algo bastante frecuente, las pginas en modo de impresin, por ello, el contenido debe ir adaptado a todo tipo de formato. Muchas pginas ofrecen textos o imgenes que posiblemente los usuarios necesiten o deseen imprimir. Es muy frecuente que cuando tratamos de imprimir una pgina en su diseo original, esta no tiene las medidas adecuadas y la impresin no se vea de manera correcta. Por ello, muchas pginas ofrecen a sus usuarios y visitantes la posibilidad de acceder a una versin imprimible del documento. Del mismo modo, un usuario que desea acceder a una pgina web desde un mvil, encontrar que las versiones para ordenadores de las pginas web presentan dimensiones inadecuadas para este medio, debiendo emplear las molestas barras de desplazamiento horizontal para acceder al todos los contenidos. Debido al notorio incremento del empleo de mviles para acceder a la web, muchas pginas ofrecen actualmente versiones de sus pginas que se adaptan a las resoluciones de pantalla de los mismos. La opcin de crear un documento para cada tipo de medio, si bien es viable, realmente resulta difcil de implementar por dos razones. La primera es que constituye una verdadera prdida de tiempo y energa por parte del diseador. En segundo lugar, la creacin de varios documentos para cada una de las pginas de un sitio implica ocupar mucho espacio en el servidor, con el consiguiente aumento de los costos del mismo. La mejor solucin es la implementacin de hojas de estilo externas, es decir, separadas del documento HTML o XHTML para cada uno de los medios que se

150

desea implementar y vinculadas al documento principal a travs de la etiqueta <link> en el <head> del documento.

Estas etiquetas tienen la facultad de que una vez que el navegador ha detectado el medio a travs del atributo media (media=screen para los ordenadores normales, media=print para el diseo de la pgina imprimible y media=handheld para los diferentes dispositivos mviles), determina cual de las hojas de estilo es la que debe aplicar. El siguiente ejemplo es una muy conocida pgina, Wikipedia, la cual ofrece a sus visitantes la posibilidad de acceder a una pgina imprimible. Aqu pueden observarse las diferencias entre un diseo y otro. Orden del documento. Muchos motores de bsqueda indexan las pginas web teniendo en cuenta cules son los elementos que aparecen desplegados en los primeros lugares del documento HTML, lo que no indica necesariamente que sea el orden en el que se visualizan, ya que esto puede modificarse empleando el CSS, como ya apuntamos en el mdulo anterior. Adems, siempre es conveniente dar un orden lgico a los contenidos, de modo que la pgina no aparezca como algo confuso compuesto por elementos inconexos. Adems de la importancia real de los elementos del documento (tanto los visibles como los no visibles), los diferentes componentes tienen un orden de importancia relativa, es decir, una jerarqua en el orden en que son visualizados. Desde este punto de vista, es importante que los diferentes contenidos aparezcan ordenados de acuerdo con esta jerarqua, y su visualizacin corresponda con la misma. La presentacin de un documento en varios formatos para su visualizacin en diferentes medios, tambin conlleva la seleccin de elementos. Cuando se disea una pgina web, algunos elementos de este formato son compatibles con los diseos de impresin, mientras que otros pueden y deben ser obviados, dado que no aportan ninguna utilidad al usuario y puede ocupar un espacio que, en los formatos de impresin, pueden resultar tiles para expandir textos o imgenes.

151

Algunos ejemplos de elementos que pueden ser dejados de lado, son por ejemplo, los mens y las columnas (siempre y cuando no tengan contenidos relevantes y relacionados con el resto del documento). Los links no sern visualizables en un formato de impresin, pero si se puede colocar una direccin web para que pueda ser visible en el documento impreso. Utilizacin de textos alternativos. La etiqueta <img/>, la cual determina la ubicacin de una imagen en un documento web, tiene la posibilidad de insertar un texto alternativo a travs del atributo alt=texto alternativo. Algunos buscadores le dan importancia a los textos alternativos de las imgenes, por lo que es aprovechado en el posicionamiento de una pgina web en los mismos. Sin embargo, este atributo tiene una importancia que va mucho ms all de colaborar en la tarea de indexacin de una pgina por las palabras clave empleadas en este atributo. Se trata de la accesibilidad. Este texto alternativo es el que los medios destinados a las personas con dificultades visuales utilizan para la descripcin de lo que se muestra en una pgina web. Tambin los videos tienen la posibilidad de agregar descripciones en forma de texto, los cuales pueden ser interpretados por los medios para discapacitados. Las personas que navegan por la web, emplean los sitios web de formas diferentes, de acuerdo a sus necesidades, gustos o posibilidades. El hecho de que un porcentaje de los usuarios de Internet tengan dificultades visuales o ausencia completa de la visin, debe orientar una buena parte de los contenidos a su uso por parte del software de lectura. Otro porcentaje importante de los internautas, acceden la mayor parte del tiempo a la web a travs de los mltiples dispositivos mviles, por lo que las pginas deberan contar con un diseo especfico para este tipo de dispositivos, que permita la visualizacin de los contenidos en bajas resoluciones de pantalla.

152

Y lo ms importante, todo esto, no debe requerir un esfuerzo desmesurado por parte del diseador, el cual cuenta con medios a su alcance para que esta tarea resulte sencilla y sin tener que realizar modificaciones en el documento original, tanto si est escrito en HTML como en XHTML. La importancia del contenido de las pginas web. Para obtener un buen referenciamiento en los motores de bsqueda, hay que crear un contenido web de calidad. Los motores de bsqueda se centran en el texto para entender de qu trata una pgina web. Para tener un buen posicionamiento en los motores de bsqueda es importante trabajar el contenido de las URLs y el contenido textual de cada pgina. Tambin hay que trabajar la popularidad de su web y conseguir enlaces de otras pginas webs. Un buen contenido textual slo, no permite un posicionamiento ptimo si el sitio no tiene una cantidad suficiente de enlaces entrantes. De la misma manera, tener enlaces sin un contenido optimizado tampoco vale. Es verdad que conseguir enlaces entrantes no es fcil para el comerciante que se lanza en internet y no tiene ni mucho presupuesto ni mucha notoriedad. No todo el mundo es Apple y puede permitirse el lujo de tener poco contenido, porque naturalmente obtiene muchos enlaces entrantes. Para una tienda online clsica, es diferente. Es decir, enlaces entrantes y contenido textual de calidad van juntos. A ms contenido textual se tendrn menos enlaces entrantes que se necesitarn de cara al referenciamiento en los motores de bsqueda. Trabajar el contenido de las pginas detalladas de presentacin de los productos. El texto de descripcin de un producto en un sitio e-commerce debe ser suficientemente largo para ser considerado por los motores de bsqueda. La extensin ptima es entre 100 y 200 palabras. En este sentido, ofrecer la posibilidad a tus clientes de dejar comentarios es una muy buena idea.

153

Pgina de inicio y pginas de categoras. En ocasiones resulta difcil crear descripciones originales y que no sean aburridas. En este caso debemos centrarnos en la pgina de inicio y en las pginas de categoras. Prepara un buen texto e introdcelo antes o despus de las fotos o imgenes de tus productos.

Una buena opcin para enriquecer el contenido textual de tu pgina web puede ser abrir y alimentar un blog. La solucin ePages propone una funcin para crear un blog. Utilzala y haz publicidad de tu blog proponiendo el flujo RSS en diferentes anuarios. En resumen, debes recordar los siguientes puntos clave: 1) Los ms pequeos comerciantes que desean mejorar su posicionamiento deben ante todo trabajar bien el contenido para que sea identificable por el crawler (la herramienta de rastreo de los buscadores). 2) La segunda etapa, la generacin de enlaces entrantes, ser un medio de valorizar la calidad de este contenido.

154

3) Con ello beneficiars de una base slida a la cual siempre podrs aadir contenido. Cuanto ms contenido de calidad tiene una tienda, ms fcil resultar mantener su posicionamiento. A continuacin vamos a ver algo ms en detalle cada uno de los elementos del contenido que debe ser cuidado y de qu manera.

155

UNIDAD DIDCTICA 1. TEXTO Y ENLACES. La redaccin de textos en las tiendas online. En pleno proceso para definir la tienda online para nuestros clientes, llegamos al punto clave que nos obliga a detenernos brevemente para coger un poco de perspectiva. Llega la hora de la redaccin de textos. Necesitamos textos que seduzcan, que atraigan, que transmitan confianza, que no parezcan demasiado corporativos y, sobretodo, que ayuden a vender ms.

Basta de descripciones de producto aburridas (o demasiado corporativas). El actual entorno nos obliga a darle otra vuelta, como mnimo. El tono ser entonces esencial para encontrar el punto medio entre lo informativo y lo seductor, todo ello mientras muestras los principales beneficios, el resto de la gama, el cmo comprarlo, etc. Teniendo como punto de partida el sentido comn, el objetivo que seguiremos para la redaccin de textos se basar en convencer a los visitantes de que ese producto es (o est hecho) para ellos. Qu realmente lo que estn viendo ser ms o igual a lo que esperan. Que esa confianza que tienen al darle al botn de comprar, ser la misma cuando reciban el producto y sobretodo, cuando lo prueben. Como ya imaginamos, solamente con muchas visitas no aseguraremos el xito de la Tienda Online, hay que ofrecer descripciones de calidad, que puedan persuadir a los usuarios, que fcilmente vean lo sencillo que es hacerse con uno, que realmente lo deseen.

156

Los 4 pilares bsicos en la redaccin de contenidos Web son: 1) 2) 3) 4) Usabilidad. Persuasin. Confianza. Posicionamiento en Buscadores.

Del mismo modo que algunos consejos que nos ayudarn en esta tarea son los siguientes: Uso de los bullets (concepto por frase). Frases cortas (podemos decirlo, seguro, en muchas menos palabras). Claridad (ir al grano, dejarse de rodeos y de palabras extraas o que no aportan nada). Que se pueda hacer una lectura escaneada en pocos (muy pocos) segundos. La base de la redaccin de textos web. Los textos son el contenido ms relevante de una pgina web. stos deben ser dispuestos y producidos en forma correcta para que resulten atractivos a los visitantes. Como ya hemos dicho, el contenido ms importante de todas las pginas web se encuentra en los textos, an en aquellos casos en los que las imgenes ocupan un porcentaje mucho mayor respecto del espacio de la pgina. Esto hace que el diseador web deba poner especial atencin en cmo dispone de los textos. La web es una herramienta que tiene caractersticas especiales. Llevados por un razonamiento simplista, podramos suponer que la disposicin de los textos en el diseo de una pgina web, podra ser similar que la que tienen los libros o las revistas. Sin embargo, la lectura en los medios impresos es diferente a la de un monitor. Estudios cientficos indican que el cansancio que se experimenta en la lectura de textos en un ordenador es mucho mayor que en los medios impresos, y que la velocidad de lectura es ms rpida en los ltimos.

157

Adems, debido a las expectativas que se tienen sobre uno y otro medio (un usuario de internet espera que todo sea instantneo), el tiempo de atencin de los usuarios de estos dos medios es diferente, siendo mucho ms corta en los usuarios de pginas web.

Estas caractersticas tan especiales de las pginas web, hace que la produccin, disposicin y la forma en que se presentan los textos, deba ser especialmente cuidada, ya que descuidar este aspecto podra provocar una prdida de usuarios. Redaccin de textos para la web. Lo ms importante al redactar textos para pginas web, es que se debe emplear aproximadamente la mitad de las palabras que se emplean en los medios impresos para desarrollar un tema, teniendo en cuenta lo ya dicho sobre el tiempo de atencin de los usuarios de internet. Cada prrafo, debe contener tan solo una idea. Esto agiliza notablemente la lectura y simplifica la comprensin del texto en general. As como disminuye el tiempo de atencin, la calidad de la misma es sensiblemente menor en los medios electrnicos. Cada tema o subtema, debe estar separado del resto mediante la aplicacin de subttulos claros y que contengan informacin de utilidad sobre el contenido que los lectores encontrarn en los prrafos siguientes. Esto permite una esquematizacin de los textos que simplifica la comprensin y dan una mayor velocidad a la lectura, adems de aumentar la atencin del lector.

158

Cantidad y calidad de los textos en la web. La extensin de los textos en una pgina web puede ser variable. Depende, como es de suponerse, del tema que trata la misma. La cantidad de texto que es necesario emplear en una pgina destinada a juegos es totalmente diferente a la que necesita una web sobre literatura. En este tipo de evaluaciones, debe intervenir necesariamente el sentido comn. En una pgina en la que se desarrolla un tema en la cual el texto es el elemento fundamental, la extensin de los textos ser considerable y probablemente sea lo que buscan los usuarios. Sin embargo, en la pgina de presentacin del sitio, en la presentacin de un tema, una pgina de ofertas o una de descripcin de productos, lo ms indicado es colocar textos cortos y especficos, con frases llamativas que atraigan la atencin de los usuarios. En los casos en que la extensin de los textos que se deben emplear supere las dos pginas, lo conveniente no es extender indefinidamente la pgina hacia abajo, ya que el uso de las barras de scroll en forma permanente no resulta del agrado de los usuarios de internet. En este caso, cabra considerar la posibilidad de dividir el tema en dos o ms pginas, empleando un buen sistema de navegacin que permita a los usuarios navegar entre ellas con facilidad. La calidad de la produccin de textos debe ser ptima. Simplicidad en la elaboracin de frases y oraciones, buena sintaxis, ortografa sin errores y estilo cuidado, pueden hacer que el lector llegue al final de los textos, mientras que de no cuidarse estos aspectos, posiblemente el porcentaje de lectores que finalicen la lectura sea muy bajo. Disposicin de los textos en una pgina web. Todo texto debe estar iniciado por un ttulo perfectamente visible y claramente diferenciado del resto de los textos. Este encabezado del texto, debe resultar llamativo y lo suficientemente explcito como para que los usuarios tengan una idea acabada del tema tratado en los prrafos siguientes. Tal como se dijo en el apartado anterior, es necesaria la disposicin del texto en prrafos, separados por un interlineado visible, de forma tal que un texto no de la impresin de tratarse de un gran bloque que nunca termina.

159

Los prrafos no deben ser muy extensos, ya que los bloques de textos de muchas lneas, hace que muchos usuarios se pierdan al cambiar de lnea, algo que resulta extremadamente frustrante y hace que se pierda la concentracin y la atencin. Dentro de los prrafos, los conceptos ms importantes y las palabras clave es conveniente que sean ms visibles que el resto del texto, por lo que deben ser remarcados. La mejor forma de hacerlo es la utilizacin de negritas. La tipografa en itlica tambin es empleada para este fin, pero el aumento de la visibilidad es menor que cuando se emplean las negritas, por lo que es preferible emplear el primer mtodo. En cambio, el subrayado es totalmente desaconsejado, ya que provoca algunas dificultades en la lectura de las palabras; adems, generalmente las palabras subrayadas suelen ser empleadas para los enlaces, lo que puede generar confusin en los usuarios. El color en el texto. El empleo del color en los textos debe cumplir con algunas reglas bsicas que deben ser seguidas en forma estricta, a los efectos de evitar que el pblico tenga dificultad para leer o para mantener la atencin. El texto en un solo color, suele ser montono, lo que puede provocar que el usuario encuentre poco atractiva la propuesta. Por lo general, para hacer que el texto deje de ser algo montono, basta con incluir colores diferentes a los ttulos y subttulos para que la apariencia general se muestre en forma atractiva. En otros casos, el empleo de varios colores est dado por el tipo de pgina que se est haciendo. Una pgina destinada a los grficos, la pintura o cualquier otro tema relacionado con el color, puede hacer necesario que los bloques de texto tengan colores diferentes. Esto tambin es empleado con frecuencia en pginas corporativas, ya que el texto puede llevar los colores que identifican a la compaa.

160

El empleo del color suele ser de relevancia tambin en el contraste del texto sobre el fondo sobre el cual se encuentra. Esto es particularmente importante en el caso de las pginas que tienen imgenes como fondo, ya que en esos casos, la lectura es an ms compleja que en las pginas que tienen un color slido de fondo. En todos los casos, los colores empleados en los textos deben ser compatibles con la gama de colores de la pgina, ya que los bloques de texto forman parte de la propuesta visual de la pgina. Los textos deben seguir los mismos principios de diseo que el resto de la pgina. Veamos a continuacin algunas buenas prcticas en los textos: Uso correcto de las maysculas, negritas e itlicas. En algunos casos, las palabras escritas totalmente con maysculas se emplea para remarcar un texto, lo que resulta efectivo. Sin embargo, un uso abusivo de este recurso puede hacer que el texto se vea montono, ya que las maysculas son ms uniformes que las letras minsculas. Algo similar sucede con el empleo de las negritas, el uso abusivo hace que el texto adquiera demasiada relevancia en el diseo, y las itlicas son notoriamente ms difciles de leer que las letras normales. No utilizar efectos en los textos. Los efectos de marquesina, el texto parpadeante o textos mviles logrados con algunos scripts, por lo general deben ser evitados, ya que tienen efectos contraproducentes. Usar un mximo de tres fuentes diferentes y dos o tres colores para el texto. Hacer que los enlaces se distingan muy bien del resto del texto. Usar un espaciado apropiado entre lneas, prrafos, ttulos y subttulos, sangras, etc. Recuerda que los textos van a ser otra de las claves para fidelizar al cliente y para que el usuario no se vaya de la pgina. La redaccin del texto, junto con los copys que ya comentamos en el mdulo anterior, sern una pieza fundamental para captar la atencin del cliente.

161

La importancia de los enlaces en las tiendas online. La creacin de enlaces es una utilidad muy importante del sistema de edicin de contenidos y, por ello, merece la pena ser comentado con ms detalle. La manera ms fcil de crear enlaces en tu tienda es aadiendo el correspondiente enlace a la categora, pgina de texto o blog deseado en la seccin Estructura del men de tu panel de control. Pero hay bastantes ocasiones en las que se quiere crear enlaces desde una palabra o frase a una categora o una pgina web determinada sin hacer uso de la opcin aadir enlaces de la seccin Estructura.

El procedimiento para realizar el enlace es muy sencillo: nicamente tienes que marcar con el ratn la palabra o frase desde la que quieres realizar el enlace y seleccionar la opcin "Insertar / Editar hipervnculo" de la barra de ayuda situada sobre la caja de texto de edicin de contenidos. Se abrir a continuacin una caja donde tendrs que poner la direccin URL completa del lugar con el que te quieres enlazar y darle a "Insertar". Utilizar enlaces internos de forma lgica. Una de las formas de que nuestras pginas ganen notoriedad y relevancia en los buscadores, es que varios enlaces apunten hacia ellas. Para ello los enlaces internos tambin cumplen un papel. Debe disearse una estrategia de enlaces para que los productos, categoras o subcategoras ms importantes reciban suficientes enlaces. Podemos por ejemplo:

162

En cada ficha de producto, aadir enlaces a otros productos similares, o a otros que los complementen, creando un circuito por el que puedas saltar de un producto a otro continuamente. Escribir artculos en la pgina principal o en el blog con enlaces a productos o categoras. Distribuir notas de prensa con enlaces a pginas interiores. Debemos asegurarnos de que no haya enlaces rotos, y en caso de variaciones en los productos o en la tienda, verificar y mantener los enlaces siempre actualizados. Como en todos los casos, en los enlaces debers usar siempre las palabras clave tanto en el texto del enlace como en la propiedad o el campo titlte. Crear un blog que acompae a la tienda online. En algunos casos, debido al tipo de producto que se pretenda vender, es prcticamente imposible realizar descripciones largas o que aporten contenido de valor a nuestra tienda online. En estos casos, es imprescindible la creacin de un blog para atraer algo de trfico a la tienda. De todas formas, en todos los casos es aconsejable la creacin de un blog que vaya dirigido a nuestro pblico objetivo, que hable de nuestro sector o de lo que lo rodea, y que nos sirva tambin para promocionar nuestros productos de algn modo, directa o indirectamente. Conseguir enlaces externos. Como en todos los sitios web, conseguir enlaces de otros sitios que apunten hacia tu pgina har que ganes popularidad y relevancia, y por lo tanto ganars posiciones dentro de los resultados de bsqueda. Como no, los enlaces tambin atraern nuevos visitantes a tu web de forma directa, haciendo clic en dichos enlaces. No existe un nmero de enlaces ideal, cuantos ms consigas mejor, pero s que debern ser de forma lo ms natural posible, ya que si por ejemplo Google detecta que ests forzando el ganar estos enlaces, te va a penalizar por ello. Tienen ms

163

relevancias los enlaces naturales, los enlaces que provengan de webs de nuestro mismo sector o los enlaces que surjan desde redes sociales donde nuestra marca tenga cierta presencia. Existen diferentes tcnicas para conseguir los preciados enlaces externos o tambin llamados backlinks. Algunas de ellas son: Aade tu tienda a los directorios de tiendas online. Sube tus productos a Google Products y otros buscadores de productos. Realiza intercambio de enlaces con sitios de tu misma temtica. Publica anuncios en pginas de anuncios gratuitos. Facilita al usuario compartir tus productos. Publica algunos de tus productos y artculos en Facebook, Twitter y otras redes sociales. Participa en foros y blogs de tu sector y utiliza la firma para dejar enlaces. Publica contenido de calidad y espera a que te enlacen de forma natural. Midiendo la popularidad. La popularidad de una web es la cantidad de enlaces externos que apuntan a un sitio web y proceden de un sitio de calidad. Un sitio del que no se habla en Internet simplemente no existe. Una tienda online que nadie tiene en cuenta nunca podr ser encontrada por los usuarios. La bsqueda de estos enlaces es un trabajo laborioso que requiere tiempo y dedicacin pero esencial para que un negocio electrnico sea visible. La forma en que los buscadores miden la popularidad es un secreto infranqueable basado en una serie de algoritmos desconocidos. Ahora bien, los aos de investigacin en este campo por parte de expertos en marketing han confirmado que existen unos parmetros que ayudan a obtener esta popularidad. Google, el buscador ms utilizado en Internet, utiliza su propio mtodo para conceder este valor a travs del conocido pagerank. Google: El pageRank. El PageRank es la denominacin de Google para cuantificar la popularidad de una web. Se trata de un valor numrico entre 0 y 10 que atribuye el buscador en

164

funcin de su propio sistema algortmico. Un sitio con un PageRank igual o superior a 4 puede considerarse con un alto nivel de popularidad, aunque el trabajo complicado es ir escalando posiciones a partir de este valor y ese trabajo suele ser lento. Para conocer el pageRank que otorga Google a un sitio web basta con descargarse la barra de herramientas del buscador e instalarla en el explorador. El valor aparece en una barra verde dentro de esta aplicacin. El indicador ha sido un quebradero de cabeza para muchos websmasters y responsables de marketing, pero lo cierto es que es un indicador ms en la estrategia de posicionamiento y no deben centrarse todos los esfuerzos nicamente en l.

Fuente de los enlaces. Una labor importante a tener en cuenta es la seleccin de los sitios web que apuntarn hacia nuestra tienda online, pues de estas fuentes depender nuestro ndice de popularidad. En lneas generales los parmetros que se deben analizar de una pgina web para que proporcione un enlace de valor son: La web debe ser popular. La web debe tener un trfico de visitas considerable. Alta frecuencia de actualizacin por parte de los buscadores. Los motores de bsqueda no visitan todos los sitios con la misma frecuencia. Una web visitada con ms periodicidad tiene ms valor a la hora de incluir un enlace de nuestra tienda online. Para conocer este dato hay que visitar la cach de la pgina de resultados. Sitios webs con larga trayectoria en Internet. La web debe tener contenido relacionado. Si la tienda online distribuye productos cosmticos los enlaces que procedan de portales de salud o belleza tendrn ms valor para aumentar nuestra popularidad.

165

La estrategia de popularidad. Algunos responsables de tiendas online creen que la forma de conseguir que su web sea popular consiste en ir dando de alta la pgina en diversos directorios de forma indiscriminada. Suele ocurrir que no se escogen los directorios adecuados, ni el formato del enlace ms ptimo, ni los sitios que realmente conceden valor. Por lo tanto, antes de llevar a cabo esta tarea es imprescindible definir una estrategia marcada por dos siguientes interrogantes: Formato del enlace (Cmo ser el enlace?). Destino del enlace (Dnde incluir el enlace?). Formato del enlace. El texto del enlace es tan importante como la calidad de la pgina en la que se inserta. A veces, se cae en el error de utilizar el nombre de dominio de la tienda online y lo cierto es que los buscadores valoran ms un texto relacionado que vincule con el sitio web. En el lenguaje de programacin a esto se le conoce como "anchor text". Lo ms recomendable es que este anchor text est relacionado con las palabras clave que se quieren posicionar en los buscadores. Destino del enlace. Una vez que tenemos el enlace o los enlaces definidos llega el turno de buscar los sitios web en los que se va a solicitar su inclusin. La eleccin de estas pginas debe hacerse de forma pormenorizada y en funcin de los criterios comentados anteriormente (popularidad, contenido, trfico, actualizacin). En cualquier caso algunos de los tipos de sitios web que se deben tener en cuenta en la estrategia son: Alta en directorios. Los directorios son pginas web que catalogan un sinfn de sitios en funcin de sus criterios de organizacin. Algunos de ellos cuentan con una alta popularidad, llevan mucho tiempo en la Red y son una fuente fiable para conseguir que nuestra tienda

166

online escale posiciones. El directorio de Yahoo o DMOZ son algunos de los ms significativos. Estos directorios pueden ser de pago o gratuitos, aunque algunos de los gratuitos requieren un pago adicional para dar prioridad al enlace. Y pueden abarcar todos los temas, como el directorio de Yahoo o especializarse en un contenido especfico. Participacin en redes sociales. La creacin de una pgina relacionada con la tienda online en alguna de las redes sociales que gozan de una buena popularidad como Facebook facilita la insercin de enlaces sobre el comercio y permite estar visible a terceros, que a su vez pueden aadir el enlace de la tienda online en sus propias pginas o en los grupos de los que son miembros. Alta en blogs y foros. Algunos blogs y foros tienen un alto ndice de popularidad. Podemos buscar los blogs y foros relacionados con la temtica de nuestra tienda online y participar activamente firmando con el enlace de la web. Aunque esta prctica est muy extendida en Internet por lo que puede ser sancionada por los moderadores si se utiliza en exceso. La clave, tal vez, consiste en convertirse en un participante reputado. En definitiva, la reputacin de una web ser lo que le otorgue la popularidad en buscadores y por tanto una mayor visibilidad que se traducir a la larga en un aumento del trfico de visitas y en el caso de una tienda virtual un incremento, tal vez, de la facturacin. Ahora bien, no se debe caer en el error de tomar esta tarea como una actividad aislada, sino integrarla en la propia estrategia de comunicacin del proyecto web y dedicarle los recursos necesarios para que sea realmente efectiva.

167

Mostrar enlaces permanentes en Pretashop. Dependiendo de la plantilla que se est utilizando, cuando publicamos los enlaces permanentes normalmente se visualizan en la parte superior del sitio y permiten a los visitantes ver el mapa del sitio, poder enviar un mensaje al administrador o a los contactos creados y marcar como favorito en el navegador la pgina del producto que se est viendo. Podemos ver en est imagen cuales son los enlaces permanentes.

168

Para publicar estos enlaces en nuestra tienda virtual antes debemos instalar el mdulo respectivo, por esto debemos entrar al back office, hacer clic en la pestaa Mdulos y luego en el link Mdulos.

En la lista Categoras que se encuentra a la izquierda buscamos el Link Aplicaciones Front Office y hacemos clic en l para desplegar los mdulos disponibles.

169

Para estar seguros de encontrar el mdulo de los enlaces, seleccionamos Instalado y Desinstalados y Activados y desactivados en las listas desplegables de los filtros de bsqueda.

Entre los mdulos que aparecen buscamos el que dice Bloque de enlaces permanentes. Si el bloque no est activo encontramos un link que dice Activado, hacemos clic sobre l para activarlo. Este mdulo nos permite agregar los enlaces a nuestra tienda virtual de Prestashop.

170

Cmo enlazar pginas estticas. Si en nuestra plantilla (archivo .tpl) queremos incluir algn enlace a una pgina esttica podemos hacerlo, incluyendo la ruta completa. Esta accin no es recomendada, en caso de cambiar el dominio o directorio, pues dejara de funcionar. Por otro lado, puede hacerse usando el siguiente cdigo que nos generar el enlace a la pgina en cuestin:

El alias no es obligatorio. Con la id basta. Tambin podemos enlazar categoras de forma similar:

171

UNIDAD DIDCTICA 2. IMGENES Y FORMATO. Fjate en las imgenes mostradas en tu monitor. Estas imgenes estn formadas por unos puntos muy pequeos llamados pixels. Si tu monitor fuera de aquellos en blanco y negro utilizados en la poca de los pioneros, cada pixel poda estar encendido (color blanco) o apagado (color negro). En los monitores de color actuales cada pixel o punto de pantalla no representa esos dos nicos colores, como sabes puden mostrar millones de colores y tonalidades. Pero la idea es la misma. La imagen est formada por puntos y el ordenador los maneja como bits. A la hora de codificar esta imagen para poder guardarla en un archivo existen dos tcnicas bsicas: los mapas de bits y las imgenes vectoriales Bien sea para ilustrar la informacin contenida en nuestras pginas o para integrar un largo texto o, por que no, por cuestiones estticas, es prcticamente imposible evitar colocar alguna que otra imagen en nuestras pginas. Al emplear las imgenes debemos guiarnos por unas cuantas reglas bsicas: Procurar que las imgenes sirvan para algo, que den informacin. Esta es una de las razones por las que debemos usar los atributos ALT. No excedernos. La pgina no debe pesar demasiado. Un visitante que ve como la pgina tarda en cargarse ms de 15 o 20 seg lo ms probable es que se vaya y, lo que es peor, que no vuelva. Procurar un equilibrio entre tamao del archivo de imagen y calidad de sta. A veces una imagen muy grande requiere una compresin tal que al final tenemos una calidad psima. En estos casos debemos plantearnos el tipo de imagen a usar. Imgenes y formatos. El componente grfico de las pginas web tiene mucha importancia, es el que hace que estas sean vistosas y el que nos permite aplicar nuestra creatividad para hacer del diseo de sitios una tarea agradable. Es tambin una herramienta para acercar los sitios al mundo donde vivimos, si embargo, es tambin el causante de errores graves en las pginas y hacer de estas, en algunos casos, un martirio para el visitante.

172

Las nociones bsicas para el uso de archivos grficos son sencillas, conocerlas, aunque sea ligeramente, nos ayudar a crear sitios agradables y rpidos. No cometer errores en el uso de las imgenes es fundamental, aunque no seas un diseador y las imgenes que utilices sean feas, utilzalas bien y as estars haciendo ms agradable la visita a tus pginas.

Mapas de Bits. En Internet se utilizan principalmente dos tipos de archivos grficos GIF y JPG, pensados especialmente para optimizar el tamao que ocupan en disco, ya que los archivos pequeos se transmiten ms rpidamente por la Red. El formato de archivo GIF se usa para las imgenes que tengan dibujos, mientras que el formato JPG se usa para las fotografas. Los dos comprimen las imgenes para guardarlas. La forma de comprimir la imagen que utiliza cada formato es lo que los hace ideales para unos u otros propsitos. Adicionalmente, se puede usar un tercer formato grfico en las pginas web, el PNG. Este formato no tiene tanta aceptacin como el GIF o JPG por varias razones, entre las que destacan el desconocimiento del formato por parte de los desarrolladores, que las herramientas habituales para tratar grficos (como por ejemplo Photoshop) generalmente no lo soportaban y que los navegadores antiguos tambin tienen problemas para visualizarlas. Sin embargo, el formato se comporta muy bien en cuanto a compresin y calidad del grfico conseguido, por lo que resulta muy til en infinidad de casos. Todos estos problemas han pasado y ya slo Internet Explorer 6 tiene algunos fallos cuando trata con PNG, pero la aceptacin actual es ms que suficiente para incorporarlo a nuestras posibilidades reales de trabajo con formatos y optimizacin de archivos.

173

Veamos a continuacin los tipos de archivos que pueden ser las imgenes:

Veamos estos formatos en detalle. Formato GIF. A parte de ser un archivo ideal para las imgenes que estn dibujadas tiene muchas otras caractersticas que son importantes y tiles. Compresin: Es muy buena para dibujos, como ya hemos dicho. Incluso puede ser interesante si la imagen es muy pequea, aunque sea una foto. Transparencia: Es una utilidad para definir ciertas partes del dibujo como transparentes. De este modo podemos colocar las imgenes sobre distintos fondos sin que se vea el cuadrado donde est inscrito el dibujo, viendose en cambio la silueta del dibujo en cuestin. Para crear un gif transparente debemos utilizar un programa de diseo grfico, con el podemos indicar qu colores del dibujo queremos que sean transparentes. Generalmente, definimos la transparencia cuando vamos a guardar el grfico.

174

Colores: Con este formato grfico podemos utilizar paletas, conjuntos, de 256 colores o menos. Este es un detalle muy importante, puesto que cuantos menos colores utilicemos en la imagen, por lo general, menos ocupar el archivo. En ocasiones, aunque utilicemos menos colores en un grfico, este no pierde mucho en calidad, llegando a ser inapreciable a la vista. En algunos programas podemos modificar la cantidad de colores al guardar el archivo, en otros lo hacemos mientras creamos el grfico. Formato JPG. Veamos ahora cuales son las caractersticas fundamentales del formato JPG: Compresin: Tal como hemos dicho anteriormente, su algoritmo de compresin hace ideal este formato para guardar fotografas. Adems, con JPG podemos definir la calidad de la imagen, con calidad baja el fichero ocupar menos, y viceversa. Transparencia: Este formato no tiene posibilidad de crear reas transparentes. Si deseamos colocar una imagen con un rea que parezca transparente procederemos as: con nuestro programa de diseo grfico haremos que el fondo de la imagen sea el mismo que el de la pgina donde queremos colocarla. En muchos casos los fondos de la imagen y la pgina parecern el mismo. Colores: JPG trabaja siempre con 16 millones de colores, ideal para fotografas. Formato PNG. El formato PNG es el gran desconocido de internet, pese a su magnfico comportamiento. Realmente existen varios formatos PNG: PNG8, que almacena imgenes de hasta 256 colores, PNG24 para imgnes de 24 bits y PNG32 para imgenes de 32 bits. Permite transparencias como los GIF y transparencia graduada (colores cuya opacidad van desde el 0% hasta el 100%), aunque los

175

exploradores no aprovechan esta utilsima propiedad. Por contra no admiten animaciones.

Optimizar ficheros. Para que las imgenes ocupen lo menos posible y se transfieran rpidamente por la Red debemos aprender a optimizar los ficheros grficos. Para ello debemos hacer lo siguiente: Para los archivos GIF: Reduciremos el nmero de colores de nuestra paleta. Esto se hace con nuestro editor grfico, en muchos casos podremos hacerlo al guardar el archivo. Para los archivos JPG: Ajustaremos la calidad del archivo cuando lo estemos guardando. Este formato nos permite bajar mucho la calidad de la imagen sin que esta pierda mucho en su aspecto visual. Es imprescindible disponer para optimizar la imagen de una herramienta buena que nos permita configurar estas caractersticas de la imagen con libertad y fcilmente. Photoshop (las versiones 5.5 o 6) es un programa bastante recomendable, pues incorpora una opcin que se llama "Guardar para la Web" con la que podemos definir los colores del gif, calidad del JPG y otras opciones en varias muestras a la vez. As con todas las opciones configurables, viendo los resultados a la vez que el tamao del archivo podemos optimizar la imagen de una manera precisa con los resultados que deseamos.

176

Tambin existen en el mercado otros programas que nos permiten optimizar estas imgenes de manera sorprendente. Una vez hemos creado la imagen la pasamos por estos programas y nos comprimen aun ms el archivo, hacindolo rpido de transferir y, por tanto, ms optimo para Internet. Al ser estas utilidades tan especializadas los resultados suelen ser mejores que con los programas de edicin grfica. Algunos ejemplos de estos optimizadores grficos son los que siguen: WebGraphics Optimizer. ProJPG, GIF Imantion. GIF Wizard. Imgenes vectoriales. Este otro mtodo de almacenar imgenes se basa en encontrar funciones matemticas para representar la imagen completa. Este mtodo no slo se usa para figuras regulares (rectngulos, cuadrados, crculos) tambien se puede usar para imgenes tipo fotografa. Las llamadas figuras de Mandelbrot se emplean para encontrar una funcin matemtica que represente la forma tan poco regular como un paisaje de montaa y similares. Estas imgenes dan una calidad excelente y permiten ser escaladas (modificar su tamao) sin prdida de calidad. Un ejemplo son los archivos DXF y otros usados en programas CAD. Sin embargo, estos formatos no se usan en las pginas web. Optimizacin de imgenes para pginas web. Ya hemos mencionado ms arriba que para que la pgina no tenga un peso excesivo y se cargue en poco tiempo, es necesario reducir el peso de las imgenes, es decir, optimizarlas para su uso en la web.

177

A pesar del mejoramiento en el ancho de banda y las mejoras en los procesadores, aun sigue siendo recomendable que las pginas web tengan un peso reducido para evitar que tengan problemas o demoren en cargar. Sin lugar a dudas, una de las dificultades mayores frente a la que se enfrentan los diseadores web es en la utilizacin de imgenes. El empleo de imgenes, tanto para el decorado de la pgina como para que forme parte del contenido, es indispensable. Teniendo en cuenta esto, la nica opcin con que cuentan los diseadores web es la optimizacin de las imgenes para su empleo en sus pginas. Para que el diseo tenga la vista que su creador ha planificado, es necesario que el largo y ancho de las imgenes no se modifique, por lo que la nica opcin con que se cuenta es con la reduccin de la calidad. La reduccin de la calidad de una imagen, no necesariamente afectar su vista en la pgina web. Esto se debe a que generalmente las imgenes obtenidas de una cmara, un escner u otro medio, tienen una resolucin ptima para su impresin o revelado, que es muy superior al mnimo necesario para que se vea bien en el monitor de un ordenador. Qu se modifica en una imagen para su optimizacin? Las imgenes a ser utilizadas en el diseo de una pgina web, puede ser modificada en varios parmetros a los efectos de reducir su peso. El parmetro ms empleado para modificar el peso de una imagen es la resolucin, cuya medida es en ppp (pixeles por pulgada cuadrada). Una cmara digital obtiene resoluciones de unas 300 ppp, y una impresin de buena calidad (aunque pueden obtenerse impresiones de mayor calidad) es de 200 ppp. Estas resoluciones no son necesarias en una imagen que va a ser mostrada en una pgina web, ya que una resolucin de 72 ppp es lo que se recomienda para su uso en este medio, debido a que la gran mayora de los monitores no tienen resoluciones superiores. Otro parmetro modificable es el color. Una imagen de alta calidad (denominado color verdadero, ya que se acerca a la capacidad del ojo humano en la deteccin de colores) tiene una profundidad de color de 32 bits por pixel, de los cuales 24 bits

178

son para el color (casi 17.000.000 de colores) y 8 bits son destinados a las transparencias. Reduciendo la escala de profundidad del color a 16 bits (color de alta densidad), se obtiene tambin una reduccin del peso de la imagen. Para imgenes que emplean pocos colores, pueden utilizarse escalas menores, como 256 colores o menos. El formato GIF va ms all, ya que cada imagen guarda su propia escala de colores, lo que reduce notoriamente la cantidad de informacin (y por consiguiente el peso) que contiene un archivo de imagen. Los archivos de imagen pueden contener datos adicionales (metadatos), que tambin influyen en el peso del mismo, por lo que en muchas ocasiones, los programas de optimizacin de imgenes los quitan, como mtodo de reducir la cantidad de informacin contenida en el archivo. Hay varias formas de optimizar una imagen para su empleo en pginas web. Algunos programas de edicin de imgenes tienen plug-ins para la optimizacin y otros tienen esas funcionalidades incorporadas. Adobe Photoshop presenta herramientas que permiten definir algunos parmetros de calidad para optimizar las imgenes, tanto reduciendo su calidad para su utilizacin en la web, como para aumentarla para su uso en impresiones. GIMP no posee funciones que permitan definir la calidad de las imgenes tratadas, pero en el guardado permite la modificacin de algunos de ellos (segn el formato) para reducir su tamao. Otra opcin es la utilizacin de herramientas especficas, tanto programas como herramientas online, algunas de las cuales describiremos a continuacin. Tambin es posible emplear algunos trucos con buenos resultados. RIOT: Software gratuito para optimizar imgenes. RIOT es un software de optimizacin de imgenes gratuito de muy bajo peso y portable (puede ejecutarse desde un dispositivo de memoria USB), que presenta dos ventanas en las cuales se visualizan la imagen original y el resultado tras los ajustes que se van realizando.

179

En pruebas realizadas con este programa, los resultados son muy buenos. En una imagen de alta calidad con formato JPG, se logr una reduccin del peso de las imgenes de hasta 6:1, lo que quiere decir que una imagen de 600kB quedara en 100kB aproximadamente, con una reduccin de la calidad que no resulta visible empleando los parmetros por defecto. En imgenes PGN con transparencias, la reduccin es menor, aunque los nmeros siguen siendo igualmente buenos, ya que se logra una reduccin del peso de la imagen hasta algo menos que 3:1.

Otra de las caractersticas del programa es que solo trabaja con formatos JPG, PGN y GIF, permitiendo el cambio de formato, lo que quiere decir que, si estamos optimizando una imagen JPG, podremos guardarla como GIF o PNG. Adems, el programa presenta la opcin de establecer el peso que se desea que la imagen tenga, reduciendo la calidad hasta obtener el peso deseado. Es posible aumentar la proporcin de disminucin del peso de la imagen, as como modificar los parmetros. La interfaz es extremadamente sencilla, aunque se encuentra en ingls y no existe una versin en espaol.

180

Por otro lado, existen diversos sitios que realizan optimizacin de imgenes. Uno de ellos es SiteReportCard, una pgina que adems de otros servicios y herramientas para diseadores web, ofrece la optimizacin de imgenes en lnea. Esta optimizacin se realiza bajando la calidad de los colores y la definicin de la imagen. La pgina muestra la opcin de optimizar una imagen que se encuentra en una web, para lo cual el usuario de introducir en un campo la URL de la imagen o de subir una imagen desde el ordenador del usuario. En cualquiera de los dos casos, la pgina devuelve cinco copias de la imagen inicial en diferentes tamaos (y lgicamente diferentes calidades), las que pueden ser descargadas al ordenador del usuario. Otro sitio, con caractersticas similares es Dinamicdrive. El servicio es muy similar, aunque Dinamicdrive ofrece algunas copias ms que en el caso anterior y un servicio adicional, que es convertir las imgenes a otros formatos. Los formatos admitidos para su conversin u optimizacin son JPG, PNG y GIF. Una de las grandes maravillas que tiene Photoshop es la herramienta para guardar imgenes optimizadas para web (archivo/guardar para web). Esta herramienta resulta indispensable una vez la conoces. Te permite reducir el peso de las imgenes de forma espectacular manteniendo su calidad.

181

UNIDAD DIDCTICA 3. LOS PRODUCTOS. Los productos ofrecidos son el elemento ms importante de una tienda online, esencialemente porque sin ellos no podra ser una tienda. Como ya hemos dicho al principio de este curso, se tienen que tener muy bien definidos los objetivos y las lneas de actuacin de la marca. Los productos deben estar diseados y preparados para su lanzamiento En la presente unidad veremos al detalle de qu manera gestionar el catlogo de productos en nuestra tienda online pretashop. Iremos especificando paso a paso en su configuracin.

Gestin del catlogo. La parte Catlogo accesible desde la pestaa del mismo nombre le permite administrar el conjunto de sus productos a travs de su solucin e-comercio PrestaShop.

Gestin de las categoras de productos. La primera pgina de la pestaa Catlogo se presenta como sigue:

182

La parte Categoras permite a travs de la funcin Aadir una nueva subcategora crear diferentes clases de productos para ordenar sus artculos y ayudar as a sus clientes a encontrar ms fcilmente lo que buscan. Todas las categoras son subcategoras de la pgina de inicio. Creacin de una categora. Para crear una categora, rellene el siguiente formulario:

183

Primero, atribuya un nombre a su categora, despus determine si se encuentra activa, es decir si es o no accesible a sus clientes. Puede resultar interesante durante la creacin de una categora diferir su visualizacin por los clientes hasta que est completa o haya sido comprobada. Si se trata de una subcategora que pertenece a otra categora diferente del inicio, elija la categora a la que pertenece en el men desplegable Categora pariente. Pulse en Recorrer para importar una imagen desde su ordenador, para ilustrar su categora. Los campos de optimizacin de referenciamiento para una categora. Estos datos le permiten optimizar la visibilidad de su catlogo en los motores de bsqueda.

184

La Etiqueta <ttulo>: es el ttulo que aparecer en los motores de bsqueda durante una bsqueda efectuada por los clientes. La Meta descripcin es la presentacin en algunas lneas de su sitio Web, bajo el ttulo (Meta ttulo) en los resultados de los motores de bsqueda. Las Meta palabras-clave son las palabras clave que debe definir, para estar mejor referenciado en los motores de bsqueda. Puede indicar varias, separadas por comas, as como expresiones, que debern ir entre comillas. La URL amigable, le permite reescribir la direccin de sus categoras como quiera para favorecer un mejor referenciamiento. Por ejemplo, en lugar de tener una direccin tipo: http://www.mitienda.prestashop.com/category.php?id_category=3, obtendr: http://www.mitienda.prestashop.com/123-nombre-de-la-categora. Para ello, basta con indicar en el campo URL amigable, las palabras que quiere ver aparecer en lugar de nombre-de-la-categora, separadas por guiones.

El Acceso grupos le permite restringir algunas de sus categoras y productos a ciertos usuarios de su tienda. Para ver aparecer dichas categoras, los usuarios debern formar parte del grupo de usuarios. Vaya a la aplicacin de grupo en la pestaa Clientes para ms informacin.

185

Una vez que haya terminado la configuracin de su categora, puede registrarla en la misma pgina pulsando en Grabar o grabar y volver a la categora anterior pulsando en Grabar y volver a la categora anterior. Cada campo que tiene una bandera a su derecha indica que puede configurarse en varios idiomas. Para ms informacin sobre esta aplicacin, vaya a la aplicacin de gestin de idiomas. Gestin y aadir productos al catlogo. La gestin de los productos se hace a travs de la segunda parte de la pgina, titulada Productos en esta categora. Ver la siguiente imagen. Una vez que haya creado su categora, podr aadir productos pulsando en Aadir un producto nuevo, y aparecer un formulario con diferentes pestaas. Lo presentamos aqu etapa por etapa. Empezaremos por la pestaa n1 del formulario, que le permite rellenar la informacin general sobre sus productos.

186

Completar la informacin general sobre el producto.

Lo primero que debe hacer es rellenar la informacin sobre el producto. Es el nombre que aparecer en los resultados de la bsqueda. Al lado de dicho campo, ver una bandera que le permitir seleccionar el idioma en el que desea editar o crear el campo. Si no quiere que dicho producto sea visible por sus clientes, al menos inmediatamente, marque la casilla Desactivado. El campo Fabricante permite informar sobre el nombre del fabricante del producto. Se trata de un campo opcional. Pulse en Crear al lado del campo Fabricante si no existe ya, o seleccione en el men desplegable el que desee asociar al producto. Numerosas informaciones se encuentran a su disposicin para poder administrar perfectamente las referencias de sus productos, como Referencia, EAN13, Referencia Proveedor o Ubicacin, que le ayuda a definir una ubicacin en su almacn. Para terminar, tambin es posible indicar el peso para efectuar el clculo de gastos de envo de los pedidos de sus clientes.

187

Crear un pack de productos. Desea vender un pack de productos formados por varios artculos. Ejemplo: una configuracin informtica compuesta por una unidad central, una pantalla, y una impresora. Para ello puede crear un pack y asociar otros productos de su catlogo. Marque la casilla Paquete. Aparecen diferentes opciones, entre las cuales un men desplegable que le propone elegir el producto que desea aadir al pack entre los ya creados. Seleccinelo, elija la cantidad, y pulse en el botn verde para validar lo aadido. Puede aadir al pack tantos productos como desee. Los paquetes permiten al administrador del sitio Web facilitar la preparacin de los pedidos. Tambin permiten a los clientes poder disfrutar de ofertas especiales.

Crear un producto descargable. Marque la casilla Producto descargable, si vende bienes descargables como ttulos en mp3, documentos en PDF, etc.

188

Seleccione el archivo que pondr a disposicin de sus clientes pulsando en Elija un archivo, despus seleccinelo en su ordenador. Nombre del archivo. Asigne el nombre del archivo. Nmero de descargas. Indique cuantas veces se podr descargar este archivo para cada pedido de sus clientes. La fecha de validez. Indica la fecha a partir de la cual el archivo ya no estar disponible a la venta. Rellene este campo respetando la indicacin: AOMES-DA. Nmero de das. Una vez que el cliente haya validado una compra en su tienda, puede limitar la duracin durante la cual ste podr descargar su archivo. En ese caso, indique el nmero de das en cifras. Este campo es obligatorio para guardar su producto. Configuracin de la lista de precios de un producto. Configure el precio que aparecer en su espacio de venta gracias a los siguientes datos:

189

El campo Precio de compra sin IVA: le permite saber en cada momento cual es el precio de coste. Puede as compararlo con el precio de venta para decidir cual ser su margen. El campo Precio de venta IVA incluido: Indique el precio sin IVA de su producto. El campo Impuesto: Indique el tipo de impuesto que se aplicar al producto. Elija entre los diferentes tipos de tasas (IVA al 18%, 8%...) Para configurar los impuestos, consulte la seccin Impuestos. El campo Precio de venta IVA incluido: precio de venta que incluye las tasas. El campo Eco-Participacin: le permite definir la parte del precio designada al reciclaje de su producto. Debe indicarse en el caso de productos de tipo electrodomstico, tecnolgico El campo Descuento: le permite aplicar un descuento en porcentaje o en valor fijo. Si la oferta tiene una duracin limitada, indique las fechas de validez, en formato ao-mes-da. Si desea indicar que su producto est en oferta, marque la casilla Indicar que el producto est en oferta y aparecer un logo en la ficha del producto correspondiente. Puede modificar el logo desplazando el archivo a la siguiente ubicacin: temass/prestashop/img/onsale_fr.gif El precio de venta final es el que aparece en la ficha producto, una vez se haya aplicado el descuento. Puede rellenar el campo Precio de venta IVA incluido y seleccionar el tipo de impuesto a aplicar, entonces el campo Precio de venta IVA incluido se calcular de forma automticamente. La operacin en sentido inverso tambin est disponible.

190

Disponibilidad de un producto.

El campo Cantidad corresponde al nmero de productos disponibles. En el caso en el que disponga de una gama de productos, este campo representar la suma del conjunto de las cantidades de dichas gamas. El campo Mensaje si disponible le permite enviar un mensaje a sus visitantes cuando el producto se encuentra disponible. Eso los convence de su eficacia, mostrando por ejemplo Artculo disponible para informarles de que el producto se encuentra disponible. En caso de falta de existencias, tiene dos posibilidades: 1) Aceptar los pedidos y diferir su envo. Para ello, marque Aceptar los pedidos. 2) Rechazar los pedidos. En este caso, no se aceptar ningn pedido para dicho producto.

191

Tambin es posible configurar de manera general el comportamiento que deber aplicarse a todos sus productos. Por defecto, la opcin elegida es rechazar el pedido, pero es posible modificarlo en la pestaa Preferencias/Productos, que se encuentra detallada en la seccin Configuracin de los Productos. Categora por defecto y presentacin en su catlogo. La categora por defecto se utilizar cuando un artculo pertenece a varias categoras para precisar qu categora utilizar si un cliente llega a su sitio Web a partir de un buscador (sin pasar por la arborescencia clsica de su sitio Web). El nombre de la categora aparecer en la URL del producto. Ejemplo: un telfono puede aparecer en la categora de su marca (Apple, Samsung, Nokia) pero tambin en la de sus caracterstica (Smartphone, telfono de tapa...). Referenciamiento de su producto. Para mejorar el referenciamiento de sus productos, as como el de su tienda, le invitamos a rellenar cuidadosamente los diferentes campos de optimizacin de referenciamiento: los ttulos meta, descripciones meta, las palabras claves y URL amigables. Para acceder a estas informaciones, pulse en la siguiente frase:

Aparecen los siguientes campos:

192

Configuracin de la descripcin del producto.

193

La primera pestaa consta de dos espacios dedicados a introducir una descripcin. La primera le permite introducir un resumen que aparecer en los buscadores. El resumen debe ser de 400 caracteres mximo. La segunda le permite introducir una descripcin de su producto que aparecer directamente en su tienda en lnea. Gracias al editor de texto, dispone de todas las opciones de presentacin para hacer que sus descripciones sean ms atractivas (fuente, tamao, color del texto, etc.) El campo Tags le permite definir los trminos que ayudarn a sus clientes a encontrar ms fcilmente lo que estn buscando. El campo Accesorios le permite elegir productos asociados que se proponen en la ficha del producto. Para sugerir un producto a sus clientes, introduzca las primeras letras de dicho producto, despus seleccinelo y pulse en el botn verde situado a la derecha del campo. Una vez que haya terminado de configurar todos estos puntos, le aconsejamos que guarde su trabajo pulsando en Guardar, en ese momento ser redirigido a la pgina de inicio de su catlogo. Otra opcin es pulsar en Guardar y seguir, para seguir con la configuracin de la presentacin del producto. Una vez haya guardado su trabajo, aparecern nuevas opciones, en especial las pestaas 3.Gamas, 4.Caract., 5.Personalizacin, 6.Precios decrecientes, 7.Documentos adjuntos. Configuracin de las imgenes productos. La pestaa nmero 2 es til para incluir imgenes en su pgina producto.

194

195

Para ilustrar su producto, pulse en Recorrer, despus importe una foto desde su ordenador. El valor del campo Leyenda se indicar cuando sobrevuele una imagen. Tambin es el valor que tienen en cuenta los buscadores para indexar su contenido. Por lo tanto debe darle un nombre que corresponda a la descripcin del producto para que aparezca ms fcilmente en los buscadores. Marque la casilla Portada si quiere que la imagen importada se utilice como imagen por defecto, y por lo tanto que aparezca directamente en el momento de su conexin en la pgina producto de su tienda en lnea. Para terminar, puede redimensionar las imgenes en miniaturas, es decir, adaptar su foto al tamao idneo en la ficha producto: elija entre Automtico o Manual en el men desplegable Mtodo de redimensionamiento. Le aconsejamos que lo deje en automtico. Una vez que haya importado varias imgenes, puede, gracias a la flecha numerada 1 en la imagen, modificar el orden de aparicin pulsando en las flechas de la columna Posicin o definir otra imagen de portada pulsando en los iconos de la columna Imagen de portada. Caractersticas. La pestaa nmero 4, Caractersticas le permite especificar las caractersticas de sus productos. Esta aplicacin le permite homogeneizar los datos que va a mostrar a sus clientes. Al definir dichas caractersticas puede indicar los criterios que desee para cada uno de sus productos. Esto le permite no volver a cubrir los campos para cada creacin de producto, sino nicamente completar los valores que estn relacionados. Atencin, contrariamente a las declinaciones, stas no cambian, son vlidas para el producto en general.

196

Crear una caracterstica. Para crear una caracterstica, as como sus valores, pulse en la pestaa del catlogo llamada Caractersticas.

197

Pulse en Aadir una caracterstica, por ejemplo, para aadir el nmero de pares de cordones que incluye cada par de zapatos.

Indique el nombre de la caracterstica y guarde. Crear un valor. Para aadir un valor a la caracterstica, vuelva a la pgina anterior, y pulse en Aadir un valor.

En el men desplegable elija la caracterstica a la que quiere aadir un valor, indique su contenido y guarde. Asignar un valor y una caracterstica al producto. Para terminar, vuelva a la pestaa Caractersticas de la ficha producto y elija el de su producto en los mens desplegables. Pulse en Subir caractersticas.

198

Acabamos de crear caractersticas y los valores relacionados. Ya puede ir al producto de su eleccin e indicar las caractersticas, as como los valores que debern aparecer. Si una caracterstica no tiene valor asignado, entonces no aparecer en la tienda. Indicar un valor personalizado. Si quiere crear un valor que no ha sido configurado previamente, puede aadirlo directamente en el campo Personalizacin, y una vez completado aparecer en su tienda. Personalizacin. El software de tienda en lnea PrestaShop permite a sus clientes intervenir sobre la eleccin del producto, que van a comprar, personalizndolo. Ejemplo: Usted es vendedor de joyas y quiere dar a sus clientes la posibilidad de grabar un texto o una imagen. Sus clientes podrn comunicarle en el momento del pedido un texto o una imagen. Veamos como configurar esta aplicacin. En la pestaa nmero 5: Personalizacin, indique qu tipo de campo debe ser personalizado. Si su cliente debe poder enviarle una o varios ficheros (una o varias

199

fotos por ejemplo) cambie el valor del Campo fichero para indicar el nmero de ficheros que va a recibir. Si su cliente debe poder enviarle texto, modifique entonces el valor de Campo texto. Al modificar el valor de cada uno de los campos, tambin se modificar el nmero de los que aparecern en la pgina producto de su e-comercio. Con este mismo ejemplo vamos a seguir modificando los dos valores inscribiendo 1 en los dos campos. Una vez haya hecho esto, pulse en Actualizar los parmetros. Entonces aparece lo siguiente:

En Campos de archivo aada una indicacin para sus clientes para que sepan qu archivo deben enviar. Marque la casilla Requerido si dicho elemento es indispensable para validar la compra. En Campos de texto, indique cul es el tipo de contenido que su cliente debe rellenar.

200

Despus pulse en Guardar los campos para guardar. En la tienda, deber aparecer lo siguiente:

La ventaja de esta funcin es ofrecer a sus clientes una prestacin personalizada. Lo apreciarn.

201

MDULO 6. MTODOS DE PAGO Y LA PASARELA DE PAGO. El Comercio Electrnico es una realidad incontestable. Vivimos en una era en la que el consumidor es omnipotente y multicanal. A diferencia de previos cambios, esta revolucin se basa en innovacin impulsada por el consumidor. Y lo ms interesante es que el consumidor va por delante en esta carrera tecnolgica. Esta revolucin tambin afecta a los pagos y, por ello, estn surgiendo alternativas muy interesantes para facilitar el pago a los consumidores, ya sea a travs del PC, del smartphone, de los tablets, etc. No slo surgen nuevas aplicaciones, accesorios, y perifricos, si no tambin nuevas PSPs, sistemas de pago, y diferentes y creativas formas de poner en contacto a consumidores y comercios para generar negocio. Para una tienda online es muy importante elegir bien los medios de pago y, sobre todo, la pasarela de pago, ya que la experiencia de usuario en el proceso de pago de los compradores contribuir a su nivel de recurrencia y fidelidad. En las tiendas fsicas existe la alternativa del dinero en efectivo, pero en el eCommerce slo es factible y seguro aceptar medios de pago electrnicos para el pago de los productos y/o servicios. Para especificar algo ms la diferencia entre mtodo de pago y pasarela de pago, veamos a continuacin una breve definicin de ambos trminos. Un mtodo de pago es la forma que tiene tu pagador de darte dinero, es decir, las distintas opciones que tiene de abonarte una cantidad determinada. Por ejemplo, tu pagador podra pagarte con tarjeta de crdito/dbito, transferencia bancaria, dinero en efectivo, crditos virtuales, etc. Una pasarela de pago es el medio por el cual tu pagador te abona una cantidad con el mtodo de pago elegido, es decir, el camino por el que se encauza el

202

proceso de pago. Puede pagarte con tarjeta de crdito (mtodo de pago) a travs de Paypal (pasarela de pago) o por medio de una TPV virtual (pasarela de pago). No todas las pasarelas admiten todos los mtodos de pago ni todas las monedas, por lo que tendrs que averiguar/consultar si la pasarela que eliges soporta las posibilidades que quieres ofertar. Los medios de pago ms extendidos en el mundo son las tarjetas Visa (Dbito y Crdito), MasterCard (Dbito y Crdito), American Express y, en menor medida, Diners Club y JCB. En algunos pases y regiones del mundo tambin hay medios de pago locales, como Discover en EE.UU. y UnionPay en Asia, sta ltima con un potencial enorme de crecimiento. PayPal, a medio camino entre un sistema de pago, un agregador y una pasarela, es tambin una solucin global que permite la transferencia de dinero entre usuarios (consumidores y empresas) que tengan correo electrnico. Por todo ello, la seguridad en una tienda online pasa a tener un papel prioritario. Queremos hacer mencin en este mdulo de la importancia de la seguridad. La importancia de la Seguridad en una Tienda Online. Cuando desarrollamos un proyecto de Tienda Online, una de las cuestiones importantes es la seguridad de que los datos que un cliente son trasmitidos con seguridad y confidencialidad, y esta informacin no es utilizada de manera inapropiada. Por ello debemos incluir en nuestro sitio de venta online este tipo de certificados que dar tranquilidad y confianza a nuestros clientes. EL Certificado SSL (Secure Socket Layer) es un protocolo de seguridad utilizado en la comunicacin y transferencia de datos entre el usuario y la Red. Se utiliza para proteger la transmisin de informacin confidencial y que nadie ms pueda manejarla de modo inapropiado. Actualmente es el estndar de comunicacin segura en los navegadores web ms importantes (protocolo HTTP), como Internet Explorer, Firefox, Chrome, Safari, etc. El Certificado Digital. Un certificado digital garantiza que la informacin confidencial que enva el usuario conectado (pgina Web, Tienda Online ) a un servidor (web site con soporte SSL) est encriptada y as no sea susceptible de ser interceptada por

203

terceras personas no autorizadas. El usuario realiza operaciones con completa seguridad al brindar sus datos confidenciales en este entorno. Cmo sabemos si una web cuenta con proteccin bajo un certificado SSL? Esto puede verse a simple vista en todos los principales navegadores. En las ltimas versiones de los navegadores web la barra de direcciones aparecer en amarillo. Lo primero es el prefijo HTTP de la direccin URL de la pagina web, cambia a HTTPS (que significa HTTP seguro). Lo segundo es que en alguna parte de la ventana del navegador (ello depende de que navegador utilice), se visualiza un icono con forma de candado; el mismo al darle click abre una ventana con todos los datos del certificado SSL en cuestin, y los datos de la entidad CA que genero este certificado. El certificado de seguridad lo concede una entidad certificadora, despus de haber controlado la correcta configuracin del proceso de encriptacin (SSL) y haber comprobado los datos de la empresa solicitante. El certificado de servidor seguro se concede a una entidad cuyas referencias han sido comprobadas, para asegurar que quien recibe los datos encriptados es, efectivamente, quien debe recibirlos. En el momento de finalizar la compra y facilitar los datos personales, podras comprobar que estaas en un servidor seguro. En esta pgina puedes ver cmo aparece un candado que indica que esta est protegida con un certificado de seguridad SSL. Este candado aparecer en todas las partes de esta web donde haya informacin sensible. La implementacin de pginas web protegidas con certificados SSL aplica a cualquier organizacin de todo tamao; desde una micro empresa hasta una gran empresa. Es absolutamente esencial en funciones y pginas web de comercio electrnico, tiendas online, donde se soliciten datos de tarjetas bancarias o informacin confidencial. Por ello, todo banco con servicios en lnea cuenta con accesos a la banca electrnica con proteccin bajo certificados SSL. Siempre que

204

se realizan pagos a travs de pasarelas bancarias, el banco es quien garantiza la seguridad de la conexin, y las Tiendas Web no guardan ninguna informacin de nmeros de tarjeta por lo que el certificado no les es necesario para sus pagos. Lo mismo ocurre con otros mtodos de pago como PayPal. Son indispensables en los accesos va pginas web a redes privadas corporativas o empresariales. Si tu empresa realiza operaciones comerciales por internet, casi es seguro en alguna de tus pginas web requerir el uso de un certificado SSL. Son obligatorios en Espaa los certificados de seguridad para Tiendas Virtuales? Todo depender del tipo de datos que se soliciten a los usuarios. La LOPD obliga a cifrar las comunicaciones o, lo que es lo mismo, a tener certificado de seguridad, cuando solicitemos datos de nivel alto. Este tipo de datos sern los que se refieren a: Ideologa. Religin. Creencias. Origen racial. Salud / Vida. En la mayora de las Tiendas Virtuales se solicitan los datos bsicos como son el nombre y apellidos, direcciones de contacto, telfonos, etc. Incluso si la propia tienda requiere a sus clientes datos financieros se consideraran de nivel medio, que son tratados de diferente manera que los bsicos, y an as tampoco tendra la obligacin de tener instalado un certificado de seguridad. Conseguir un certificado SSL. La organizacin que desee encriptar informacin en algunas de sus pginas web debe solicitar un certificado digital a una autoridad de certificacin (CA). Los CA ms reconocidos a nivel mundial son: VeriSign, Thawte, GeoTrust y RapidSSL en ese orden.

205

Ahora, no confundas si tu proveedor de hosting te ofrece un certificado SSL, el no es un CA; aunque si puedes estar como un distribuidor de un CA registrado. Es decir, que tu proveedor de hosting pueda tramitarte un certificado SSL de cualquiera de los CA reconocidos (como los mencionados anteriormente). O bien, puedes ir al web oficial del CA de preferencia y tramitar por t mismo el certificado SSL que ocupe. Precisamente los certificados SSL se pagan bajo la misma modalidad que los hostings web; es decir se paga una cantidad establecida por el CA y la misma corresponde a un tiempo de vigencia del certificado SSL. Una vez el certificado expira, este tiene que ser renovado (va otro pago), sino, el certificado pierde validez y no funciona para realizar una conexin cifrada segura. Una vez que tu certificado SSL se ha aprobado y emitido por un CA, tu desarrollador web o administrador web debe dirigirse al sitio web del CA donde haya tramitado el certificado, y descargar la secuencia de comandos para el sello y aadir este en las pginas web apropiadas (los accesos o formularios donde se captura la informacin confidencial). La persona que instale el sello tendr que saber el nombre comn utilizado para la compra del certificado SSL y poder actualizar el HTML de las pginas donde se aadir el sello. El sello consiste en una lnea pequea de cdigos que enlaza con un ventana emergente generada por el CA que contiene informacin sobre su certificado SSL. Una vez hemos aprendido los conceptos de los pagos a travs de Internet, as como la seguridad que debe construirse entorno a ellos, pasemos a ver con detalle la gestin de estos pagos en la plataforma Pretashop.

206

Gestin de los mdulos de pago. Mdulos de pago. El software de tienda en lnea PrestaShop le ofrece la posibilidad de aceptar las transacciones de sus clientes a travs de diferentes modos de pago, como los cheques, las transferencias bancarias, al contado en el momento de la entrega, a travs de Google Checkout, o mdulos como Hipay, Moneybookers, y PayPal. Todos ellos ya estn incluidos en su tienda y listos para usar. Sin embargo, es necesario configurarlos. Para instalar el mdulo Al contado en el momento de la entrega, basta con un pulsar en el botn Instalar. La lista completa de los mdulos se encuentra en la pestaa Pago como nos muestra la siguiente imagen:

207

Vamos a analizar la configuracin y la instalacin de dichos mdulos que son esenciales para que su tienda en lnea funcione perfectamente.

208

Mdulo de transferencia bancaria. Para configurar sus mdulos, pulse en Configurar. Aparece un formulario en el que se le piden un nmero de informaciones, rellnelo y guarde: el mdulo ya es operacional. Para que se acepten las transferencias bancarias, basta con rellenar los datos bancarios de la tienda. Una vez haya validado, pulse en Actualizar para guardar todos los parmetros. En ese momento sus clientes vern las diferentes opciones en el momento del pago.

Si sus clientes eligen Pagar por transferencia, aparece la siguiente pgina: Es necesario validar la divisa que se vaya a utilizar.

209

Al pulsar en Confirmo mi pedido, aparecen sus datos bancarios. Ver imagen:

Una vez que se encuentre en esta etapa, el pedido de su cliente aparece directamente en el recapitulativo de sus pedidos en la pestaa Pedidos. Cuando un cliente hace una transferencia bancaria, usted debe cambiar manualmente el

210

estado de pago del pedido en su BackOffice contrariamente al mdulo por tarjeta de crdito que se efecta de manera automtica. Pago por cheque. Para configurar el modo de pago por cheque, debe ir a la pgina de configuracin de los mdulos de pago por cheque, en la pestaa Pago pulse configurar en la lnea del mdulo cheque, despus rellene los campos A orden de y Direccin.

Una vez haya rellenado los campos, pulse en Actualizar para guardar los datos. Sus clientes vern la informacin cuando realicen un pedido, justo despus de elegir su modo de pago, es decir, por cheque. Cuando un cliente realiza un pedido con el pago por cheque, usted debe actualizar manualmente el estado de pago del pedido, no como sucede en el pago con tarjeta donde la operacin se realiza de manera automtica. Mdulos bancarios de empresas asociadas. PrestaShop propone varios mdulos de empresas asociadas: Paypal. Moneybooker.

211

Hipay. Google checkout. Para poder utilizarlos, pulse en Instalar que se encuentra en la misma lnea. Aparece el botn Configurar que le permitir informarse sobre las ventajas de las empresas asociadas para que pueda crear una cuenta e inscribir las indicaciones que se encuentran en el BackOffice. Una vez haya terminado, pulse en Actualizar para guardar las preferencias. Paypal. PayPal le permite aceptar los pagos en su tienda de manera muy simple e intuitiva. Veamos como configurar el mdulo.

En estndar dos mdulos estn presentes: Empecemos por abordar el primer mdulo PayPal 1.6. Para poder activar el mdulo, pulse en Configurar, aparece la siguiente pgina:

212

Se requieren 3 elementos, primero la direccin email con la que ha creado una cuenta. Si desea activar su mdulo PayPal, puede empezar por una fase de test utilizando el modo Sandbox seleccionando S en la opcin que se propone. Atencin, una vez haya terminado el test, debe seleccionar No, en caso contrario sus clientes no podrn efectuar sus pagos. Despus, la URL del banner deber aparecer en el momento del pago en PayPal. Una vez haya configurado todos los elementos, pulse en Actualizar para validar su configuracin. En el momento de elegir el modo de pago su cliente tendr as diferentes opciones. Si no dispone de una cuenta PayPal le invitamos a crear una en el sitio: https://www.paypal.com

213

Al seleccionar PayPal, ser redirigido a una pgina de pago seguro, y podr escribir sus datos bancarios. Ver siguiente imagen:

214

El banner configurado en el BackOffice aparecer directamente en la pgina de pago PayPal, lo que da confianza a su cliente, que puede constatar la relacin entre su tienda y el modo de pago seguro que se le ha presentado. Solo tendr que introducir sus datos bancarios para validar su transaccin.

215

Hipay. Hipay es un modo de pago que le permite aceptar diferentes divisas. Para configurar su mdulo, primero debe instalarlo. Para ello pulse en Configurar. Aparece la siguiente pgina. Cree una cuenta pulsando en Crear una cuenta Hipay. Cuando su cuenta haya sido validada, Hipay le enviar los elementos necesarios para utilizar su cuenta con las diferentes divisas que propone. Solo tendr que completar la informacin de su BackOffice para que su tienda en lnea PrestaShop pueda proponer este nuevo modo de pago.

216

Moneybookers. La configuracin del mdulo de pago Moneybooker es extremadamente sencilla. Debe crear una cuenta en el sitio Moneybookers en la siguiente direccin: http://www.moneybookers.com/partners/prestashop/ Moneybookers es uno de los sistemas de pago ms importantes de Europa, que le permite hacer pagos locales en ms de 200 pases. Ms de 60.000 comerciantes en lnea utilizan actualmente Moneybookers, incluyendo importante empresas internacionales del comercio electrnico tales como eBay.com, Skype y Thomas Cook. Con ms de 14 millones de titulares de cuenta, Moneybookers tambin ofrece una de las carteras electrnicas ms grandes del mundo.

Una vez que haya creado su cuenta, deber rellenar la informacin de su cuenta con su direccin y su contrasea. Despus, seleccione los logos que desea que aparezcan en su tienda en lnea PrestaShop. Valide su configuracin pulsando en Guardar y validar mi cuenta. Restriccin de los medios de los mdulos de pago por divisas. En la pgina de la pestaa Pago, aparece el siguiente apartado:

217

En funcin del pago, la divisa que se propone a los clientes puede diferir: Pago por transferencia: marque las divisas que desea autorizar. Si acepta varias divisas, el cliente podr elegir una de ellas en el momento del pago. Pago al contado en el momento de la entrega: el cliente deber pagar en la devisa que haya seleccionado previamente en la tienda. Pago por cheque: marque las divisas que desea autorizar. Si acepta varias divisas, el cliente podr elegir una de ellas en el momento del pago. Pago por Moneybookers: es posible elegir entre diferentes divisas propuestas (entre las instaladas en la tienda). El cliente podr elegir en el momento del pago entre las divisas aceptadas. Pago por Google Checkout, Hipay y por Paypal: slo puede elegir una divisa aceptada en pago (entre las instaladas en la tienda). Tambin puede aceptar proponer a cada cliente un pago en la divisa que l mismo haya elegido en la tienda. Por ltimo, tambin puede aceptar nicamente los pagos en la divisa por defecto de la tienda (pestaa pago, divisa, preferencia de divisas).

218

Restricciones de los modos de pago en relacin al grupo.

PrestaShop le permite restringir los modos de pago en funcin del grupo de clientes. Por ejemplo si, en el campo de su actividad, desea que los particulares paguen con Paypal, Moneybookers e Hipay, mientras que los profesionales paguen por transferencia bancaria. En el momento del pago, el cliente solo tendr acceso al modo de pago adecuado en funcin del tipo de cliente y de lo que usted haya decidido. Restricciones de los modos de pago por pases. Su tienda en lnea PrestaShop le permite restringir sus modos de pago en funcin del pas de sus clientes. Por ejemplo, en Francia, Espaa, Alemania es posible aceptar todos los modos de pago como los cheques, las transferencias bancarias, etc. Mientras que en otros pases como Italia, Reino Unido o Suiza, puede decidir aceptar nicamente las transferencias bancarias. La eleccin de los mdulos de pago por pases se efecta en la pestaa Pago. Ver siguiente imagen:

219

Para proponer modos de pago en funcin del pas, debe marcar la casilla que corresponde a la lnea del pas elegido y la columna del modo de pago deseado. Una vez haya configurado todos los parmetros, pulse en Guardar en la parte inferior de la pgina. Divisas. PrestaShop le ofrece la oportunidad de aceptar un gran nmero de divisas. Por defecto, hay tres divisas en estndar: el euro, el dlar y la libra esterlina. Pero es posible aadir y configurar nuevas divisas pulsando en la pestaa Divisas de la seccin Pago.

220

Si desea crear una divisa, pulse en el botn Nuevo de la imagen precedente, y ver aparecer el siguiente formulario:

221

Una vez haya configurado la nueva divisa, pulse en Guardar para guardar sus parmetros. Impuestos. La pestaa Impuestos situada en el apartado Pago le permite administrar los impuestos aplicables a sus productos. Cuando pulsa en la pestaa impuestos, aparece la lista de los mismos. En estndar se han configurado tres impuestos.

222

Rellene el formulario para configurar su impuesto, despus pulse en Guardar a pie de pgina. Si desea aplicar impuestos especiales a un pas en lugar de a una zona, debe ir a la pestaa Transporte, despus Zonas, para crear y configurar una zona especfica. Vales descuento. En la pestaa Vales descuento, puede ofrecer a sus clientes descuentos (en valor o en porcentaje) o los gastos de envo de su pedido. En la pestaa aparecen los vales descuento que ya han sido creados as como las condiciones de validez.

Para crear un nuevo vale descuento pulse en Nuevo en la parte superior de la pgina. Aparece el siguiente formulario:

223

En una primera etapa, es necesario atribuir un cdigo a su vale descuento. Puede crear uno o bien generarlo automticamente. Para ello, pulse en New a la derecha del campo Cdigo. El campo Tipo, le permite elegir cul ser el mtodo de reduccin aplicado. Existen 3 opciones: Reduccin sobre el pedido en % (porcentaje). El vale descuento aplicar un descuento en porcentaje sobre el valor total del pedido. Ejemplo: el pedido tiene un valor de 200, el vale descuento tiene un valor de 15%, aplicando el descuento el cliente pagar nicamente 170.

224

Reduccin sobre el pedido (importe). Esta opcin aplicar un descuento monetario sobre su pedido. Ejemplo: el pedido tiene un valor de 100 y el vale un valor de 20, aplicando el descuento el cliente pagar nicamente 80. Gastos de envo gratis: gracias a este vale descuento, puede regalar los gastos de envo a sus clientes. En el momento del pedido stos debern indicar el cdigo requerido. El campo Descripcin le permite introducir una breve descripcin, que aparecer en su Back-Office, en la pestaa reduccin pero tambin en el carrito de su cliente en el momento de su pedido. El campo Categora le permite restringir la aplicacin de sus vales descuento a ciertas categoras. As, en funcin de sus mrgenes, no podr ofrecer el mismo tipo de descuento a todas las categoras. Seleccione las que le interesen marcando las casillas correspondientes. El campo Cantidad disponible le permite limitar el nmero de reducciones que se podrn utilizar. Gracias a esta aplicacin, puede por ejemplo organizar una oferta flash, de tipo los 100 primeros pedidos tendrn un descuento de 10% introduciendo el vale descuento XXX. El campo Cantidad por persona, tiene la misma funcin que el precedente pero permite filtrar la cantidad disponible para cada cliente. As, si quiere que el vale descuento se aplique una sola vez por cliente, seleccione 1. Si por el contrario, desea que sus clientes tengan acceso a varios descuentos, seleccione el nmero que quiera. El campo Importe mnimo de compra, le permite seleccionar un umbral mnimo de compra para que se aplique un descuento. De esta manera, los descuentos sern efectivos cuando se alcance o se sobrepase el importe que usted ha elegido. Tambin puede decidir si sus vales descuento son acumulables con otro tipo de descuento u otros vales descuento que haya generado anteriormente. Seleccione sus preferencias marcando las casillas correspondientes.

225

El campo Destinado a, le permite restringir su vale descuento a un nico cliente. Ejemplo: se ha producido un retraso en la entrega de un producto y quiere pedir perdn al cliente afectado, cree un vale descuento que ser vlido nicamente para l. Para encontrarlo rpidamente escriba las primeras letras de su nombre o apellido. El vale descuento puede tener una duracin limitada. Gracias a PrestaShop puede decidir la fecha de principio y fin de validez. Pulse en el campo De y A para elegir sus fechas en el calendario. Para terminar, el campo Estado le permite activar o no el vale descuento que acaba de configurar. Una vez haya terminado, pulse en Guardar. Su vale descuento aparecer en la pestaa Vales descuento, si lo desea puede suprimirlo o editarlo. Una vez haya guardado todo, ya puede enviarlo a sus clientes. Estos debern escribirlo en el momento de hacer el pedido, directamente en el recapitulativo de su carrito.

226

MDULO 7. LA GESTIN. UNIDAD DIDCTICA 1. DATOS ESTADSTICOS PARA LA GESTIN: PEDIDOS Y CLIENTES. Introduccin a la gestin de clientes. Como ya vimos anteriormente, una de las desventajas del eCommerce frente a las tiendas tradicionales es la prdida de la relacin cara a cara entre cliente y vendedor. Adems, el comercio electrnico facilita a los compradores la bsqueda del mejor precio para el producto que desean adquirir, por lo que en principio, y ponindonos en el peor de los casos, no hay nada que haga que tus clientes repitan la compra. Uno de los consejos ms importantes frente a esta situacin es no entrar en una guerra de precios frente a otras tiendas, es decir, poner los precios ms bajos de Internet. Es esencial, lejos de esta accin, diferenciarnos de la competencia por algo en particular que no sean los precios y que haga que nuestros clientes repitan la compra.

Lo que debemos hacer es que nuestra tienda aporte algo ms de valor hacia el cliente y no tan slo un buen precio. Hemos de tener presente que el eCommerce por s mismo es totalmente impersonal y que deberamos acercarnos ms al cliente. Si conseguimos crear ese vnculo, aumentaremos las posibilidades de que el comprador vuelva a realizar un pedido en nuestra tienda. Si bien las redes sociales pueden ayudar a acercar nuestra marca al consumidor y facilitarle una cara y un nombre propio, tambin se deberan tener en cuenta los 5 consejos para fidelizar clientes que os damos a continuacin.

227

1. Descuentos por nuevo cliente. Tienes un visitante nuevo, le gusta tu producto y est casi decidido a realizar el pedido, pero para l es una tienda nueva, no tiene referencias y no se atreve a dar el paso. Lo mejor ante esta situacin es ofrecer un descuento por ser nuevo cliente para incitarle a comprar en la tienda por primera vez. Por pequeo que sea dicho descuento, es un detalle de agradecer y en muchos casos puede romper la barrera psicolgica del coste del envo. Puedes entregar un cdigo promocional por email cuando confirmes el registro del usuario en tu web, pero no te olvides de anunciar el descuento antes del registro para captar su atencin. 2. Opiniones de compradores. Nada mejor para decidirse que ver qu opina el resto de clientes sobre la tienda. El boca a boca sigue siendo un factor determinante incluso en el mundo digital, as que quiz deberas incluir una seccin en tu tienda en la que los usuarios comentaran que tal fue su proceso de compra. Aunque generalmente estos apartados suelen estar plagadas de comentarios buenos, tambin reconforta ver algunos no tan perfectos: aunque las cosas no siempre salgan bien, debes demostrar que haces todo lo posible por satisfacer a tus clientes. Si adems permites que stos hagan un pequeo anlisis de cada producto que adquieren, mucho mejor. 3. Puntos de fidelizacin. Es una tcnica bastante utilizada en las tiendas convencionales que tambin se aplica al comercio electrnico. Por cada pedido, el cliente obtiene un nmero de puntos que se convierten en una cantidad de euros de descuento para prximas compras. Presentan dos ventajas: para conseguir ms descuento, puede que el cliente compre ms de lo que tena pensado, y por otro lado, como el descuento solo es vlido en nuestra tienda, favorecemos la fidelizacin de clientes en nuestro comercio online.

228

4. Facilidades de devolucin. Es algo muy a tener en cuenta si poseemos una tienda de ropa o similares, ya que las tallas no siempre son exactas y cada fabricante tiene patrones y medidas diferentes. Incluso poniendo a disposicin de los visitantes una guia de como elegir su talla, no siempre se acierta al 100%, as que si facilitamos, en la medida de lo posible, la devolucin y cambio del artculo, por descontado generaremos una buena impresin en el cliente. Para aplicar esto, puede que sea buena idea que un mensajero recoja el paquete en la misma casa del cliente, evitando as que ste se desplace. 5. Atencin postventa. Es la mejor forma de hacer nuestro comercio electrnico ms personal. Seguro que los visitantes agradecen tener un chat para comunicarse con el vendedor en tiempo real mientras visitan la tienda. As, pueden ser asesorados para elegir el producto que mas les convenga segn sus necesidades. Adems de ello, no podemos dejar de lado la comunicacin por correo electrnico para notificar cambios en el estado del pedido, si ste ya se ha enviado, etc.

Aunque algunas de estas medidas puedan suponernos a corto plazo un gran costo de trabajo o de dinero, nuestra inversin se ver recompensada a medio y largo plazo ya que los compradores se sentirn como en una tienda fsica, eso si, con todas las ventajas del comercio electrnico.

229

En este ltimo mdulo estudiaremos cmo gestionar los clientes y los pedidos en nuestra tienda online Pretashop. Para ello veremos el paso a paso de la configuracin y puesta a punto de estos dos pilares tan importantes de nuestra tienda. Hay que tener en cuenta que estos son los dos factores ms importantes a tener en cuenta en los objetivos de nuestra tienda online. Nuestra meta es que los clientes compren para as obtener beneficios, para ello deberemos, en primer lugar cuidar nuestra tienda online aplicando una serie de tcnicas que hemos ido viendo a lo largo del curso, para incitar al cliente a realizar un pedido. Del mismo modo, este pedido es una parte vital del proceso de compra-venta, pues si es rpido y efectivo indicar la buena gestin de la tienda y sin duda habr un alto porcentaje de que el cliente compre de nuevo en nuestro establecimiento virtual.

Gestin de los clientes. La pestaa Clientes le permite hacer un seguimiento de la creacin de cuentas clientes en su tienda. Es posible editar la cuenta de cada uno de sus clientes, por ejemplo desactivarla, etc., sin necesidad de entrar en la edicin de una cuenta cliente, puede efectuar varias acciones pulsando en los iconos verdes y rojos en el siguiente cuadro. Activar/ Desactivar una cuenta, inscribir/ desinscribir a un cliente a la lista de difusin de empresas asociadas. Para crear una cuenta cliente manualmente, pulse en Nuevo. Aparecer un formulario que podr completar con los datos relativos al cliente:

230

231

Rellene los datos del cliente e introduzca una contrasea de al menos cinco caracteres. Indique tambin su direccin email. La fecha de nacimiento es optativa. Elija si ese cliente puede o no conectarse modificando su estado, si est o no abonado a la newsletter (si existe) y, para terminar, si acepta recibir publicidad de empresas asociadas. Asigne un grupo a su cliente para poder atribuirle ventajas. Pulsando en la pestaa Direcciones tendr acceso a la lista de direcciones de sus clientes:

Tambin tendr la posibilidad de crear otras mediante el botn Nuevo. Grupos. PrestaShop le permite conceder privilegios a sus clientes, asignndoles grupos. Podr crear tantos grupos de clientes como quiera pudiendo atribuirles ventajas diferenciadas. Para ello pulse en la pestaa Grupos. Aparecer la siguiente pgina (por defecto se definir un nico grupo).

232

Para crear otros grupos pulse en el botn Nuevo. Ver formulario:

En el campo Nombre indique la denominacin que desee aplicar al grupo. En el campo Descuento, indique el porcentaje de reduccin que desea aplicar a los miembros de ese grupo, al conjunto de sus productos. Como el software PrestaShop se utiliza mucho en el sector BtoB, podr mostrar a sus grupos de clientes precios directamente sin IVA. Seleccione en el men desplegable Mostrar los precios, la manera en la que desea mostrarlos. Puede elegir entre IVA incluido o sin IVA. Valide los parmetros pulsando en Guardar.

233

Puede asignar un cliente al grupo de su eleccin pulsando en el icono de la lnea correspondiente, luego marcando en el cuadro Grupo el grupo del que el cliente formar parte. Bsqueda de un cliente. La bsqueda de un cliente en su tienda PrestaShop puede efectuarse de dos maneras: 1) La primera, introduciendo la informacin de la que dispone en la barra de bsqueda de PrestaShop que se encuentra en la parte superior izquierda de su Back-Office. Indique, a elegir : Su ID, que corresponde a la cifra que se le asign en la base de datos. Su nombre. Su direccin e-mail. En el men desplegable seleccione Clientes, despus pulse en Bsqueda.

Al validar visualizar los resultados.

Aparecern su id, su sexo, su email, su fecha de nacimiento, su fecha de registro, el nmero de pedidos y si su estado est o no activado.

234

2) El segundo mtodo consiste en ir a la pestaa Cliente listando el conjunto de sus clientes.

Entonces podr completar los campos para filtrar sus resultados segn los siguientes criterios: Id, sexo, nombre, apellidos, direccin e-mail, edad, activacin de cuenta, inscripcin a la newsletter, inscripcin a las ofertas de empresas asociadas, fecha de inscripcin, ltima conexin. Acabamos de ver dos mtodos para buscar un cliente. Pasemos ahora a la consulta del perfil de un cliente. Consultar los datos de un cliente. Para obtener ms informacin sobre un cliente pulse en el botn Buscar. Ver aparecer este botn segn los dos mtodos de bsqueda abordados previamente. Ver aparecer la siguiente estructura:

235

236

Carritos. El software PrestaShop pone a su disposicin funciones marketing muy eficaces que le permitirn consultar, en tiempo real, los productos que los clientes van aadiendo a sus carritos. Dispone de dos mtodos: Consultar el contenido de sus carritos directamente en la ficha de datos clientes pulsando en el botn del perfil cliente en el apartado Carritos. Ir a la subpestaa Carritos de la pestaa Clientes. Consulte el conjunto de los carritos que se llenaron. Podr, por ejemplo, filtrar los resultados segn la fecha en la que se aadieron los productos. Podr ver el perfil de los clientes que consulten su sitio Web y, si lo desea, actuar en consecuencia para mejorar su eficacia comercial. En ambos casos podr consultar el contenido del carrito de un cliente.

Los datos ms importantes retoman el contenido del carrito. Es decir, los productos concernidos, el precio a la unidad, la cantidad deseada y el importe total de la compra. Gestin de los pedidos. La pestaa Pedidos permite visualizar el conjunto de las informaciones sobre las compras en su tienda. Pulsando en dicha pestaa ver aparecer el conjunto de las transacciones efectuadas en su tienda clasificadas por fecha.

237

Lista de pedidos. La lista de los pedidos, as como su estado, son accesibles directamente pulsando en la pestaa Pedidos.

Los campos anteriores le permiten filtrar los resultados para encontrar fcilmente los pedidos que est buscando. Por ejemplo, para identificar los pedidos efectuados por el Sr. Rodrguez, escriba Rodrguez en el campo Cliente, despus pulse en Filtrar. Consultar el detalle de un pedido. Para tratar los pedidos recibidos, empecemos por consultar las informaciones que contienen. Pulse en la lnea de un pedido o en el botn Buscar a la derecha del pedido. La estructura se presenta entonces de la siguiente manera:

238

239

Enviar un mensaje a su cliente. Pulsando en el apartado Nuevo mensaje puede enviar un mensaje a su cliente para avisarle de una informacin relacionada con su pedido, de un retraso, de una sorpresa, por ejemplo. Mantener informados a sus clientes es sin duda una de las claves del comercio en lnea.

Puede grabar mensajes predefinidos y as evitar escribirlos cada vez. Si desea enviar uno de dichos mensajes, seleccinelo en el men desplegable. Puede enviar un mensaje libre escribindolo en el cuadro previsto a tal efecto. En ambos casos, una vez comprobado su mensaje, pulse en Enviar. Su cliente recibir este mensaje por email. Facturas. Cada vez que se valida un pedido en su tienda, se emite una factura. Este tratamiento se efecta cambiando el estado del pedido a Ok o Pago aceptado.

240

Puede descargarla directamente en el recapitulativo del pedido concernido pulsando en la parte superior derecha, apartado factura. Ver el siguiente ejemplo:

Por su parte, el cliente podr acceder a la factura yendo a su cuenta cliente, donde podr consultar la totalidad de las facturas que le conciernen. Impresin de las facturas. Si desea imprimir varias facturas al mismo tiempo vaya a la subpestaa Facturas de la pestaa Pedidos. Ver aparecer esta interfaz:

241

Para imprimir varias facturas, introduzca las fechas deseadas en los campos Desde y Hasta en el apartado Imprimir facturas en PDF. Para crear los PDF pulse en Generar archivo PDF. En el segundo apartado Opcin de facturacin, puede elegir si las facturas deben editarse en el momento del pedido, pero tambin, para su contabilidad, qu prefijo hay que configurar as como el primer nmero de la edicin de la factura. La aplicacin de edicin de factura le permite simplificar la gestin de su contabilidad.

Cuando un cliente le pida que le enve sus facturas, podr redirigirlo hacia su cuenta cliente donde las facturas estarn disponibles. Bonos de entrega. La funcin bono de entrega funciona exactamente bajo el mismo principio que la edicin de las facturas que acabamos de ver. Seleccione las fechas as como las opciones y despus valide generando sus documentos. Estado de los pedidos. Hay diferentes estados de pedido que le permiten administrar fcilmente a sus clientes. Estos estados son visibles y editables en la pestaa Estado de pedidos.

242

Por supuesto podr crear otros segn le convenga a travs del botn Nuevo. Complete el formulario siguiente y guarde.

243

244

Devolucin de productos. A travs de la pestaa Devolucin productos, podr ofrecer a sus clientes la posibilidad de devolver los productos pedidos que no les satisfagan. Pulsando en la pestaa devolucin mercanca aparecer un formulario: indique su eleccin y guarde.

En el momento en que haya activado esta opcin en su BackOffice, el cliente podr elegir efectuar una devolucin cliente desde su espacio. Ver la foto siguiente:

245

En ese momento el cliente debe seleccionar los productos que desea devolver. Una vez rellenado el formulario, el cliente validar pulsando en Generar una devolucin. La lista de los pedidos que van a ser objeto de la devolucin aparecer en su BackOffice. Ver la siguiente pantalla:

Pulse entonces en una de ellas para consultar las informaciones que contiene. Si un cliente devuelve un producto, la devolucin aparecer en la lista situada encima de las Opciones de devolucin productos, presentada en el cuadro anterior. Pulse en el nombre de la devolucin para consultar el detalle.

Modifique ahora el estado para seguir la evolucin de la devolucin.

246

Creacin de un vale. Si hay una devolucin, deber generar un vale. Para ello, seleccione en la lista de pedidos aquella en la que se solicita la devolucin y a continuacin pulse en el nombre para acceder al detalle del mismo. Marque en el detalle del pedido los productos devueltos, luego la casilla Reintroducir si desea volver a poner ese producto en su stock y, para acabar, marque la casilla Generar un vale. Si desea satisfacer a un cliente despus de haber cometido un error en su pedido, no se olvide de regalarle un vale descuento marcando Vale descuento y, si lo estima oportuno, reembolsarle los gastos de envo que la devolucin pudo ocasionarle, marcando la casilla cluir gastos de envo. Una vez seleccionadas todas las opciones, valide pulsando en Devolver los productos.

El vale generado estar disponible tanto en el detalle del pedido como en la pestaa Vale.

247

Su cliente ver aparecer el vale en su espacio cliente.

A continuacin, si ha generado un vale descuento, el cliente lo ver aparecer en el apartado Mis vales descuento en una pgina similar a la presentada a continuacin:

El importe del pedido se aade entonces en un vale descuento. El cdigo descuento deber retomarse en el siguiente pedido que el cliente efecte para poder beneficiar del descuento. Mensaje cliente. Su tienda en lnea PrestaShop permite la intercomunicacin entre usted y sus clientes gracias a un sistema de mensajera integrada. En efecto, si lo desean, sus clientes pueden enviarle mensajes sobre los pedidos a travs de sus cuentas cliente en Mis pedidos seleccionando luego el pedido en cuestin y completando el siguiente formulario:

248

Una vez que el cliente haya enviado el mensaje, aparecer directamente en la subpestaa Mensajes clientes, en la pestaa Pedidos.

Pulsando en la lnea del mensaje aparecer directamente en el pedido concernido por el mensaje. A partir de entonces podr consultarlo en la parte inferior de la pgina a la izquierda. En ese momento el mensaje aparece resaltado en amarillo para una mejor visibilidad.

249

Una vez que haya ledo el mensaje, no se olvide de pulsar en el punto verde para indicar que ha recibido la informacin. Comunique a su cliente que ha recibido la informacin envindole un mensaje despus de pulsar en el apartado Nuevo mensaje, que se encuentra justo encima y cuyo funcionamiento ya tratamos en la seccin Enviar un mensaje a su cliente. Mensajes predefinidos. Cuando enva mensajes a sus clientes a travs de la interfaz de administracin de PrestaShop puede elegir grabarlos para reutilizarlos con otros clientes. Para ello, vaya a la subpestaa Mensajes predefinidos, de la pestaa Pedidos. Un mensaje est grabado en estndar. Para aadir otros pulse en el botn Nuevo.

Aparecer entonces la siguiente pgina:

250

En el campo Nombre indique el ttulo de su mensaje para poder encontrarlo fcilmente. A continuacin en el campo Mensaje, indique el contenido que desea enviar a su cliente. Una vez hecho esto, valide pulsando en Guardar. Podr crear tantos mensajes como desee. Y ahora puede enviar el o los mensajes yendo directamente al pedido de un cliente.

Seleccione el mensaje y despus pulse en Enviar. Su cliente lo recibir por e-mail. En este punto podemos dar por finalizado el Mdulo, donde hemos aprendido a gestionar a los clientes y sus pedidos de manera eficaz con las herramientas que nos ofrece Pretashop.

251

MDULO 8. LA PUESTA EN PRODUCCIN. A lo largo de este curso, hemos ido viendo cmo configurar una tienda online. Una vez se tiene preparada y todos sus elementos estn listos llega la hora de su puesta en produccin o puesta en marcha. A partir de este momento esperamos que nuestro esfuerzo, dedicacin e inversin produzca unos beneficios que con el tiempo aumentarn. No obstante, para su puesta en marcha son necesarios algunos requisitos de los que todava no hemos hablado. Aprovechamos la oportunidad para informar a todo aquel emprendedor que desee montar su negocio electrnico. La parte activa e interesante del negocio ya est configurada, pero queda la parte legal y el trasfondo pesado al que tenemos que atenernos. As, en este mdulo trataremos algunos de los aspectos fundamentales para poner en marcha nuestra tienda virtual y poder empezar a producir beneficios. Requisitos legales para creacion de una tiendas online por un particular. Los requisitos legales necesarios para crear una tienda online y poder vender en internet constituyen un aspecto muy importante para emprendedores, empresarios y, en general, para cualquier persona que desee montar un negocio online.

Pero no solo eso, para que hoy en da se pueda finalizar con xito una venta es fundamental mostrar en la web del vendedor, de manera visible y clara, su informacin fiscal/legal, una completa informacin de los productos puestos a la

252

venta y sus caractersitcas, as como las restantes condiciones de compra, de forma que transmitamos seguridad y confianza a los potenciales clientes e internautas. Para crear una tienda online constitutiva de actividad habitual y directa como empresario/a particular desde Espaa es necesario cumplir con una serie de obligaciones mnimas laborales, fiscales y otras relacionadas con el derecho de la sociedad de la informacin y comercio electrnico. Vemoslas a continuacin. Obligaciones en relacin a la seguridad social. El empresario que decida crear una tienda online debe estar dado de Alta en el Rgimen Especial de Trabajadores Autnomos (R.E.T.A) De acuerdo a la ley, toda persona que realice de forma habitual, personal y directa una actividad econmica a ttulo lucrativo (comercial, industrial o profesional), sin sujecin por ella a contrato de trabajo y aunque necesite de los servicios de otras personas deber de darse de alta en el Rgimen Especial de Autnomos de la Seguridad Social. Existe una sentencia del Tribunal Supremo de 29 de octubre de 1997 que refuerza el requisito de habitualidad para que nazca la consideracin de trabajador autnomo, y por tanto la obligacin de cotizar a la Seguridad Social en tal condicin. Esto significa que para que nazca la obligacin tiene que existir continuidad o visos de cierta permanencia en el ejercicio de la actividad profesional en la tienda virtual. Asimismo, a partir de esa sentencia del Tribunal Supremo, la jurisprudencia se muestra unnime al estimar adecuada la comparacin de lo percibido por el interesado por el ejercicio de una actividad con el salario mnimo interprofesional (SMI), de tal manera que la superacin del umbral de su importe anual se entiende como indicador de la condicin de habitualidad. Si los ingresos obtenidos por la actividad superan el SMI, no cabra estimar tal actividad como espordica. Actualmente se entiende que si el administrador de una tienda online percibe menos del SMI anual, no cumplira con el requisito de habitualidad necesario para darse de alta en el RETA, y podra ejercer legalmente dicha actividad de venta en tienda online cumpliendo con las obligaciones fiscales (alta en el IAE,

253

declaraciones trimestrales y resumen anual de IVA) y las relacionadas con la LSSICE, LOPD, LCGC, etc. El riesgo de esta opcin es que si en el futuro la Seguridad Social hace una comprobacin de la situacin y entiende que debiera ser una situacin de alta, reclamar el pago de lo adeudado desde la creacin de la tienda virtual, ms los intereses correspondientes. Por lo tanto, al comienzo de un negocio de tienda virtual, mientras no se alcancen unos ingresos mnimos, no es necesario cotizar en el Rgimen Especial de Trabajadores Autnomos (R.E.T.A). Obligaciones fiscales. El empresario que decida crear una tienda online debe realizar la declaracin censal, etiquetas y el IVA, as como darse de Alta en el IAE (Impuesto de Actividades Econmicas) La declaracin previa de inicio de actividad, se presenta conjuntamente con las declaraciones de etiquetas y opciones de IVA. Como empresario individual (autnomo) se debe pagar el Impuesto sobre la Renta de la Persona Fsicas (IRPF). Puede optarse por: Rgimen de estimacin directa (normal y simplificada). Rgimen de estimacin objetiva. Declaraciones fiscales. Hay que realizar las declaraciones de IVA trimestral y anual, y los pagos fraccionados trimestrales a cuenta del IRPF, dependiendo de la cantidad que se perciba por la actividad.

Obligaciones derivadas de la legislacin especfica del comercio electrnico en Espaa.

254

Servicios de la Sociedad de la Informacin y de Comercio Electrnico en Espaa (LSSICE). Desde que entr en vigor Los Servicios de la Sociedad de la Informacin y de Comercio Electrnico en Espaa (LSSICE) (Ley 34/2002, de 11 de julio, que entr en vigor en octubre del 2003) los propietarios de sitios web o tiendas virtuales debern cumplir con una serie de requisitos especficos. Esta ley slo obliga a los Prestadores de Servicios de la Sociedad de la Informacin. Por "prestador de servicios" se entiende a todos aqullos, tanto empresas como particulares, que realicen algn servicio por Internet a peticin del usuario, incluidos los servicios no remunerados pero que supongan carcter econmico para la empresa o particular que los ejerce. Esta ley es solo de aplicacin para Espaa. Lo determinante no es disponer de una pgina web, sino que con sta se obtenga algn beneficio econmico directa o indirectamente de los usuarios a travs de un servicio prestado. Son Prestadores de Servicios de la Sociedad de la Informacin, por ejemplo, las empresas que disponen de un website con un catalogo de productos (aunque no vendan por Internet) o incluso las webs personales que muestran banners publicitarios.

255

Se deber ofrecer en la website de forma permanente, fcil y gratuita, informacin general sobre la empresa y sobre los productos y servicios que se ofrecen y las condiciones de los mismos. Los datos obligatorios a publicar son los siguientes: Nombre o denominacin social (nombre y apellido en caso de empresario autnomo). Domicilio social de la empresa, direccin de la residencia en caso de profesionales. En su defecto la direccin de alguno de los establecimientos permanentes en Espaa. (Domicilio particular en caso de empresario autnomo). Direccin de correo electrnico. Nmero de Identificacin Fiscal. Los datos de inscripcin en el Registro Mercantil o profesional correspondiente segn se trate de una empresa o un profesional (los autnomos no titulados no deben realizar ningn registro). Si se trata de prestadores de servicios que realizan actividades necesitadas de autorizacin administrativa previa, deben informar de los datos relativos a dicha autorizacin y deben identificar al rgano administrativo de su supervisin. Si la actividad del prestador de servicios consiste en el ejercicio de una actividad de las denominadas regladas, deben incluir los datos del Colegio profesional, ttulo acadmico o profesional y Estado expedidor u homologador de esa titulacin, as como las normas profesionales aplicables al ejercicio de esa profesin y la forma en que puedan conocerse esas normas. Los cdigos de conducta a los que est adherido y la forma de consultarlos electrnicamente.

256

La LSSICE tambin establece: La prohibicin expresa de envo de correos electrnicos publicitarios no solicitados o expresamente consentidos. La obligacin de incluir, en la pgina Web, informacin genrica para facilitar el contacto de los usuarios y las administraciones pblicas con el prestador del servicio. El deber de facilitar al cliente, informacin referente al proceso de contratacin electrnica, en los instantes anterior y posterior a la celebracin del contrato. Proteccin de Datos de Carcter Personal. Ley Orgnica 15/1999, de 13 de Diciembre, de Proteccin de Datos de Carcter Personal (LOPD) establece que todas las empresas, profesionales y colectivos como ONG's, asociaciones, etc. que dispongan de ficheros conteniendo datos de carcter personal deben ser dados de alta ante la Agencia de Proteccin de Datos. Las obligaciones Legales de la Normativa de Proteccin de Datos son las siguientes: Inscripcin de los ficheros en el Registro General de la Proteccin de Datos. Redaccin del documento de seguridad. El responsable del fichero elaborar e implantar la normativa de seguridad mediante un documento de seguridad de obligado cumplimiento para el personal con acceso a los datos automatizados de carcter personal y a los sistemas de informacin. R.D 994/1999, de 11 de Junio. Auditora. Artculo 17 R.D. 994/1999, de 11 de Junio. Redaccin de clusulas de proteccin de datos. Artculo 5 de la LOPD. Otras medidas de seguridad de ndole tcnica y organizativas necesarias para garantizar la seguridad de los datos objeto de tratamiento. Artculos 9 y 10 LOPD y R.D 994/1999, de 11 de junio.

257

Redaccin de los contratos, formularios y clusulas necesarias para la recogida de datos, los tratamientos por terceros y las cesiones o comunicaciones de datos. Ley de Condiciones Generales de Contratacin. Esta ley distingue las condiciones generales de la contratacin de las clusulas abusivas. Las primeras son aquellas que han sido predispuestas e incorporadas, con ausencia de negociacin individual entre ambas partes, a una pluralidad de contratos. Por el contrario, son clusulas abusivas las que, en contra de las exigencias de la buena fe, causan en detrimento del consumidor un desequilibrio importante en los derechos y obligaciones contractuales. Las clusulas abusivas pueden tener o no el carcter de condiciones generales, pues pueden aparecer tambin en contratos celebrados entre particulares, es decir en contratos de adhesin. Asimismo, estas condiciones se han de redactar con transparencia, claridad, concrecin y sencillez, siendo nulas y no formarn parte del contrato aquellas que el consumidor no haya conocido antes de la firma, las ilegibles, las ambiguas, las oscuras y las incomprensibles. Los contratos y las condiciones generales han de ser inscritos en un Registro de Condiciones Generales de la Contratacin. Ley de Ordenacin del Comercio Minorista. Las ventas efectuadas a travs de la red mediante una tienda online, al ser llevadas a cabo sin la presencia fsica simultnea del comprador y del vendedor, son ventas a distancia, por lo que las relaciones entre las partes intervinientes en dichas ventas, se regirn por la Ley 7/1996 de Ordenacin del Comercio Minorista de fecha 15 de enero de 1996.

258

Los Artculos de la Ley ms destacados son los correspondientes al Ttulo III, Captulo II: Ventas a distancia. Artculo 43. Plazo de ejecucin y pago. De no indicarse en la oferta el plazo de ejecucin del pedido, ste deber cumplimentarse dentro de los treinta das siguientes al de su recepcin por el vendedor. Slo podr exigirse el pago antes de la entrega del producto cuando se trate de un pedido que se haya elaborado con algn elemento diferenciador para un cliente especfico y a solicitud del mismo. Artculo 44. Derecho de desistimiento. El comprador podr desistir libremente del contrato dentro del plazo de siete das contados desde la fecha de recepcin del producto. En el caso de que la adquisicin del producto se efectuase mediante un acuerdo de crdito, el desistimiento del contrato principal implicar la resolucin de aqul. El ejercicio del derecho o desistimiento no estar sujeto a formalidad alguna, bastando que se acredite, en cualquier forma admitida en Derecho. El derecho de desistimiento del comprador en operaciones realizadas a travs de una tienda virtual no puede implicar la imposicin de penalidad alguna, si bien, el comprador deber satisfacer los gastos directos de devolucin y, en su caso, indemnizar los desperfectos del objeto de la compra. Artculo 45. Excepciones al derecho de desistimiento. Lo dispuesto en el artculo anterior no ser de aplicacin a los siguientes supuestos: 1) A las transacciones de valores mobiliarios y otros productos cuyo precio est sujeto a fluctuaciones de un mercado no controlado por el proveedor.

259

2) A los contratos celebrados con intervencin de fedatario pblico. 3) Tampoco se extender el derecho de desistimiento, salvo pacto en contrario, a las ventas de objetos que puedan ser reproducidos o copiados con carcter inmediato, que se destinen a la higiene corporal o que, en razn de su naturaleza, no puedan ser devueltos. Artculo 46. Pago mediante tarjeta de crdito. Cuando el importe de una compra hubiese sido cargado utilizando el nmero de una tarjeta de crdito, sin que sta hubiese sido presentada directamente o identificada electrnicamente, su titular podr exigir la inmediata anulacin del cargo. En tal caso, las correspondientes anotaciones de adeudo y reabono en las cuentas del proveedor y del titular se efectuarn a la mayor brevedad. Sin embargo, si la compra hubiese sido efectivamente realizada por el titular de la tarjeta y, por lo tanto, hubiese exigido indebidamente la anulacin del correspondiente cargo, aqul quedar obligado frente al vendedor al resarcimiento de los daos y perjuicios ocasionados como consecuencia de dicha anulacin.

Como ves para crear una tienda virtual, se necesitan tener en cuenta algunos requisitos legales, por ello es preciso obtener asesoramiento (si no se conoce el tema), tanto de la puesta a disposicin de software de creacion de tiendas virtuales mas adecuado, como sobre el suministro de tpv para transacciones en tu tienda,

260

as como en la promocin de tu tienda online en google. Todo ello con el propsito de adecuar el negocio a la normativa de proteccin de datos. Cmo crear tu tienda online en 20 pasos. La idea es enumerar los pasos a seguir para crear una tienda online, cumpliendo con todos los requisitos legales y prcticos. Paso 1. Tener claro el tipo de productos que queremos comercializar (aunque despus vayamos aadiendo otros relacionados) y definir categoras y subcategoras. Aunque pueda parecer algo obvio, pensar en los productos a comercializar, no lo es. Es importante al principio tener una idea de lo que queremos vender. No se puede empezar a vender un producto determinado y un mes despus querer vender otro totalmente diferente en la misma pgina. Es necesario centrar el tipo de productos que vamos a comercializar, establecer una temtica. Despus podremos ir ampliando al ponernos en contacto con proveedores que ofrezcan otros productos relacionados y que nos sirvan para completar la pgina y puede que alguno de estos productos aadidos lleguen a dar mejor resultado. Se debe intentar apostar por productos originales y de calidad y que fuesen fcil de encontrar, pues es una manera de intentar diferenciarnos. Unido con los productos elegidos deberemos seleccionar las categoras y subcategoras. Esa eleccin que al principio parece poco importante realmente si lo es. Si no se le da la debida importancia que tiene desde un primer momento, llegar un punto en que los productos de la pgina no guarden orden ni coherencia, lo que supondr un trabajo adicional en redisear las categoras a la nueva realidad de productos. Nuestra recomendacin en este punto es ir definiendo las subcategoras a las que le asociemos los artculos. Y crear categoras que agrupen las distintas subcategora con las que contemos. Esas categoras deben ser fcilmente

261

modificables de tal forma que si dentro de una categora llega un momento que tenemos muchas subcategoras podamos dividirla en dos categoras distintas.

Es conveniente no crear demasiadas categoras, aunque tengamos muchos artculos distintos porque haramos que el cliente se perdiese fcilmente. Cntrate en las subcategoras. Paso 2. Elegir un dominio para crear la tienda online que est libre, que sea atractivo y que encaje con los artculos que vamos a vender. Elegir un dominio puede generar bastantes quebraderos de cabeza, ms que nada porque los que puedan resultar ms interesantes estn ocupados, ya sea por una empresa o simplemente reservados. Hay muchas web que te muestran si un dominio est disponible y con qu extensiones, como por ejemplo en redcoruna.com. Hay que probar muchas veces hasta que demos con uno que nos satisfaga y que est libre. Otra opcin es contactar con el propietario del dominio (sobre todo en el caso en que est reservado) e indicarle que ests interesado en comprarlo, aunque esta opcin suele resultar bastante cara.

262

Algunos consejos a la hora de elegir el dominio: Fundamental que sea fcil de recordar. Esto permitir la recomendacin boca a boca y ayudar para que una persona que ha visto algo que le interesaba vuelva a visitarlo. El nombre no debe ser largo. Cuanto ms largo ms difcil de recordar y ms incomodo para teclearlo. Es conveniente que incluya palabras clave. Podra ayudar a posicionar ms rpido y mejor la pgina. Para ver cules podran ser las palabras clave para incluir en el dominio una herramienta que puede ayudar bastante es la de palabras clave de Adwords (adwords.google.com ). Introduciendo una palabra clave nos indica el nmero de bsquedas aproximadas y la competencia que la misma tiene en adwords. Tambin te muestra otras similares con esa informacin. Recomendable que sea .com y reservar tambin el .es (redirigirlo al .com o crear una pgina de inicio que informe del .com). El dominio .com es el ms utilizado y el que ms se recuerda. Adems da ms sensacin de seriedad. Si en un futuro te quieres expandir internacionalmente el .com no te limita. No utilizar smbolos o separadores del tipo guiones, puntos, etc. Crea confusin y no se recuerda. Recomendable registrarlo al menos por dos aos ya que parece que google posiciona mejor los dominios con duracin superior al ao, entiende que son ms estables y que no van a desaparecer. Paso 3. Registrar el dominios. Una vez elegido el dominio registrado es fcil y econmico. Basta con ir a una de las mltiples web que ofrecen el servicio para registrar el dominio, elegir datos personales o de empresa y pagarlo. Lo ms cmodo es registrarlo con el mismo proveedor que vayas a utilizar para el hosting, algo que comentaremos en el siguiente paso.

263

Recomendamos registrar al menos el .com y el .es, en algunos casos al registrar estos dominios te regalan algn otro como el .eu o algn dominio .es. Como ya hemos dicho, es recomendable contratarlo por periodos de al menos 2 o 3 aos ya que parece que ayuda al posicionamiento al dar sensacin a google de continuidad. Adicionalmente a lo que vaya a ser nuestra pgina principal no est de ms contratar algn dominio que incluya las palabras clave de lo que sern nuestros productos estrella (ms rentables), si es que los conocemos ya, sino es mejor esperar y registrarlo ms adelante. Estos dominios adicionales podemos redirigirlos de manera automtica a la url de nuestra web principal o crear una pgina introductoria que haga referencia a los productos de la pgina principal. No est probado que ayude al posicionamiento pero existen pginas solo con un texto introductorio que estn posicionadas con las palabras que contiene la url. Otra opcin que trataremos en el paso 14 sobre el posicionamiento web es no crear subdominios sino ms bien que nuestras palabras claves aparezcan en la url. Una vez registrado si es en la misma empresa en la que hemos contratado el hosting simplemente hay que activarlo, si el alojamiento est en otro hosting o en otro lugar hay que configurarlo con la url a la cual redireccionar y la IP (mediante el servidor DNS). Hay que esperar un tiempo a que el dominio sea reconocido en todos los servidores de internet (entre 4 y 48 horas segn la extensin). Una vez registrado el dominio hay que establecer los procedimientos adecuados para renovarlo antes que caduque (ya sea con domiciliacin bancaria o con aviso desde el registrador a la cuenta de correo de uso habitual). Paso 4. Elegir el proveedor de hosting adecuado. Debemos seleccionar el proveedor de hosting donde alojar nuestra pgina web. El hosting no es ms que un lugar para la pgina web (alojamiento web). Ese proveedor de hosting nos proveer de la arquitectura tcnica necesaria para poder poner en funcionamiento nuestra pgina, entre otras cosas nos puede facilitar: espacio en disco, cuentas de correo,

264

herramienta de administracin de la plataforma, soporte en caso de incidencia, transferencia (subida y bajada de informacin) El hosting puede ser en rgimen compartido o dedicado: Compartido es cuando el mismo servidor es compartido con otros clientes del proveedor de hosting, es decir, en el servidor puede haber unas cuantas pginas web. En el caso de dedicado, t eres el nico que ests en el servidor, el dedicado a su vez puede ser virtual o fsico dedicado. En ambos casos debes tener conocimiento de administracin de los sistemas para instalar los componentes que necesites y mantenerlos. Debes definir qu recursos deseas contratar para la mquina; la memoria RAM suele ser el recurso ms crtico (hay que tener en cuenta el consumo del sistema operativo, servidor web, base de datos y de aplicacin); no recomendaramos contratar menos de 1Gb de memoria. Para empezar lo lgico es un servidor compartido para ahorrar costes. Evidentemente tiene bastantes limitaciones, entre otras una posible penalizacin en la velocidad de visualizacin de la pgina. Pero un servidor dedicado es mucho ms caro (el virtual dedicado est mnimo por los 400 /ao y el fsico 900 /ao). Cuando crezcamos y el negocio lo requiera en el mismo proveedor podremos migrar a un servidor dedicado, el cambio no debera ser complicado. Evidentemente tambin est la opcin de disponer t mismo del servidor donde alojar la pgina web. Opcin que no aconsejamos al principio por los problemas y dificultades aadidas que podran surgir (problemas de cada de lnea, copias de seguridad, conocimientos de administracin). A la hora de seleccionar el proveedor de hosting deberamos hacer un listado previo con lo que vamos a necesitar y empezar a ver ofertas y presupuestos. En ese listado no solo deberemos incluir especificaciones tcnicas sino tambin otras

265

cuestiones como: ~ Posibilidad de acceso desde el servidor a url externas. ~ Que suministre una consola de administracin sencilla. Por ejemplo, Cpanel. ~ Posibilidad de hacer uso de cache. Requiere que el servidor web del proveedor tenga habilitado el mdulo correspondiente. ~ Posibilidad de usar compresin(es decir, que el servidor web comprima los ficheros .html, .php, etc., no las imgenes, antes de ser enviados al navegador, para que el tiempo de carga sea menor). ~ Posibilidad de usar conexiones persistentes, es decir ms de una peticin por conexin. ~ Posibilidad de hacer uso de url amigables y as facilitar la inclusin de palabras claves en la url. ~ Asegurarnos que soporta el protocolo cURL sino queremos tener errores del tipo: Error de verificacin (protocolo cURL) cuando usemos Paypal. ~ Para no tener problemas en temas legales de proteccin de datos (LOPD) recomendamos que el proveedor sea espaol. Bien es cierto que hay algunos proveedores extranjeros que tienen un acuerdo para garantizar que no tendrs estos problemas. No olvidemos que si nuestro negocio est en Espaa, nos posicionaremos ms rpido si usamos un hosting con IP en Espaa. Otra razn ms para elegir un proveedor espaol (aunque el coste sea ms alto al final compensa). ~ Y por ltimo y no menos importante la atencin al cliente. Todo ese tipo de cuestiones es bueno contactar con el proveedor y analizarlo bien para evitar cambios de proveedor en el futuro. Paso 5. Contactar con los posibles proveedores de artculos para la web. Para poder comercializar los productos seleccionados en el paso 1 debemos contactar y negociar con los proveedores que nos lo puedan suministrar. Si contsemos con un negocio tradicional este paso estara hecho aunque seguramente habra que revisar condiciones y adaptarlo a la venta online.

266

Cmo poder encontrar proveedores interesantes? Una buena opcin es mediante contactos y conocidos, y otra es buscar por internet. En la medida de lo posible lo mejor es comprar lo ms al principio de la cadena de suministro ya que los precios son mejores, aunque normalmente es ms difcil que te puedan realizar envos directos al cliente o simplemente que te atiendan. Podemos trabajar con los proveedores con dos modelos de negocio muy distintos: ~ Que los artculos lo almacenemos nosotros en nuestras instalaciones. ~ Que el producto est en los almacenes del proveedor desde donde el envo fuese directo al cliente. Tambin es posible contar con un modelo mixto, para el mismo proveedor que segn el artculo que el stock lo tenga el proveedor o nosotros. Cada uno de los modelos tiene sus ventajas e inconvenientes. En el caso en el que no tengamos el stock est la gran ventaja que reducimos los gastos de almacenamiento y logsticos, pero existe el inconveniente que no controlamos la disponibilidad en tiempo real ni el proceso de envo. Nuestra recomendacin sera que los productos voluminosos o de mucho peso intentar que el stock lo tenga el proveedor. Productos pequeos o de poco peso es ms conveniente almacenarlos nosotros, en algunos casos es la nica manera de poder comercializarlos ya que suelen venir en cada caja de envo varias unidades. De cara a contactar con los proveedores es conveniente tratar al menos los siguientes asuntos: Listado de precios. Estimacin de costes de envo. Ambos fundamentales para poder marcar el precio de venta objetivo y para poder analizar si es rentable o no los productos que nos puede facilitar el proveedor.

267

Condiciones de envo. Gestionan ellos el envo con su propia agencia de transportes o si debemos enviar a nuestra agencia a recoger la mercanca?. Condiciones de pago: Normalmente y sobre todo al principio los proveedores solicitarn el pago por adelantado. Garanta de los productos. Como gestionar las posibles devoluciones. Por ley cualquier persona que compre por internet tiene derecho a devolver el producto en un plazo mximo de 8 das desde que lo recibi. Informacin de disponibilidad del producto los ms online posible (para el caso en el que el stock lo tenga el proveedor). Es muy importante la agilidad en la gestin de los pedidos y mantener una buena relacin con los proveedores. Marcar unos procedimientos claros de cara a posibles pedidos de envo directo. Esa buena relacin con los proveedores es fundamental. Ayuda a facilitar los trmites de envos. No descartar nunca proveedores extranjeros. Muchas veces con estos proveedores puedes incluir en tu pgina productos que son difciles de encontrar en otros comercios y que por tanto te diferencien. Evidentemente es ms difcil ya que tienes que gestionar el proceso de importacin, pero puede ser muy rentable. La bsqueda de proveedores no es algo que acabe al crear la tienda online, ni mucho menos. Una vez que va avanzando y consolidndose el negocio es conveniente seguir buscando para complementar la oferta de productos en la pgina. Paso 6. Realizar un pequeo anlisis de la viabilidad del negocio. Para cualquier negocio es necesario analizar previamente la viabilidad del mismo. Este anlisis inicial es muy importante en negocios tradicionales donde la inversin inicial es alta.

268

En el caso de comercio electrnico no creemos que sea necesario dedicarle mucho tiempo a ese estudio de viabilidad inicial, realmente la viabilidad del mismo lo vamos a ir viendo durante los primeros meses una vez que est en marcha la tienda online. Nosotros apostamos por un estudio de viabilidad continuo. Los componentes de un estudio de viabilidad en un negocio online seran principalmente: ~ ~ ~ ~ ~ ~ Recopilar las tarifas de los proveedores. Estimar los gastos de envo. Estimar costes estructurales y operativos. Precios de venta objetivos. Establecer objetivo de ventas por producto. Liquidez y tesorera disponible.

Con estos componentes podremos saber si el negocio inicialmente parece viable o no. Pero no ser hasta que lo pongamos en prctica cuando realmente veamos si salen los nmeros o no, si vendemos al precio que hemos marcado como objetivo y si el volumen de ventas es el adecuado para cubrir el resto de costes. Al final la clave est en el precio de venta, tenemos que establecer un tanto por cierto de margen bruto sobre la tarifa que nos enva los proveedores, y hay que ver si ese precio es competitivo en el mercado de internet. Ese porcentaje no tiene que ser siempre el mismo, depender del importe del artculo y si el envo queda incluido o no. Aunque no suele ser un componente importante en el negocio online al principio, hay que vigilar la liquidez. Debemos de disponer de suficiente liquidez para adquirir los productos que vamos a tener en stock ya que al principio todo lo que compremos lo vamos a tener que pagar por anticipado, los proveedores no

269

nos conocen ni tienen confianza con nosotros para aceptar otra forma de pago inicialmente. Nuestro consejo sera no lanzarse a adquirir muchos productos que nos pueden dejar sin liquidez y nos pueden aumentar los costes de almacenamiento, creemos que es mejor empezar con un escenario ms conservador (poco almacenamiento y sin personal), que minimice los riesgos, inversin y nos ayude a ir estudiando la viabilidad. Ya habr tiempo. Debemos tener en cuenta varios factores al ir analizando la viabilidad durante los primeros meses (y aos) de vida de la tienda online: Conforme van pasando los meses las ventas deben ir aumentando ya que estaremos mejor posicionados en google y en otras pginas. Punto muy importante y que tendremos que analizar si podremos cubrirlo al crear la tienda online o si merece la pena contar con ayuda externa (no se puede abarcar todo). Al principio normalmente se cuentan con menos costes de estructura y operativos que cuando vas adquiriendo volumen. Surgen economas de escala conforme vas creciendo. Cuanto ms negocio mueves, muchos costes de estructura se van diluyendo (por ejemplo, los costes de asesora contable si cuentas con ella, son los mismos prcticamente vendas ms o menos). Conforme vas creciendo y aumentas las ventas consigues mejores condiciones de los proveedores, mejores precios y te prestan ms atencin. En internet hay muchas pginas que te proponen distintas herramientas para analizar la viabilidad de un negocio. Nosotros apostamos por un estudio sencillo en una simple hoja de clculo: gastos previstos e ingresos estimados para el ao en cuestin. Conforme van pasando los meses hemos ido revisando esos nmeros y estimando de nuevo. Hay productos y proveedores que hemos potenciado y otros que hemos desestimado porque con el margen objetivo que nos marcamos no conseguamos vender aunque tuviesen visibilidad. Insistimos: estudio continuo de viabilidad del negocio online.

270

Paso 7. Elegir el software de comercio electrnico que se va a utilizar. Una vez que tenemos claro el tipo de producto que queremos comercializar, su viabilidad y hemos registrado nuestro dominio, as como tenemos identificado nuestro proveedor de hosting para alojar nuestra plataforma de comercio electrnico, debemos tomar la decisin del software de comercio electrnico que vamos a usar.

Existen plataformas de software libre que estn funcionando muy bien y que no tienen nada que envidiarle al software privativo. La ventaja principal de usar una solucin basada en software libre es que contamos con el cdigo fuente para realizar ciertas modificaciones que, como veremos en el paso 14, nos ayuden a la optimizacin onpage, as como poder contar con una comunidad que esta evolucionando el producto continuamente y adaptndolo a las nuevas tendencias. Basta con hacer una bsqueda en google del tipo plataforma ecommerce software libre para conocer las diferentes soluciones que existen. A lo largo de este curso hemos recomendado PrestaShop por las siguientes razones: ~ Esta apoyada por una fuerte comunidad que mantiene el proyecto vivo. ~ Existen varios foros que funcionan muy bien, donde puedes realizar cualquier tipo de consulta que te respondern muy rpidamente. ~ Es muy fcil de instalar. ~ Facilita mucho el poder hacer cambios sobre el cdigo si tienes conocimiento en lenguaje PHP, aunque esto ltimo realmente no es necesario para poner en marcha una tienda en poco tiempo. ~ Existen mdulos de todo tipo, as como plantillas para el diseo de pgina con precios aceptables, aunque tambin los podemos encontrar sin coste.

271

~ En relacin al pago telemtico, PrestaShop cuenta con mdulos especficos como pasarela de pago. Aunque este punto lo veremos ms adelante en el paso 17. ~ PrestaShop trae una plantilla por defecto poco atractiva, pero existen sitios donde puede descargar plantillas, tanto sin coste, como otras de pago con diseos interesantes. Una vez decidido el software tendremos que determinar si lo instalamos nosotros en el proveedor de hosting seleccionado o bien buscamos un proveedor de hosting que tenga la plataforma instalada como un servicio mas a contratar y no tendremos que realizar instalacin alguna, tan solo su configuracin y administracin. Esta decisin esta condicionada por el tipo de perfil que tengamos y la posibilidad de contar con la ayuda de terceros. La ventaja principal de hacer nosotros la instalacin es que tendremos control total sobre la plataforma y el cdigo fuente. En el otro caso, posiblemente estaremos ms limitados. En resumen, el tema tecnolgico no debe ser una barrera en nuestro proyecto para crear una tienda online. Existen personas con grandes ideas, con perfiles no tcnicos, que ven mucha complejidad el hacer funcionar una plataforma de este tipo, integrndola con el sistema de pago y agencias de transporte. Nuestra recomendacin es que arranques tu proyecto con un socio tecnolgico o bien busca ayuda en terceros, pero no olvides que poner en marcha una plataforma de este tipo en un entorno productivo (sin incluir el catalogo de productos obviamente) no debera llevar ms de una jornada de trabajo de un perfil tcnico. Paso 8. Optimizacin y seguridad de nuestra solucin PrestaShop. En este momento ya hemos decidido crear la tienda online con la solucin PrestaShop, que cubre con nuestras necesidades y partimos del escenario en el que ya tenemos una instalacin bsica en el proveedor de hosting que hayamos decidido. Una vez instalado y configurado nuestro PrestaShop deberamos considerar qu aspectos de configuracin puedo realizar para mejorar el rendimiento y optimizacin de nuestra tienda, ya que aunque pensemos que inicialmente

272

tendremos pocas visitas, debemos estar preparado para recibir miles de visitas y que nuestra tienda no presente problemas. Ahora si, necesitaremos la ayuda de un perfil tcnico para estos pequeos ajustes. Para optimizar la solucin PrestaShop hemos visto interesante realizar las siguientes acciones: ~ En el fichero config/config.inc.php debemos desactivar el display de errores y tambin el debug de consultas a base de datos. ~ En el fichero config/smarty.config.inc.php debemos desactivar tanto la verificacin como la compilacin en tiempo de ejecucin, as como los aspectos de debug. ~ Consultar con el proveedor de hosting si el motor de base de datos mysql tiene activada la cache, que es recomendable en estos casos para un mejor rendimiento. ~ El uso de subdominios para el contenido esttico tambin es recomendable. Tambin es necesario indicar el subdominio en el fichero config/defines.inc.php y crear las entradas RewriteRule. ~ Evitar el uso de cookies con en la configuracin con uset Set-Cookie en el fichero .htaccess. Existen otras tcnicas que ayudan a mejorar el rendimiento de nuestra tienda, como es el uso de Spriting CSS. Si se tiene posibilidad es recomendable usar el sistema de cache eAccelerator, aunque al requerir que sea instalado en el servidor, en el caso de hosting compartido no ser posible.

273

Si tenemos activados los mdulos de estadstica, PrestaShop guardar demasiada informacin en base de datos. Es bueno vigilar las tablas relacionadas con los accesos y estadsticas para ir limpiado a medida que crecen demasiado. En temas de seguridad para PrestaShop podemos hacer las siguientes recomendaciones: ~ Renombrar la carpeta /admin. ~ Aunque la consola de administracin esta protegida con usuario y contrasea (que se almacena en base de datos), tambin es bueno protegerlo con un sistema de autenticacin manejada por el servidor web (y almacenada en el sistema de ficheros). ~ No olvidar tras la instalacin borrar directorios y ficheros del tipo: install, docs, readme_fr.txt, readme_en.txt y readme_es.txt. ~ Controlamos el acceso a ciertos ficheros, como los .tpl haciendo uso de las posibilidades del fichero .htaccess. ~ Consultar tambin con el proveedor de hosting que las herramientas pblicas se puedan restringir por IPs, por ejemplo el acceso al cpanel, ftp, mysqladmin, webmail. ~ Eliminar cualquier referencia en la interfaz en relacin a by Prestashop, para evitar que determinadas bsquedas maliciosas nos encuentren. Paso 9. Crear la empresa. Dar de alta la sociedad (se puede hacer antes pero creemos interesante atrasarlo con el fin de acercarlo en el tiempo a cuando realmente va a comenzar a operar). Un punto fundamental y de los que pueden resultar ms complejos administrativamente es el alta de la empresa con la que vamos a operar. Este alta se podra hacer con anterioridad a los pasos anteriores, pero nuestra recomendacin es acercarlo en el tiempo lo mximo posible al inicio de la actividad para ahorrar costes.

274

Pasamos a comentar cada una de estas opciones. Como autnomo: Podemos vender por internet nicamente dndonos de alta como autnomo. La ventaja de hacerlo as es que nos ahorramos unos cuantos trmites; la desventaja es que ni tiene entidad independiente a la personal y de cara al exterior no da buena imagen operar con tu nombre personal. Sociedad sin entidad jurdica: Por ejemplo una sociedad civil. Respecto al autnomo tiene la ventaja que la empresa lleva un nombre propio y da ms seriedad. Los trmites administrativos que tiene para darla de alta y de cara a la gestin son sencillos (no es necesario realizar declaracin de IVA y la contabilidad se reduce a un resumen de gastos e ingresos). Pero carece de entidad jurdica propia, es decir, se sigue respondiendo con sus bienes personales. Sociedad limitada: Tiene entidad jurdica propia, la sociedad limitada responde nicamente con los bienes de la empresa, no con los particulares. El alta y gestin es ms compleja. Inicialmente nuestra recomendacin sera comenzar con una sociedad civil, por la sencillez y por mostrar cierta entidad. Pero si se tiene pensado apostar por el futuro de la tienda, recomendaramos que desde el principio se crease una sociedad limitada. A continuacin hablaremos de los pasos a seguir para ambas opciones y que cada uno elija la que considere ms conveniente. Una cuestin a tener clara: alguien tiene que estar dado de alta de autnomo para crear una sociedad. Cualquiera de los tipos de sociedad exige que el administrador este dado de alta de autnomo y pagar la cuota mnima de seguridad social 253 en 2012). Una opcin inicial es buscarse alguien de confianza que ya est dado de alta como autnomo y nombrarle administrador, de esa forma os ahorrarais esos gastos que al principio son excesivos.

275

No es necesario en principio que se de de alta como autnomo si ingresa poco ya que no es su trabajo habitual. En el momento en los que ingresos vayan acercndose al salario mnimo, tendra que darse de alta de autnomo (pudiendo desgravarse el 50 % de la cuota si es que sigue a su vez trabajando por cuenta ajena), como ya comentamos en el punto anterior. Pasos para dar de alta la sociedad civil. ~ Redactar unas escrituras de constitucin de la sociedad, se firman a ttulo particular. ~ Establecer domicilio social y fiscal. ~ Al menos una persona de la sociedad civil debe estar dado de alta como autnomo. Esa persona debe tener mayora en la sociedad y se supone que es la que realizar la actividad. ~ Registrar en hacienda la sociedad, solicitar CIF y alta de la sociedad correspondiente. Todo se puede realizar a travs del modelo 036. ~ El alta se realizara en rgimen especial con recargo de equivalencia. Quiere decir que todas las adquisiciones de artculos para la venta posterior tienen que venir grabadas con el % de recargo. En el 2012 sera 18 % + 4 % de recargo (hay que solicitrselo al proveedor si es nacional o declararlo posteriormente en hacienda si es de importacin). Esto nos liberar de tener que declarar IVA en la venta posterior. Econmicamente este sistema sale a cuenta si el margen de ganancias sobre un producto es superior al 22%. A partir de ah ya podramos operar con la sociedad. No es necesario llevar una contabilidad oficial. Basta con llevar cmputo de gastos e ingresos. No hay que declarar trimestralmente el IVA. Personas con conocimientos bsicos de gestin de empresas podran gestionar administrativamente la empresa, no es necesario contar con una asesora (aunque si recomendable). Pasos para crear una sociedad limitada. Decidir el tipo de sociedad a crear. Os recomendamos crear una Sociedad Limitada por el procedimiento denominado exprs simplificado (ver BOE 3 Diciembre 2010 Num. 293 pgina 12 artculo 5). Mediante este procedimiento el alta es relativamente rpido y sobre todo con un coste mnimo. Actualmente el costo sera de solo 100 si la empresa se crea por menos de 3.100 . El resto de

276

los puntos a continuacin se basa en este tipo de sociedad. Otra opcin sera, por ejemplo, crear una sociedad limitada nueva empresa, pero aporta ya poco adicional a esta forma de crear la limitada. Pedir certificado al registro mercantil que indique que el nombre que le queremos poner a la sociedad est libre. Esto se puede realizar completamente en internet en la pgina del registro mercantil (www.rmc.es). Os recomendamos primero realizar la consulta que es inmediata y con un coste mnimo en el apartado Denominaciones sociales/Consultas. Una vez que tengamos un nombre que parece que est disponible realizar la solicitud formal con distintas combinaciones en el apartado Solicitud de certificados (coste 18 en 2012). Lo envan con firma electrnica por e-mail.

Preparar nombre, DNI, domicilio y porcentajes de participacin que va a tener cada uno de los socios. Y quien va a componer el organo de administracin; las personas que lo compongan tendrn que estar dados de alta como autnomo. Establecer el domicilio social de la empresa. Aportar cada uno de los socios el importe del capital social que le corresponde en la cuenta bancaria que se vaya a utilizar para la sociedad. Solicitar el certificado de desembolso de capital al banco (necesario para la firma ante notario).

277

Firmar ante notario la constitucin de la sociedad (con los estatutos modelo segn el BOE). Deben estar presentes todos los socios. El notario y registrador lo realizarn de manera telemtica y en menos de 48 horas segn el procedimiento expres. El notario solicitar el CIF mediante el modelo 036 (se puede solicitar un CIF provisional si hiciera falta anteriormente para los puntos anteriores). Solicitar la firma electrnica para la empresa, necesaria para declarar el IVA trimestral y resto de gestiones. Para ello se deber solicitar la nota simple de los asientos registrales en el registro (depende la delegacin de Hacienda puede servir con el documento que se solicita por internet en la pgina del registro) y posteriormente el administrador tendr que ir a Hacienda para solicitar la firma. Paso 10. Incluir en la pgina las condiciones de uso. Seguro que todos estamos familiarizados con la tpica coletilla Haz clic aqu para aceptar las condiciones de uso o Debe aceptar las condiciones de uso, que al final aceptamos para poder pasar a la siguiente pgina y poder completar el pedido. Esa aceptacin significa aceptar unas reglas de juego para el cliente que compra. En nuestra tienda debemos tener en un lugar accesible las condiciones de uso para operar en la tienda. Esas condiciones deben ser completas y bien escritas, tanto para que el cliente conozca bien cmo operar y a qu atenerse, como para nosotros mismos que nos sirva como gua de actuacin y reglas establecidas. Nos servir como un manual de procedimientos. Las condiciones de uso deben estar muy claras y completas. Debe cumplir tanto un papel preventivo como correctivo en caso de problemas. El cliente puede consultarlas previo a la compra y las debe aceptar al comprar. Pocos clientes las leen realmente en este momento, pero ah estn y las aceptan. De tal forma que si surge algn problema les podremos remitir a ellas, en ese momento s que las leern.

278

Un ejemplo claro es el caso en el que el cliente quiere devolver un producto que ha recibido, tiene derecho a devolverlo por ley en los siguientes 7 das hbiles. Le remitimos a las condiciones de uso donde indica el procedimiento a seguir.

Os aconsejamos que todas las condiciones de uso aparezcan en una sola pgina. Queda demasiado largo, pero es la nica forma para que sea el nico documento de referencia y el que se va a aceptar al realizar la compra. Esas condiciones de uso consideramos conveniente que incluya al menos los siguientes apartados: ~ Informacin general de la empresa y de la web. ~ Los contenidos que aparecen en la web. Establecer la propiedad de los mismos. ~ Informacin sobre los productos que aparecen. ~ Precio: Qu incluye y qu no. ~ Sobre el stock disponible. ~ Pago. Cmo se realiza. ~ Informacin sobre la seguridad de la pgina. ~ Cmo se realiza el pedido y cmo se puede cancelar un pedido. ~ Plazos y lugar de entrega. ~ Condiciones para la devolucin. ~ Garantas de los productos. ~ Limitarnos lo mximo posible de responsabilidades. ~ Poltica de privacidad de datos. ~ Posibilidad de modificar las condiciones de uso. ~ Ley aplicable. Adicionalmente es conveniente tener algunas condiciones especficas importantes y que al cliente le puede interesar antes de comprar en una pgina aparte, de tal

279

forma que el usuario pueda acceder a ellas ms fcilmente sin tener que buscar entres muchas lneas. Por ejemplo nosotros lo hemos hecho con las condiciones de envo, lo tenemos adems de en las condiciones de uso en una pgina desde la que se puede acceder desde cualquier pgina de la web. Esto a los clientes les interesa. Paso 11. Cumplir la LOPD y la LSSICE. Para vender mediante una tienda online en Espaa tenemos que cumplir las leyes LSSICE (Ley de Servicios de la Sociedad de la Informacin y de Comercio Electrnico) y la LOPD (Ley Orgnica de Proteccin de Datos). En caso de no cumplimiento, puede uno exponerse a importantes multas si alguien denuncia. En este punto tienes dos opciones, solicitar a una empresa que te asesore y te realice los trmites para cumplirlas o aventurarte t mismo y realizar la acciones que son necesarias. Para cumplir LSSICE debe informarse en la web de la tienda online de las siguientes cuestiones: ~ ~ ~ ~ Denominacin social, NIF, domicilio, telfono o e-mail. Los datos de inscripcin en el registro. Condiciones de uso de la web. Precios de los productos o servicios que se venden en la web. Informndose de los impuestos y los gastos de envo.

Para cumplir LOPD las obligaciones se dividen en 3 apartados: Notificacin, Obtencin del consentimiento y Proteccin de los datos. Notificacin: Notificar a la Agencia Espaola de Proteccin de Datos (AGDP) de aquellos ficheros de los que somos propietarios (y cualquier variacin de los mismos). Obtencin del consentimiento: Para obtener y almacenar los datos de terceros debemos de contar son su consentimiento, no pudiendo hacer nunca uso fraudulento de ellos.

280

Proteccin de los datos: Los ficheros con esos datos deben estar protegidos fsica y tecnolgicamente. La informacin solo puede ser accesible por personas autorizadas. Para garantizar la seguridad debemos alojar la web en un hosting que permita mantener dicha seguridad, para ello el hosting debe ser de una empresa europea o de una norteamericana incluida en el listado Safe Harbour. Nuestra recomendacin es utilizar un hosting espaol para quitarnos problemas y por lo que ya comentamos respecto al posicionamiento en las bsquedas desde Espaa. Paso 12. Dar de alta los productos en la web. Una vez que ya tenemos la plataforma tecnolgica, los proveedores y los productos seleccionados podemos empezar a darlos de alta en la web. Este es un trabajo que al principio parece que se puede tardar poco tiempo, pero en realidad es lo que ms tiempo consume. Primero se tiene que comprender para qu sirve cada campo en el formulario para dar de alta el producto. A parte del nombre, descripcin, importe e imagen. hay que informar ms campos como palabras claves, url, descripcin para los buscadores, etc. Una vez entendidos los campos deben darse de alta los productos. Una manera de darlos de alta es con la denominacin que indica el proveedor, y con una descripcin resumida. Sin embargo, hay otros procedimientos ms prcticos para dar de alta los productos. Nombre del producto: Informarnos de un nombre del producto ms genrico que el nombre propio que suministra el proveedor. Ese nombre de producto los buscamos en la herramienta de palabras claves de Google AdWords de tal manera que nos

281

aseguremos de que tiene suficientes bsquedas exactas. De esta manera aseguras tu posicin con palabras que el pblico busca en Google. Url: En la url final del producto indicaremos el nombre que hemos elegido para el producto. Es muy importante tener configurado en nuestra plataforma ecommerce la opcin de URL amigable. Como dijimos, en PrestaShop se configura en el men Preferencias. Este campo se suele autocompletar con el nombre del producto y no tenemos que hacer nada. Es recomendable hacer las primeras altas uno mismo para entender complejidad, donde mejorar y establecer una metodologa. Una vez definido el procedimiento es conveniente contar con ayuda externa, es un trabajo que requiere mucho tiempo. Paso 13. Poner precios a los productos. Poner precios a los artculos en cualquier herramienta de comercio electrnico (en nuestro caso Prestashop) es bastante sencillo. Lo complicado es acertar con el precio adecuado. No nos tenemos que pasar de caro ni de barato. No tiene sentido que no vendamos casi nada por tener un precio muy alto ni que vendamos mucho perdiendo dinero. En el punto medio est la virtud. A la hora de establecer los precios tenemos que tener en cuenta los siguientes aspectos: ~ ~ ~ ~ ~ Lo que nos cuesta el artculo a nosotros. El coste de almacenaje de ese producto. Los costes de envo. Costes de manipulacin. Otros costes indirectos que al final deben ser repercutidos a los productos para que la empresa gane dinero. Por ejemplo costes de gestin de un pedido, comisiones por pago, publicidad o costes de estructura. ~ El precio al que lo vende la competencia. ~ Si el proveedor te obliga o te recomienda un precio de venta. Por desgracia en el negocio online lo que ms nos va a marcar es el precio al que lo vende la competencia, sobre todo si es un producto fcil de encontrar en otras

282

pginas. Los clientes tiene multitud de maneras de comparar los precios (mediante pginas comparadoras de precio, buscadores, grandes portales como Amazon, etc.). Existe una herramienta que de un vistazo te permite ver a qu precio lo venden otros y si hay muchas web que lo venden. Esa herramienta es Google Shopping. Nuestra recomendacin inicial es tener un precio parecido a los ms baratos. Nunca por debajo, porque si no se puede convertir todo en una guerra continua de precios en la que nadie gane. No nos obsesionemos con tener el precio ms barato, pues tambin se tiende a valorar otras cosas como estar bien posicionado, el servicio y confianza de la web, atencin al cliente, etc. Si los precios que encontramos no nos permiten obtener margen suficiente, mejor establecer un precio con el que ganemos, venderemos menos pero ganaremos en cada venta. Seguramente esas empresas que lo tienen tan barato tambin lo comprar ms barato porque manejan volumen. En la medida de lo posible es recomendable no centrarse en productos que se pueden encontrar en cualquier gran superficie o gran tienda online. Otro asunto a tener muy en cuenta son los descuentos o cupones. El objetivo que deben perseguir es convencer al cliente que el producto tiene un buen precio en nuestra web y poder vender ms unidades. Estos descuentos son tiles en periodos de rebajas, cuando se est acabando la temporada fuerte para ese producto o simplemente porque tengamos mucho stock y tenemos que sacarlo. Los cupones son otra manera de conseguir volumen de venta y de visitas. Han estado muy de moda, pero poco a poco el pblico se empieza a cansar de ellos, muchas empresas suben los precios para despus ofrecer cupones. Cuanto ms volumen de venta tengamos ms podremos ajustar los precios ya que compraremos ms barato y los costes fijos de estructura se podrn repartir entre

283

ms productos vendidos. Ah es donde est la clave de la venta en internet, en el volumen. Cuanto ms vendas, ms posibilidades de xito tiene la web. Paso 14. Tendencias en el posicionamiento. SEO y SMO para una tienda online. Se ha escrito tanto de posicionamiento web que no resulta fcil abordar el tema. Lo primero que ha de hacerse es realizar una correcta optimizacin interna de la web, siguiendo por un lado las recomendaciones de Google en su gua para principiantes sobre optimizacin para motores de bsqueda de Google. No debera ser costoso y tampoco es necesario cumplir todo al 100%. Una vez tengas tu tienda optimizada, tienes que determinar cules son las palabras claves de tu negocio. Para realizar este trabajo recomendamos la lectura del artculo que publico ecommerce-news titulado Dime qu vendes y te dir qu palabras clave debes usar para poSEOcionar tu tienda online. http://www.ecommercenews.es/index.php?option=com_content&view=article&id=1011:dime-que-vendesy-te-dire-que-palabras-clave-debes-usar-para-poseocionar-tu-tiendaonline&catid=51:marketing-online&Itemid=110 Con el listado de palabras claves identificadas, que en el caso de una tienda, suelen ser palabras asociadas a diferentes productos o categoras, debemos usar ese conjunto de palabras para los artculos que vamos dando de alta en nuestra tienda. Por ltimo, muchos expertos en SEO consideran vital para el posicionamiento los enlaces externos (en otras webs) que apunten a tu web (los conocidos backlinks, venta de backlinks, linkbait, linkwheel, landing pages, etc.) y amplificar los enlaces con diferentes tcnicas. Puedes crear enlaces mediante ciertas tcnicas para su amplificacin a travs de herramientas de marcadores sociales, como puede ser socialmarker y creacin de RSS con la herramienta freerssfeedgenerators y su publicacin en directorios RSS con la herramienta fastrsssubmitter.

284

Si se quieren crear enlaces externos, lo mejor es buscar aquellos blogs y/o foros que tengan una temtica similar, realizar aportaciones y crear tu enlace con variedad en el anchor text. Quedara pendiente seguir trabajando el posicionamiento a travs de los medios sociales, la creacin de un canal youtube, la creacin de un blog, fomentar el uso de opiniones y comentarios, usar Google Places para el posicionamiento local y la integracin de nuestros productos con plataformas como Google Merchant Center. Por ltimo debemos hacer hincapi en trabajar el anlisis y monitorizacin continua de nuestra web, el trabajo del posicionamiento es de por vida y es fundamental determinar la salud de nuestra tienda a los ojos de Google en todo momento. Como ya hemos dicho, dedica tus esfuerzos en lo que realmente sabes hacer y busca ayuda para estos temas usando las herramientas de informe para validar el trabajo que te realicen. Paso 15. Estrategia Social Media. Alta de la pgina en Facebook y otras redes sociales. Hacer que tu tienda online forme parte de las redes sociales, no significa crear una cuenta en facebook y esperar que nos visiten. Antes de crear una comunidad virtual un experto en redes sociales, te dira que debes dar respuestas a muchas preguntas para que tenga xito. Un Community Manager nos dira que los principales objetivos para crear una comunidad virtual deberan ser: ~ Crear marca. ~ Buscar ser un referente en el mercado. ~ Ayudar al cliente en la decisin de compra.

285

~ ~ ~ ~ ~

Fidelizar consumidores. Conocer al cliente con mayor profundidad. Testear nuevos productos y/o servicios. Realizar ofertas y promociones. Poder conocer el mercado: la competencia y alianzas.

En una importante organizacin la estrategia social debera estar correctamente organizada con diferentes perfiles: el social media manager (el que define la estrategia), el community manager (el que implementa la estratega) y el content manager (el que crear los contenidos). Aunque no se vaya a ser una gran organizacin, es necesario dedicar un tiempo a pensar la estrategia en medios sociales antes de comenzar a darse de alta de manera indiscriminada en redes y marcadores sociales. Se debe reflexionar acerca de las siguientes cuestiones: Pensar en nuestra audiencia a la hora de publicar comentarios y contenidos: edad, intereses, zona, palabras claves, pginas visitadas y de salida, tipos de usuarios, etc. Definir que contenido e ideas podemos comentar. En este punto recomendamos definir una tabla (algo similar a lo que se conoce como pirmide de relevancia, aunque menos ambicioso) donde podamos indicar nuestras ideas de contenido a publicar, con la temporalidad relacionada, palabras claves relacionadas con el negocio, si aplicase, y dependiendo el tipo de negocio habr que tener en cuenta la edad y perfil del tipo de audiencia de nuestro negocio. Decidir los canales de difusin que vamos a usar. Nuestra recomendacin: incluir facebook, twitter, youtube y pinterest. Ms adelante incluira google+ y linkedin. Determinar como vamos a realizar las mediciones y uso de herramientas (por ejemplo en facebook revisando nuevos seguidores reales y sus comentarios), a travs de Google Analytics (ahora existen paneles social media) y Google Alerts. Existen otras tantas herramientas especializadas (socialmention.com, addictomatic, search de twitter.com, likester, placebook, etc) en social media. Decidir si se puede crear un blog en la misma tienda online con un estilo propio intentado ser un referente donde intentemos distinguirnos.

286

Determinar a nivel tcnico como vamos a integrar la tienda con las redes sociales y quien nos puede ayudar. Normalmente el inters de los seguidores vara segn el tipo de red social y es importante conocerles y darles lo que esperan para as mejorar el nivel de involucramiento (ms conocido como la Pirmide de Engagement). Es algo a tener en cuenta a la hora de definir que contenidos vamos a publicar en cada red social. Por ejemplo, facebook es ms dada a que el seguidor espere promociones, descuentos, eventos, noticias de inters y/o anuncio de futuros productos y servicios. En twitter se puede usar el mismo enfoque que facebook, pero quizs con un toque ms serio y ms breve. En una red social debemos transmitir sinceridad y claridad, servilismo, humildad, en resumen, parecer personas muy normales y cercanas. Intenta usar emoticonos en tus comentarios para transmitir mayor complicidad. Paso 16. Seleccionar una empresa logstica para la tienda online: transporte y almacn. Dar con una empresa logstica que te d el servicio adecuado es fundamental de cara a la imagen de tu tienda online con el cliente, al fin y al cabo la persona que le entrega el producto va a ser la nica con la que va a tener contacto fsico. Hay muchas empresas que dan servicio de transporte, mensajera y almacenaje, pero ni mucho menos el servicio, el coste y la flexibilidad que ofrecen es la misma. Los factores a tener en cuenta al elegir una empresa de transportes para una tienda online son:

287

Fiabilidad: A nivel general que sea una empresa de transporte que te ofrezca garantas de entrega y seriedad. Tarifa del envo: Fundamental que nos ofrezca un precio competitivo. Los costes de transporte son una losa en el comercio electrnico ya que es complicado repercutirlos al cliente. Eso s, buen precio pero manteniendo siempre un servicio adecuado, de nada sirve precios de envo bajos si no se cumplen los plazos o la mercanca no llega en condiciones adecuadas. Normalmente las tarifas las establecen en funcin de la zona geogrfica de destino, si es la misma provincia, la misma comunidad o si es una regin cercana o lejana. Lo lgico es que conforme vayas creciendo en nmero de envo la tarifa vaya reducindose. Calculo del peso volumtrico: Muy importante a tener en cuenta en la tarifa es el peso volumtrico, sobre todo cuando envas artculos de cierto volumen. Todas las empresas de transporte convierten el volumen a peso siguiendo una formula y al final aplican la tarifa de envo segn lo que sea mayor, el peso real o el volumtrico. Cuando nos den esa formula hay que compararla con otras ofertas que tengamos. Coste de envos cruzados (recogida desde un almacn distinto al nuestro): Se utiliza para envos directos desde tu proveedor hasta el cliente final. En ocasiones tiene un coste adicional. Cobertura al menos nacional: La experiencia nos dice que es muy conveniente que tenga sucursal en la mayora de las provincias. Hay empresas de transporte pequeas que no cubre todo el territorio y en muchas provincias tiene acuerdos especficos con otras empresas. Esta situacin puede generar problemas, retrasos en envos y mala resolucin de posibles incidencias. Y no est de ms que permita realizar envos internacionales, aunque sea con alguna empresa asociada, porque aunque no parezca al principio posible. Tiempos de entrega: Que te ofrezca la posibilidad de entregar segn urgencia. En este punto es conveniente optar por el nivel ptimo. No ofrecerle al cliente ms rapidez de la que necesita porque sino encareceremos el envo sin necesidad. Opciones de envo de paquetes voluminosos: Normalmente las empresas de transporte urgente te permiten enviar paquetes de hasta 40 Kg y para pesos superiores tienes que contar con una empresa de transportes especial. Esas

288

empresas de transporte urgente suelen tener un acuerdo con alguna otra para esos envos voluminosos. Si consigues centralizarlo en la misma te ahorras en gestin y puedes conseguir ms volumen que suele incidir en que te ofrezcan tarifas inferiores. Resolucin de incidencias: Es importante que la empresa tenga un procedimiento gil para la resolucin de incidencias. Esto normalmente no lo conoces hasta que utilizas el servicio. El punto ptimo es que la incidencia que se produzca la solucione la empresa de transporte antes incluso que tengas conocimiento de la misma. Coste de cajas o bolsas de envo: Segn el envo puede ser conveniente que se incluyan en bolsas o cajas. Las empresas de mensajera suelen facilitarlas a un coste reducido o incluso gratis. Lo mejor es que se puedan reutilizar otras cajas para reducir costes. La tecnologa con la que cuente la empresa de transporte: Si la empresa de transporte cuenta con tecnologa avanzada permitir que conozcamos el estado de cada envo casi en tiempo real a travs de su pgina web, incluso cuando lo necesitemos lo podremos integrar con nuestra plataforma de comercio electrnico. Los puntos a tener en cuenta a la hora de seleccionar un servicio logstico de almacenaje son los siguientes: La tarifa por espacio ocupado. En algunos casos la tarifa es por metro cuadrado, en otras por metro cbico. La distribucin en el espacio, accesibilidad de la mercanca (sobre todo importante al principio cuando sueles tener pocas unidades de cada referencia). Seguridad: En caso de robo o incendio que est asegurada la mercanca. Los gastos de recepcin y / o manipulacin de la mercanca. La rapidez de preparacin para el envo de la mercanca (picking).

289

Sistema de facturacin claro: Es importante revisar que la facturacin est correcta porque cuando uno llega a tener ms de 10 envos al da de manera continuada las equivocaciones pueden darse (por destino, tamao, duplicidad). Paso 17. Seleccionar un sistema de pago adecuado. Sin un sistema de pago no se puede vender por internet. Es importante que se ofrezcan distintos medios de pago para que el cliente pueda elegir con la que se sienta ms cmodo. Y fundamental que cada una de las formas de pago sean seguras (para el cliente y para la empresa) y que al cliente le transmita seguridad. En resumen: diversidad y seguridad. Es conveniente incluir un apartado en la web para indicar los medios de pago posibles que se pueden utilizar. Los medios de pago ms utilizados actualmente son: ~ ~ ~ ~ Transferencia / ingreso en cuenta corriente Tarjetas bancarias (de crdito / dbito) Contra reembolso PayPal

Transferencia o ingreso en cuenta corriente. Este sistema de pago requiere pocos preparativos, simplemente indicar la cuenta a la que el cliente debe realizar la transferencia y en que banco puede realizar el ingreso. Es conveniente indicarlo en el proceso de pedido e informar de la cuenta por e-mail al confirmar el pedido para que la tenga a mano. En este medio de pago es fundamental controlar la fecha de valor, cuando el ingreso o la transferencia se ha hecho efectiva en la cuenta corriente (aparece en nuestra cuenta el importe). En ese momento es cuando podemos estar seguro que el cliente ha

290

realizado el pago y no puede revertirlo. Las buenas prcticas dice que solo cuando lo hemos recibido deberamos enviar la mercanca. La gran ventaja del pago con transferencia o ingreso en cuenta para el vendedor es que no hay ningn gasto de comisin, y para pedidos de cierto importe se nota. Para muchos clientes este medio de pago les quita la inseguridad de pagar por internet, ya que le permite pagar sin dejar su nmero de tarjeta. Aunque, en la mayora de los casos la transferencia le genera algunos gastos al comprador, aunque cada vez menos con las operaciones bancarias por internet. El mayor inconveniente que puede tener es que al cliente le da ms tiempo para pensarse la compra. Se pierde la posible compra compulsiva. Hay que tener en cuenta que muchos clientes seleccionan esta forma de pago para simular un proceso de compra y as estar seguros del coste total. Es uno de los motivos principales por las que el pago de muchos de estos pedidos no se finalizan. Tarjetas bancarias. Segn todos los estudios, es el medio de pago ms utilizado en las compras online. Entorno al 60% de los pagos se realizan con tarjeta. La verdad es que se puede considerar un medio ptimo para la venta online. El cliente no tiene que pagar nada por realizar el pago y al vendedor le cobran una comisin aceptable. El pago lo recibe de manera inmediata el vendedor. El nico problema que puede darse es el tan temido pago fraudulento, o que el cliente no confe en introducir su tarjeta para realizar el pago. Es fundamental contar con un sistema de pago por tarjeta realmente seguro y que el cliente perciba esa seguridad. Hoy por hoy lo dan la mayora de los TPV de bancos y asociados. Dentro del pago con tarjeta es bueno saber que existen dos sistemas, el pago con tarjeta securizada y el pago con tarjeta sin securizar. En el caso de la securizada el

291

cliente ha tenido que dar previamente de alta la tarjeta en su banco para que permita el pago por internet, cuando va a pagar el sistema se conecta a su banco y le pide un usuario y contrasea adicional. Este tipo de pago es el ms seguro de cara al vendedor. El problema es que algunos clientes no tiene activada la tarjeta. Contra reembolso. Otra opcin de pago que cada vez se va utilizando menos es el pago contra reembolso. El cliente paga a la empresa de mensajera cuando recibe el pedido, esta opcin era muy demandada cuando empez la venta por internet, el cliente quera ver el producto antes de pagar.

La gran ventaja que tiene es que anima a muchos clientes a comprar ya que pagan cuando reciben y eso les da confianza. Las desventajas es que es posible que el cliente rechace el pedido, o incluso que no sea real y los gastos de envo tendran que asumirlos el vendedor. Las empresas de transporte cobran comisiones altas por el pago contra reembolso, que alguien debe asumir.

292

Paypal. Su creadora, eBay, ha conseguido tener un sistema de pago muy extendido en el que mucha gente confa y con el que gana mucho dinero. Mediante Paypal permite al cliente pagar sin tener que dar su tarjeta o su cuenta bancaria ya que estn guardadas en su cuenta de Paypal (en las que el cliente confa).

Paypal es un medio de pago que hay que incluir sobre todo cuando se empieza, nadie te conoce y necesitas todos los recursos para dar esa confianza. Crearse una cuenta de Paypal es muy sencillo, pero asociarla a la empresa y utilizarla sin limitaciones es un poco ms complicado ya que piden bastante documentacin. Pero el gran inconveniente son las comisiones desorbitadas que cobran, fruto de la posicin predominante en los medios de pago de internet. Paypal ofrece opciones para agilizar la compra en tienda, como un pago rpido, incluso puede utilizarse la direccin que haya guardado el cliente en la cuenta de Paypal para el envo del pedido. Puede adaptarse e integrarse totalmente en el aspecto de nuestra web.

293

Gestin de los reembolsos en los medios de pago. Lamentablemente hay veces que despus de que el cliente te haya pagado tienes que devolverle el importe del pago, lo que se conoce como reembolso. Los motivos pueden ser mltiples. En algunas ocasiones tambin se realizan reembolsos parciales, por ejemplo para compensar al cliente por una incidencia. Veamos un cuadro resumen ventajas y desventajas de cada medio de pago para una tienda online:

294

Paso 18. Monitorizacin tienda online para que todo funciona segn lo esperado. Monitorizar permite saber que se estn haciendo las cosas bien y as poder guiarnos en las siguientes acciones a realizar o al menos ser conscientes de las que no realizamos. Qu debe monitorizarse? Por un lado, es importante realizar una monitorizacin constante desde el punto de vista tcnico y por otro una monitorizacin temporal de negocio. Cuando hablamos de aspectos tcnicos, queremos decir que una vez que tengamos la tienda online funcionando, ya sea construida por nosotros o un tercero, es importante realizar un seguimiento tcnico de la misma para mantenerla saludable en todo momento. Es importante arrancar con la tienda siguiendo los pasos tcnicos que hemos recomendado en los pasos anteriores. La buena salud esta relacionado con la optimizacin onpage de la pgina, uno de los puntos importante para mejorar nuestro posicionamiento web y por tanto que nuestra fuente de visitas no decaiga. En relacin a los aspectos tcnicos, acciones que con cierta frecuencia (sobre todo durante los primeros meses) es importante hacer con la herramienta para webmasters de Google son los relacionados a la seccin de Salud, Optimizacin y Otros Recursos, que tiene la propia herramienta: Errores de rastreo: Indica que el host ha sido capaz de comunicarse con el servidor, pero no existe el fichero que ha sido pedido. Este tipo de errores esta relacionado con enlaces rotos. Nos referimos a que por alguna razn nuestra tienda tenga enlaces que devuelva un error 404, ya sea porque hemos realizado algn cambio en la tienda que ha producido un efecto colateral o bien porque desde un inicio existan enlaces rotos. Una buena herramienta para identificarlos es la herramienta checklink de validator w3c. Software malintencionado, aunque es extrao, nunca esta de ms revisar.

295

Sitemap: Tenemos que mantener actualizado sobre todo si vamos dando de alta nuevos artculos y cuando lo subamos de nuevo probar que no tenemos errores de sintaxis. Mejoras HTML: Te informa si tenemos en nuestra tienda metadescripciones duplicadas, etiquetas de ttulo ausentes, problemas de indexacin de alguna pgina, etc. Este informacin se complementa con la que nos aporta la herramienta validator de w3c, que deberamos lanzar cada cierto tiempo cuando hemos realizado cambios de interfaz, nuevos mdulos en la plataforma, etc. Herramienta de pruebas de datos estructurados para comprobar que los fragmentos enriquecidos que tenemos en nuestra tienda online son interpretados por Google correctamente. Esta comprobacin es bueno realizarla cuando hacemos algn cambio en el cdigo relacionado con los rich snippets o bien para verificar que algn cambio en la poltica de Google no ha provocado algn tipo de aviso. Google Merchant Center: Si tenemos publicado nuestros artculos en Google Shopping, adems de comprobar que la URL del sitio esta verificada, es conveniente comprobar que no tenemos alertas en Google Merchant Center relacionado con el atributo de algn artculo, duplicacin de identificador, etcSe comprueba que el google-shopping.txt es correcto en la seccin Calidad de los Datos. Este servicio, probablemente, pase a ser de pago a partir de Febrero de 2013. Google Places: Aunque nuestro negocio sea de mbito nacional o mundial, no esta de ms tener correctamente configurado Google Place, que tenemos nuestro sitio verificado y comprobar que salimos en las bsquedas correctamente. Rendimiento: El tiempo de respuesta al cargar las pginas en el navegador tambin consideramos que es importante no descuidar, sobre todo con la llegada de Google Pinguin. Se recomienda usar los valores que proporcionan la herramienta Google Analytics, en concreto la seccin de Velocidad del Sitio del rea de Contenidos. Puedes obtener informacin de como evoluciona en este sentido y tomar determinadas acciones. La herramienta pingdom, tambin es interesante para identificar donde estn los cuellos de botella cuando se esta cargando nuestra pgina, as como medir el tamao de nuestra pgina, otro punto que tambin tenemos que ir vigilando cada cierto tiempo.

296

El resto de opciones de la herramienta webmasters de Google con realizarlas la primera vez, no deberan cambiar y por tanto no es necesario monitorizar, como son los diferentes aspectos de configuracin de la herramienta. Paso 19. Promocionar tienda online: Google Shopping, m-commerce y t-commerce. Una vez tenemos montada nuestra tienda online en Internet, los primeros das no hacemos otra cosa que ver las estadsticas de nuestro Google Analytics y nos damos cuenta que el nmero de visitantes no es el que esperbamos. Pero, qu se debe promocionar? la tienda online? la web? de que tipo de difusin web estamos hablando? A continuacin vamos a realizar un resumen de los pasos que entendemos debemos seguir y los aspectos que debemos tener en cuenta para realizar una difusin ordenada de nuestra tienda online: ~ Principales redes sociales como las que mencionamos en el paso 15 sobre la estrategia social media. ~ Uso de marcadores sociales a travs de herramientas que permitan una difusin masiva y automtica. Con determinadas tcnicas SEO puede ayudar al posicionamiento web. ~ Directorios web de Internet que tuvieron su momento de gloria pero que actualmente con la llegada de Google Pinguin no son muy recomendables y menos si son directorios que te solicitan un intercambio de enlace. ~ Directorios RSS que de igual forma que los marcadores sociales debemos hacernos con alguna herramienta que facilite su difusin. ~ Webs de publicacin de productos, como el caso de Google Shopping, entre otras tantas. En este punto recomendamos que la descripcin de los artculos sea diferente en este tipo de webs para evitar el contenido duplicado a los ojos de Google, sobre todo porque es muy posible que Google indexe antes este tipo de Web que la nuestra.

297

~ Uso de Google Place, que tambin podra ayudar al posicionamiento web y que Google Maps nos ayude a promocionarnos. ~ Tener un blog propio sobre la temtica de nuestra tienda online es hoy da casi fundamental por muchos motivos. ~ Colaboracin en Blogs o Webs de terceros sera tambin muy recomendable con artculos nuestros, preferiblemente de la misma temtica que nuestro negocio. ~ Dedicar tiempo a realizar comentarios de valor en blogs que traten sobre nuestro negocio. ~ Participar en las redes sociales de terceros aportando reflexiones de valor, ya que indirectamente estaremos haciendo difusin de nuestra marca. Por otro lado, en relacin al comercio mvil o m-commerce, cuando hablamos de difusin tenemos que pensar que nuestra tienda debe estar adaptada para que pueda ser visualizada de una forma fcil y sencilla no solo desde un equipo sobremesa como tradicionalmente, sino tambin desde cualquier dispositivo mvil. Existen datos que indican que el crecimiento de este tipo de dispositivos ser cada vez mayor y nuestra tienda online debe estar preparada desde el primer momento tanto en el diseo como en lo funcional, comprobando que es posible realizar todo el ciclo de compra completo de forma gil.

En relacin al punto anterior, pensemos tambin en la fuerte tendencia de las compras online desde el sof (couch commerce) con un tablet (t-commerce). No se

298

debe considerar que se realizan de igual forma que las compras online desde el smartphone y este aspecto hay que tenerlo muy presente. Paso 20. Transmitir confianza a los clientes. Una vez que ya est todo creado, la difusin hecha y los distintos procedimientos establecidos lo nico que queda es vender, que no es poco. Para ello es fundamental transmitir confianza a los visitantes que queremos que se conviertan en clientes y que luego repitan. Sin confianza en la tienda, poco se vender, por muy buenos precios y productos que se tengan. A continuacin indicamos algunas recomendaciones para inspirar confianza al cliente: Humanizar la web. Que se vea que detrs de la web hay personas trabajando, incluso que podamos trasmitir cario hacia ese posible cliente y es que los sentimientos tambin influyen en las ventas. Explicar quienes somos y una foto de los fundadores/trabajadores en la web es ms que recomendable, y si adems esa foto muestra cercana y es divertida mejor. Medios de contacto: Ofrecer a los clientes los mayores medios posibles para que se pongan en contacto contigo y que estn en lugares muy visible. Imprescindible email, tener un apartado de contacto en la web (que al final es similar al email, pero sin tener que salir de la web), pero tambin es muy importante un telfono de contacto con un horario amplio de atencin. Una idea prctica podra ser la posibilidad de contactar por WhatsApp. Como medio adicional de contacto es conveniente estar en las redes sociales principales: al menos Facebook y Twitter. Tambin es interesante que el cliente pueda poner comentarios en la web. Pero no basta con tener estos medios de contacto, hay que estar atentos y responder con agilidad. Y si por ejemplo no podemos responder a alguna llamada porque estemos ocupados o porque est fuera de un horario habitual hay que

299

devolverla lo antes posible. Dejar una llamada olvidada puede provocar perder una venta y provocar una mala opinin de nosotros. La atencin telefnica es un punto clave. Pueden llegarse a obtener muchas ventas gracias a tener la atencin telefnica o simplemente tener un nmero de telfono claramente accesible al que el cliente pueda llamar si tiene algn problema.

Mediante redes sociales pocas personas lanzan consultas. Normalmente para lo que sirven es para que puedan comentar experiencias, que tambin da confianza. Tambin permite compartir novedades, crear imagen de marca, etc. Tener un blog ayuda tambin a transmitir confianza, resolver dudas y mostrar de lo que hablas. Cuanto ms interactivo sea el blog mejor todava. Gestionar correctamente posibles incidencias que puedas tener con los clientes. Al final por muy controlado que tengas todo el proceso, la realidad es que incidencias surgen (algo que llega roto, que se retrasa ms de la cuenta o que no es lo que esperaban, etc.). Lo importante es reaccionar rpidamente y con rotundidad. Si se hace bien se puede incluso volver a tu favor. En algunos casos tienes que compensar econmicamente, incluso puedes perder dinero en la operacin, pero a cambio puedes conseguir que tu cliente acabe satisfecho y ms importante an, que no hable mal de la web.

300

Los comentarios de los clientes en la web. Hay que animar a los clientes a dejar comentarios en la web, sobre todo cuando sabemos que las cosas han ido bien y que el cliente est satisfecho. Como gancho, para que dejen comentarios, puede resultar interesante dar descuentos adicionales para futuras compras. Otros posibles clientes van a leer esos comentarios. Las condiciones de compra, envo y pago deben estar claras y resumidas en algn lugar de la web. Tener varias formas de pago tambin da confianza, cada cliente podr pagar con lo que se sienta ms cmodo o seguro. Algunos les da ms confianza PayPal, a otros la transferencia porque no dejan datos de pago en la web, otros les parece ms cmodo el pago con tarjeta. Y respecto a la pasarela de pago esa debe ser mediante conexin segura https y adems debe quedar claro en el proceso de compra para que el cliente siga teniendo esa confianza. Monitorizar a los clientes con problemas en el registro. Es recomendable monitorizar continuamente la web mediante alertas. En el caso de que un cliente tenga problemas al darse de alta o al registrarse se le puede enviar un correo solicitndole el telfono para poder ayudarle. En resumen: confianza, cercana, humildad, tratar al cliente como la persona ms importante. Sin cliente no hay negocio. Recuerda que la venta online est en expansin, pero es un terreno donde an queda mucho por conquistar. Meterse en las ventas virtuales y tener xito es una opcin que requerir de mucho trabajo y dedicacin, as como de una inversin inicial. Si esto se lleva a cabo con paciencia y entrega, haciendo hincapi en los puntos clave que apuntamos en este curso, y el producto tiene demanda, el xito de nuestra tienda online est garantizado.

301

Recuerda las 5 claves para el xito de tu tienda online. 1. Asienta los objetivos de tu negocio. 2. Crea un diseo atractivo, accesible y amigable para el usuario. 3. Genera contenido de calidad. 4. Inspira confianza. 5. Date a conocer.

302

EJERCICIOS DE REPASO NO EVALUABLES (Este trabajo no tiene correccin)

Para el desempeo de estos ejercicios se recomienda (en caso de no tener descargado Pretashop) hacer uso de la Demo que nos acerca la pgina de prestacin, donde podremos practicar. El enlace es el siguiente, tanto para el Frontend, como para el Backend. http://www.prestashop.com/es/demo

1. Cree una nueva Categora llamada Cascos. Dentro de esta categora cree dos nuevos productos: cascos inalmbricos y cascos clsicos. 2. Crea una nueva cuenta cliente manualmente con tus propios datos. 3. Ordena, uniendo mediante flechas, los pasos a seguir para crea un perfil de una organizacin en la red social de Facebook.

303