slide1

Alt1040. Noticias acerca de Internet, diseño, música, cine, opiniones, weblogs y medios

Es uno de los weblogs de tecnología más seguidos de la blogosfera hispana.

slide2

Bitelia. Blog de software, internet y servicios web

Software y aplicaciones para mejorar tu vida, guías de uso, trucos, listas, noticias y todo sobre tecnología.

slide3

Xataka. Publicación de noticias sobre gadgets y tecnología.

Últimas tecnologías en electrónica de consumo y novedades tecnológicas en móviles, tablets, informática, etc.

slide4

Wwwhatsnew. Aplicaciones, marketing y noticias en la web.

Servicios que os pueden ser útiles para dibujar, gestionar tareas, hacer amigos, encontrar restaurantes...

slide5

Fayerwayer. Discusiones y opiniones de lo ultimo en tecnología y gadgets

Con secciones dedicadas a Internet, Software o Redes Sociales es un referente a nivel de tecnología en español.

24 de febrero de 2014

Softicons, la mayor galería de iconos gratis para tu blog


SoftIcons.com es un sitio web que lleva funcionando desde 2010 y ofrece un fantástico catálogo que contiene más de 450.000 iconos/imágenes y cuyo crecimiento es exponencial. Permite la descarga de iconos de forma gratuita para uso personal.


Podemos descargar la imagen en formato ico o en formato png. En la mayoría de los casos los tamaños de los iconos png para descargar son desde 16x16 hasta 128x128 píxeles. También existe la posibilidad de descarga de paquetes de iconos en formato comprimido (zip).

Permite la búsqueda de iconos por nombre o descripción desde la caja de texto situada en la parte superior. También proporciona una lista alfabética de conjuntos de imágenes (Alphabetic List of Icon Sets) así como una lista de iconos libres para uso comercial (Free for Commercial Use Icons).
Además dispone de una clasificación muy detallada por categorías:


Otra de las utilidades interesantes que podemos encontrar en su web es la sección de Herramientas de Iconos (Icon Tools). Con esta herramienta gratuita podrás convertir tu imagen en otra en formato png, jpg, gif o png. Del mismo modo, puedes seleccionar el formato de color (32-bits o 256-colores) y el tamaño (16, 32, 64, 128, 256px) así como recortar o aplicar filtros o fectos (escala de grises, colores invertidos, etc).

A decir verdad, estoy usando estos iconos desde que comencé con el blog porque siempre encuentro los que busco y porque me resultan muy elegantes. Y quería aprovechar esta ocasión para compartirlos con todos vosotros :)

Perfil de Google+: https://plus.google.com/+Softiconscom/posts
Perfil de Twitter: https://twitter.com/SoftIcons
Perfil de Facebook: https://www.facebook.com/SoftIcons
Perfil en Pinterest: http://www.pinterest.com/softicons/


17 de febrero de 2014

Cloud Management Platform (CMP) : solución para gestionar entornos MultiCloud


Cuando aparecieron los servicios de Cloud Computing tanto los usuarios finales como las empresas proveedoras de servicios vieron claramente las ventajas de esta nueva tecnología, desde el punto de vista operativo y de negocio.


Para las empresas proveedoras de servicios Cloud los beneficios eran:

  • Menores costes gracias a un uso más eficiente del espacio y la potencia.
  • Ahorro de tiempo en instalaciones y mantenimiento.
  • Plataforma HW más robusta e inmune a fallos.
Para el cliente también parecía ser un modelo con grandes ventajas:

  • OPEX (gastos operativos o de funcionamiento) en lugar de CAPEX (gastos de capital), es decir, formato de servicio sin inversión.
  • Pago por el uso que realmente se realice.
  • Evitar capacidad no utilizada por la flexibilidad de tener los recursos estrictamente necesarios.
  • Inmediatez, capacidad de disponer de los recursos cuando se necesiten.
Del Cloud al MultiCloud

Sin embargo, a pesar de las indiscutibles ventajas del Cloud, su demanda no acababa de despegar. El uso del Cloud se limitaba a pequeñas empresas (start-ups) o a proyectos pequeños no críticos de empresas medianas y grandes. Una causa de las dudas de los potenciales usuarios la encontramos en la pérdida de control y transparencia que se produce al contratar un proveedor Cloud.

