Diseño web, Tiendas Virtuales, Posicionamiento Buscadores | CartonWebs http://www.cartonwebs.com Diseño web, Tiendas Virtuales, Posicionamiento Buscadores | CartonWebs Wed, 20 Jul 2011 19:38:04 +0000 es hourly 1 http://wordpress.org/?v=3.3.1 Imprescindibles en una tienda online http://www.cartonwebs.com/elementos-imprescindible-en-cualquier-tienda-online/ http://www.cartonwebs.com/elementos-imprescindible-en-cualquier-tienda-online/#comments Fri, 08 Jul 2011 09:37:47 +0000 admin http://www.cartonwebs.com/?p=810 ]]> Si queremos que nuestra tienda sea un éxito no solo tenemos que limitarnos a tener un bonito diseño, precios competitivos y aparecer bien posicionados en google.

Tambien tenemos que ofrecer al visitante (y futuro cliente) ciertas informaciones imprescindibles así como posibilidades de interactuación:

 

Condiciones de uso, política de devoluciones… Todo esto ofrece al posible cliente la información sobre la tienda necesaria para que se sienta en un comercio REAL. A nadie le gusta comprar sin saber quién está detrás o dónde está la tienda en caso de tener que reclamar algo, por ejemplo.

 

Tener las tarifas de envío claras y visibles, para evitarle sorpresas desagradables al nuevo cliente. O según los rangos de precios/portes que se manejen incluso ofrecer portes incluidos. A nadie gusta meter en la cesta un producto de 6€ para luego descubrir que el envío cuesta otros 6€.

 

Posibilidad de contactar con algún responsable de la tienda. Es muy penoso querer preguntar algo sobre un producto y que no haya forma de comunicarse con quien puede aclarar nuestras dudas. Y mejor si ofrecemos varias vias, formulario de contacto, chat, teléfono de atención… cada negocio tiene su público y se deben escoger las vis más aduecuadas.

 

Buenas descripciones y buenas fotos de los productos. De poco sirve poner una foto de un, por ejemplo, sujetalibro muy bonito, si no ponemos qué tamaño tiene. Una descripción fantástica de un conjunto de mesa y sillas de jardín si ponemos una foto de mala calidad (pixelada, desenfocada…)

 

Comentarios de los productos. La mayoría de las tiendas virtuales tiene la posibilidad de permitir a los clientes de escribir una reseña o comentario acerca de los productos. Muchos clientes se fían más de lo que dicen otros clientes que de lo que dice la descripción. Pero no hagais trampas, si es el propio dueño de la tienda quien se dedica a pone los comentarios, se nota. Mejor animad a vuestros clientes a escribir una reseña aunténtica.

 

Ofercer pago online. Nada más frustante que realizar una compra y al terminarla descubrir que hay que hace el pago por transferencia al banco “fulanín” que casualmente no es el mismo que usamos nosotros. Tres días de demora extra, comisiones de transferencia, tener que realizar otra gestión ara el pago… muchas ventas se pierden por ahí. Da esa posibilidad si quieres, pero ofrece pago online, ya se a través del TPV virtual de tu banco o de Paypal.

 

 

]]> http://www.cartonwebs.com/elementos-imprescindible-en-cualquier-tienda-online/feed/ 0 Botón +1 Google http://www.cartonwebs.com/boton-1-google/ http://www.cartonwebs.com/boton-1-google/#comments Fri, 01 Jul 2011 16:39:41 +0000 admin http://www.cartonwebs.com/?p=808 ]]> Google recientemente se ha apuntado a la moda de los botones para compartir contenido de forma “social”, que ya era hora, ya que la única forma que tenía la gran “G” para compartir era por medio de los bookmarks, iGoogle (que no sé si lo usará alguien) y poco más.

La idea (por cierto aun esta en fase de pruebas y puede que aún no aparezca) es que al llevar a cabo una búsqueda en Google nos parazcan junto a los resultados cuántos +1 ha obtenido esa web. Su influencia en el posicionamiento SEO de las páginas recomendadas aun es una incógnita.

Su implementación es realmente sencilla, solo tienes que copiar el código ofrecido por Google en tu página web.

 

