29.7.14

Liveweave - editor HTML5 CSS3 en linea

Muchas veces hemos utilizado editores de texto como ser Sublime Text, Notepad++ o simplemente el fiel y querido Notepad (que siempre nos ha sacado de más de un apuro), para escribir código HTML5, CSS3 o simplemente JavaScript.
Cuando codificamos, guardamos el código en diferentes archivos, luego abrimos el navegador y probamos el funcionamiento de la página y esto a veces puede ser una tarea tediosa, ya que se vuelve repetitiva a la hora de corroborar la correcta visualización.
Pero existe una herramienta alternativa online que en la cual podemos codificar todos los ítems a la misma vez, sin necesidad de refrescar la página para ver los resultados.
Esta herramienta se llama Liveweave, la podemos utilizar directamente desde nuestro navegador y no es necesario ningún tipo de setup de instalación.
Nos provee una extensa librería de scripts como ser Angular JS, JQuery, Modernizr, Prototype JS y otras más que, al invocarlas se inserta la ruta de la misma directamente en el head de la página.
Una de las ventajas que posee es que a medida que vamos codificando, el resultado se va renderizando en tiempo real, esto es de gran ayuda ya podemos realizar cambios y viendo los resultados inmediatamente, sin necesidad de ir salvando.



Otra de las virtudes que posee es que podemos trabajar en el código con nuestro equipo de trabajo, compartiendo el mismo a través de una url, dándonos la posibilidad de establecer comunicación ya sea por audio o escrita.



Una vez que finalizamos el armado del código, lo podemos bajar a nuestra PC, ya sea como HTML puro con el script y los estilos in line o bien, nos da la posibilidad de bajar en un zip los archivos separados por carpetas, pero esta opción se encuentra disponible solamente para Chrome, Firefox, Safari y Opera.



Por último podemos guardar nuestra codificación de las páginas en el cloud del site.

Site: http://liveweave.com/

22.7.14

Como enviar notas a Evernote via mail

Les comento que soy un asiduo usuario de la herramienta Evernote y en ciertos lugares como ser oficinas, centros de capacitación, etc. me he encontrado muchas veces que todas las salidas a redes sociales se encuentran bloqueadas, ya sea para que no haya distracción en el trabajo como así también en el aprendizaje.
Pero para poder escribir notas, tareas, recordatorios y listas, hoy en día existe una solución muy simple que es generar las mismas por medio del envío de un mail y enviarlas directamente a Evernote
 Como se puede realizar esta tarea: comencemos...
Para encontrar la dirección de correo electrónico de Evernote, debemos realizar un click en tu Tools y luego en Account info. Allí aparecerá nuestra dirección de mail de la aplicación

Se puede copiar la dirección de correo electrónico y pegarla directamente en la barra de direcciones de tu nuevo mail, o bien guardarla en la libreta de direcciones para poder usarla en diferentes ocasiones o bien tenerla como correo para postear directamente a Evernote sin necesidad de usar la aplicación desktop o web.

En el asunto del mail deben ir los siguientes datos:
Título de la nota !fecha opcional @carpeta #tags
Ej.: Prueba !22/07/2014 @casa #html5


Y en el body colocar aquello que queramos guardar, ya sea texto, imágenes, audio o video.
Al enviar el email, Evernote guarda automáticamente el contenido del mail en la carpeta indicada con sus correspondientes tags, es realmente muy práctico para almacenar toda esa gran cantidad de información que necesitamos almacenar.

La inserción de los contenidos enviados por mail, se refleja en forma instantánea (a veces depende del servidor de mail), pero una vez allí se sincroniza con todos nuestros dispositivos


 Una vez en la aplicación podemos buscar la nota ya sea por fecha de creación, por carpeta o bien por los tags que hayamos colocado para una mejor identificación.

20.7.14

Comprobar si tu sitio es responsive

