Internet Archives - Diseño de páginas web Asturias https://jorgedelbarrio.com/category/internet/ Desarrollo web, ecommerce, SEO, trafficker y marketing digital Mon, 09 Mar 2020 15:16:49 +0000 es hourly 1 https://wordpress.org/?v=7.0.1 https://jorgedelbarrio.com/wp-content/uploads/2016/07/cropped-favicon-2-32x32.png Internet Archives - Diseño de páginas web Asturias https://jorgedelbarrio.com/category/internet/ 32 32 53230092 Manual de uso de google analytics: Parte 2 Cómo insertar el código de seguimiento https://jorgedelbarrio.com/diseno-web/manual-de-uso-de-google-analytics-parte-2-como-insertar-el-codigo-de-seguimiento/ https://jorgedelbarrio.com/diseno-web/manual-de-uso-de-google-analytics-parte-2-como-insertar-el-codigo-de-seguimiento/#respond Wed, 16 Sep 2015 07:52:48 +0000 http://jorgedelbarrio.com/?p=5708 Manual de uso de google analytics: Parte 2 Cómo insertar el código de seguimiento ¿Cómo realizo el seguimiento de un sitio web nuevo? Para empezar a supervisar un sitio web nuevo, deberá llevar a cabo dos sencillos pasos: la creación de un nuevo perfil de sitio y la adición del código de seguimiento de Google Analytics […]

La entrada Manual de uso de google analytics: Parte 2 Cómo insertar el código de seguimiento se publicó primero en Diseño de páginas web Asturias.

]]> Manual de uso de google analytics: Parte 2 Cómo insertar el código de seguimiento

¿Cómo realizo el seguimiento de un sitio web nuevo?

Para empezar a supervisar un sitio web nuevo, deberá llevar a cabo dos sencillos pasos: la creación de un nuevo perfil de sitio y la adición del código de seguimiento de Google Analytics a todas las páginas que desee supervisar.

Crear un perfil nuevo

En la página «Ajustes de Google Analytics», haga clic en «Añadir perfil de sitio web».

  1. Seleccione «Añadir un perfil para un dominio nuevo».
  2. Introduzca la URL del sitio del que desea realizar el seguimiento. Asegúrese de seleccionar «https://» (más habitual) o «https://» (sitio seguro) en la lista desplegable.
  3. Haga clic en «Finalizar». Aparecerá la página «Estado de seguimiento», que contiene el código de seguimiento necesario para realizar los pasos que se indican a continuación.

Añadir el código de seguimiento a sus páginas

Debe copiar y pegar el código que aparece en el cuadro de texto de la página «Estado de seguimiento» en todas las páginas web que vaya a supervisar. Se inserta inmediatamente antes de la etiqueta </body>, y puede hacerse manualmente o a través de plantillas o inclusiones, en caso de que las haya.

Sugerencia: El código de seguimiento de Google Analytics es exclusivo de cada cuenta y de cada perfil incluido en dicha cuenta. Para obtener su código personalizado en cualquier momento:

  1. En la página «Ajustes de Google Analytics», busque el perfil para el que necesita obtener el código de seguimiento en la tabla «Perfiles del sitio web».
  2. Haga clic en «Editar» de la columna «Configuración» de ese perfil. Aparecerá la página «Configuración del perfil».
  3. Haga clic en «Comprobar estado», en la parte superior derecha de la tabla.

¿Qué debo hacer para añadir el código de seguimiento a mi sitio web?

Copie el segmento de código y péguelo al final de su contenido, inmediatamente antes de la etiqueta </body> de cada página que desea supervisar. Si utiliza una plantilla o una inclusión común, introdúzcala aquí.

Importante: Si sus páginas incluyen la invocación de urchinTracker(), utmLinker(), utmSetTrans() o utmLinkPost(), el código de seguimiento debe insertarse en el código de la página encima de cualquiera de las invocaciones. En estos casos, el código de seguimiento puede colocarse en cualquier lugar entre la etiqueta de apertura <body> y la llamada de JavaScript.

<script src="https://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct="UA-xxxx-x";
urchinTracker();
</script>

Deberá sustituir la cadena «xxxx-x» del ejemplo anterior por su número de cuenta de Google Analytics.

Puede obtener este código de seguimiento personalizado completo siguiendo las instrucciones que encontrará en ¿Dónde puedo encontrar mi código de seguimiento?

¿Cómo puedo verificar que he introducido el código de seguimiento correctamente en mis páginas?

Google Analytics se encarga de verificar que el código de seguimiento se ha insertado correctamente en la página principal de su sitio. Tras crear un perfil nuevo, el estado de seguimiento mostrará la advertencia «Estado de seguimiento desconocido» hasta que el sistema detecte el código.

Si utiliza un editor WYSIWYG («What you see is what you get», lo que se ve es lo que se obtiene), como Macromedia Dreamweaver, asegúrese de que el código esté oculto cuando visualice la página con un navegador. Algunos de estos editores intentan colocar el código como texto en su página. Utilice la vista de «código fuente» cuando se disponga a pegar el código en sus páginas web. Por último, una vez que se haya publicado su página, seleccione Código fuente en el menú de su navegador y busque el código en cuestión. Debería aparecer inmediatamente antes del código </body> de la página y coincidir exactamente con el que le hemos proporcionado:

<script src="https://www.google-analytics.com/urchin.js" type="text/javascript">
. </script>
<script type="text/javascript">
_uacct="UA-xxxx-x";
urchinTracker();
</script>

En este ejemplo, su número de cuenta debería sustituir a la cadena xxxx-x. Si necesita volver a obtener el código, haga clic en el vínculo Editar junto al perfil en cuestión en la página Ajustes de Google Analytics y, a continuación, seleccione Comprobar estado en la parte superior derecha de la tabla.

google-analytics-paneles-personalizados

¿Cómo administra Google Analytics los redireccionamientos?

Si su sitio utiliza redireccionamientos, la página de redireccionamiento se convierte en la referencia de la página de destino. Por ejemplo, si un usuario basa su búsqueda en una palabra clave específica, como «libros usados» en Google, no habrá ningún dato de referencia que muestre que se ha empleado esta palabra clave en una búsqueda en Google, sino que la referencia aparecerá como la página de redireccionamiento.

Por este motivo, recomendamos colocar el código de seguimiento de Google Analytics en la página de redireccionamiento además de hacerlo en la página de destino. De este modo, la página de redireccionamiento captará la información de referencia actual para sus informes.

Tenga en cuenta que quizás no pueda implementar correctamente el código de seguimiento en todas las páginas de redireccionamiento, ya que algunas de estas páginas no contienen ningún código. Asimismo, algunos navegadores pueden realizar el redireccionamiento antes de que se realice la llamada de JavaScript desde el código.

¿Por qué no se recopilan datos de CPC cuando se utilizan redireccionamientos?

Uno de los problemas más habituales a los que se enfrentan los usuarios con sus redireccionamientos es que la información de CPC no se registra correctamente. Una situación típica es la que se recoge a continuación:

• Un usuario hace clic en un anuncio de AdWords que lo envía a www.ejemplo.es?gclid=XDF (El parámetro gclid lo añadió automáticamente el sistema de etiquetado automático de AdWords de Google para realizar el seguimiento de la información de la campaña, medio y palabra clave en Google Analytics. Esta situación se aplica también a etiquetas de información de campañas asignadas manualmente, como www.ejemplo.es?utm_source=Google&utm_medium=ppc.)

• www.ejemplo.es?gclid=XDF redirecciona el navegador del usuario a www.anunciante.es/producto.htm, eliminando el parámetro gclid. Para asociar los datos de CPC al clic, es necesario realizar el seguimiento de la página de destino (www.ejemplo.es del ejemplo anterior) con el código de seguimiento de Google Analytics. Asimismo, debe asegurarse de que el código de seguimiento de Google Analytics de esa página dispone de tiempo para su ejecución antes de que se lleve a cabo el redireccionamiento. Puede que necesite añadir un breve intervalo de retraso al redireccionamiento para que dé tiempo a registrar los parámetros de la campaña.

De manera alternativa, puede transferir los parámetros de la URL a la página de destino del redireccionamiento (www.anunciante.es/producto.htm en el ejemplo anterior). Cuando el código de seguimiento de Google Analytics de la página de destino lea los parámetros de la URL, asociará la visita a la información de campaña correspondiente.

Las direcciones URL de cada paso de mi ruta de redireccionamiento definido son idénticas. ¿Qué debo hacer para realizar un seguimiento de cada uno de los pasos como si se tratase de una URL diferente?

Es posible que desee realizar un seguimiento del progreso de los usuarios por un redireccionamiento que utilice la misma URL para cada paso. Por ejemplo, su redireccionamiento de registro puede ser como este:

  • Paso 1 (Registro) – www.misitio.es/registro.cgi
  • Paso 2 (Aceptación del acuerdo) – www.misitio.es/registro.cgi
  • Paso 3 (Finalización) – www.misitio.es/registro.cgi

Para solucionarlo, utilice en cada paso la función JavaScript urchinTracker (posiblemente, en un proceso de carga), como se muestra a continuación:

urchinTracker("/redireccionamiento_O1/paso1.html")
urchinTracker("/redireccionamiento_O1/paso2.html")
urchinTracker("/redireccionamiento_O1/paso3.html")

A continuación, configure los pasos de su redireccionamiento siguiendo estos parámetros:

https://www.misitio.es/redireccionamiento_O1/paso1.html
https://www.misitio.es/redireccionamiento_O1/paso2.html
https://www.misitio.es/redireccionamiento_O1/paso3.html

Tenga en cuenta que ni el argumento de la ruta ni del nombre de archivo de urchinTracker() tienen que representar una ruta o nombre de archivo existente. El argumento de urchinTracker sólo ofrece un nombre de página inventado al que Google Analytics puede adjuntar visitas de página.

Importante: Si las páginas incluyen una invocación a urchinTracker(), utmLinker(), utmSetTrans() o utmLinkPost(), su código de seguimiento de Analytics debe insertarse en el código HTML encima de cualquiera de dichas invocaciones. En estos casos, el código de seguimiento puede colocarse en cualquier lugar entre la etiqueta de apertura <body> y la llamada de JavaScript.

Para verificar que se está llamando a urchinTracker correctamente, puede revisar su informe «Contenido principal» 24 o 48 horas después de que se haya ejecutado el código de seguimiento actualizado. Probablemente verá el nombre de página asignado en su informe.

Mi sitio dispone de varios nombres de dominio. ¿Cómo configuro el seguimiento?

Si su sitio abarca varios dominios o emplea varios alias de dominio para el mismo contenido, deberá aplicar determinados cambios para garantizar que su sitio y el código de seguimiento de Google Analytics son compatibles.

Tenga en cuenta que hay una diferencia entre varios subdominios y varios dominios raíz. carritoseguro.ejemplo.es es un ejemplo de subdominio, mientras que www.ejemplo.es y www.muestra.es representan varios dominios raíz.

¿Cómo puedo realizar el seguimiento de todos los subdominios de mi sitio en un perfil?

Es posible realizar el seguimiento de subdominios dentro del mismo perfil que el dominio. Para ello, deberá añadir una línea al código de seguimiento en cada una de las páginas del subdominio. En las instrucciones que se indican a continuación se asume que este perfil se ha establecido con el dominio principal como el sitio web indicado (ejemplo.com).

1. Añada la siguiente línea (en negrita) al código de seguimiento de todas las páginas tanto de su subdominio como de su dominio principal:

<script src="https://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-xxxx-x";
_udn="example.com";
urchinTracker();
</script>

Esta línea deberá hacer referencia al dominio principal (ejemplo.com). Tenga en cuenta que si bien este cambio le permitirá realizar el seguimiento de subdominios dentro de un perfil, es posible que sus informes no establezcan la diferencia entre páginas de www.ejemplo.com y de ayuda.ejemplo.com. Por ejemplo, en su informe Contenido principal podrá obtener resultados de www.ejemplo.com/índice.html y ayuda.ejemplo.com/más.html; sin embargo, el informe mostrará lo siguiente:

/índice.html

/más.html

Si desea establecer diferencias entre subdominios, puede crear un filtro avanzado para su perfil con los siguientes valores:

Tipo de filtro: Filtro personalizado > Avanzado

Campo A: Nombre de host