Esta falta de control afecta a múltiples aspectos como:

  • Disponibilidad. Cuando tienes tu plataforma en tu CPD o en un Datacenter accesible, en caso de problema se puede hacer algo. Cuando tu aplicación está en un Cloud externo, no puedes hacer nada, sólo esperar.
  • Complejidad. Los proveedores de Cloud ofrecen procesos difíciles con interfaces poco amigables.
  • Prestaciones/Rendimiento. Cada proveedor proporciona servicios y rendimientos diferentes que no puedes controlar.
  • Capacidad. Cuando quieres ampliar puedes descubrir que tu proveedor no tiene capacidad disponible en ese momento.
  • Cobertura. Según la ubicación del proveedor puedes encontrarte con problemas legales (Protección de datos), de posicionamiento SEO (IP no locales) o de una peor experiencia de usuario.
Con esta situación se entiende lo difícil que es para las empresas decidirse a contratar servicios a un proveedor de Cloud Computing. En tal caso, si no puede confiar en un proveedor Cloud, ¿por qué no contratar a más de uno?
De esta forma aparece el concepto de MultiCloud, una solución Multiproveedor, una combinación de proveedores, ubicaciones y prestaciones.

¿en qué consiste realmente un entorno MultiCloud?

Multicloud no es simplemente utilizar varios proveedores de forma individual y ejecutar una aplicación en un Cloud y otra en otro Cloud distinto. Ésto no soluciona la falta de control, sólo distribuye el riesgo de manera que el problema de un proveedor no afectará a todas las aplicaciones.


MultiCloud es combinar más de un proveedor en la misma plataforma. Por ejemplo, puedo usar un proveedor de confianza para la parte más crítica de nuestra plataforma (BBDD) y uno o varios proveedores más económicos y distribuidos geográficamente para el frontal web. Ésto nos permite obtener lo mejor de cada proveedor y evitar el efecto que un fallo de un proveedor pueda ocasionar en nuestra aplicación.


Si la gestión de un proveedor Cloud puede ser difícil, la gestión de más de un proveedor aún lo es más. Los proveedores Cloud utilizan paneles de usuarios diferentes, con funcionalidades diferentes e incluso con servicios distintos (no todos ofrecen firewall o balanceadores de carga, o los mismos sistemas operativos).
Es aqui dónde aparecen los CMP o Cloud Management Platform como soluciones para gestionar entornos MultiCloud.

Las aplicaciones de Cloud Management Platforms son paneles de control que permiten unificar la forma de trabajar con diferentes proveedores. De forma resumida consisten en un interfaz entre los usuarios y las diferentes API’s proporcionadas por los Clouds para el control de sus servicios.


Asi, con un CMP se puede crear un servidor cloud en uno de los proveedores soportados, encenderlo, apagarlo o eliminarlo con un solo click.
Además, proporcionan una serie de funciones adicionales como pueden ser:

  • Despliegue automático de aplicaciones. Permite disponer de aplicaciones listas para ser usadas de forma rápida y automática.
  • Gestión de Capacidad (CPU, RAM, Disco y Red).
  • Orquestación IT. Automatización de ciertas tareas de gestión como actualización de aplicaciones.
  • Autoescalado. Permite lanzar servidores Cloud adicionales para responder a picos de demanda.
Con un CMP se puede gestionar de forma fácil diversos proveedores Cloud, pero aún faltaba algo más. ¿Qué pasa con los servidores físicos? que seguirán utilizándose durante tiempo por múltiples motivos: por razones de rendimiento, seguridad, o de negocio. El escenario real es pues una combinación de entornos físicos y Cloud, y por tanto se necesita una herramienta que permita gestionar desde el mismo panel ese entorno mixto.

ECmanaged: primer CMP que permite también la gestión de servidores físicos.

ECmanaged, además de las funciones propias de un CMP, permite añadir servicios Cloud a una plataforma física existente.
Así pues, con ECmanaged los profesionales IT pueden:

  • Escalar de forma automática una plataforma física con un servicio de Cloud.
  • Facilitar un proceso de disaster recovery de una plataforma física. En caso de desastre, puedes lanzar una réplica de la plataforma física afectada en un proveedor Cloud.
  • Combinar Físicos y Cloud en la misma plataforma. Por ejemplo, Cloud para los servidores web y físicos para el backend.
  • Añadir a tu plataforma física servidores Cloud distribuidos geográficamente.
Para poder realizar esta combinación, ECmanaged ha desarrollado un agente de gestión para controlar también servidores físicos y cualquier servidor Cloud (no sólo los que tengan sus API’s integradas en la aplicación).