La empresa Dimensions Toolkit ha desarrollado una herramienta online/offline para comprobar si el site que estamos desarrollando es totalmente responsive.
Posee también una extensión para Google Chrome con una interface realmente dinámica e intuitiva, en la cual podemos testear el site, emulándolo en diferentes dispositivos como smartphones, tablets y PC, teniendo también la disponibilidad de rotar la pantalla para corroborar su correcta visualización
Si deseamos probar en una interface de pantalla determinada que no viene precargada en la aplicación (ej.: modelos de smart), podemos customizar el ancho y alto de la misma con solo mover el cursor del mouse o simplemente colocar sus valores manualmente. Por el momento se puede testear nuestros sites desde la web de Dimension hasta que liberen la versión final de Google Chrome

A continuación les dejo la dirección del site de la Empresa y de Chrome Web Store http://www.dimensionstoolkit.com/
https://chrome.google.com/webstore/detail/dimensions-toolkit/oajdmmikmphdckpkjgkdofoegppahcak

15.7.14

Momentum, una inspiración para Chrome

Momentum se trata de una extensión para Chrome que reemplaza la página de inicio con una hermosa imagen, una frase inspiradora, la hora local, el estado del clima, una lista de tareas y un botón para ir directamente a tu lista de aplicaciones
Detecta automáticamente tu ubicación y te muestra la temperatura local
También puedes armar tu propia de lista de tareas (TODO) para realizarlas cuando llegue tu inspiración

Instalar
https://chrome.google.com/webstore/detail/momentum/laookkfknpbbblfpciffpaejjkokdgca/related


9.7.14

Free Microsoft eBooks

Les paso un link perteneciente al blog de Eric Ligman (MS), en el cual podrán encontrar una recopilación de más de 130 libros totalmente gratuitos.
Les detallo algunas de las tecnologías que se pueden encontrar:

  • Windows 8.1
  • Windows 8
  • Windows 7
  • Office 2013
  • Office 365
  • Office 2010
  • SharePoint 2013
  • Dynamics CRM
  • PowerShell
  • Exchange Server
  • Lync 2013
  • System Center
  • Azure
  • Cloud
  • SQL Server


Blog.
http://blogs.msdn.com/b/mssmallbiz/archive/2014/07/07/largest-collection-of-free-microsoft-ebooks-ever-including-windows-8-1-windows-8-windows-7-office-2013-office-365-office-2010-sharepoint-2013-dynamics-crm-powershell-exchange-server-lync-2013-system-center-azure-cloud-sql.aspx

20.6.14

HTML5 - nuevos tags para mostrar codigo

El elemento samp se encuentra a identificar un ejemplo de salida de un programa de ordenador. Por lo general, aparece en la fuente monotipo predeterminado del navegador (por ejemplo, Lucida Console)

El elemento kbd o teclado de entrada de HTML, representa la entrada del usuario y produce un elemento en línea que aparece en la fuente monotipo por defecto del navegador

El elemento code representa un fragmento de código

El elemento var representa una variable en una expresión matemática o un contexto de funciones

El elemento dfn representa la instancia de la definición de un término

El elemento mark representa texto resaltado, es decir, una extensión de texto marcado para fines de referencia. Por ejemplo, puede ser utilizado en una página de resultados de búsqueda que muestra para resaltar todas las instancias de la búsqueda por palabra.

Codigo
http://chopapp.com/#glryfkzi

Ejemplo:

Si tipea dir con el command aparecera Directory of C:\Documents and Settings\Gabriel.

Confirma la insercion de datos del usuario? CONFIRM.
Realice un click en Agree para continuar.
var x = Math.sqrt(256);
Breadcrumbs es una ayuda para la navegacion utilizada por el usuario dentro del site

12.6.14

DevDocs una librería infaltable para los desarrolladores

DevDocs proporciona una interfaz cómoda para leer y buscar documentación de referencia de varias API de los diferentes frameworks, lenguajes, metalenguajes, etc.
Entre ellos se encuentran:

  • Angular.js 
  • Backbone.js 
  • C + + 
  • CoffeeScript 
  • CSS 
  • D3.js 
  • DOM 
  • Ember.js 
  • expreso 
  • Git 
  • Ir 
  • ronco 
  • HTML 
  • HTTP headers y estado códigos 
  • JavaScript 
  • jQuery 
  • JQuery Mobile 
  • JQuery UI 
  • Knockout.js 
  • Laravel 


Podremos encontrar funcionalidades como:

  • Docs activar / desactivar 
  • Atajos de teclado 
  • Soporte de Retina 
  • Versión móvil 
  • Código abierto 