Extracto A: (.*)

Campo B: URI de la solicitud

Extracto B: (.*)

Enviar resultados a: URI de la solicitud

Constructor: /$A1$B1

Con este filtro configurado, los ejemplos anteriores aparecerán con el subdominio adjuntado:

www.ejemplo.com/índice.html

ayuda.ejemplo.com/más.html

¿Cómo se realiza el seguimiento de todos los subdominios de un sitio en perfiles separados?

Para realizar el seguimiento de subdominios en perfiles individuales basta con introducir el nombre correcto del subdominio en el cuadro de diálogo Añadir perfil de sitio web. Añada el código de seguimiento suministrado a todas las páginas de su subdominio. Así, el tráfico que se reciba en ese subdominio se reflejará con precisión en los informes. Tenga en cuenta que cada perfil utiliza un código de seguimiento exclusivo, por lo que debe asegurarse de añadir el correcto en sus páginas.

¿Cómo puedo instalar el código de seguimiento si mi sitio web se extiende por varios dominios?

Si su sitio utiliza varios dominios, podrá realizar el seguimiento de sus usuarios igualmente; sólo será preciso realizar unas pequeñas modificaciones en su código de seguimiento.

1. Añada las siguientes líneas (en negrita) al código de seguimiento en todas las páginas de ambos dominios:

<script src="https://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct="UA-xxxx-x";
_udn="none";
_ulink=1;
urchinTracker();
</script>

2. A continuación, deberá añadir la función __utmLinker a todos los vínculos que haya entre los dominios. Si sus vínculos actuales son parecidos a éstos:

<a href="https://www.segundositio.es/?login=parameters">Acceder ahora</a>
cámbielos por estos otros:
<script type="text/javascript">
document.write('<a href="javascript:__utmLinker(\'
https://www.segundositio.es/?login=parameters\');">Acceder ahora</a>');
</script>
<noscript>
<a href=" https://www.segundositio.es/?login=parameters ">Acceder ahora</a>
</noscript>

El código anterior ofrece vínculos para usuarios con o sin la función de JavaScript habilitada. Tenga en cuenta que es necesario cambiar los apóstrofos por una barra invertida allí donde aparezcan en el vínculo o en el texto de éste.

Importante: Si las páginas incluyen una activación de urchinTracker(), utmLinker(), utmSetTrans() o utmLinkPost(), su código de seguimiento de Analytics debe insertarse en el código HTML encima de cualquiera de dichas activaciones.

3. Si envía información entre dominios por medio de formularios, tendrá que utilizar la función

__utmLinkPost() en lugar de la función __utmLinker(). utmLinkPost() agrega información de la

cookie a la dirección URL facilitada del formulario proporcionado.

<form action=»https://newdomain.com/form.cgi» onSubmit=»javascript:__utmLinkPost(this)»>

Funcionará incluso en formularios con el método =»GET».

4. De manera predeterminada, los datos de los informes únicamente incluirán la URI de la solicitud, y no el nombre del dominio. Si desea ver los nombre de dominios en sus informes, puede crear un filtro avanzado para su perfil con los siguientes valores:

Tipo de filtro: Filtro personalizado > Avanzado

Campo A: Nombre de host

Extracto A: (.*)

Campo B: URI de la solicitud

Extracto B: (.*)

Enviar resultados a: URI de la solicitud

Constructor: $A1$B1

40-Google-Analytics-Solutions3

¿Qué debo hacer para realizar el seguimiento de un sitio que utiliza alias de dominio?

Las siguientes instrucciones proporcionan un ejemplo de cómo redirigir el tráfico de los dominios con alias al dominio principal en los servidores IIS y Apache. Con estos pasos, se asegura de que el seguimiento de usuarios de Google Analytics se establece bajo el dominio principal y de que se supervisan todos los usuarios de manera coherente.

Redireccionamiento de alias en servidores Apache Si utiliza un servidor web Apache, la configuración se puede modificar fácilmente para redirigir todo el tráfico que se origina en uno de los alias al sitio principal. Una forma de lograrlo es crear dos entradas de host virtual. La primera será el dominio principal, que incluirá su configuración normal; el segundo host virtual incluirá todos los alias y redirigirá el tráfico al sitio principal:

#—hostvirtual principal

Nombredeservidor www.misitio.es

Aliasdeservidor misitio.es

…

#—hostvirtual secundario

Nombredeservidor misitio.org

Aliasdeservidor ww_.misitio.org misitio.net www.misitio.net

Reescribirmotor en

Reescribirregla ^(.*) https://www.misitio.com$1 [R=301]

El host virtual secundario utiliza una regla de reescritura con un código de redireccionamiento 301 (trasladado permanentemente) para reenviar todo el tráfico al sitio original. En este momento, desde la perspectiva de Google Analytics, este sitio parece tener un único dominio, y está listo para insertarle el código de seguimiento normal de Google Analytics.

Redireccionamiento de alias en servidores IIS

Si utiliza un servidor web Microsoft IIS, la configuración se puede modificar fácilmente para redirigir todo el tráfico que se origina en uno de los alias al sitio principal. Una forma de lograrlo es crear dos sitios web en la configuración del servidor IIS. El primero será el dominio principal (www.misitio.es), que incluirá su configuración normal. El segundo incluirá los alias restantes (misitio.net, misitio.org, etc.) y redirigirá el tráfico al sitio principal.

Para crear un redireccionamiento 301 mediante servidores IIS, siga los pasos que se indican a continuación:

1. Acceda como administrador y abra el Administrador de servicios de Internet en «Inicio

>> Programas >> Herramientas administrativas >> Administrador de servicios de Internet».

2. Seleccione el servidor que aloja su dominio principal.

3. En la carpeta, haga clic en el dominio principal con el botón derecho del ratón y seleccione «Propiedades».

4. Haga clic en la pestaña «Directorio home».

5. En el campo «Redirigir a:» , introduzca el dominio al que desea redirigir el tráfico. Por ejemplo, si desea redirigirlo a misitio.org, introduzca https://misitio.org en este campo.

6. Bajo la sección «El cliente será redirigido a», seleccione «Redireccionamiento permanente para este recurso». Esto creará un redireccionamiento 301 desde su dominio principal a misitio.org.

O bien, si desea utilizar un redireccionamiento 302, desmarque la opción «Redireccionamiento permanente para este recurso».

Si desea traspasar las variables de su dominio principal al dominio nuevo al que está redirigiendo el tráfico, añada el dominio y $S$Q en el campo «Redirigir a:» . Por ejemplo: https://www.misitio.org$S$Q.

Tenga en cuenta que no es necesario que añada una barra después del dominio.

Los servidores IIS utilizan los parámetros $S para reemplazar la ubicación del subdirectorio. A su vez, utilizan $Q para cualquier cadena de consulta añadida al final. De modo que, si su URL principal es https://www.misitio.es/index.html?id=google, redirigirá el tráfico a https://www.misitio.org/index.html?id=google.

Si utiliza $S$Q, asegúrese de que estén seleccionadas tanto la opción «URL exacta introducida arriba» como la opción «Redireccionamiento permanente para este recurso» bajo la sección «El cliente será redirigido a».

La entrada Manual de uso de google analytics: Parte 2 Cómo insertar el código de seguimiento se publicó primero en Diseño de páginas web Asturias.

]]> https://jorgedelbarrio.com/diseno-web/manual-de-uso-de-google-analytics-parte-2-como-insertar-el-codigo-de-seguimiento/feed/ 0 5708 SEO Guía básica https://jorgedelbarrio.com/marketing-2/seo-guia-basica/ https://jorgedelbarrio.com/marketing-2/seo-guia-basica/#respond Tue, 15 Sep 2015 13:58:30 +0000 http://jorgedelbarrio.com/?p=5704 SEO Guía básica Un colega de trabajo me pidió ayuda para realizar una charla sobre SEO. Quería ser corto y no extenderme para darle las explicaciones más básicas y a la vez suficientes para que pudiera impartir dos o tres clases de un par de horas, así que redacté el texto que os pongo a […]

La entrada SEO Guía básica se publicó primero en Diseño de páginas web Asturias.

]]> SEO Guía básica

Un colega de trabajo me pidió ayuda para realizar una charla sobre SEO. Quería ser corto y no extenderme para darle las explicaciones más básicas y a la vez suficientes para que pudiera impartir dos o tres clases de un par de horas, así que redacté el texto que os pongo a continuación.

Espero que os sea de utilidad.

En primer lugar deberías de escuchar una conferencia que es la base que tendría que realizar cualquier empresa para realizar el SEO:

Por otro lado el SEO es fácil de entender y llevar. Google valora varias cosas, pero sobre todo el sentido común. Lo que pretende es mostrar resultados relevantes, porque es lo que le transforma en un buen buscador, por lo tanto para realizar un buen SEO lo imprescindible es tener una web actualizada (viva) y también con metadatos que correspondan con lo que se cuenta. Es decir:

Web viva

Mantener actualizado el blog y si por ejemplo está construida sobre un CMS como wordpress o joomla, mantener actualizado el CMS. Esto es así porque si google o cualquier buscador detecta una web desactualizada desde hace más de un año, entiende que es una web muerta y por lo tanto poco relevante.

Versión móvil o responsive

El móvil supone actualemente el 50 ó 60% del tráfico de internet, por lo tanto cualquier buscador que detecte una web que no tenga su propia versión móvil o sea responsive (a través de CSS), la penalizará hasta el punto de expulsarla de las búsquedas. La principal pega que están poniendo actualmente es en la distancia que se marca entre texto e imágenes. Google está pidiendo que tenga como mínimo 10 píxeles de distancia entre texto e imágenes, si no se hace así, considera que no tienes versión móvil. Evidentemente, si el menú o la navegación no está adaptado a móviles o tablets, directamente te expulsa.
responsive_design_kinetic_knowledge

Metadatos

Las webs tienen etiquetas h1 (titulares) y textos encuadrados con la etiqueta html «p» (párrafos). Si en los metadatos se ponen otras cosas que no corresponda con el titular o el párrafo, google penaliza automáticamente estas webs. Por otro lado las metaetiquetas o metatags (palabras clave que describen la página), también tienen que estar incluídas en el titular o en el párrafo. Si no, google considera que estás mintiendo con respecto a lo que habla tu web y queda expulsada. Esto se hizo a partir de la entrada del algoritmo penguin (hace dos años) para evitar las granjas de enlaces y las trampas de posicionamiento con landings ficticias que no tenían nada que ver con la web y que creaban empresas como QDQ. Si quieres ampliar información puedes visitar a los mejores en el tema, que son éstos.

SEM: SEO de pago

El clásico adswords. Adswords está resultando muy caro y los resultados se evaporan cuando finalizas la campaña. Antes google te premiaba con posicionamiento tras una campaña larga en adswords. Ahora mismo cuando finaliza, el posicionamiento se pierde. Campañas en redes sociales como facebook parece que dan un resultado muy rápido (consigues cientos de fans en menos de una semana), pero no se debe de olvidar que lo importante es que visiten tu web y compren y eso tampoco se consigue a través de facebook que no deja de ser una espejismo de resultados reales.

Paciencia

Ahora mismo google no empieza a tomarse en serio una web hasta que pasa un año. Durante el primer año, las visitas serán mediocres. A partir del primer año (y con primer año me refiero exactamente a 366 días), si se ha trabajado el blog y todo lo dicho anteriormente es correcto, el posicionamiento y las visitas se disparan. Esto es así, porque cuando compras un dominio, la compra es anual. Muchas empresas prueban durante un año y al no recibir lo esperado, se rinden y no renuevan, así que se ha demostrado que durante el primer año hay un auge de webs no relevantes. Las que aguantan el segundo año, pasan a ser relevantes.

Sentido común

Escucha la charla de Aceros de Hispania al completo y sabrás a qué me refiero.

No dejes que el SEO estropee tus contenidos

Por los puntos que acabo de nombrar anteriormente se está supeditando al posicionamiento. Periódicos como el Huffingtong Post, entro otros muchos, sacan artículos del tipo «las diez cosas que …». Listados que funcionan bien en el posicionamiento, pero que no aportan nada a la comunidad. Trata de no emponzoñar tu contenido sólo para ganar audiencia y tendrás unos textos que podrán permanecer más tiempo en la red porque son relevantes.

 