En resumen, ECmanaged es una aplicación SaaS que ayuda a los profesionales IT a:

  • Gestionar entornos mixtos. Cualquier tipo de servidor, físico o Cloud.
  • Automatizar tanto las tareas de implementación (aprovisionamiento de Servidores Virtuales y despliegue automático de aplicaciones) como de gestión (monitorización y automatización de tareas).
ECmanaged contribuye a una adopción del Cloud Computing más fácil y permite a los profesionales IT reducir su dedicación a tareas de poco valor añadido y centrarse en los proyectos importantes para la empresa.
Toda la información disponible en: Multi-Cloud Management software- ECmanaged | ECmanaged


10 de febrero de 2014

Google Universal Analytics: la evolución de Google Analytics

Universal Analytics es un conjunto de innovaciones tecnológicas que mejoran la forma en que los datos se recopilan y procesan en Google Analytics permitiéndonos realizar el seguimiento desde cualquier dispositivo digital (smartphone, tablet, portátil, etc).


Vamos a poder diseñar nuestras métricas personalizadas, adaptando la herramienta de analítica web a las necesidades de nuestra empresa lo que nos va a permitir medir de forma unificada todas las interacciones de un usuario, ya sea desde su equipo, desde su móvil, tablet o cualquier otro dispositivo. También es posible añadir a nuestra nueva herramienta de analítica web datos generados o almacenados fuera de línea, como podría ser del CRM corporativo.

Todas las propiedades de Google Analytics deberán utilizar Universal Analytics. Las propiedades que no sigan el proceso de actualización se transferirán automáticamente a Universal Analytics en el futuro.

La actualización nos proporciona las ventajas de Google Analytics, incluidos los nuevos métodos de recopilación y herramientas de informes. Los métodos de recopilación de Google Analytics clásico (como la biblioteca JavaScript de ga.js) se desactivarán cuando Google Analytics se integre por completo como el nuevo estándar operativo.

El proceso completo de actualización consta de dos pasos:

  1. transferir la propiedad a la tecnología de procesamiento de datos de Universal Analytics
  2. implementar el código de seguimiento de Universal Analytics.
Se deben actualizar todas las propiedades de Google Analytics. Los usuarios con el permiso Edición pueden transferir las propiedades a la actualización de Universal Analytics en sus cuentas. Un programador u otra persona con conocimientos técnicos debe implementar el nuevo código de seguimiento de Universal Analytics - Introduction to Analytics.js.

<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

 ga('create', 'UA-44789425-1', 'https://www.tecnoblog.guru');
 ga('send', 'pageview');
</script>
<!-- End Google Analytics -->

Consulta en la Guía de Actualización los detalles del proceso de actualización y en Fases de Actualización los detalles de las fases.

Al realizar la actualización no se pierden datos, se puede acceder al historial de datos y analizarlo con los mismos informes y herramientas que usamos ahora, pero también accederemos a funciones que solo están disponibles a través de Universal Analytics.

Como los datos se recopilan y procesan por propiedad en Google Analytics, cada propiedad se debe actualizar individualmente. Si tienes muchas propiedades en una cuenta de Google Analytics, debes seguir el proceso de actualización para cada una.

Si no completas el paso 1 del proceso de actualización, la propiedad se transferirá automáticamente a Universal Analytics en el futuro. Si no completas el paso 2 del proceso de actualización, seguirás enviando datos a Google Analytics desde un método de recopilación que no es de Universal Analytics. Estos datos seguirán procesándose durante un periodo después de que Universal Analytics se haya convertido en el nuevo estándar operativo, en cuyo momento se desactivarán todos los métodos de recopilación de datos que no sean Universal Analytics y ya no funcionarán. Si sigues enviando datos con un método de recopilación que no sea de Universal Analytics después de que se hayan desactivado, los datos ya no se procesarán.

Todas las actualizaciones de producto y nuevas funciones solo estarán disponibles para las propiedades que reciben datos de un código de seguimiento de Universal Analytics (biblioteca JavaScript analytics.js en sitios web, SDKs de aplicaciones para dispositivos móviles versión 2.x o posterior para Android e iOS, y el protocolo de medición para otros dispositivos digitales, como las videoconsolas y los quioscos de información). Las propiedades clásicas y las propiedades que reciben datos de una versión anteriormente del código de seguimiento de Google Analytics (como la biblioteca JavaScript ga.js) no recibirán actualizaciones de producto ni acceso a nuevas funciones.