11.5.14

OneTab extension de Chrome

OneTab se trata de una nueva extension para Google Chrome, para ahorrar memoria (casi un 95%) con las tabs abiertas en nuestro navegador
No hace mucho tiempo atrás cada vez que abríamos una nueva pagina, se nos abría una nueva instancia del navegador; pero desde la llegada de de Firefox o Chrome las tabs fueron una nueva manera en que los usuarios comenzaron a abrir páginas indiscriminadamente sin tener que navegar entre ventanas diferentes una sobre otra en nuestra barra de tareas
Simplemente instalas la extensión y un botón en forma de embudo aparecerá en la barra de navegación, al presionarlo todas tus pestañas se cierran y se convierten en una sola lista en la cual se guardan para que puedas recuperarlas cuando se necesiten. Lo mejor de todo es que mantienes todas las pestañas a la mano pero reduces totalmente el consumo de memoria



Download
https://chrome.google.com/webstore/detail/onetab/chphlpgkkbolifaimnlloiipkdnihall

12.3.14

Nuevos Add-on para Google Drive

De la mano de Google Drive, a parte de poder trabajar con documentos MS Office, documentos Open Office, podemos trabajar con documentos nativos de Google, que a parte de ser super livianos, son mu fáciles configurar, editar y darle un LF muy especial a que poseen cientos de templates para dicha función
Una vez finalizada la edición de los mismos los podemos exportar al formato que mas encaje en nuestra suite ofimática empresarial
Recientemente se le ha agregado también una serie de add-ons, tanto para los documentos como para las planillas de calculo, dándole aun mas potencialidad a la que a poseían

Cuando abrimos un nuevo documento o una spreadsheet nos encontraremos que en el menú de los mismos hay una nuevo ítem denominado Add-ons, desde allí podremos utilizar los que ya hemos bajado o bien se abrirá una nueva ventana con los add-on disponibles para su utilización en ese tipo de documentos






11.3.14

Estrategias de Marketing en Youtube

Desde el sie www.alumn-e.com nos ofrecen por un tiempo limitado (gratis me refiero) un nuevo curso que puede ayudar a los que usan Youtube para desarrollar campañas de marketing, el curso se encuentra dividido en 11 bloques que suman un total de 34 breves lecciones en vídeo, tratando los siguientes temas:


  • Usando YouTube en el marketing y publicidad.
  • Creando un planning estratégico y conociendo cómo funciona un canal de YouTube.
  • Creando contenidos para un canal de Youtube.
  • Cómo subir y gestionar los vídeos subidos.
  • Trabajando con varios canales al mismo tiempo.
  • Herramientas de edición y cómo mejorar nuestros vídeos.
  • Marketing social enfocado en Youtube.
  • Cómo integrar Youtube con WordPress.
  • Cómo gestionar e incluir publicidad en los vídeos de Youtube.


Site
http://www.alumn-e.com/pages/course/Youtube-para-Marketing-y-Negocios


6.3.14

CanvasDemos.com - Sitio dedicadco a HTML5 Canvas

CanvasDemos, se trata de un mu completo site dedicado exclusivamente a la API de Canvas
En el mismo podemos encontrar una gran variedad de tutoriales, herramientas, juegos, apps, etc. que utilizan el elemento canvas de HTML 5 que nos permite la representación de secuencias de comandos dinámica de imágenes de mapa de bits.

Recomendable

Site
http://www.canvasdemos.com/




5.3.14

Google Keep - otra forma de tomar notas

Google Keep se trata de un servicio ofrecido por Google muy similar al que ofrece OneNote de Microsoft o Evernote; El mismo consiste en tomar notas mientras se navega por en Internet de forma totalmente desatendida
Se puede agregar en los dispositivos mobiles con Android o bien en Chrome. Lo interesante del servicio es que sincroniza las tareas creadas por medio de Google Drive, de esta manera todas las notas creadas son almacenadas en la nube, teniéndolas disponibles en cualquiera momento  en cualquier dispositivo Android