La entrada SEO Guía básica se publicó primero en Diseño de páginas web Asturias.

]]> https://jorgedelbarrio.com/marketing-2/seo-guia-basica/feed/ 0 5704 Manual de uso de google analytics: Parte 1 Creación de la cuenta y sus perfiles https://jorgedelbarrio.com/diseno-web/manual-de-uso-de-google-analytics-parte-1-creacion-de-la-cuenta-y-sus-perfiles/ https://jorgedelbarrio.com/diseno-web/manual-de-uso-de-google-analytics-parte-1-creacion-de-la-cuenta-y-sus-perfiles/#respond Wed, 02 Sep 2015 10:15:45 +0000 http://jorgedelbarrio.com/?p=5696 Manual de uso de google analytics: Parte 1 Creación de la cuenta y sus perfiles 1.1 ¿Qué es Google Analytics? Google Analytics le muestra cómo encuentran su sitio los usuarios, cómo lo exploran y de qué manera puede mejorar usted su experiencia. Incremente el rendimiento de la inversión, aumente las conversiones y consiga más beneficios […]

La entrada Manual de uso de google analytics: Parte 1 Creación de la cuenta y sus perfiles se publicó primero en Diseño de páginas web Asturias.

]]> Manual de uso de google analytics: Parte 1 Creación de la cuenta y sus perfiles

1.1 ¿Qué es Google Analytics?

Google Analytics le muestra cómo encuentran su sitio los usuarios, cómo lo exploran y de qué manera puede mejorar usted su experiencia. Incremente el rendimiento de la inversión, aumente las conversiones y consiga más beneficios a través de Internet. Con más de 80 informes, su cuenta gratuita de Google Analytics realizará el seguimiento de los usuarios de su sitio, así como del rendimiento de sus campañas de marketing, tanto de las campañas de AdWords como de las campañas por correo electrónico o de cualquier otro tipo de programa publicitario.

Gracias a la información recopilada, sabrá qué palabras clave funcionan verdaderamente, qué texto de anuncio es el más eficaz y en qué punto del proceso de conversión abandonan los usuarios su sitio web. No crea que por ser un programa gratuito las prestaciones son limitadas: Google Analytics ofrece un paquete de análisis web completo y potente. Los anunciantes de AdWords pueden obtener todas estas ventajas desde su cuenta de AdWords, ya que Google Analytics está totalmente integrado en este programa. Todos sus informes y ajustes están disponibles en la pestaña Google Analytics.

google-analytics-services

Para empezar a utilizar el programa, no tiene más que ir a la página www.google.com/analytics/es-ES o hacer clic en la pestaña Google Analytics de su cuenta de AdWords. Desde ahí, accederá a un sencillo proceso de registro, en el que deberá añadir un fragmento de código.

Cuando lo haya completado, el programa empezará a reunir información inmediatamente y le permitirá mejorar el retorno de la inversión.

1.2 ¿Cómo funciona Google Analytics?

Google Analytics utiliza una cookie de origen y código JavaScript para recopilar información acerca de los usuarios que visitan un sitio web y realizar el seguimiento de los datos de su campaña publicitaria. El programa efectúa un seguimiento anónimo de la forma en que los usuarios interactúan con el sitio en cuestión. Ello incluye su procedencia, las acciones que han realizado y si han alcanzado alguno de los objetivos de conversión del sitio. Google Analytics también realiza el seguimiento de sus datos de comercio electrónico y los combina con información sobre la campaña y las conversiones para proporcionar más detalles sobre el rendimiento de sus campañas publicitarias. Toda esta información se presenta a través de informes exhaustivos, intuitivos, visuales y de fácil lectura.

Google Analytics movil

Google Analytics no afectará al rendimiento ni al aspecto de su sitio web, no alojará archivos adicionales en él y sus páginas no activarán archivos GIF. Con la información de Google Analytics, podrá dirigir el tráfico a su sitio y convertirlo con mayor eficacia.

1.3 ¿Qué debo hacer para registrarme en Google Analytics?

Para registrarse en Google Analytics, visite la página principal correspondiente en la dirección www.google.com/analytics. En ella, podrá crear una cuenta nueva de forma gratuita.

Si no dispone de una cuenta de Google, deberá crear una antes de registrarse en Google Analytics. Cuentas de Google no sólo ofrece la ventaja de acceso único a las distintas aplicaciones de Google, sino que también garantiza la máxima seguridad para su cuenta. Si lo desea, puede crear una cuenta de Google en la página principal de Google Analytics.

Si es usted anunciante de AdWords, puede registrarse en Google Analytics desde su cuenta de AdWords. Para acceder al servicio, haga clic en ella y siga las instrucciones que le permitirán supervisar los datos relativos a su campaña de AdWords y al retorno de su inversión.

1.4 ¿Cómo puedo permitir que otros usuarios tengan acceso a mis informes de Google Analytics?

Google Analytics permite añadir el número de usuarios que desee a su cuenta, así como conceder varios niveles de acceso a sus informes. Puede otorgar acceso a los informes de determinados perfiles cuando se disponga a añadir a un usuario nuevo, o bien modificar el acceso para los usuarios que ya existen. Para conceder acceso a sus informes al crear un usuario nuevo:

  1. Haga clic en Administrador de acceso.
  2. Haga clic en Añadir.
  3. Introduzca el nombre, apellidos y dirección de correo electrónico del usuario, teniendo en cuenta que esta última debe ser una cuenta de Google.
  4. Defina la opción Tipo de acceso para el usuario en cuestión en Sólo ver informes o Administrador de cuenta, que permitirá al usuario modificar los ajustes de la cuenta.
  5. Seleccione los perfiles a los que desea que este usuario tenga acceso. Tenga en cuenta que el usuario únicamente dispondrá de acceso a los informes que se especifiquen.
  6. Haga clic en Añadir para copiar estos perfiles en la lista Perfiles seleccionados del sitio web. 7. Haga clic en Finalizar para crear el nuevo usuario.

Ahora podrán acceder utilizando la dirección de correo electrónico y la contraseña de su cuenta de Google. Para modificar el acceso de usuarios que ya existen:

  1. Haga clic en Administrador de acceso.
  2. Localice el usuario correspondiente en la lista Acceso existente y haga clic en Editar.
  3. En Perfiles disponibles del sitio web, seleccione los perfiles a los que desea que este usuario tenga acceso. Tenga en cuenta que el usuario únicamente dispondrá de acceso a los informes que se especifiquen.
  4. Haga clic en Añadir para copiar estos perfiles en la lista Perfiles seleccionados del sitio web.
  5. Haga clic en Guardar cambios para actualizar el nivel de acceso de este usuario.

1.5 ¿Qué es un perfil de sitio web y para qué sirve?

Básicamente, un perfil de sitio web es un conjunto de normas que definen los informes que usted ve. Normalmente, cada perfil corresponde a un dominio, de modo que podrá consultar informes de cada uno de los dominios por separado. Los perfiles también sirven para efectuar un seguimiento de los subdominios de manera independiente. Para ello, configure filtros de modo que sólo muestren resultados de los subdominios que desee.

Si prefiere realizar el seguimiento de las secciones de un sitio web, cree varios perfiles y aplique filtros para que muestren los datos que desea obtener. ¿Cómo puedo realizar el seguimiento de determinadas áreas de mi sitio web por separado? Otra de las utilidades de los perfiles es controlar el acceso a los informes. Dado que los tipos de informes disponibles para un perfil se definen mediante sus ajustes, le sugerimos crear dos o más perfiles para un dominio, cada uno de ellos con un conjunto de informes distinto. Si a continuación asigna los usuarios que desea a un determinado perfil, se asegurará de que sólo consultan los informes que les corresponden.

1.6 ¿En qué se diferencian un perfil y una cuenta?

Un perfil es un grupo de normas y ajustes que definen los informes que ve el usuario. Entre ellos, se incluyen los ajustes de objetivos y filtros, los valores de la página predeterminada y la URL del sitio web y los niveles de acceso del usuario. En especial, los ajustes de objetivos y filtros tienen un gran efecto en los datos que aparecen en los informes. Lo más habitual es que haya un perfil por dominio; sin embargo, también se pueden crear perfiles duplicados que utilicen el mismo código de seguimiento (y que, por tanto, recojan los mismos datos), pero a los que se apliquen ajustes distintos.

Esta configuración resulta útil para probar filtros, o cuando se requieren más de cuatro objetivos y redireccionamientos en un solo sitio web. Una cuenta es un conjunto de perfiles. Algunos ajustes de Google Analytics se aplican de manera global en toda la cuenta, mientras que otros se aplican únicamente por perfiles. Entre los ajustes que se aplican en los perfiles se encuentran:

  • Paneles y categorías de informes disponibles
  • Moneda
  • Exclusiones de parámetros de consulta de URL
  • Objetivos y redireccionamientos
  • Filtros • Acceso por usuario
  • Importaciones de datos de coste de AdWords (la vinculación a cuentas de AdWords se realiza en cada cuenta)

Los siguientes ajustes se aplican a toda la cuenta:

  • Acceso de administrador (los administradores de cuentas tienen acceso a todos los informes y perfiles de su cuenta)
  • Vinculación a una cuenta de AdWords

google-analytics

1.7 ¿Puedo definir más de cuatro objetivos por perfil?

Google Analytics admite hasta cuatro objetivos por perfil, cada uno de ellos con un redireccionamiento definido y valores fijos o dinámicos, en caso de que procedan de sus páginas de comercio electrónico. Si su sitio requiere más de cuatro objetivos, puede configurar otro perfil.

1.8 ¿Cómo puedo añadir un perfil?

Los perfiles le permiten ver los informes de dominios y subdominios concretos, así como de los datos filtrados sobre sus páginas web. Encontrará más información sobre el uso de perfiles en ¿Qué es un perfil de sitio web y para qué sirve?

Crear-cuenta-Insertar-código-de-Google-Analytics

 

Para añadir un perfil nuevo:

  1. Haga clic en Ajustes de Analytics.
  2. En el cuadro Perfiles del sitio web, haga clic en Añadir perfil de sitio web.
  3. Seleccione el botón correspondiente para añadir un perfil para un dominio existente (uno para el que ya exista un perfil) o para añadir un perfil para un dominio nuevo.
  4. En caso de añadir un perfil para un dominio existente, seleccione el valor adecuado en la lista desplegable Seleccionar dominio e introduzca el Nombre de perfil que desea que aparezca en su cuenta.
  5. Si se dispone a crear un perfil para un dominio nuevo, introduzca el valor en el campo de texto correspondiente. Si lo desea, puede indicar la ruta de un dominio o subdominio y especificar en la lista desplegable si el dominio utiliza https:// o https://.

Haga clic en Finalizar para añadir el nuevo perfil o en Cancelar para terminar el proceso sin guardar los cambios. Una vez creado y guardado un perfil, deberá añadir el código de seguimiento a sus páginas.

¿Puedo añadir más perfiles?

Google Analytics ofrece varios perfiles, lo que permite a la mayoría de los usuarios crear uno o varios perfiles por cada dominio web del que desean efectuar un seguimiento. Si desea realizar el seguimiento de más sitios, puede combinar varios dominios en un mismo perfil. Para ello, añada el código de seguimiento del perfil a todas las páginas y utilice filtros personalizados para mostrar la raíz de la consulta.

1.9 ¿Cómo puedo cambiar el nombre de un perfil?

  1. Para cambiar el nombre de un perfil existente:
  2. Haga clic en el vínculo Ajustes de Analytics.
  3. Encuentre el perfil cuyo nombre desea cambiar y haga clic en Editar. Aparece la pantalla Editar ajustes del perfil.
  4. En la barra Información del perfil del sitio web principal, haga clic en Editar.
  5. Actualice el campo Nombre del perfil.

Haga clic en Guardar cambios para cambiar el nombre del perfil o en Cancelar para finalizar el proceso sin guardar los cambios. Recibirá un mensaje de error que especifica «entrada no válida» cuando intento crear un perfil nuevo.

Si el dominio especificado durante la creación del perfil no se ha escrito correctamente, Google Analytics evitará que siga avanzando hasta que haya corregido los errores. Si le surge este problema:

  • Asegúrese de que no ha introducido ninguna errata, caracteres extraños o adicionales en la entrada de su dominio. • Utilice la lista desplegable para seleccionar https:// o https://; no lo escriba en el cuadro de texto.
  • Elimine la ruta del directorio de la URL que está introduciendo (no incluya nada al final del nombre de dominio, ni siquiera una «/» adicional). Los datos de sus informes de Google Analytics se basarán en el lugar donde introduzca el código de seguimiento en vez de en la URL exacta que especifique en este paso.