Primero vamos a la página que provee Google http://www.google.com/webmasters/+1/button/ y escogemos el tamaño del boton y el idioma. Con esto se nos generará un código para que peguemos en la cabecera de nuestra web, entre las etiquetas <head> y </head>, o al menos antes de la etiqueta <body> y otro para el botón.

 

Por ejemplo, para el botón en español a tamaño medio (20px) este es el código de la cabecera

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
{lang: 'es'}
</script>

 

Y este el del botón:

<g:plusone size="medium"></g:plusone>

el cual se pone en el lugar dónde queramos que aparezca.

 

Y quedaría algo así:

<!DOCTYPE>
<html>
<head>
<title>Página de pruebas</title>
<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
{lang: 'es'}
</script>
</head>
<body>
<h1>Esta es mi prueba de botón +1</h1>
<p>Un poquito de loren ipsum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam</p>
<g:plusone size="medium"></g:plusone>
</body>
</html>

Demo

]]> http://www.cartonwebs.com/boton-1-google/feed/ 0 Crear textos rellenos de imagen http://www.cartonwebs.com/crear-textos-rellenos-de-imagen-y-que-degraden-aceptablemente/ http://www.cartonwebs.com/crear-textos-rellenos-de-imagen-y-que-degraden-aceptablemente/#comments Fri, 24 Jun 2011 18:09:19 +0000 admin http://www.cartonwebs.com/?p=804 ]]> WebKit (Safari, Google Chrome, Epiphany, Midori y alguno que otro más) soportan una caracteristica de CSS 3 bastante llamativa llamada background-clip, la cual se puede utilizar para hacer algunos efectos bien majos.

 

Vamos allá. Vamos a usar una imagen que será visible a través del texto.

 

La Idea

h1 {
 color: white;  /* Fallback: si por lo que sea no funciona hay que darle un color al texto, no? */
 background: url() no-repeat;
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
}

 

Ahí está, bien sencillo. Se establece un fondo para el elemento, se recorta y se establece que el color de relleno va a ser tranparente.

 

El Problema

Pues el gran problema es que esto solo funciona, como dijimos antes, con navegadores basados en webkit. Asi que, ¿qué ocurre si vemos la web en un navegador que no lo es?

Como puedes ver en el codigo de arriba, hemos declarado un color como color principal del texto. Este valor será invalidado por -webkit-text-fill-color en los navegadores que lo soporten, y en los que no, como tambien ignorarán -webkit-background-clip veremos la imagen realmente de fondo del texto (que estará en blanco, como definimos al principio)
Bueno, no es que sea lo mejor del mundo ¿verdad? Vamos a ver si lo podemos mejorar

 

Un “Falback” mejor

La herraienta definitiva para mejorar las degradaciones es Modernizr. Simplemente hay que incluir un pequeño Javascript en la página y añadir las clases al h1 de tu página indicando que el actual navegador es capaz de ello.

Aunque un no hay un test de esta caracteristica en Modernizr, pero por suerte hay un “hook” para ello.

 

<script src="modernizr-1.6.min.js"></script>
<script>
 Modernizr.addTest('backgroundclip',function(){
 var div = document.createElement('div');
 if ('backgroundClip' in div.style) return true;
 'Webkit Moz O ms Khtml'.replace(/([A-Za-z]*)/g,function(val){
 if (val+'BackgroundClip' in div.style) return true;
 });
 });
</script>

Ahora sabemos con certeza si el navegador con que estamos viendo la web soporta background-cpli o no, si lo hace, el tag h1 tendrá la clase backgroundclip, y si no, la no-backgroundclip. Así que ahora solo se aplicará el fondo si el navegador acepta background-clip.

 

.backgroundclip h1 {
 background: url(images/west.jpg) -100px -40px no-repeat;
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
}
h1 {
 color: orangered;
}


 
Ver demo
 
Fuente: CSS-tricks
 

]]> http://www.cartonwebs.com/crear-textos-rellenos-de-imagen-y-que-degraden-aceptablemente/feed/ 0 Generador de Sprites CSS – Spritemapper http://www.cartonwebs.com/generador-de-sprites-css-%e2%80%93-spritemapper/ http://www.cartonwebs.com/generador-de-sprites-css-%e2%80%93-spritemapper/#comments Fri, 10 Jun 2011 13:26:17 +0000 admin http://www.cartonwebs.com/?p=790 ]]> Los sprites CSS son una gran idea para minimizar el numero de peticiones hechas al servidor web cuando se cargan imágenes, esa es la parte buena, la mala es que generar dicho sprite puede ser una tarea muy pesada y frustante si se trata de muchas imágenes.

 