Acciones que se pueden realizar sobre Google Keep:

  • Agregar notas, listas y fotografías. Las notas pueden hacer uso de casillas, convirtiendo tus notas en listas de verificación
  • Organizar tus notas arrastrándolas para reorganizarlas
  • Codificar notas usando colores
  • Agregar notas usando voz
  • Dictar notas, usando su servicio de voz a texto, en dispositivos Android
  • Puedes archivar las notas que ya no necesitas tener a la mano, sin borrarlas definitivamente (también puedes borrar notas que definitivamente quieres eliminar por completo)
  • Puedes compartir notas mediante Google+
  • Hacer búsquedas entre todas tus notas

Repositorio de Chrome
https://chrome.google.com/webstore/detail/google-keep/hmjkmjkepdijhoojdojkdfohbdgmmhki/reviews

Repositorio Google Play
https://play.google.com/store/apps/details?id=com.google.android.keep

Repositorio en Google Drive
drive.google.com/keep/



27.2.14

Como usar templates en Google Drive

Muchas veces (creo que la mayoría de las mismas) hemos utilizado Word para crear nuestras cartas de presentación, CV, u algún otro documento que requiera de un cierto template de uso.
Con Google Drive podemos realizar la composición de los mismos en forma online y una gran variedad de templates y por supuesto que gratuitamente.

Para poder utilizar estos templates debemos realizar los siguientes pasos:

Debemos hacer login en Google Drive y redirigirnos a la siguiente dirección https://drive.google.com/templates?view=public#

En el menú izquierdo seleccionar -> Narrow by category -> Resumes & Cover Letters



Seleccionar el Template a utilizar (Use this template)



En drive se abrirá el template y ya se encontrará listo para ser utilizado


una vez armado el documento, lo único que nos falta por realizar es hacer un click derecho sobre el documento -> download y seleccionar el tipo de documento a bajar (ej.: Word)







15.2.14

Docs Quickly - creación de documentos

Docs Quickly

Acceso directo a creación de documentos 

La gente de Google no hace mucho tempo, sacó una extensión para Chrome denominada Docs Quickly, la misma nos permite una acceso directo para crear documentos en Google Drive sin necesidad de ingresar al site de Drive

Al instalar la extensión se nos generará un icono en la barra de navegación donde tendremos las opciones de creación de los docs

Site
https://chrome.google.com/webstore/detail/docs-quickly/cejihakmbjnefdijhceabdkkjfnmlgog?hl


14.2.14

Script para exportar vectores de Photoshop a SVG

Se trata de un recurso que, podemos llegar a decir casi esencialmente imprescindible para todos diseñadores, el mismo se trata simplemente de un script que nos permite exportar vectores de Photoshop a SVG con tan solo un clic

Este script posee los siguientes requerimientos:

  • Windows o OS X.
  • Photoshop CS5, CS6 o CC.
  • Adobe Illustrator


Lo bueno de este script que es totalmente gratuito (si, ya sé, no lo pueden creer, pero es así)

Site
http://hackingui.com/design/export-photoshop-layer-to-svg/

PD: lo único que encontré que hay que registrarse al newsletter, pero sigue siendo gratuito



11.1.14

Google Drive un Hosting gratuito

Muchos de nosotros utilizamos a diario Google Drive para almacenar nuestros documentos, imágenes, código fuente, fotos, formularios, presentaciones, etc.
Pero ahora también nos da la posibilidad de utilizar una carpeta como repositorio de archivos HTML, CSS, JS y que la misma funcione como hosting
Los pasos para armar nuestro repositorio son realmente muy sencillos de seguir:

  • Crear una carpeta con un nombre representativo,como por ejemplo "Hosting"

  • Compartir dicha carpeta con acceso público





  • Luego dirigirnos a detalles y en el ítem alojamiento se encontrará la URL de acceso al site





Si en el root de la carpeta le agregamos un archivo denominado Index.html, Google Drive tomará el mismo como página de inicio, si no tuviésemos ninguna página principal, se mostrarán todos los archivos y carpetas que se encuentren alojados en la carpeta compartida.
De utilizar la aplicación Drive para PC, tendríamos una sincronización instantánea del código fuente con el hosting, y si lo utilizamos en un grupo de trabajo, todo el equipo tendrá las últimas actualizaciones que hemos realizado