La entrada Manual de uso de google analytics: Parte 1 Creación de la cuenta y sus perfiles se publicó primero en Diseño de páginas web Asturias.

]]> https://jorgedelbarrio.com/diseno-web/manual-de-uso-de-google-analytics-parte-1-creacion-de-la-cuenta-y-sus-perfiles/feed/ 0 5696 Cómo enfrentarse a Google Panda: Buenas prácticas SEO https://jorgedelbarrio.com/diseno-web/como-enfrentarse-a-google-panda-buenas-practicas-seo/ https://jorgedelbarrio.com/diseno-web/como-enfrentarse-a-google-panda-buenas-practicas-seo/#respond Thu, 26 Feb 2015 03:03:41 +0000 http://jorgedelbarrio.com/?p=5656 Cómo enfrentarse a Google Panda: Buenas prácticas SEO Consejos sobre SEO para tiendas online. Google lanzó el operación Panda en febrero de 2011. Su efecto es penalizar los sitios web de desestimación estatura (con capacidad pueril, pillado o adulterado), arruinar con ellos y eliminarlos de sus rankings. ¿Cómo saber si a tu sitio le afecta […]

La entrada Cómo enfrentarse a Google Panda: Buenas prácticas SEO se publicó primero en Diseño de páginas web Asturias.

]]> Cómo enfrentarse a Google Panda: Buenas prácticas SEO

Consejos sobre SEO para tiendas online.

Google lanzó el operación Panda en febrero de 2011. Su efecto es penalizar los sitios web de desestimación estatura (con capacidad pueril, pillado o adulterado), arruinar con ellos y eliminarlos de sus rankings.

¿Cómo saber si a tu sitio le afecta Panda?

Llamo a Panda “el diabólico afónico”. Con Penguin el travesía jerarquizado cae rápidamente, sin embargo Panda va minándolo algo a algo. Por eso tienes que vigilarlo de alambrada si crees que te está afectando. Veamos cómo reducen tu navegación las penalizaciones de Penguin y Panda:

Google-panda-vs-Google-penguin

Como veis, el magnitud mortal de Penguin es instantáneo mientras tanto que Panda actúaprobación a bigardo período. Las penalizaciones de Panda no se detectan tan alado como las de Penguin y cuando lo haces… puede que ya sea tarde.

A como tu cabotaje no cae en incesante de un día para otro (aria en casos extremos), necesitas antecedentes diarios de tu travesía organizado de Google Analytics (u otra aparejo). ¿A desde el tratamiento del e-commerce? Penguin te forzaría a ceñir tu mercado online profuso a priori que Panda. A reponerse de una penalización de Penguin todavía es copioso más intrincado.

¿Quieres cultura si te está afectando? Vigila las caídas de travesía, también las chiquilloñas. Puede ser achuchado de detectar porque el crucero mengua paulatinamente a lo vago de varias semanas.

Mi buen partidario y mentor SEO MJ Cachon me recomendó unas cuantas herramientas estupendas que vosotros igualmente podéis servirse: Panguin, Website Penalty Indicator oSearchMetrics.

Otra disyuntiva muy vibrante y gratuita es la proceder de señal de Google Analytics. ¡Crea alertas diarias para instrucción a qué ritmo cae tu navegación corporal!

Pero, ¿qué hay de irregular en mi establecimiento PrestaShop?

Bueno, veamos qué le gusta almorzar al pigmeo Panda (adicionalmente de bambú):

  • Contenido baladí
  • Contenido aporreado
  • Contenido duplicado
  • Errores 404 recurrentes
  • Enlaces de desaparecido elevación
  • Palabras máximo de orla
  • Contenido creado para buscadores, no para personas
  • Velocidad de gabela

Ese es el centro del operación Panda. ¿Quieres entender su funcionamiento más en peculiaridad? Bill Slawski explica en su blog SEO by the sea cuáles son las patentes desarrolladas y adquiridas por Google para gestar Panda.

¿Aómo me recupero de una penalización de Panda?

Contesta a las siguientes preguntas y descifrarás la opción a tus problemas. Aé sincero: tu travesía depende de ello.

¿Mis contenidos son pobres o insustanciales?

Esta pregunta es cardinal para las páginas de categorías y especie y para blog (¡si aún no tienes, obligarseías!). Recuerda que los buscadores valoran el superficie por además de todo: ¡crea textos originales y útiles! No copies y pegues las descripciones que ya usan tu distribuidor o tu fabricante. Siteliner es una útil fantástica para entender la dimensión común de tu interrupción: te dirá qué porcentaje de espacio duplicado, global y forastero estás usando.

Si tienes que cambiar una gran coplosidad de textos no obstante estás demasiado difícil vendiendo, ¡contrata a cierto para que lo haga! Nunca —insisto, NUNCA— confíes la comienzo de contenidos a un vendedor ahorrador. Si tienes un dificultad con Panda, emplear a cierto que NO redacta moblaje forastero y de elevación romanza lo agravará.

¿Mi interrupción está plagado de errores 404?

Escanea tu asedio con las arañas Screamingfrog o Xenu para detectar errores 404 y arréglalos. A, cómodamente, usa las herramientas para webmasters de Google para adeudar estos errores controlados y sigue sus directrices para suscitar páginas 404 útiles. ¡Ten fabricado cuando borres o desactives clase y categorías de tu bazar! Redirecciona siempre (¿recuerdas los redireccionamientos 301?) a género similares. A haz lo mismo con las categorías.

¿Hay enlaces de quebranto estatura apuntando con destino a mi incomunicación web?

Solucionar oriente atolladero es más enrevesado y igualmente es arduo adivinar una útil gratuita que evalúe sistemáticamente la talla de los backlinks. Mi referencia: haz una primera crítica con Majestic, Ahrefs o Moz’s Open Site Explorerpara establecer si tus enlaces son buenos o malos. ¿Parece que hay un apuro agarrotado? Recurre a alternativas más avanzadas: Link Detox y la aparejo de desautorización para webmasters Disavow Tool de Google. Dos trucos rápidos:

  • Si más del 5% de los enlaces tiene las mismas palabras decisivo (por antonomasia: mercar libros online) en el libro de fondeo, ¡estás próximo! (Con el contrahecho injusto de Majestic, sabrás si es así).
  • Evita los sitios clásicos de enlaces de muerto estatura: granjas de enlaces, directorios web y de posesiones, bloques de enlaces, enlaces sitewide y en pies de páginas o enlaces en blogrolls, comentarios de blogs o foros y en firmas o perfiles.

¿Mi mercado online tiene palabras álgido de ribete?

Esta es dócil. ¿Alguna vez has sobre-optimizado tus páginas PrestaShop llenándolas de palabras gélido repetidas? Si la respuesta es “posiblementes” o “embravecido… puede”, no hay achares: lo has influencia.

Corrige las páginas con superficie razonable. No repitas la misma acento congelado más de tres veces por página, sobre todo si el obra es sustituto. ¡Google sabe lo que estás haciendo y no le gusta!

¿Estoy creando capacidad para buscadores en vez de para mis clientes?

Esta todavía es sencilla. Cuando redactas, ¿piensas más en los robots que en las personas? Si has respondido otra vez “suertes” o “impetuoso… puede”, sí, lo haces. Puedes altercar a lo que yo llamo “la gimnasia de mamá”: si tu estrato no entiende el compendio ni qué estás vendiendo, empieza de novato. Recuerda que son personas las que compran tus mercancía, no Google.

A lo mejor, para el límite: ¿Mi página es más lenta que una balata?

Si es así, ¡dale rapidez! Empieza por las opciones de explotación que están en la pestaña Preferencias del back-office de tu almacén PrestaShop. Después, adiestramiento estos trucos: reduce el convexidad de las imágenes, haz una adiestramiento TTFB (etapa hasta el primer byte) en tu cuidador o traslada tu almacén a un cuidador dedicado. ¿Por qué no usas una red de ofrenda de espaciosidad para que las imágenes, los CSS y el JavaScript se carguen más veloz? También puedes pescar un módulo de caché de la mercado PrestaShop’s Addons.

Bola infrecuente: Trucos para los sitios web PrestaShop

Aí, lo reconozco: me encanta PrestaShop. Lo uso desde hace cuatro primaveras y he aprendido un cantidad sobre su funcionamiento. Aquí tenéis algunos trucos más para reservar una fallecimiento SEO súamarradero:

  • Mantén el fichero robots.txt aseado. Evita CUALQUIER parámetropolitano inaparejo, sobre todo los que crea el módulo de tráfico por capas.
  • Comprueba el planisferio de tu incomunicación regularmente y elimina las páginas innecesarias: carrito, remesa, aparición de plazo, direcciones, bonos de beneficio, etc.
  • Ten minucioso cuando importes archivos CSV. Indica la época de génesis del producto… o Google podría opinar que son de 1.969 y se equiparían errores en el atlas del asedio de las herramientas para webmasters.
  • Presta ayuda cuando crees subdominios CDN. A veces (si no se han creado acertadamente), duplican el espacio. ¡Revísalos y vuelve a revisarlos.
  • Dale celeridad a tu aislamiento cuando esté nervioso. Usa la útil Google Page Speedy GTMetrix.com para producir historial sobre lo que se puede beneficiar.

La entrada Cómo enfrentarse a Google Panda: Buenas prácticas SEO se publicó primero en Diseño de páginas web Asturias.

]]> https://jorgedelbarrio.com/diseno-web/como-enfrentarse-a-google-panda-buenas-practicas-seo/feed/ 0 5656 Google Analytics para principiantes https://jorgedelbarrio.com/diseno-web/google-analytics-para-principiantes/ https://jorgedelbarrio.com/diseno-web/google-analytics-para-principiantes/#respond Thu, 26 Feb 2015 02:43:15 +0000 http://jorgedelbarrio.com/?p=5652 Google Analytics para principiantes Si vendes online, habrás oído hablar de Google Analytics (GA) a tu desarrollador, a tu diseñador o… en uno de nuestros boletines. Sin duda GA es una de las herramientas online más potentes empero la clave de su popularidad es que la versión estándar es totalmente gratuita. ¡Por eso hemos integrado […]

La entrada Google Analytics para principiantes se publicó primero en Diseño de páginas web Asturias.

]]> Google Analytics para principiantes

Si vendes online, habrás oído hablar de Google Analytics (GA) a tu desarrollador, a tu diseñador o… en uno de nuestros boletines. Sin duda GA es una de las herramientas online más potentes empero la clave de su popularidad es que la versión estándar es totalmente gratuita. ¡Por eso hemos integrado sus funcionalidades en el programa PrestaShop!

Suena muy perfectamente, sin embargo ¿qué es cabalmente Google Analytics? Vamos explicártelo de un forma candoroso, sin esos términos tecnológicos que te suenan a chino.

Google Analytics te contribución a comprender el posición de tus clientes.

Instala GA en tu botica online: sabrás qué hacen tus clientes en Internet. ¿Pómo? Imagina que tienes una establecimiento física y contratas a una andoba para que programa todo lo que hace cada cliente. Sus anotaciones serían poco así: “Mujer, 25-30 abriles, entra en la establecimiento a las 15:00, se acerca al neófito escaparate azur, examina tres enseres, va a la cofre y los operación”.

Google Analytics te informa de los enlaces en los que pinchan tus clientes. Si continuamos con el excelencia previo, GA achacará así la gala del cliente: “Hace clic en la encarnación cerúleo, entra en esta prestigio, revisa tres condición y cierra la marco. Ha reformado cinco minutos en el retiro web”. ¿Quieres erudición más? Google Analytics ofrece asesoría demográfica de los clientes (como perduración y apego) y detalles como el edad que pasa un beneficiario viendo un artínalgas manifiesto.

GA te da una concepto de la entusiasmo de tus clientes asimismo con anterioridad de aceptar en tu soledad web. Así sabrás perfectamente de dónde vienen… y captarás mejor cómo han antitético tu establecimiento online.

Google Analytics convierte datos en consultoría.