Spritemapper es una herramienta para facilitar dicho proceso uniendo multiples imágenes en una sola y creando el CSS necesario para mostrar cada parte.

]]> http://www.cartonwebs.com/generador-de-sprites-css-%e2%80%93-spritemapper/feed/ 0 Visita virtual http://www.cartonwebs.com/visita-virtual/ http://www.cartonwebs.com/visita-virtual/#comments Mon, 30 Aug 2010 20:15:54 +0000 admin http://www.cartonwebs.com/?p=551 Hoy traemos esta demo que se quedó un poco olvidada con el cambio de web.

Es una Visita Virtual a L’Escala donde podeis ver 4 distintos emplazamientos.

Visita Virtual

]]> http://www.cartonwebs.com/visita-virtual/feed/ 0 Plugin wordpress http://www.cartonwebs.com/plugin-wordpress/ http://www.cartonwebs.com/plugin-wordpress/#comments Sat, 29 May 2010 21:04:33 +0000 admin http://www.cartonwebs.com/?p=391 ]]> Este fin de semana traemos una pequeña contribución para lo usuarios de WordPress.
demo
Un sencillo plugin para añadir al pie de cada post una lista de botones para que los lectores puedan compartir las noticias en su red social favorita.

La ventaja frente a addthis o sharethis es que no es necesario darse de alta en ningún servicio, solo subir el plugin a la carpeta wp-content/plugins y activarlo desde la administración. Por contrapartida no dispondremos de ninguna herramienta para hace seguimiento, pero eso no es un gran problema dado que todos deberiamos estar ya usando algun servicio de ese estilo, como google analytics.

Aqui os dejo el archivo en formato zip, listo para descomprimir y usar.

]]> http://www.cartonwebs.com/plugin-wordpress/feed/ 0 Video tutorial http://www.cartonwebs.com/video-tutorial/ http://www.cartonwebs.com/video-tutorial/#comments Thu, 20 May 2010 12:03:28 +0000 admin http://www.cartonwebs.com/video-tutorial/ Un video cortito de como hacer rapidamente un bonito efecto cortina en Flash por medio de las mascaras

]]> http://www.cartonwebs.com/video-tutorial/feed/ 0 Diseño web http://www.cartonwebs.com/diseno-web/ http://www.cartonwebs.com/diseno-web/#comments Fri, 16 Apr 2010 18:47:55 +0000 admin http://localhost/wordpress/?p=27 ]]> Si lo que quiere es un diseño único y exclusivo, una creacion web que le distinga de sus competidores, en CartonWebs también ofertamos diseño y  desarrollo web de páginas, usando tanto html clásico, como dinámico, php, java, javascript, css, asp, AJAX, flash, y mysql entre otros.

Davinci, Goya y Monet han sustituido el pincel por el ratón y tienen una empresa diseño web.

¡No! Desde luego que no somos artistas de tanto renombre, aunque algunas empresas de diseño web cuentan entre sus filas con personal salido de las más punteras facultades de bellas artes.

Esta disciplina, por desgracia cada vez menos valorada hoy en día, tiene como objetivo, entre otras cosas, dar vida a los lienzos de tela con una pantalla por escenario, y es quizas la parte de la creacion web que requiere más imaginación por parte de los profesionales.

También hay que tener en cuenta que no basta con diseñar un sitio pensando únicamente en los sentidos, existen cuestiones tales como navegabilidad, interactividad, usabilidad, accesibilidad y manejo de la información, las cuales forman una parte importante del conjunto.

Pero se nos plantea un serio problema, ya que el arte, el diseño, son subjetivos, y al igual que cada persona tiene su color favorito, se puede afirmar casi con toda seguridad, que es casi imposible realizar un diseño web a gusto de todos.