Este programa de actualización de Universal Analytics se producirá de forma incremental en tres fases:

  1. Fase 1: todas las propiedades pueden actualizarse a Universal Analytics (fase actual).
  2. Fase 2: comienza el proceso de transferencia automática.
  3. Fase 3: fin de la versión beta de Universal Analytics.
  4. Fase 4: Universal Analytics es el estándar operativo de Google Analytics.

Toda la información disponible en: Descripción general de la configuración de Universal Analytics



3 de febrero de 2014

Google Charts para crear gráficos en tu sitio web


Google Charts a través de su API ofrece la posibilidad de visualizar datos en tu sitio web. La galería gráfica provee diferentes tipos de gráficos listos para su uso: desde gráficos de barras o líneas simples a mapas de árboles jerárquicos complejos.


Los gráficos se representan mediante la tecnología HTML5 / SVG (Scalable Vector Graphics) para garantizar la compatibilidad entre navegadores (incluyendo VML o Vector Markup Language para versiones anteriores de Internet Explorer) y la portabilidad entre plataformas para iPhones, iPads y Android. Los usuarios no tendremos que instalar plugins o software adicional, sólo es necesario disponer de un navegador web.

La forma común de mostrar los gráficos en tu sitio web es mediante la inserción de código javascript en un documento html. Sólo tenemos que indicar los parámetros correspondientes a cada gráfico a utilizar.

  • Gráfico de Líneas (Line Chart)
<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Año', 'Ingresos', 'Gastos'],
          ['2004',  1000,      400],
          ['2005',  1170,      460],
          ['2006',  660,       1120],
          ['2007',  1030,      540]
        ]);
        var options = {
          title: 'Balance de la Compañía'
        };
        var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 900px; height: 500px;"></div>
  </body>
</html>

 Cargando gráfico de líneas... por favor, espere

Si queremos presentar las líneas de forma curva añadimos el parámetro curveType:

Información detallada de todos los parámetros de configuración: Line Chart

  • Gráfico de Barras (Column Chart)
<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Año', 'Ingresos', 'Gastos'],
          ['2004',  1000,      400],
          ['2005',  1170,      460],
          ['2006',  660,       1120],
          ['2007',  1030,      540]
        ]);
        var options = {
          title: 'Balance de la Compañía',
          hAxis: {title: 'Año', titleTextStyle: {color: 'red'}}
        };
        var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 900px; height: 500px;"></div>
  </body>
</html>

 Cargando gráfico de barras... por favor, espere

Hay tres maneras diferentes de definir los colores de las columnas: valores RGB, nombres de los colores en inglés, y estilos css:

Información detallada de todos los parámetros de configuración: Column Chart

  • Gráfico Circular (Pie Chart)
<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Tareas', 'Horas por día'],
          ['Trabajo',     11],
          ['Comida',      2],
          ['Transporte',  2],
          ['Televisión',  2],
          ['Dormir',      7]
        ]);
        var options = {
          title: 'Mi actividad diaria',
          is3D: true,
        };
        var chart = new google.visualization.PieChart(document.getElementById('piechart_3d'));
        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="piechart_3d" style="width: 900px; height: 500px;"></div>
  </body>
</html>

 Cargando gráfico circular... por favor, espere

El parámetro is3D con valor true indica que el gráfico se visualiza en tres dimensiones. Para mostrarlo en dos dimensiones, cambiamos su valor a false.
Información detallada de todos los parámetros de configuración: Pie Chart

Tal vez te interese instalar esta extensión en tu navegador Google Chrome para generar gráficos en 3D e imprimirlos de forma sencilla:


Crea gráficos online de 2D o 3D. El modo edición es fácil e intuitivo. Además puedes imprimir el gráfico generado.


Todos los ejemplos de gráficos se pueden encontrar en Chart Gallery, así como otros añadidos por la comunidad Additional Charts Gallery


27 de enero de 2014

Google Api: otra forma sencilla de integrar artículos de un blog en tu página web.

API significa Interfaz de Programación de Aplicaciones (del inglés Application Programming Interface), y es el conjunto de llamadas a bibliotecas (informática) que ofrecen acceso a servicios web de terceros, dentro de nuestra propia aplicación web, de manera abstracta para nosotros.