Si observas los datos, sabrás cómo se mueve cada gallo por tu bloqueo web. ¿A para qué? ¿Acaso importa si un cliente que ha pinchado en la símbolo cerúleo está cinco minutos en la almacén? No. Sin antecedentes para concordar, los datos carecen de audacia porque no dicen carencia aprendiz sobre tu comercio.

GA reúne todos los datos recopilados y los procesa para ofrecerte asesoría sobre tu incomunicación web. Por paradigma: yuxtaposición el permanencia que todos los clientes pasan en tu asedio web, lo divide entre el emblema de visitantes y te dice cuál es el años meteorismo de las visitas a tu comercio. ¡Ahora ya sabes si una reconocimiento de cinco minutos está por además o por abajo de la average!

Aquí tienes algunos ejemplos de consultoría que puedes ceder con Google Analytics:

  • Tráfico de visitantes durante un tiempo notorio
  • Relación entre visitantes nuevos y habituales
  • Fuentes que te proporcionan la máximo multitud de crucero
  • Oportunidades procedentes de campañas en redes sociales
  • Productos que más se añaden al carrito
  • Comportamiento de operación de los clientes

Google Analytics te participación a refrescar decisiones más inteligentes.

Con Google Analytics tendrás estadísticas e consultorio sobre cualquier postura relacionado con tu soledad web. Sin secuestro, no toda la consultoría es relevante. Por antonomasia, si vendes online en los Estados Unidos, ¿te enamorarán esos tres visitantes de Brasil? Seguramente no. Pero querrás sapiencia desde que páginas han llegado a tu interrupción web tus visitantes estadounidenses y quizá desde qué brazo están buscando.

Si configuras GA, podrás producir circunstancias que incluyan romanza la consultorio que necesitas en un etapa ostensible. ¿Quieres un amorfo de marketing con el navegación entrante y otro monstruoso cambista apartado que incluya aria el travesía oriundo de campañas de Google AdWords? No hay prisión, cada monstruoso te da aria los datos que necesitas, cuando los necesitas. Antes de originarse, lee esta acceso: Diez métricas esenciales de e-commerce para Google Analytics.

Google Analytics te cuota a despachar más.

Las tiendas online son más complejas que los sitios web no transaccionales, por lo que el compañía de los clientes incluso es más confuso. Por eso GA lanzó hace algo la útil de bazar electrónico mejorado Ya puedes controlar los hábitos de adquisición de tus clientes: sabrás cómo buscan los mercaderías, cómo los añaden al carrito y, lo más fundamental, cómo finalizan la negocio.

La encrucijada de mercado electrónico mejorado de Google Analytics te aporta consultoría como:

  • Múpuro distinción de categoría por remisión
  • Valor vendaval de cada compra
  • Última página visitada con antelación de realizar la transacción
  • Eficacia de las ventas cruzadas y las sugerencias de existencias de grado más ingreso
  • Clics en las promociones internas o los banners

Google Analytics en pocas palabras

Google Analytics recopila y procesa los datos de tu cerco web y los convierte en asesoría útil y segmentada. ¡Decide con líder e incrementa las ventas!

La entrada Google Analytics para principiantes se publicó primero en Diseño de páginas web Asturias.

]]> https://jorgedelbarrio.com/diseno-web/google-analytics-para-principiantes/feed/ 0 5652 WordPress 4.0 ya está disponible https://jorgedelbarrio.com/diseno-web/wordpress-4-0-ya-esta-disponible/ https://jorgedelbarrio.com/diseno-web/wordpress-4-0-ya-esta-disponible/#respond Fri, 05 Sep 2014 20:39:04 +0000 http://jorgedelbarrio.com/?p=3082 WordPress 4.0 ya está disponible. Ya está listo para descargar, actualizar o instalar WordPress 4.0 “Benny”, la última versión del CMS que ha revolucionado la publicación en la red y seguirá haciéndolo. Las novedades de WordPress 4.0 que vas encontrar y disfrutar desde ya mismo son las siguientes:   Vista previa de adjuntos en el editor […]

La entrada WordPress 4.0 ya está disponible se publicó primero en Diseño de páginas web Asturias.

]]> WordPress 4.0 ya está disponible. Ya está listo para descargar, actualizar o instalar WordPress 4.0 “Benny”, la última versión del CMS que ha revolucionado la publicación en la red y seguirá haciéndolo.

Las novedades de WordPress 4.0 que vas encontrar y disfrutar desde ya mismo son las siguientes:

 

wordpress-4.0-benny-1024x576

Vista previa de adjuntos en el editor

A partir de ahora solo tienes que pegar la URL de un adjunto para ver en el editor, sin necesidad de publicar o guardar un borrador, una vista previa del objeto incrustado, ya sean vídeos de YouTube, listas de reproducción de audio, mapas o lo que sea.

El sistema es automático, en cuando pegues la URL, en vez de la dirección web, verás automáticamente el adjunto en todo su esplendor, y si es un vídeo o audio se reproduce automáticamente.

previsualizar-objeto-incrustado-editor-WordPress-4.0-500x427

En tu idioma desde la instalación

WordPress 4.0 ya te deja elegir el idioma desde el primer momento de la instalación. Nada más empezar a instalarlo te muestra una pantalla en la que elegir tu idioma, y una vez seleccionado todo el proceso posterior ya es en tu lengua, así como la instalación definitiva, que descarga automáticamente desde la localización en tu idioma más reciente.

elegir-idioma-instalacion-wordpress-1-500x308

Y no solo eso, sino que desde la pantalla de “Ajustes -> Generales” podrás cambiar en cualquier momento el idioma de WordPress, ahí es nada.

cambio-idioma-wordpress-4.0-500x242

Desde mi punto de vista esta es una de las novedades más relevantes para la popularización (aún más) de WordPress.

Mejoras de navegación en la librería multimedia

La librería multimedia, esa gran desconocida e infrautilizada pantalla de administración de WordPress, quizás ahora reciba más atención por tu parte, pues se ha rediseñado casi completamente.

Se ha incorporado una visualización en modo cuadrícula (o rejilla, según los gustos), mucho más intuitiva, además de recibir también la incorporación del navegador de adjuntos, desde el que revisarlos en toda su amplitud.

Dudo mucho que esto redunde en un mayor uso pero ahí está y ahora es más práctico y, sobre todo, bonito.

Mejoras en el personalizador de Widgets

Ahora se mostrarán los widgets en un panel separado del personalizador, haciendo más intuitivo – si cabe – su uso.

personalizador-widgets-wordpress-4.0-500x385

Selector de color de texto en el editor

El tristemente desaparecido selector de colores de texto está de vuelta ¡Gracias!

selector-colores-texto-editor-wordpress-4.0-500x287

Barra de formato del editor que se desplaza mientras escribes

Esta es una de las mejoras que más apreciarás en el trabajo día a día de WordPress, pues ahora la barra de iconos de formato, tanto en el editor visual como en el de texto, ya no se queda arriba cuando haces scroll por el texto sino que te sigue, facilitando sobremanera la edición de textos.

Una auténtica gozada.

barra-editor-wordpress-4-500x249

Pero no solo eso, también se expande la caja del editor a medida que escribes, una gozada.

Más objetos incrustables mediante oEmbed

Se ha ampliado la lista de objetos que puedes incrustar fácilmente, como …

  • Charlas TED
  • Mixcloud
  • CollegeHumor.com
  • PollDaddy
  • Issuu
  • Listas de reproducción de YouTube

modificar-mapa-google-en-wordpress-500x375

Rediseño y mejora en el instalador de plugins

Otra de las ventanas de administración que ha sufrido importantes mejoras es la del instalador de plugins, que hereda el aspecto del instalador de temas para hacerlo más visual y atractivo.

instalador-plugins-wordpress-4.0-500x220

También se ha mejorado enormemente la ventana de información de cada plugin, como no podía ser de otro modo, incorporando un sistema de iconos.

ventana-información-plugin-wordpress-4.0-500x458

Pero lo mejor de todo es que ahora te mostrará primero los plugins para los que haya una localización en tu idioma.

Mejoras para desarrolladores

Entre los cambios “bajo el capó” destacan las mejoras en la Customizer API, que ahora los desarrolladores tendrán más flexibilidad a la hora de ordenar queries y que se han actualizado librerías como la de  jQuery y TinyMCE.

Para terminar aquí tienes el vídeo oficial …

 

La entrada WordPress 4.0 ya está disponible se publicó primero en Diseño de páginas web Asturias.

]]> https://jorgedelbarrio.com/diseno-web/wordpress-4-0-ya-esta-disponible/feed/ 0 3082 A punto de publicarse wordpress 4.0 https://jorgedelbarrio.com/diseno-web/a-punto-de-publicarse-wordpress-4-0/ https://jorgedelbarrio.com/diseno-web/a-punto-de-publicarse-wordpress-4-0/#respond Wed, 20 Aug 2014 09:10:17 +0000 http://jorgedelbarrio.com/?p=1873 A punto de publicarse wordpress 4.0 y siguen llegando noticias sobre el futuro WordPress 4.0 y una muy buena noticia ya confirmada es que WordPress 4.0 será multilenguaje desde el momento de su instalación. Esta internacionalización de WordPress es sin duda algo muy esperado y que no sólo será de gran ayuda a los usuarios de WordPress sino […]

La entrada A punto de publicarse wordpress 4.0 se publicó primero en Diseño de páginas web Asturias.

]]> A punto de publicarse wordpress 4.0 y siguen llegando noticias sobre el futuro WordPress 4.0 y una muy buena noticia ya confirmada es que WordPress 4.0 será multilenguaje desde el momento de su instalación. Esta internacionalización de WordPress es sin duda algo muy esperado y que no sólo será de gran ayuda a los usuarios de WordPress sino que ayudará a la expansión de este fantástico CMS.

wordpress-multilenguaje

Como funcionará WordPress 4.0 multilenguaje

Según el desarrollador principal de WordPress, Andrew Nacin, los objetivos de WordPress 4.0 multilenguaje serán:

  • El primer objetivo es que se pueda elegir idioma en WordPress desde la instalación y a partir de ahí, todos los pasos de la instalación se mostrarán en el idioma seleccionado. Cuando la instalación finalice tendremos el escritorio de WordPress totalmente en nuestro idioma.
  • El idioma seleccionado se podrá cambiar desde la pantalla de ajustes generales de WordPress.
  • Otra opción será la de buscar plugins o temas que estén en el idioma seleccionado. De esta forma si hemos instalado WordPress en español podremos buscar directamente temas o plugins que ofrezcan una traducción al español.
  • Los “paquetes de localización” consistirán en archivos del de core WordPress, algunos archivos traducidos (readme.html, el archivo de licencia o el archivo de configuración wp-config-sample.php) y el archivo de traducción PO/MO del idioma seleccionado. Estos paquetes de localización deberán estar disponibles con cada nueva versión de WordPress de forma inmediata.
  • Los paquetes de localización antes descritos sólo se emplearán para la descargas iniciales, es decir, para instalaciones desde cero. En las actualizaciones se emplearán los “paquetes de idioma” ya que no hay motivo alguno para volver a instalar todos los archivos de los paquetes de localización.
    Para que quede claro, van a existir dos tipos de traducciones: 

    • Los “paquetes de localización” empleados en instalaciones iniciales (incluirán todos los archivos de la traducción).
    • Los “paquetes de idioma” empleados para actualizaciones (sólo incluirán las traducciones necesarias para cada actualización).

Cambios de WordPress 4.0 beta 2

WordPress 4.0 incluirá una nueva vista de rejilla de la librería multimedia, pues estos dos componentes han sido objeto de la solución de múltiples bugs, algo normal cuando se introduce nuevas funcionalidades.

Se ha mejorado el uso de cookies y ahora están enlazadas con una sesión interna para ofrecer una mayor seguridad.

El cambio más significativo introducido en esta versión beta 2 es la inclusión del selector de color(color picker) en el editor de entradas. Recordemos que este selector de colores se había retirado pero por demanda popular se ha vuelto a incluir. Ahora cuando accedemos al botón de acceso a la paleta de colores se nos muestra ademas de la paleta por defecto, las letras “Custom…”, que al hacer click en ellas nos lleva al selector de color. A través de este selector de color podemos seleccionar un color personalizado de tres modos:

  • Desplazando manualmente la cruceta con el ratón.
  • A través del valor hexadecimal del color.
  • A través del valor RGB del color.