Las modas y las tendencias cambian, y con ellas, por supuesto, también el diseño web. Por ejemplo, hace tan solo 10 años las paginas más chic, impactantes, famosas y admiradas en internet carecían de vida y animación, ni tan siquiera se pensaba en el posicionamiento en buscadores.

Estabamos a las puertas de un nuevo milenio, estos sitios pertenecen a lo que hoy llamamos “la web 1.0″, el diseño web era poner letras en negrita y retocar una foto, hoy nos hallamos sumergidos en la aldea global, con herramientas que alimentarán la industria de las tecnologias de la información durante los proximos 10 años: redes sociales, podcast, rss, bases de datos, blogs, … Toda esta constelación de técnicas y tecnologías son la herramienta del diseñador web para “pintar” el sitio web de esta Era, el presente, la realidad y el destino del diseño web. Bienvenidos al siglo XXI, ¡bienvenidos a la web 2.0!

He oído que el diseño web es caro, ¿por qué?logo_pregunta

Como hemos mencionado anteriormente, el diseño web forma parte de una de las disciplinas artísticas modernas. El arte es inpiración, y la inspiración no se puede forzar.

Usted debe de pensar que “diseño” y “exclusivo” son 2 palabras que no pueden evitar ir juntas, y por ello el coste de algo personalizado, como es el caso, es más alto que el de un producto genérico o de plantilla, como pueden ser las paginas web baratas.

Aun a pesar del incremento de precio, piense que un buen diseño web es su tarjeta de presentación virtual de cara a sus posibles clientes, proporcionandole una mayor presencia.

No caiga en el error de pensar en ello como un gasto. Mírelo como una inversión que comparada con los beneficios que esta le reportará, es mínima. Además, en España contamos con el plan Avanza y el proyecto NEW (Ninguna Empresa sin Web) impulsados por el Ministerio de Industria, los cuales aportan ayudas interesantes a su empresa si desea modernizarse.

Ya que cada proyecto es único, sentimos no poder darle un precio fijo en este instante, por eso le ofertamos un presupuesto sin compromiso para su pagina web, no tiene mas que rellenar nuestro formulario de contacto, o llamarnos al 93 380 34 35 donde le atenderemos encantados.

]]> http://www.cartonwebs.com/diseno-web/feed/ 0 Nuevas tecnologías http://www.cartonwebs.com/nuevas-tecnologias/ http://www.cartonwebs.com/nuevas-tecnologias/#comments Mon, 12 Apr 2010 23:25:23 +0000 admin http://www.cartonwebs.com/?p=310 ]]> ¿iPhone? ¿BlackBerry? ¿Nexus?

No importa si usted lo usa o no, sus clientes potenciales ya están intentando acceder a su web por medio de estos dispositivos moviles.

¿Va a quedarse atrás?

Su negocio es un negocio ganador por el cual usted y su equipo se esfuerzan a diario para que lo siga siendo y para que crezca. ¿Por qué renunciar a todos losclietnes potenciales que nos brindan las nuevas tecnologías? Admítalo, seguramente ya conoce a alguien que tiene un dispositivo movil “pegado” a la palma de su mano y esa tendencia va al alza. No se conforme con llegar solamente al público que utiliza dispositivos y navegadores más convencionales, tome ventaja sobre sus competidores a la vez que se asegura una mayor presencia teniendo una web “multidispositivo”.

¡No le cierre las puertas del futuro a su empresa! Rellene nuestro formulario de contacto, o llámenos al 93 380 34 35 donde le atenderemos encantados.

]]> http://www.cartonwebs.com/nuevas-tecnologias/feed/ 0 Bienvenidos… http://www.cartonwebs.com/cartonwebs/ http://www.cartonwebs.com/cartonwebs/#comments Sat, 02 Jan 2010 12:19:25 +0000 admin http://localhost/wordpress/?p=102 ]]> Si está buscando una empresa que le haga el diseño web para su próximo proyecto, está usted de enhorabuena ya que acaba de entrar en una página donde la palabra “innovación” es uno de nuestros lemas…

Tenemos un diseño web distinto, original e innovador para usted, su empresa y su proyecto, ya que de la misma manera que no existen dos patatas iguales, tampoco hay dos personas, empresas o proyectos que sean iguales.

]]> http://www.cartonwebs.com/cartonwebs/feed/ 0