Google proporciona más de 60 apis de acceso a sus servicios en su página Google Data APIs

¿Cómo funcionan las APIs de Google?
Las aplicaciones que escriben los desarrolladores se conectan remotamente con el servicio Web API de Google. Esta comunicación se realiza mediante un protocolo llamado SOAP (Simple Object Access Protocol). Está basado en XML, y se usa para el intercambio de información entre aplicaciones. Sin embargo, no es necesario tener conocimientos ni de SOAP ni de XML para trabajar con las APIs de Google.

Vamos a ser capaces de insertar en nuestro sitio web los últimos post publicados en cualquier blog con sólo unas líneas de código html:

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("feeds", "1");
function initialize() {
 var feed = new google.feeds.Feed("https://www.tecnoblog.guru/feeds/posts/default"), entry, dv;
 feed.setNumEntries(5);
 feed.load(function(result) {
  if (!result.error) {
   var container = document.getElementById("feed"), entry = result.feed.entries, date;
   for(var i = 0; i < entry.length; i++) {
    dv = document.createElement("div");
    date = new Date(entry[i].publishedDate);
    dv.innerHTML = '<a href="' + entry[i].link + '" target="_blank">' + entry[i].title + '</a> ' + date.toDateString().substr(4) + '<br/>' + entry[i].contentSnippet + '<hr/>';
    container.appendChild(dv);
   }
  }else{alert(result.error.message);}
 });
};google.setOnLoadCallback(initialize);
</script>
<div id="feed"></div>


Escribimos este fragmento de código dentro del cuerpo de nuestro documento html y sustituimos la url 'https://www.tecnoblog.guru/feeds/posts/default' por la de nuestro feed. También podemos modificar el número de entradas a mostrar representado por el 5 en el método setNumEntries.

A continuación mostramos el noticiero formateando el estilo con CSS (Cascading Style Sheets).