color-picker-wordpress-4

Este selector de color seguramente será de utilidad a más de uno. El resto de novedades son más de 170 bugssolucionados.

La entrada A punto de publicarse wordpress 4.0 se publicó primero en Diseño de páginas web Asturias.

]]> https://jorgedelbarrio.com/diseno-web/a-punto-de-publicarse-wordpress-4-0/feed/ 0 1873 Nueva legislación en la venta de medicamentos online https://jorgedelbarrio.com/marketing-2/nueva-legislacion-en-la-venta-de-medicamentos-online/ https://jorgedelbarrio.com/marketing-2/nueva-legislacion-en-la-venta-de-medicamentos-online/#respond Wed, 18 Jun 2014 08:55:58 +0000 http://jorgedelbarrio.com/?p=1835 Nueva legislación en la venta de medicamentos online La nueva ley de venta de medicamentos online va a cambiar totalmente el panorama del e-commerce español. A partir de ahora se inicia una época de venta de medicamentos muy diferente frente a la que conocíamos tradicionalmente. El  Real Decreto 870/2013, por el que se regula la […]

La entrada Nueva legislación en la venta de medicamentos online se publicó primero en Diseño de páginas web Asturias.

]]> Nueva legislación en la venta de medicamentos online

La nueva ley de venta de medicamentos online va a cambiar totalmente el panorama del e-commerce español. A partir de ahora se inicia una época de venta de medicamentos muy diferente frente a la que conocíamos tradicionalmente.

El  Real Decreto 870/2013, por el que se regula la venta a distancia al público, a través de sitios web, de medicamentos de uso humano no sujetos a prescripción médica”  nos dice que en un mes se podrán empezar a vender medicamentos por internet sin una titulación farmacéutica; ten en cuenta que hasta ahora sólo se vendía parafarmacia. La parafarmacia y los medicamentos son un caso paradigmático de venta cruzada, es decir cuando te compras el Ibuprofeno aprovechas para llevarte también unos caramelitos sabor hierbabuena con limón. Esto transforma por completo el panorama del comercio electrónico.

¿Cómo afectará la nueva ley del medicamento al eCommerce?

¿Por qué abre nuevas posibilidades al comercio electrónico? Recuerda que Amazon empezó vendiendo libros. El libro es no-perecedero, fácil de transportar y está estandarizado estandarizado, es decir prácticamente se puede comprar con un número de referencia. Al medicamento le ocurre exactamente lo mismo pero además el medicamento tiene (ha tenido hasta ahora) unos márgenes sensacionales que justifican grandes inversiones en marketing, logística, informática, etcétera.

¿Qué modelos de venta de medicamentos tenemos hoy por internet? Ninguno, hasta ahora sólo eran legal vender parafarmacia por internet. Pero en parafarmacia tenemos dos modelos diferentes según la perspectiva del cliente:

  • El primero es la la tienda electrónica que crea la propia farmacia
  • El segundo es un agregador de farmacias.

Es decir, podemos sólo comprarle a una única marca como PromoFarma que luego sirve desde diferentes farmacias o bien podemos comprar a una farmacia concreta, como puede ser la Palomera de León

¿Cuál ganará de los dos? No tengo ni la más remota idea tal vez con vivan los dos tal vez para haya farmacias que renuncien a estar online, es simplemente que sigan offline apoyados por promocionesFarma, tal vez suceda en este sector lo mismo que ha ocurrido hasta hoy: que la regulación marque la forma del negocio.

La entrada Nueva legislación en la venta de medicamentos online se publicó primero en Diseño de páginas web Asturias.

]]> https://jorgedelbarrio.com/marketing-2/nueva-legislacion-en-la-venta-de-medicamentos-online/feed/ 0 1835 Herramientas de diseño web: Webflow, Edge reflow y Macaw https://jorgedelbarrio.com/diseno-grafico/herramientas-de-diseno-web-webflow-edge-reflow-y-macaw/ https://jorgedelbarrio.com/diseno-grafico/herramientas-de-diseno-web-webflow-edge-reflow-y-macaw/#comments Mon, 02 Jun 2014 14:56:37 +0000 http://jorgedelbarrio.com/?p=1751 Herramientas de diseño web: Webflow, Edge reflow y Macaw Para prepararse para una charla sobre los papeles cambiantes de los diseñadores y desarrolladores, dadas en CÓMO interactivo hace unos meses, me entrevisté con más de 20 tiendas web . Validado por mi propia experiencia, he encontrado que muchos de ellos enfrentan desafíos encajan diseño de […]

La entrada Herramientas de diseño web: Webflow, Edge reflow y Macaw se publicó primero en Diseño de páginas web Asturias.

]]> Herramientas de diseño web: Webflow, Edge reflow y Macaw

Para prepararse para una charla sobre los papeles cambiantes de los diseñadores y desarrolladores, dadas en CÓMO interactivo hace unos meses, me entrevisté con más de 20 tiendas web . Validado por mi propia experiencia, he encontrado que muchos de ellos enfrentan desafíos encajan diseño de respuesta en su flujo de trabajo y el papel de la mayoría de los diseñadores web había cambiado para incluir la programación de una forma u otra. Al menos la mitad de los diseñadores sabían HTML y CSS bien pero quería una forma más visual para llegar a ella. Bueno, una nueva generación de herramientas de diseño visuales sensibles ha llegado. Estas herramientas de diseño que responden son para cualquier persona que entiende de HTML y CSS (o está dispuesto a aprender ) y quiere diseñar visualmente una página web de respuesta – y tienen código para mostrar. Algunas de las más nuevas y visuales constructores de sitio web de respuesta son Webflow, Adobe Edge Reflujo CC y Macaw. Sí , un millón de personas están ahí fuera, incluyendo Squarespace , FROONT y caballete, pero nos centraremos en unos pocos en este artículo. Mi intención no es campeón de estas herramientas, sino más bien para que se familiarice con ellos y discutir sus puntos fuertes y débiles . Para que conste , soy un desarrollador de front-end que -creo sitios web que responden utilizando varios marcos y mi propio código como punto de partida (junto con WordPress). Siempre he sido recelosos de código generado, por una buena razón (recuerde GoLive ? ), Pero también entiendo que herramientas como éstas tienen un tiempo, un lugar y, sí, un público. Usted podría utilizar una de estas herramientas en el proceso de diseño para crear composiciones que responden , sin importar si usted tiene la intención de usar el código generado. Incluso me he tomado a través de algunos de prototipado rápido. ¡Blasfemia! Por lo tanto, vamos a echar un vistazo, a partir de Webflow.

Webflow

Al igual que todas las herramientas que discutiremos, Webflow es un recién llegado a la escena. Es un editor de arrastrar y soltar en el navegador para crear sitios web que responden sin tener que mirar el código . Se requiere una suscripción mensual y tiene múltiples niveles de precios para los individuos y equipos . Incluido en todas las suscripciones está organizando en una red de distribución de contenidos mediante un subdominio ( yoursite.webflow.com ), a menos que quieras pagar unos dólares más para el hospedaje de dominio personalizado . Pero es posible también exportar simplemente el código generado y llevarlo donde quiera. ¿Cómo va el código que genera Webflow , usted pide? Se basa en Bootstrap 3.0, y, sí , algunos de nosotros podría escribir más limpio, más claro , más código semántico, pero dijo todo , el código de Webflow es relativamente limpio. Después de registrarse y el registro, es llegar al salpicadero del Webflow . Esto es donde el control de su cuenta , administrar la configuración del sitio web y comenzar su sitio web. Por defecto, no hay mucho excepto un gran botón azul que mira a la cara , que le insta a crear un sitio web . Puede utilizar una plantilla o empezar de cero. Incluso hay un mercado para las plantillas, de pago y gratuitos , donde se puede vender sus propias plantillas WebFlow .

Primeros pasos con Webflow

Primeros pasos con Webflow

Bloques de construcción

Una vez que haya comenzado un sitio web, te llevan en el diseñador de Webflow, donde sucede la magia. En el diseñador, que actualmente es reconocida sólo en Chrome y Google Canary (que es básicamente Chrome para desarrolladores, con nuevas características que se agregan casi todos los días), se le está mirando fijamente a su primera página en el explorador , con una barra de herramientas a la izquierda y varios los paneles de la derecha. Operaciones genéricos (por ejemplo, agregar páginas , la edición y vista previa) están a la izquierda, y los contenidos y opciones de formato meollo de la cuestión están a la derecha. Desde el panel de «+ » a la derecha, puede arrastrar elementos de diseño (divs o elementos HTML5 fijados a un max-width o un ancho de 100 %) y una cuadrícula personalizable en el diseño de escritorio por defecto. Con su estructura básica en su lugar, usted puede comenzar a insertar contenido de la página. Webflow viene con un conjunto de componentes web estándar (incluyendo listas , enlaces y bloques de texto ) y una serie de widgets personalizables (como iconos de redes sociales y deslizadores sensibles ) que puede arrastrar en la estructura de la página. Para las imágenes , puede utilizar GIF , JPG , PNG o SVG , así como imágenes optimizadas para la retina y Hi- DPI pantallas. También puedes arrastrar el widget »

Diseñador de Webflow

Diseñador de Webflow

Insertar » en el diseño para añadir su propio código.

DISEÑO

Mientras Webflow es arrastrar y soltar, la experiencia no es como el diseño en Photoshop o Illustrator. El contenido se genera encaja más como un rompecabezas y se posiciona utilizando propiedades CSS típicos como el padding, margen y posición. Como un codificador , agradezco la eficacia con Webflow muestra visualmente la estructura HTML y CSS propiedades. Como resultado , el conocimiento de HTML y CSS de trabajo es necesaria, y constructores de sitio web por primera vez puede ser un poco perplejo por algunas de las opciones, pero eso es lo que la ayuda video es para , junto con los iconos en línea de ayuda («?» ) por todas partes. Para ser honesto , el panel de estilo a la derecha, donde se ajusta la mayoría de las propiedades de CSS , es relativamente intuitivo, y la forma en que maneja las propiedades CSS , como relleno y el margen es muy inteligente . Codificadores de CSS podrían sentir que carece y quiere ver el código . Contenido compartido entre páginas es bastante simple , y algunos contenidos relacionados con SEO- , como los títulos y descripciones , se puede establecer por página .

Editar estilo

Editar estilo

DEFINIR SU DISEÑO DE RESPUESTA

Cuando se trata de cómo el contenido responde realmente a la medida del navegador, sigue Webflow cómo la industria inicialmente se acercó el diseño de respuesta : durante tres dispositivos o puntos de interrupción. A medida que agrega y diseñar su contenido y áreas, se puede determinar los tamaños de los dispositivos ( de tres) que van a aparecer en . También puede previsualizar fácilmente el diseño en los tres tamaños desde dentro de la interfaz . En la actualidad, los puntos de corte no se pueden editar en el diseñador, a menos que agregue su propio código en el tablero de instrumentos o exportar el código y editar el CSS a otra parte.

El cambio entre los puntos de interrupción

El cambio entre los puntos de interrupción

Las fuentes, los medios de comunicación, FORMAS Y VINCULACIÓN

  • Fuentes

En estos días , las fuentes alojadas son una necesidad para cualquier diseñador que se precie . La integración de Google Fuentes o un kit de una cuenta Typekit se pueden hacer en el tablero de instrumentos , y esas fuentes serán entonces accesibles en el menú «Fuente» en el área de diseño .

  • Medios de comunicación

Adición de medios (incluyendo vídeo de Vimeo y YouTube ) es bastante fácil, también. Webflow utiliza Embedly incrustar el contenido de una larga lista de proveedores.

  • Formas

Formularios de contacto simples también están disponibles y se pueden instalar y diseñados con bastante facilidad. Usted puede tener los datos que se envían por correo electrónico: Sólo tienes que arrastrar los datos capturados del formulario de la configuración en el panel de control , o el gancho de la forma a otra secuencia de comandos (o simplemente insertar su propio código de formulario).

  • Vínculos

Aparte de las opciones de vínculos típicos (como entre las páginas de sitios web , correo electrónico y teléfono ) , Webflow permite vincular a las secciones de las páginas, con desplazamiento suave entre anclajes insertados automáticamente. También puede insertar un bloque de enlace, que es un área de contenido con un solo vínculo que se le aplica . También puede ajustar fácilmente la apariencia de sus vínculos por el estilo de ellos.

