Principales tendencias de la industria digital para 2013

El mercado de Social Media madura mientras el enfoque cambia hacia modelos de construcciön de negocios y el éxito financiero.

El uso de los sitios de redes sociales continúa estando dominado por Facebook, que representol 5 de cada 6 minutos pasados ​​en línea en estos sitios. 2012 IPO de Facebook marcó una maduración del mercado de los medios sociales con un enfoque renovado en la construcción de modelos de negocio fuertes y corrientes de monetización. Varios jugadores de medios sociales también causó sensación en los mercados públicos de este año, incluyendo LinkedIn, Yelp, Zynga y Groupon, mientras que otras como Twitter, Tumblr, Pinterest y Instagram (ahora parte de Facebook) han registrado un crecimiento fuerte de usuarios a medida que comienzan a la rampa hasta los motores de sus ingresos.

Porcentaje de Tiempo en las redes sociales

Mientras que Google lidera  Bing Crece su participación en el mercado de búsqueda.

Google continúa su fuerte liderazgo en el mercado de búsquedas en EE.UU., mientras que Bing logró ganar terreno como el motor de búsqueda n º 2 en 2012. El mercado de búsquedas vio sus primeras señales de aplastamiento ya que un número cada vez mayor de las búsquedas a un cambio vertical de búsquedas específicas y plataformas móviles.

El mercado de  vídeo online también muestra signos de madurez desde el punto de vista del consumo, pero la monetización está a todo vapor como YouTube acelera sus esfuerzos de publicidad, mientras que los reproductores de medios tradicionales encuentran el éxito con contenido comercial de TV. Con la demanda de publicidad de vídeo de alto impacto excediendo el inventario disponible, busca el impulso continuo en el lado de la publicidad - en particular mientras la orientación mejora.

La Publicidad Digital Mejora la rendición de cuentas respecto de Anuncio impresos y de TV

Cerca de 6000 mil millones de impresiones de anuncios de presentación fueron entregados a través de la web en 2012 como comercializadores de marca se han convertido en cada vez más cómodo con un medio que permita ROI de marketing fuerte. A pesar de la entrega de tantas impresiones, la investigación comScore mostró que un promedio de 3 de cada 10 anuncios nunca se rindió en vista real , con el consiguiente derroche significativo, más débil rendimiento de la campaña y un exceso de inventario pobre rendimiento que los desequilibrios de la ecuación de oferta y demanda y deprime GPP. A través de la continua adopción de una norma impresiones visibles, el mercado está comenzando a adoptar un modelo de escasez digital que mejor se alinea con la monetización del valor creado por el inventario.

Los Smartphone Tablets se hacen espacio en Multi-Plataforma Digital  de los medios

Los Smartphones continuuaron impulsando el panorama móvil en 2012, finalmente alcanzando el 50 por ciento de penetración en el mercado en 2012. La plataforma Android también alcanzó un hito de 50 por ciento, ya que capturó la mayor parte del mercado de teléfonos inteligentes por primera vez. Mientras tanto, las tabletas continuó ganando tracción, con 52,4 millones estadounidenses propietarios de tabletas a partir de diciembre de 2012. La rápida adopción de teléfonos inteligentes y tabletas, y el uso creciente de los consumidores de los mismos, se ha traducido en un paisaje fragmentado de medios digitales donde el consumidor típico ahora comparte su tiempo a través de múltiples pantallas.

Diseño Web Responsive o Sensible – Guía para principiantes

Esta guía responde a preguntas comunes alrededor de Diseño Web Sensible, una técnica para la creación de sitios web para móviles y tabletas que también es recomendado por Google.

Google ha recomendado oficialmente Diseño Web Sensible como su método preferido para la construcción de sitios web móviles. Si usted tiene un sitio web o un blog, es hora de que usted considere seriamente cambiar a un diseño de respuesta en lugar de mantener un móvil diferente en el exterior (o tablet-friendly) sitio web.

Un Diseño , varias pantallas
Si eres nuevo en el concepto de Diseño Web Sensible (RWD), aquí hay una guía rápida de que debe responder a la mayoría de las preguntas comunes que usted puede tener en torno a esta técnica. Vamos a empezar.

P - ¿Por qué debo cambiar mi sitio web para Diseño Sensible?

R - Su sitio web se ve muy bien de la pantalla del escritorio, pero el mismo no puede ser cierto cuando su sitio es visto en un teléfono inteligente, una tableta o un e-reader (como el Kindle). Una vez realizado el diseño sensible, el sitio web se ve bien (y legible) en todas las pantallas y no sólo la de escritorio.

P - ¿Cuáles son las ventajas de cambiar a un diseño web sensible o responsive?

R: con diseño sensible, puede crear un diseño y automáticamente se adaptará en función del tamaño de la pantalla del dispositivo móvil. Este enfoque ofrece muchas ventajas:

Se ahorrará tiempo y dinero ya que no es necesario que mantienen sitios web separados para equipos de sobremesa y teléfonos móviles.
Diseño Sensible es bueno para el SEO de su sitio web (rankings de búsqueda) ya que cada página de su sitio tendrá una URL única y por lo tanto jugo Google conserva. Usted no tiene que preocuparse acerca de situaciones en las que algunos sitios de enlace a su sitio móvil, mientras que otro vínculo a su sitio de escritorio.
Sus informes de Google Analytics va a pintar un cuadro mejor de uso de su sitio ya que los datos de los usuarios móviles y de escritorio se consolidará.
Lo mismo será cierto para el intercambio social estadísticas (Likes de Facebook, tweets, +1' s), ya que las versiones móviles y de escritorio de sus páginas web ya no tendrán diferentes URL.
Diseños Responsive son más fáciles de mantener, ya que no tienen que ver con ninguno de los componentes del lado del servidor. Sólo tienes que modificar el CSS subyacente de una página para cambiar su apariencia (o diseño) en un dispositivo en particular.
Los métodos de diseño anteriores miró cadenas de agente de usuario para determinar el nombre de dispositivo móvil y el navegador que está haciendo la solicitud. Que fue menos exacto y con el número de dispositivos móviles y navegadores expansión cada día, que la matriz es muy difícil de mantener. Diseño Responsive no se preocupa por los agentes de usuario.
P - ¿Qué debo saber para empezar con el diseño sensible?

R - Diseño Sensible es puro HTML y CSS. Se crea simples reglas CSS que cambiar el estilo basado en la pantalla de tamaño del dispositivo del usuario.

Por ejemplo, puede escribir una regla que dice que si un usuario de la pantalla de tamaño es inferior a 320 píxeles, no muestran la barra lateral o si el tamaño de la pantalla es superior a 1920 píxeles (de escritorio de pantalla ancha), aumentar el tamaño de fuente del cuerpo texto a 15px. Estas son las reglas mismas traducidas a código:

  @ Media pantalla y (max-width: 320px) {
    . Sidebar {display: none}
  }
  @ Media pantalla y (min-width: 1920px) {
    body {font-size: 15px}
  }
P- ¿Cómo puedo comprobar si el sitio Web particular hace uso del diseño sensible?

A4 - Eso es fácil. Abre la página web en cualquier navegador de escritorio y cambiar el tamaño del navegador. Si la disposición del sitio cambia a medida que cambia el tamaño, el diseño es interactivo. También puede utilizar estas herramientas en línea para comparar los diferentes diseños de una página en la misma pestaña.

R - ¿Puede compartir ejemplos de algunos buenos sitios web que respondan?

P - Que son pocos, pero mis favoritos son Noticias de Hoy (sitio web de noticias), SEO(blog personal), Happy Cog (agencia de diseño web), Barack Obama (sí, el sitio web de la Presidencia), Shake Shack (cadena de restaurantes) , Nicole & Josh (sitio web de la boda), Sentido de Alimentos (Recetas de Cocina), dConstruct 2012 (conferencia de diseño) y Good to Know (sitio de Google sobre la seguridad en línea). También debe comprobar fuera de mediaqueri.es, una galería curada de sitios web que utilizan el diseño sensible.

R- ¿Si voy con el enfoque de diseño sensible, ¿mi sitio web funciona con navegadores más antiguos?

A6 - Mayormente sí. RWD utiliza los medios de comunicación CSS3 y HTML5-consultas (para bien semántica) que no son compatibles con las versiones anteriores de IE. Sin embargo, existen soluciones basadas JavaScript respond.js y Modernizr - por ejemplo - que llevar el poder de CSS3 y HTML5 a los navegadores antiguos como IE6.

P - ¿El diseño Responsive jugar muy bien con redes de publicidad como AdSense de Google?

R- Si está usando anuncios en su sitio web, usted debe elegir con cuidado porque los formatos de unidades de ancho (como la tabla de clasificación de píxeles 728 × 60) no puede caber en una pantalla móvil 320px. Yo prefiero usar unidades estándar rectangulares (como 300 × 250) en mi blog, ya que se adaptan con facilidad en las pantallas de teléfonos inteligentes y computadoras de escritorio de pantalla ancha.

El único problema con el diseño Sensible es que los espacios publicitarios de su Web que están por encima del pliegue (ATF) a menudo se empuja hacia abajo la versión móvil y los clientes pueden no siempre es así (si te han pagado por una ranura ATF premium).

P- Hay miles de dispositivos móviles. ¿Qué resoluciones de pantalla debería decir a mi sitio web de soporte sensible?

R. Abra su cuenta de Google Analytics tablero y elegir Audiencia -> Tecnología -> navegador y sistema operativo. Ahora cambie a la ficha Resolución de pantalla en el informe y ver la resolución de los dispositivos móviles que la gente está utilizando para el navegador de su sitio.

Yo recomendaría establecer puntos de interrupción durante al menos los siguientes elementos en sus ventanas CSS3 Mediaqueries - 320px (paisaje iPhone), 480 píxeles (vertical iPhone), 600px (Tablets Android), 768px (iPad + ~ Galaxy Tabs) y 1024px (paisaje y iPad escritorios).

Estos son los recursos más en línea para ayudarle a empezar:

Sitios Web - Revista Net, Smashing Magazine, Trucos CSS y Web Designer Wall [estos sitios web y blogs con frecuencia abarcan el diseño sensible]
Tutoriales en vídeo - YouTube, Tuts netos [diseño sensible 101]
Presentaciones - Decks PowerPoint [las presentaciones más en línea alrededor RWD]
Libros - Código [Poeta expertos de diseño web discutir técnicas para el diseño de WordPress responsablemente. El libro está disponible en formato PDF, Kindle y formatos ePUB]
Podcasts - Talk Shop, Show Web 5by5 e Industria de la red [podcasts de audio y vídeo de todo diseño de páginas web donde los anfitriones con frecuencia traen a colación el tema de diseño web sensible]
Twitter - @ RWD, @ y @ NetMag SmashingMag [cuentas vale la pena seguir en Twitter]
P - ¿Cuáles son algunas de las desventajas de usar Diseño Sensible?

R- Diseño Sensible puede añadir algunos kilobytes adicionales a su página web ya que se tiene que descargar los estilos CSS y los archivos JavaScript que de otro modo innecesario. El otro problema es alrededor de las imágenes. Usted no quiere servir de alta resolución las imágenes en su sitio móvil, pero que es difícil de lograr en el diseño sensible (a menos que recurrir a una solución del lado del servidor como imágenes adaptativas y Sencha.io).

Por último, hay una curva de aprendizaje involucrados y tomará esfuerzo para agregar una capa sensible a su sitio web existente. A veces, puede que tenga más sentido que empezar de cero en lugar de hacer su actual ancho fijo fluido sitio web.

Google Aprueba anuncios Responsive de AdSense

Cuando AdSense lanzado hace una década, la gente en su mayoría accede a sitios web de sus computadoras de escritorio o portátiles. Hoy Avance rápido y todo tipo de dispositivos - teléfonos móviles, consolas de juegos, lectores de libros electrónicos - e incluso televisiones se están utilizando para conectarse a Internet.

Los diseñadores Web, por lo tanto dependen cada vez más en una técnica llamada Diseño Web Sensible donde un diseño único de los sitios web funciona en todos los dispositivos, independientemente del tamaño de la pantalla o la resolución del dispositivo.

Anuncios de Google AdSense son de ancho fijo, pero hay una solución poco lo que puede hacer que sus anuncios de Google de respuesta. La idea es que si un usuario está leyendo su página web en una pantalla grande de escritorio, que se sirven los grandes 728 × 60 × 280 o 336 unidades, mientras que si otro visitante está viendo la misma página en una pantalla más pequeña móvil, de forma dinámica puede servir los 200 × 200 (o similar) del bloque de anuncios.

Compartí el correspondiente fragmento de código JavaScript del año pasado y, desde entonces, ha sido un tema de debate en varios hilos del foro en línea. La principal preocupación de los editores web era (y sigue siendo) que Responsive anuncios de Google podría estar en contra de las políticas de Google AdSense, ya que requieren modificación en el código predeterminado JavaScript.

<script type="text/javascript">

    var width = window.innerWidth || document.documentElement.clientWidth;
    google_ad_client = "ca-publisher-id";

    if (width >= 800) { 
       google_ad_slot = "ad-unit-1"; 
       google_ad_width = 728; 
       google_ad_height = 60; 
    } else if ((width < 800) && (width < 400)) { 
      google_ad_slot = "ad-unit-2"; 
      google_ad_width = 300; 
      google_ad_height = 250; 
    } else { 
      google_ad_slot = "ad-unit-3"; 
      google_ad_width = 468; 
      google_ad_height = 60; 
    } 
</script> 
<script type="text/javascript" 
       src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script>

Michel Wester de WebSonic.nl, un editor de AdSense de Países Bajos, en contacto con el equipo de Google AdSense para una confirmación y aquí está la respuesta oficial (en holandés):

"De voorbeeld sitio web u die stuurt geeft al juiste de código javascript die u kunt gebruiken." Google AdSense y su equipo de apoyo ha confirmado que se permiten anuncios Responsive.

Anuncios de AdSense se pueden adaptar a diferentes tamaños de pantalla utilizando un fragmento de código JavaScript simple. Para aprovechar las ventajas de diseño de respuesta, crear múltiples formatos de anuncios, como por ejemplo 728 × 90, 468 × 60 y 300 × 250. A continuación, se implementa un "if-else 'fragmento para que el formato de anuncio derecha se muestra basado en el tamaño del dispositivo del usuario.

El sitio web de ejemplo que usted envió, tiene el correcto código JavaScript que puede utilizar. Bueno, me gustaría hacer hincapié en que el cambio aún más el código de AdSense no está permitido. Los anuncios no pueden también estar oculto con CSS.

Por lo tanto no se viola ninguna de las políticas del programa de AdSense para el uso de anuncios que responden a su sitio web. El fragmento de código JavaScript no está modificando el código de AdSense, sino que simplemente solicita un bloque de anuncios diferentes en función de la anchura de la pantalla del visor visitante actual.