Sigue las siguientes instrucciones:

  • escribe en la caja de texto un feed válido (Ejemplo: http://wwwhatsnew.com/feed/ - http://www.ticbeat.com/feed/)
  • selecciona del desplegable el número de artículos a mostrar.
  • y pulsa el botón Últimas noticias. Obtendrás el resultado de tu canal en tiempo real.

Número de post a mostrar:
Loading...


Nota importante


Google ha decidio dejar de dar soporte a esta api a partir del 15 de diciembre de 2016.

El mensaje oficial es:

"This API is officially deprecated and will stop working after December 15th, 2016."

Más información

Para superar este contratiempo, en el post "Alternativas a Google Feed Api" ofrezco tres opciones válidas con ejemplos incluidos.



22 de enero de 2014

FeedBurner: como añadir entradas de un blog a tu web, sin plugins y en una línea de código.


FeedBurner es un proveedor de gestión de fuentes web propiedad de Google. Proporciona herramientas de gestión de fuentes web RSS a bloggers, podcasters, y otros publicadores de contenido basado en tecnología web.


A la velocidad con la que avanza la nueva era digital, hoy día, todo el mundo puede crear un blog o página web sin conocimientos avanzados de programación. Basta con utilizar uno de los numerosos CMS (Sistema de Gestión de Contenidos) en su versión gratuita o de pago de acceso en la red.
Todos los CMS ofrecen la posibilidad de instalar componentes extra (plugins, addons, widgets, etc), proporcionando al visitante del sitio web funcionalidades añadidas.

Si contamos con un blog y un sito web, es frecuente incorporar las publicaciones del blog en una de las páginas del sitio, por ejemplo en la sección 'últimas noticias'. Para tal propósito, podemos hacer uso de estos plugins.

En este post, utilizaremos el servicio FeedBurner para convertir el Feed (Fuente o Canal web) de cualquier blog en un fragmento de código HTML para integrar en tu página web.

Si tenemos una cuenta en Google, accederemos con los datos de la cuenta desde la dirección http://feedburner.google.com/

  • Puedes cambiar el idioma de la página al español en la parte superior derecha, haciendo clic en el enlace Languages.
  • Volvemos a la sección Mis feeds e introducimos la dirección de nuestro feed o blog como ilustra la siguiente imagen:



    Voy a hacerle un guiño a Bitelia, blog que sigo con asiduidad, por poner al alcance de todos información interesante acerca de software y aplicaciones para mejorar tu vida, guías de uso, trucos, listas, noticias y todo lo que necesitas para disfrutar de la tecnología.
    Escribimos http://feeds.hipertextual.com/bitelia en la caja de texto y pulsamos el botón Siguiente.
  • Aparece una pantalla en la que pondremos título al feed y una dirección que lo identifique (BlogBitelia). A continuación pulsamos el botón Siguiente.

  • Se nos muestra la confirmación de que el feed se ha creado correctamente:



    Hacemos clic en el botón Siguiente hasta llegar a la última pantalla:

  • Volvemos a la sección Mis feeds y accedemos al feed de Bitelia que acabamos de crear.
    Pulsamos en la pestaña Publicize(Publicita tu Feed) y hacemos clic en el servicio BuzzBoost(Publica tu blog como HTML).
    Prestemos especial atención a este apartado donde parametrizaremos la forma en que vamos a mostrar los artículos del blog: número de post a mostrar, título del feed, favicon, número de palabras por artículo, formato en texto plano o html, etc.
    Configuramos todos los parámetros de visualización del contenido y pulsamos el botón Activar.

  • Por último, copiamos el código generado para integrar en nuestra página web:

    <script src="https://feeds.feedburner.com/BlogBitelia?format=sigpro" type="text/javascript"></script>

    y vemos el resultado final:

Últimas noticias


15 de enero de 2014

Crea tu propio formulario de contacto para el blog o página web

email-contact

Vamos a diseñar un formulario de contacto de manera sencilla y sin conocimientos previos de programación, tan sólo usaremos un servicio externo y gratuito de creación y personalización de formularios.


Son numerosas las opciones disponibles para insertar un formulario en nuestro blog. Algunas de las más interesantes son:

  • Google Drive Formularios

    1. Un formulario es un documento de Drive y por tanto tiene su propio menú y su barra de botones. Se puede guardar con un nombre, duplicar, descargar y compartir.
    2. En la plantilla de formulario puedes añadir todos los elementos o campos que quieras. También puedes organizar el formulario añadiendo encabezados y dividiéndolo en varias páginas.
    3. Google también nos permite añadir un formulario a partir de una hoja de cálculo de Google Docs
    4. Información detallada: Cómo crear un formulario de Google.
    Google Drive Formularios
  • JotForm

    1. Debemos darnos de alta en su página web. En su versión gratuita podemos crear formularios de forma ilimitada, la restricción de espacio es de 100 megas y 100 envíos mensuales.
    2. Presenta un panel de personalización en castellano muy completo: cuenta con más de 50 plantillas diferentes, permite personalizar fuentes, colores, fondos, tamaño del formulario, etc.
    3. Podemos introducir campos de tipo cuadro de texto, áreas de texto, desplegables, botones de radio, casillas de verificación, campos para realizar pagos, podemos subir ficheros, imágenes, captcha.
    4. También tenemos la posibilidad de añadir al formulario vídeos de YouTube, Image Slider, SoundCloud...
    JotForm
  • EmailMeForm

    1. Para su uso, tenemos que registrarnos. La versión gratuita te permite crear un número ilimitado de formularios y ofrece hasta un máximo de 100 megas y 100 envíos al mes.
    2. Permite la subida de ficheros adjuntos de correo electrónico.
    3. Implementa la gestión de permisos de usuarios y protección por contraseña, así como código captcha anti-spam.
    4. Cuenta con versión adaptada para dispositivos móviles (Responsive Design).
    EmailMeForm
  • Foxyform

    1. Es el que utilizo para este blog por razones de peso:
      "no necesito registrarme, ofrece los campos suficientes para integrar en mi formulario y permite de forma básica configurar el color de fondo, color de fuente, fuente y tamaño de la fuente. Y todo en menos de un minuto".
      Podéis visualizarlo en este link.
      Nota: por motivos relativos al nuevo RGPD, finalmente he decidido migrar el formulario a JotForm.
    2. Además dispone de protección captcha y visualización previa.
    Foxyform
  • Kontactr

    1. Es necesario crear una cuenta en su plataforma.
    2. Dispone de protección Captcha.
    3. Permite personalizar el color de fondo del formulario y de las cajas de texto.
    4. Presenta el inconveniente de que los textos descriptivos de los campos están en inglés y no se pueden modificar.
    Kontactr
  • CloudContactForms

    1. Presenta características similares a la plataforma Kontactr.
    CloudContactForms



8 de enero de 2014

Cómo insertar un vídeo de youtube en mi página web sin su logo o leyenda

Hoy más que nunca se hace necesario tener presencia corporativa en los diferentes medios sociales. Ofrecer al usuario información de tu negocio requiere de determinadas estrategias y YouTube es una magnífica plataforma para mostrar vídeos en tu blog o sitio web.


Hace sólo unos meses, un cliente decidió dar el salto e insertar vídeos corporativos en su página web.
Partíamos del inconveniente de que son vídeos generados en alta definición cuyo formato ocupa mucho espacio en disco (superando alguno de ellos los 500 megabytes), ralentizando el tiempo de carga de la página.
Con el fin de no encarecer los costes del hosting contratando más espacio, le sugerí optar por soluciones de alojamiento gratuito de vídeo entre las que destacan Vimeo y YouTube.
Al final nos decidimos por la más usada mudialmente: YouTube.

A continuación, el reto que se planteaba era tratar de ocultar el logo de YouTube para dotar a la web de mayor corporativismo.
La plataforma de YouTube provee una serie de parámetros de su reproductor para configurar la forma en que vamos a visualizar un vídeo en nuestro sitio web: https://developers.google.com/youtube/player_parameters.
El parámetro modestbranding=1 oculta el logo pero no como hubiésemos deseado, ya que si situamos el cursor encima del vídeo, éste aparece en la parte inferior derecha.

Youtube: Zooming In On a Tree – Urban/Water Background




Google también nos ofrece su servicio de alojamiento de archivos en la nube Google Drive: cada usuario cuenta con 15 gigabytes de espacio gratuito para almacenar sus archivos, ampliables mediante pago.

Si tienes cuenta en Google, accede al Panel de control de Google para consultar fácilmente los datos asociados a tu cuenta: Google Dashboard. Abarca más de 20 productos y servicios, incluidos Google+, Gmail, Calendar, Drive, Analytics, Adsense, Blogger, Docs, Maps, Herramientas para Webmaster (webmaster tools), FeedBurner, Sites, Historial web, Alertas de Google y YouTube.

¿Qué tengo que hacer para insertar un vídeo subido a Google Drive en mi página web o blog?

Lo primero es establecerlo como público. Para ello haremos clic con el botón derecho sobre el nombre del fichero y seleccionamos la opción Compartir... > Compartir... del menú contextual. A continuación cambiamos el origen del vídeo a público y copiamos el Enlace para compartir.

Google Drive: Zooming In On a Tree – Urban/Water Background




16 de diciembre de 2013

Tarjeta de Navidad animada con jQuery

jQuery es una biblioteca de JavaScript, creada inicialmente por John Resig, que permite simplificar la manera de interactuar con los documentos HTML, manipular el árbol DOM, manejar eventos, desarrollar animaciones y agregar interacción con la técnica AJAX a páginas web. Fue presentada el 14 de enero de 2006 en el BarCamp NYC. jQuery es la biblioteca de JavaScript más utilizada. jQuery es software libre y de código abierto, posee un doble licenciamiento bajo la Licencia MIT y la Licencia Pública General de GNU v2, permitiendo su uso en proyectos libres y privativos.

La familia y los amigos son como las estrellas: no siempre las ves, pero siempre están ahí.

¡¡¡FELIZ NAVIDAD!!!



Tarjeta de Navidad animada con jQuery

 

Haz clic en el lazo azul para abrir la tarjeta

 
 
 
 
 


Si lo deseas, puedes descargar y modificar el ejemplo para añadirlo a tu página web en la siguiente dirección: navidad-jquery
(Fuente original: www.lewebmonster.com)

 



14 de noviembre de 2013

Extensiones de navegador para Social Media

Los medios de comunicación sociales (social media en inglés) son plataformas de comunicación en línea donde el contenido es creado por los propios usuarios mediante el uso de las tecnologías de la Web 2.0 y que facilitan la edición, la publicación y el intercambio de información.
Fuente: Wikipedia.

En el post anterior explicamos qué son y cómo aprovechar todo el potencial de las extensiones de un navegador web. Lectura completa en ¿qué son las extensiones de un navegador web, cómo se instalan y cuáles me interesan?

Ahora vamos a repasar aquellas extensiones útiles para la interacción y análisis de los medios sociales desde nuestro navegador.

Google Chrome

Buffer: permite publicar tus actualizaciones en Twitter, Facebook, LinkedIn y otros. Con cada actualización que publiques, tienes acceso a un análisis sobre clics, retuits, menciones, veces que se ha compartido, «Me gusta» y otros. También hace un seguimiento de resultados y analiza por ti todo lo que compartes. La versión principal de Buffer es gratis.

SocialBro: para gestionar y analizar tu comunidad en Twitter. Es un dashboard en forma de CRM que te permitirá la elaboración de informes de analíticas, gestión de listas, seguimiento de follows/unfollows...

Facebook Notifications: se conecta a tu cuenta de Facebook y te muestra lo que está pasando con tus amigos, incluyendo Likes y comentarios sobre tus posts, invitaciones a eventos, mensajes en grupos, solicitudes de amistad, etcétera.

HootSuite: publica actualizaciones, monitoriza mensajes y analiza resultados en múltiples redes sociales, como Twitter y Facebook. Con HootSuite podrás programar mensajes en Twitter, Facebook, Linkedin, Foursquare, Wordpress.com y muchas más. Monitoriza fácilmente búsquedas y resultados de tu campaña, con informes, sin cambiar de aplicación. Conoce también a tu audiencia según su influencia y hábitos de publicación.

Evernote Web: guarda todas tus notas, investigaciones y proyectos en un solo lugar para acceder a ellas desde todos los ordenadores y teléfonos que utilices. Crea listas de tareas y actividades pendientes para que nunca te olvides de nada. Captura páginas web interesantes, adjunta imágenes, archivos de audio, PDF y más.

Youtube: la comunidad de vídeos online más popular del mundo hace posible que millones de usuarios descubran, vean y compartan vídeos originales. YouTube permite que los usuarios suban y compartan clips de vídeo desde la página web y a través de Internet desde otros sitios web, dispositivos móviles, blogs y mensajes de correo electrónico.

Diigo Web: nos permite guardar nuestras páginas web favoritas. Además podemos crear categorías, etiquetas, resaltar partes de texto que nos interesan o guardar un párrafo que nos llame la atención entre otras muchas cosas.

Feedly: combina el atractivo visual de una revista con la eficiencia y la comodidad de un lector de RSS. El resultado es una poderosa herramienta que permite organizar, leer y compartir la información que se encuentra dispersa por la red. Te permite guardar un artículo cuando te gusta y poder compartirlo fácilmente en Twitter, LinkedIn, Evernote o Buffer.

Search Instagram: es un acceso directo a un servicio de búsquedas en Instagram. Podemos realizar cualquier tipo de búsqueda (tag, palabra clave, usuario, etc) para obtener como resultado las imágenes publicadas en tiempo real.

Pin Search: usa el motor de búsqueda de Google para poder ofrecer más información sobre la imagen que estamos viendo, además de permitirnos encontrar las cosas más fácilmente dentro de Pinterest. Si queremos averiguar de dónde salió una foto, es la herramienta ideal.

SeoQuake: extensión seo que nos proporciona información de la web (pageRank, edad del dominio, índice de Alexa), diagnóstico onpage (metaetiquetado, headings, keyword density, presencia de sitemap), comparativa entre dominios...

Stats Checker for Google Analytics™: permite acceder a las estadísticas de la cuenta de Google Analityics actualizadas cada 5 segundos.

FlexClip: una potente extensión que puede convertir contenido en línea como artículos y noticias en videos personalizados con un solo clic. Utiliza tecnología de inteligencia artificial para extraer rápidamente el contenido y generar videos, lo cual es 10 veces más rápido que los métodos de producción tradicionales. Además, FlexClip también ofrece funciones avanzadas de edición de video, lo que te permite crear fácilmente videos de calidad profesional.

Mozilla Firefox

Algunas de las extensiones más importantes de Google Chrome también las encontramos en Firefox, además de otras de máximo interés:

  • Facebook Notifications:
  • HootSuite:
  • Evernote Web Clipper:
  • Youtube Video Center:
  • Diigo Toolbar - Annotate, Screenshot, Bookmark:
  • Feedly:
  • Search Instagram:
  • SeoQuake:
  • Shorten URL (Bit.ly):
  • Google+ Share:
  • Shareaholic | share with Google, Facebook and more:
  • Reddit Enhancement Suite:
  • Twitter Address Bar Search:
  • Delicious Bookmarks:
  • Amazon "Add to Wish List" Button:

Tal vez te interese conocer como se crean y publican las extensiones en la Chrome Web Store:


Como crear extensiones para tu navegador Google Chrome