TRABAJANDO CON EL CÓDIGO

Al igual que con la mayoría de otras herramientas, algunas de las características de HTML y CSS más avanzadas están ocultos de manera predeterminada en el espacio de trabajo , pero se puede activar . Si te sientes aventurero , también puede asignar sus propias clases de contenido y cambiar el nombre y eliminar en el Administrador de estilos . Si usted es hábil con el código, puede insertar su propio en las etiquetas de la cabeza y el cuerpo en el salpicadero. Esto abre la puerta a la adición de los componentes personalizados , como plugins jQuery y mucho más . código de Inserción

Insertar código

Insertar código

Webflow es actualmente un constructor de sitio web estático y no está vinculado a un sistema de gestión de contenidos ( CMS) o el sistema de blogs. Usted puede exportar el código de su diseño Webflow utilizar como punto de partida para un WordPress (u otro) de proyecto o incluso como un archivo plano CMS. Pero una vez que se exporta el código, que pierde su conexión con el diseño original en Webflow . Una característica útil de Webflow es la posibilidad de guardar versiones de sitios web. En estos días, la mayoría de nosotros que desarrollan sitios web para ganarse la vida utilizan algún tipo de control de versiones , por lo que, en su forma más simple , podemos volver a versiones anteriores si se produce un problema. En el diseño de Webflow , puede crear manualmente una versión o dejar que WebFlow crear uno de forma automática cada 20 de salvar. Un punto de restauración se creará en la configuración de la página Web del tablero de instrumentos, y se puede añadir una nota en cada punto de restauración. Entonces , si pasa algo, puede restaurar el archivo completo (es decir, sitio web) a una versión guardada anteriormente. Por lo tanto, escribir una nota recordatoria en cada punto de restauración para explicar que la página web es una buena idea.

Restaurando versiones en CMS

Restaurando versiones en CMS

Publicando y exportando

La publicación en la red de entrega de contenido de Webflow (incluido en el presupuesto) es bastante simple , ya que está exportando , si usted prefiere tomar otra parte del código . Puedo imaginar varios usos para esto: las personas que lo usan para crear su propio sitio web de respuesta estática ; diseñadores lo utilizan de demostración de un diseño de respuesta o para pasar el archivo de código exportado a un desarrollador ; y desarrolladores usando piezas del código generado en sus proyectos. Webflow también permite a los usuarios trabajar en colaboración (que cuesta más), incluso mediante el intercambio de plantillas, la transferencia de sitios web para clientes y mucho más.

Exportando el código

Exportando el código

Adobe Edge Reflug CC

Edge reflug es parte de la familia de herramientas de borde y servicios que Adobe ha introducido en los últimos años . La familia incluye Edge Reflow , Edge Animate y Edge Inspeccione , y es una parte de la Creative Cloud , que está basado en suscripciones . A diferencia Webflow , que está basado en el navegador , Borde de reflujo es actualmente una aplicación que se descarga e instala en el disco duro . Debido a reflujo es todavía técnicamente en modo de vista previa pública (como una beta que está disponible para el mundo ) , no está todavía plenamente al horno , y las cosas cambiarán muy probablemente en versiones futuras sobre la base de sugerencias de los usuarios . Edge reflujo es una herramienta de diseño que captura las «de intermediarios» de un diseño de respuesta , que a menudo son difíciles de transmitir al dar el relevo un proyecto a un desarrollador o en la presentación de los conceptos de diseño a un cliente. En otras palabras, Edge reflujo hace que los archivos de Photoshop más sensible amigable.

Bloques de construcción

Al comenzar un proyecto en el reflujo , puede seguir uno de varios métodos . Usted puede crear un proyecto de reflujo que contiene las páginas de su sitio web y empezar a partir de un lienzo en blanco, por así decirlo. Puede importar imágenes de la web y el contenido de Photoshop y luego construir su diseño; hacer esto , incluso se podría importar el contenido en su proyecto de reflujo directamente desde un archivo CC Photoshop (ersión 14.1 + only – CS6 y anteriores no funciona) si el archivo de Photoshop (PSD) se ha establecido correctamente.

Un tercer método es exportar un proyecto de reflujo desde Photoshop CC ( 14.1 + ) como punto de partida para un diseño de respuesta en reflujo . Esto le permite importar las formas , el texto y los activos que ha definido en el documento de Photoshop. Utilizando la tecnología de generador integrado en Photoshop CC (14.1 +), las imágenes optimizadas en la web se generan automáticamente a partir de los nombres de capa en Photoshop. Esta conexión es uno de los grandes puntos de venta de reflujo para aquellos de nosotros que confían en Photoshop para el diseño web .

Copiando CSS de Reflow

Copiando CSS de Reflow

  • DISEÑO

Cuando se trata de diseño , reflujo es bastante similar a Photoshop e InDesign . Cambia la posición de los elementos visuales , en lugar de editar el CSS y HTML para moverlos. Reflujo también requiere que se dibuje contienen elementos en el espacio de diseño , en lugar de arrastrarlos en (como en Webflow) . El flotador : izquierda declaración se aplica a todos los elementos en reflujo por defecto, así que arrastrar el contenido que se encuentra en la página puede ser doloroso al principio. Una vez más , sin embargo, la aplicación que obliga a entender los conceptos de HTML y CSS , porque la mayoría de las funcionalidades relacionadas con el diseño se basa en ellos. Para ayudar a su diseño, Reflujo viene con una rejilla editable que le permite editar las columnas, canalones y opacidad. Cada punto de interrupción de respuesta puede tener un ajuste de rejilla diferente. Puede crear múltiples páginas, y lo más parecido a la adición de CSS es copiar y pegar los estilos visuales de un elemento a otro . Reflujo también le permite acceder a las opciones de base de CSS para el estilo del cuerpo (llamada la » página» ) y el div que contiene (que todas las páginas tienen reflujo ).

  • DEFINIR SU DISEÑO

Debido a que el diseño de respuesta es el propósito de reflujo en la vida, la única cosa que realmente llama la atención es cómo se defina visualmente los puntos de interrupción . En Reflow , está representado todo el espectro de respuesta ( no sólo los tres tamaños de los dispositivos , como en Webflow ) . Si partes de su rotura de diseño entre el móvil y la tableta , por ejemplo , puede agregar fácilmente un punto de interrupción haciendo clic en un botón y hacer los cambios necesarios . Reflujo incluso le permite establecer puntos de interrupción máxima y mínima , lo que significa que usted puede diseñar móvil primero , si quieres. Definición de los puntos de interrupción en Reflow Definición de los puntos de interrupción en reflujo (Grande vista previa) Las fuentes, los medios de comunicación.

  • Fuentes

Fuentes de una cuenta Typekit se puede utilizar fácilmente en la interfaz al conectar el kit. Reflujo también viene con acceso a Edge Web Fonts (una colección de fuentes web hospedados de Adobe, Google y otros) . medios de comunicación Porque no se puede inyectar su propio código a menos que modifique el código generado , la adición de medios en el borde de reflujo no es posible. Se puede establecer un marcador de posición para los medios de comunicación (como imágenes ) , usándolo como una señal visual para el sitio web de producción. Formas En Reflow , puede añadir una serie de elementos típicos de formulario , como botones , campos de texto y botones de radio (entre otros) . Inserción de estos elementos de formulario en la página no añadir una etiqueta de formulario con el código generado ; así, los elementos de formulario no están hechas para ser funcional fuera de la caja . Esto nos recuerda una vez más que de reflujo es actualmente una herramienta maqueta , más adecuado para la creación de un diseño a prueba de concepto de que para generar código listo para la producción . enlace En la última versión de Edge Reflujo CC , se puede enlazar a páginas dentro del proyecto y a direcciones URL externas , así como los estados de control como la libración y activa en cualquier objeto en el diseño.

INTEGRACIÓN CON UN CMS

Reflug actualmente no tiene manera de integrar con un CMS a menos que tome el código que se genera y lo hace usted mismo fuera de la aplicación .

TRABAJO CON EL CÓDIGO

Edición de código no es el propósito de reflujo , ya que está destinado a ser utilizado como una herramienta de diseño visual . Sin embargo , utilizando el panel Elementos , puede nombrar a los elementos y organizar el código (es decir, para el DOM) en una jerarquía que tenga sentido para usted ( y tal vez a su desarrollador) .

Si usted está mirando para agregar cosas como una presentación de diapositivas jQuery, desplazamiento suave o un video o insertar su propio código HTML , entonces tendrá que modificar el código generado en otra aplicación. El panel Elementos El panel Elementos (Grande vista previa) Publicación y exportación Tenga en cuenta que el borde de reflujo tiene actualmente ningún exportador o funcionalidad de publicación . Al previsualizar la página web en un navegador compatible , reflujo genera el código HTML y CSS, pero los comentarios en línea que advierten contra el uso del código en un entorno de producción.

Editar tags en el outline

Editar tags en el outline

 

A juzgar por la respuesta en los foros de Edge de reflug, esto no ha impedido que la gente lo intente. Reflug te permite mostrar, copie y pegue el código CSS generado utilizar más aguas abajo en su página web real. Copiado CSS del reflujo Copiado CSS del reflujo (Grande vista previa) Para una mirada al interior de cómo Reflujo produjo, echa un vistazo en cuenta el proceso de Aaron Shekey.

Macaw

La última aplicación de la escena es Macaw, que acaba de ser lanzado al público como la versión 1.0 el 31 de marzo. Macaw se posiciona como una herramienta de diseño web que también escribe HTML semántico y CSS. Creo que el lema lo dice todo : «Deja de escribir código, empezar a dibujar ella. » Como Edge Reflow, Macaw también es una aplicación que se descarga e instala en el disco duro y está vinculada a una cuenta registrada. Pero a diferencia de Webflow y Edge Reflujo CC , no hay ninguna cuota mensual. Usted sólo paga un precio por una sola vez.

Después de pasar unos días con Macaw , te puedo decir que tiene un gran potencial como herramienta de diseño de páginas web sensibles . Esa es una buena manera de decir que es un bastante impresionante versión 1.0 , con algunos errores . Viniendo de un fondo de la web , puedo decir que la interfaz es bastante intuitiva , aunque me encuentro que faltan características básicas como los menús de contexto del botón derecho y zoom. Pero teniendo en cuenta que un puñado de personas inició esta cosa , no una corporación grande , estoy impresionado.

La interfaz del Macaw Interfaz (vista previa Large) del Macaw Bloques de construcción Cuando se inicia un proyecto Macaw, que se enfrentan a una página en blanco , que es el lienzo de diseño. Usted puede empezar a añadir elementos de diseño a la página mediante la importación de imágenes y añadir marcos de texto y el formato a ir con ellos, o usted puede ir directamente a la adición de puntos de interrupción que se podría esperar de su uso. La interfaz del Macaw es bastante simple, y el diseñador promedio realmente no se necesita mucho tiempo para descifrar dónde están las cosas – es decir, el tiempo que tienen un conocimiento de HTML y CSS de trabajo . Como Reflow , Macaw es bastante similar a Photoshop e InDesign en su acercamiento al diseño. Usted dibuja y recolocar los elementos visuales , en lugar de tener que editar el CSS y HTML. Stream es el nombre del motor que calcula todas las propiedades que colocan los elementos de diseño en el flujo del documento estático.

Al igual que con Webflow y reflujo , usted tiene que entender HTML y CSS conceptualmente , porque la mayoría de la funcionalidad de diseño se basa en ellos. Elementos de diseño en Macaw Elementos de diseño en Macaw (Large vista previa) DISEÑO Macaw tiene lo que parece ser una característica muy útil, llamado modo de visualización , que muestra los elementos de diseño en la página como » normal» o » contorno » o » alambre «. Debido a que muchos de nosotros va a utilizar Macaw como wireframing y maqueta herramienta , al ver el contenido como contornos negros ( «perfil «) o cajas de color gris ( » alambre «) será útil. El modo de vista del Macaw El modo de vista del Macaw (Large vista previa)

DEFINIR SU DISEÑO

Después de haber trabajado en el borde de reflujo durante un tiempo , me sorprendió la forma en que el espacio de trabajo Macaw similar . Como Reflow , Macaw permite definir puntos de interrupción visual , aunque su interfaz no es tan elegante como reflujo de en mi opinión. Todo el espectro de respuesta se representa ( no sólo los tres tamaños de los dispositivos , como en Webflow ) . Si partes de su rotura de diseño entre los puntos de interrupción , puede agregar fácilmente un punto de interrupción y hacer los cambios necesarios . Tristemente, Macaw actualmente no permite el diseño móvil primero porque no se puede establecer puntos de interrupción máximo y mínimo . El DOM también se bloquea en los puntos de corte más pequeñas , lo que impide la adición de contenido ( las herramientas están aún en gris ) . Pero la gente está charlando en foros del Macaw que los puntos de corte min- width (por diseño -mobile primero ) están llegando. Establecer puntos de interrupción en Macaw Establecer puntos de interrupción en Macaw (Large vista previa) Las fuentes, los medios de comunicación,

FORMAS Y VINCULACIÓN

Fuentes Fuentes web de Google se integran en el espacio de trabajo, y también se puede acceder a las fuentes Typekit conectando su cuenta en el menú «Fuente» del área de diseño . medios de comunicación Actualmente, Macaw ofrece una manera fácil de insertar los medios de comunicación , tales como videos de YouTube. Puede, sin embargo , introducir un elemento de marcador de posición y ate algo de JavaScript a la misma, a través del » scripts » del panel. Formas Macaw tiene una variedad de elementos de forma típica , incluyendo botones, campos de texto y botones de radio, que se pueden agregar a un diseño . Al igual que en reflujo , se trata de representar visualmente un formulario, no para crear una forma de trabajo real . Si te sientes aventurero , puedes elementos de forma de agrupar y cambiar la etiqueta a formarse en el editor de esquema. Esto por lo menos le dará las bases para una forma funcional si tiene la intención de usar el código generado en su sitio de producción. enlace Puedes enlazar a páginas creadas en un proyecto, así como el tipo de enlaces en el menú » Vínculos».

TRABAJO CON EL CÓDIGO

Lo más parecido a trabajar con código en Macaw (aparte de editar el código publicado) es editar elementos en el panel de esquema, que es una representación del DOM. En el panel de esquema , puede cambiar las etiquetas HTML , jerarquía y el contenido de pedido, solicitar nombres de CSS y más. También se pueden crear estilos globales (CSS) que se pueden aplicar a su contenido. Edición de etiquetas en el panel Contorno Edición de etiquetas en el panel Contorno (Grande vista previa)

INTEGRACIÓN CON UN CMS

Como Reflow , Macaw no se integra con un CMS. Algunas personas en la comunidad Macaw están tratando de averiguar un flujo de trabajo de Macaw para WordPress (y otros plataformas ) , pero no hay una conexión directa todavía. Publicación y exportación Macaw tiene una opción de publicación que lleva a una ventana de vista previa . A diferencia de reflujo, Macaw ofrece opciones para la exportación , en «Configuración de publicación.» En el cuadro de diálogo de ahí, puede elegir las páginas para exportar , inyectar código (como Google Analytics) en la cabeza o el cuerpo , adaptar el CSS a sus necesidades (escribiendo abreviaturas , la adición de prefijos de proveedores , la consolidación de estilos , etc), genera imágenes optimizadas para pantallas de alta definición y más. Los ajustes que dicen que el código generado no es sólo para mostrar. Una vez publicada , se le llevará a una ventana de vista previa , donde se puede ver todo el código (HTML , CSS , JavaScript ) e incluso ir a la vista previa de la página en el navegador predeterminado . De las tres aplicaciones , el código del Macaw es el más conciso y lo más cercano a lo que un desarrollador de front-end en realidad podría escribir.

Opciones para publicar código

Opciones para publicar código

CONCLUSIÓN

Estas herramientas de diseño están aquí para quedarse de una forma u otra. Desde dispositivos móviles llegaron a la escena, que hemos estado tratando de configurar nuestros flujos de trabajo para dar cabida a los diseños sensibles. Estas herramientas podrían potencialmente salvar esa brecha cuando es usado como punto de partida para el diseño de aplicaciones para usuario o simplemente para wireframes y prototipos.
Como era de esperar, ya he visto la gente trata de construir un gran sitio web basado en CMS con reflug y luego se quejan cuando no pueden inyectar su slideshow de respuesta preferida o lamentarse de que el código no es lo que iban a escribir. Tenga en cuenta que el guacamayo y reflujo tienen el propósito de ser parte de un flujo de trabajo, no al principio y al final. Mediante el uso de estas herramientas, ya que tienen por objeto (y no obligarlas a nuestro flujo de trabajo), podemos cruzar el umbral de la capacidad de respuesta, que puede salvar a nosotros mismos ya nuestro tiempo y dolores de cabeza clientes.

La entrada Herramientas de diseño web: Webflow, Edge reflow y Macaw se publicó primero en Diseño de páginas web Asturias.

]]> https://jorgedelbarrio.com/diseno-grafico/herramientas-de-diseno-web-webflow-edge-reflow-y-macaw/feed/ 3 1751 Estrategias para vender un libro electrónico https://jorgedelbarrio.com/diseno-grafico/estrategias-para-vender-un-libro-electronico/ https://jorgedelbarrio.com/diseno-grafico/estrategias-para-vender-un-libro-electronico/#respond Tue, 20 May 2014 09:04:07 +0000 http://jorgedelbarrio.com/?p=1732 Cómo diseñar, editar y vender tu libro electrónico Con la editorial ItsBook he tenido mucha experiencia en la venta de libros digitales y en papel autoeditados. Hay mucha gente que desconoce que el mercado editorial es un lugar en el que no abundan las ventas, exceptuando en contadas excepciones. En el caso de la autoedición […]

La entrada Estrategias para vender un libro electrónico se publicó primero en Diseño de páginas web Asturias.

]]> Cómo diseñar, editar y vender tu libro electrónico

Con la editorial ItsBook he tenido mucha experiencia en la venta de libros digitales y en papel autoeditados. Hay mucha gente que desconoce que el mercado editorial es un lugar en el que no abundan las ventas, exceptuando en contadas excepciones. En el caso de la autoedición (y este es el caso del 95% de los libros electrónicos que existen), hay diversos puntos a tener en cuenta antes de lanzarse a vender un libro. Son estrategias que bien he usado o voy a llevar a cabo para mi propio libro «Órbita Final: Éxodo» y con las que he conseguido que en tres días, se sitúe entre los cinco más vendidos de ciencia ficción de Amazon.

Órbita Final en Amazon

Órbita Final en Amazon

Parecen obvios, pero no se suelen tener en cuenta:

Corrección del texto

Éste es un blog de diseño y estoy poniendo esto. El diseño cuenta historias y jamás verás un logotipo que antes no haya pasado por una y otra y otras revisión. ¿Por qué publicar un libro que se van a leer en el peor de los casos varias decenas de personas y no revisarlo? La corrección del texto no es tan sólo los fallos gramaticales. Normalmente cuando un autor lo lee por octava vez, descubre que hay un parón en el ritmo de lectura, que sobran o faltan diálogos o que simplemente hay que eliminar un capítulo por completo. Revisa antes de pensar en publicar.

Diseño y maquetación

Personalmente uso varios programas. Para la redacción resulta bastante cómodo uno llamado Scrivener. Es importante que se respeten las normas como el guión largo para los diálogos. Es habitual entre escritores que autoeditan que al no contratar a diseñadores se salten muchas normas de maquetación básicas, por lo que recomiendo conocer el uso de las comillas españolas y otros símbolos. En su caso podéis contactar conmigo para realizar la maquetación profesional del libro.

Una vez terminado el texto, hay que maquetarlo. El formato electrónico es algo similar a una página web encapsulada en un archivo .rar, pero renombrado como epub, mobi o el formato que use el lector en particular. Antes era especialmente importante tener cuidado con la tipografía escogida, puesto que las tipografías de palo seco no eran adecuadas para la lectura y las que tenían serifa, perdían detalle porque los dispositivos de tinta electrónico apenas tenían detalle. La elección ideal son las egipcias, especialmente Rockwell, que al tener serifas anchas y con trazos rectos y rectos, no pierden detalle en los dispositivos. De hecho, el kindle (el lector de Amazon), viene configurado para que todos los libros se lean inicialmente con una rockwell modificada. Aunque he de decir que los últimos lectores que han salido al mercado tienen suficiente resolución para usar tipos con serif, mi recomendación es tener cuidado con esto porque hay muchas personas que compraron un lector en el pasado y no van a comprar uno nuevo en mucho tiempo.

Una vez escogida la tipografía, la maquetación final se puede realizar con Sigil, un programa gratuito del que no nos tenemos que preocupar de que vaya  desaparecer porque google ha dejado un hueco en sus servidores a los desarrolladores del mismo. Permite insertar la portada de manera cómoda, crear TOC (Table Of Content), separar la información por capítulos, insertar pequeñas imágenes en el texto y comprobar si todo está correcto. Después exporta a epub. El código que devuelve es limpio y el archivo pesa lo menos posible. Si notas que tu libro pesa en exceso es posible que sea por la portada o imágenes que hayas insertado. Anteriormente he escrito un artículo con consejos para realizar una portada para un libro electrónico.

Maquetación con Sigil

Maquetación con Sigil

Para pasar el libro de epub a mobi (el formato elegido por Amazon), recomiendo no usar el famoso Calibre, porque no es el mejor conversor. Amazon pone a disposición de los usuarios el programa Kindle previewer que viene con las características de la mayoría de sus lectores preprogramadas. Basta con abrirlo, escoger el lector al que se quiere traducir el epub y arrastrar el libro sobre el programa. El kindle previewer se encargará de generar un archivo mobi limpio y preparado para el sistema de Amazon. Si quieres crear un mobi es exclusivamente para los lectores de Amazon, así que usa sus programas.

Publicidad y ventas

El tema más importante. Podrás leer en multitud de foros quejas de autores que no paran de comentar que no venden ni un ejemplar. En primer lugar tienen que comprarte el libro los AFC, es decir amigos, familia y conocidos. Si no eres capaz de vendérselo a ellos sin hacer de comercial pesado, es mejor que abandones. Con eso deberías de haberte garantizo unas decenas de ventas. Una vez has hecho la publicidad entre los AFC, que se queda en facebook, redes sociales, foros que suelas visitar y el cara a cara, toca la publicidad entre los blogueros. El consejo es que regales el libro a los blogueros o podcasteros que creas que tienen relación con el mundo o que comentarán algo sobre tu libro. Si el libro es bueno, lo harán y será una publicidad efectiva. Puedes pasar a los concursos, aunque no te lo recomiendo. Normalmente en el caso de la autoedición, no conviene poner precios bajos porque no harás que tu libro, escrito por alguien prácticamente anónimo tenga un añadido frente al de un escritor famoso; por lo tanto un concurso para regalar un libro que puede costar como mucho euro y medio o dos euros, no es algo en lo que la gente vaya a poner esfuerzo.

Las promociones gratuitas es algo que funciona. Tendrás cientos de descargas y si el libro es bueno obtendrás valoraciones en aquellas tiendas en donde lo hayas puesto. Las valoraciones son muy importantes de cara a posibles compradores porque leerán la opinión de alguien ajeno al libro y si es positiva, los motivará a comprarlo.

Por último una estrategia en Amazon considerada rastrera, pero efectiva es la compra de tu propio libro. No lo he experimentado, pero un autor inglés se convirtió en un best-seller y escribió un libro al respecto. Su truco, crearse 270 cuentas ficticias y comprar su propio libro poniéndose 270 opiniones positivas. Pasó a estar en el primer puesto de los más vendidos de Amazon con una valoración estupenda, lo que arrastró más ventas. Es posible «hackear» Amazon si pagas por ello (muy parecido al posicionamiento en google).

Estos son varios consejos básicos para empezar la venta de tu libro electrónico. También advertirte que en un mar lleno de libros a bajo precio, no puedes pretender ser un best-seller aunque tu obra sea perfecta. Es un mundo muy complicado en donde la suerte también influye.

La entrada Estrategias para vender un libro electrónico se publicó primero en Diseño de páginas web Asturias.

]]> https://jorgedelbarrio.com/diseno-grafico/estrategias-para-vender-un-libro-electronico/feed/ 0 1732