Archive for enero, 2011


A-more-Beautiful-Web-bl

El sábado 22 de Enero del 2011 estuve en Huacho (Norte de Lima) participando como orador invitadoSilverligh-Bl-V en el evento organizado por el Student Tech Club de la Universidad Nacional José Faustino Sánchez Carrión, en el evento hablamos de Internet Explorer 9, Silverlight, LINQ y WPF con Microsoft Surface.

En esta oportunidad me acompañaron Fernando Cárdenas Villena, Goyko Alexander Obrenovich Vinces y Victor Andres Altamirano Vasquez con quienes brindamos varias sesiones orientadas a público académico en una universidad cuya curricula está orientada al software Libre.

La experiencia fue muy buena y la convocatoria también, espero regresar en el futuro, a continuación algunas fotos del evento:

Saludos


MVP_HorizontalFrancis Urteaga
Microsoft MVP | Internet Explorer
Microsoft Student Partner Senior | Microsoft Perú
clip_image00352clip_image00452clip_image00652clip_image00752clip_image00952

Siguiendo con la serie “Tu Web para Internet Explorer 9” en esta oportunidad seguiré escribiendo acerca de como podemos crear JumpList en tu sitio web para aprovechar las características de Internet Explorer 9, en el post anterior a esta serie utilizamos etiquetas <meta> de HTML estándar, pero si queremos ir más allá con esta característica, necesitamos generar opciones para el JumpList de manera dinámica o aleatoria, hay varios escenarios en los que podríamos necesitar crear opciones aleatorias, sobre todo en sitios que incluyen una opción de inicio de sesión con usuario y contraseña.

Para darles una muestra de esta característica les mostraré el ejemplo del sitio de Twitter, si acceden a su cuenta en Twitter con su usuario y contraseña verán que el JumpList tiene más opciones:

Sin Ingresar:

Out Session

Una vez Ingresado:

In Session

Otra clase de JumpList son los dinámicos, como es el caso de la web de Discovery Channel :

Discovery

Como nos podemos dar cuenta el JumpList cambia y nos muestra más opciones de acuerdo a la página web, otra cosa que podemos notar es que las opciones están organizadas por Grupos de acciones, un grupo con el nombre “Tareas” y otro con el nombre “Discovery Favorites”.

El segundo grupo de acciones “Discovery Favorites” se generan aleatoriamente de la siguiente manera utilizando JavaScript:

  1. Crear  la categoría:
    Para empezar lo primero que debemos hacer es crear la categoría donde se incluirán las nuevas opciones en el jump list utilizando el método msSiteModeCreateJumplist y es necesario crear una lista antes de utilizar cualquier otro método posterior. Para crear una lista llamada "Amazon Favorites" agregaremos el siguiente código de Javascript:

    window.external.msSiteModeCreateJumplist(‘Amazon Favorites’);

  2. Agregar elementos:
    Luego de haber la categoría, agregamos acciones con el método
    msSiteModeAddJumpListItem:

    window.external.msSiteModeAddJumpListItem(‘Elemento1’, ‘URI del elemento1’, ‘URI del icono para elemento1’);

    De igual manera que usando la etiqueta <meta> aquí todos los atributos son obligatorios. En el caso del icono, el URI debe apuntar a un archivo .ico de 16 x 16 pixeles como mínimo. En el caso de Discovery.com, el primer elemento ‘Cash Cab’ de la categoría ‘Discovery Favorites’ se crea con la siguiente línea:

    window.external.msSiteModeAddJumpListItem("Cash Cab", "http://dsc.discovery.com/tv/cash-cab/&quot;, favicon);

    Cada categoría soporta hasta 20 elementos como máximo; si se agregan más los primeros serán eliminados automáticamente.

  3. Mostrar la lista:
    Esta lista se encuentra en memoria lista para mostrarse cuando sea más conveniente, con la siguiente línea:

    window.external.msSiteModeShowJumplist();

    Windows actualizará automáticamente el JumpList en memoria con las nuevas opciones.

  4. Borrar la lista:
    Cuando los nuevos elementos hayan servido su propósito, es posible borrar una categoría completa con la siguiente línea de código:

    window.external.msSiteModeClearJumplist();

Si un usuario elimina manualmente un elemento de un jump list creado de esta manera (con clic derecho como se ve abajo):

Discovery 2

Es posible detectar esta acción utilizando cualquier de los siguientes métodos:

document.addEventListener(‘mssitemodejumplistitemremoved’, removed, false);
document.attachEvent(‘onmssitemodejumplistitemremoved’, removed);

Lo que hará una invocación a la siguiente función con el URI de la opción eliminada como parámetro:

function removed(URI) { … }

Cualquier página en el mismo dominio en el que fueron creadas las nuevas categorías y opciones en el JumpList puede realizar modificaciones al mismo en cualquier momento.

Espero que esta tercera parte de la serie: “Tu Web para Internet Explorer 9”  sea de utilidad para los desarrolladores.

Saludos


Francis Urteaga
Microsoft MVP | Internet Explorer
Microsoft Student Partner Senior | Microsoft Perú
clip_image00352clip_image00452clip_image00652clip_image00752clip_image00952

Comparto con Uds este súper video del CES 2011:

http://www.microsoft.com:80/presspass/silverlightApps/videoplayer3/standalone.aspx?contentID=ces11_video_liveKeynoteDay1&src=/presspass/events/ces/channel.xml


MVP_HorizontalFrancis Urteaga
Microsoft MVP | Internet Explorer
Microsoft Student Partner Senior | Microsoft Perú
clip_image00352clip_image00452clip_image00652clip_image00752clip_image00952

En este post realizaré un tutorial de cómo crear JumpLists para Internet Explorer 9 ya que con el lanzamiento de Internet Explorer 9 beta se han liberado también muchas características nuevas que integran los sitios web más con algunas características de Windows 7 como los JumpLists. Un JumpList es un menú emergente que se obtiene dando clic derecho sobre un sitio que ha sido arrastrado a la barra de tareas de Windows 7, y se ve así:

JumpList

En este caso podemos ver el JumpList del sitio del STC Cajamarca, que además de las opciones estándar de InPrivate Browsing y desanclar nos muestra una lista de acciones específicas para los usuarios del STC Cajamarca Otros sitios que integran esta funcionalidad son Twitter, Facebook y muchos más.

¿Cómo se hacen? Es realmente muy sencillo y pueden incluirse en cualquier sitio ya existente con un poco deHTML.

Acá viene un ejemplo: lo primero es ubicar el espacio para los encabezados meta de la página de inicio de nuestro sitio (default.* o index.*), que se encuentre dentro de las etiquetas <head> y </head> antes de<body> y colocar algo como la siguiente línea:

<meta name="msapplication-task"
  content="name=Título de la acción ;
  action-uri=URI a la que dirigirá esta acción;
  icon-uri=URI del archivo favicon para esta acción" />

Esta línea corresponderá a una acción en la JumpList del sitio: el nombre "msapplication-task" es obligatorio al igual que los otros tres atributos:

  • content: Será el título de la acción para el JumpList que aparecerá una vez instalada el sitio en la taskbar. Lo recomendable es que sea menor de 25 caracteres y lo más descriptivo posible.
  • action-uri: La dirección web que se abrirá en el navegador cuando reciba clic. Puede incluir variables GET y soporta http, https y ftp.
  • icon-uri:El icono que se mostrará a la derecha de la acción en la JumpList. El valor puede ir vacío pero no se puede omitir el atributo. El icono deberá tener ser al menos de 16 x 16 pixeles(Pueden crear uno para cada acción con el primer tutorial).

El mismo ejemplo del STC Cajamarca , la primera línea (PDC Cajamarca) se vería así:

<meta name="msapplication-task"
  content
="name=PDC Cajamarca;
  action-uri=
http://www.stccajamarca.com/PDC%20Cajamarca.html;
  icon-uri=http://www.stccajamarca.com/events.ico" />

Se pueden colocar tantas líneas como se necesite, aunque lo mejor es colocar las que al usuario más le hagan sentido. Con este pequeño tutorial ya pueden empezar a colocar JumpList a sus sitios web para que los usuarios de sus sitios saquen provecho de esta nueva funcionalidad.

Espero les sirva. Saludos


MVP_HorizontalFrancis Urteaga
Microsoft MVP | Internet Explorer
Microsoft Student Partner Senior | Microsoft Perú
clip_image00352clip_image00452clip_image00652clip_image00752clip_image00952

Estimados amigos este es mi primer post creado en Lima, resulta que estaba en internet (Que raro no?) cuando mi lindísima amiga Emi Piedra me hizo una consulta por el Facebook con lo siguiente:

Pregunta de Emi

Por lo que este Post se lo dedicaré a Emi Piedra mostrándole paso a paso como colocar un favicon.ico o icono en tu web.

Es decir, una pequeña imagen, que aparece en algunos navegadores junto a la dirección de una página web. Por ejemplo, ahora deberías estar viendo algo parecido a esto:

1

Antes que empezar quisiera comentarles que identificar tu sitio a través de un ícono es muy importante, ya que a parte de brindar estética, muestra seriedad y con Internet Explorer 9 puedes habilitar tu sitio para tratarlo como una aplicación en Windows 7.

Una de las cualidades de Internet Explorer 9 consiste en permitir a los sitios web aprovechar al máximo el poder de la PC, los usuarios pueden interactuar con sus sitios web como aplicaciones completas en la barra de tareas, esto gracias a que fijando un sitio a la barra de tareas el icono del sitio se utiliza como la principal forma de identificar y tener acceso al sitio, es decir necesitamos un ícono para identificar a nuestro sitio, para esto vamos a utilizar un sitio web que nos permite crear el ícono sin necesidad de instalar algún programa en la PC.

  1. Creando el Ícono: X-Icon Editor es una aplicación HTML 5 (basado en <canvas>) que le permite crear iconos de alta resolución que hará brillar a sus sitios con IE9. Con X-Icon Editor usted puede tener su sitio listo con un gran icono que brindará otra experiencia a sus usuarios!
    1. Primer Paso: Les sugiero que ya tengan listo su logo para que lo importen al X-Icon Editor, la interface del sitio web es la siguiente:
      interface
    2. Segundo Paso: Importamos el logo (De preferencia que sea cuadrado) dando clic en Import y nos aparecerá este cuadro:
      importar
      En el cual das clic a Upload y te abrirá un cuadro de dialogo para seleccionar la ubicación del logo a importar.
    3. Tercer Paso: Una vez importado la página web les mostrará lo siguiente:
      importado
      Luego exportamos y seleccionamos el destino y lo guardamos con el nombre de favicon.ico.
  2. Seleccionando el Ícono de nuestra web: Una vez creado y guardado el ícono en nuestra PC:
    1. Lo subimos a la carpeta principal de nuestra web (Upload a la Raíz).
    2. Luego agregamos este código HTML (De color amarillo) en nuestra página principal (Index, master, home, etc.) luego del título y los meta content, por Ejemplo:

      <title> | Mi sitio | </title>
      <meta content="Francis Urteaga" name="keywords" />
      <meta content="Página del MVP" name="description" />
      <link rel="shortcut icon" href="favicon.ico"/>

Con esto ya pueden anclar su sitio en la barra de tareas de Windows 7 y disfrutar de Internet Explorer 9 en su pc:

fin

En 2 días estaré publicando el segundo Post-Tutorial: Tu Web para Internet Explorer 9 – Parte 2 (JumpList) no se lo pierdan!!!

Saludos


MVP_Horizontal Francis Urteaga
Microsoft MVP | Internet Explorer
Microsoft Student Partner Senior | Microsoft Perú
clip_image00352clip_image00452clip_image00652clip_image00752clip_image00952

Los duendes de estadísticas de WordPress.com han analizado el desempeño de este blog en 2010 y te presentan un resumen de alto nivel de la salud de tu blog:

Healthy blog!

El Blog-Health-o-Meter™ indica: ¡Este blog está en fuego!.

Números crujientes

Imagen destacada

Un Boeing 747-400 transporta hasta 416 pasajeros. Este blog fue visto cerca de 3,100 veces en 2010. Eso son alrededor de 7 Boeings 747-400.

 

En 2010, publicaste 129 entradas nueva, haciendo crecer el achivo para 195 entradas. Subiste 395 imágenes, ocupando un total de 27mb. Eso son alrededor de 1 imágenes por día.

The busiest day of the year was 9 de diciembre with 160 views. The most popular post that day was Programa Microsoft Solidario en Universidades.

 

¿De dónde vienen?

Los sitios de referencia más populares en 2010 fueran facebook.com, mail.live.com, twitter.com, google.com.pe y link.smartscreen.live.com.

Algunos visitantes buscan tu blog, sobre todo por silverlight 4 español, samsung i637 jackie, windows search 4.0 para windows 7, francis urteaga y windows home server.

Lugares de interés en 2010

Estas son las entradas y páginas con más visitas en 2010.

1

Programa Microsoft Solidario en Universidades diciembre, 2010

2

El PDC10 estará en el Perú!!! octubre, 2010
1 comentario

3

Silverlight 4 en español… Otro Gol de Rodrigo Díaz Concha febrero, 2010

4

Lanzamiento Presencial de Windows 7 y Office 2010 octubre, 2010
1 comentario

5

Libro Gratuito: Programming Windows Phone 7 octubre, 2010
1 comentario


clip_image00252

Francis Urteaga
Microsoft MVP | Internet Explorer
Microsoft Student Partner Senior | Microsoft Perú
MUG | STC | Email | Blog | Profile
clip_image00352clip_image00452clip_image00652clip_image00752clip_image00952

Encabezado

El día de hoy al promediar las 10:13 a.m. de la madrugada (Luego de recibir el 2011) recibí un mail con el siguiente asunto: ¡Enhorabuena MVP de Microsoft 2011!.

Al inicio pensé que se trataba de una broma y como lo leí entre sueños no le tomé importancia, así que seguí descansando, luego medio sonámbulo seguí pensando en el mail y desperté emocionado y volví a revisar el mail, fue tan grande la sorpresa que lo primero que hice fue twitearlo, la primera persona en felicitarme fue mi queridísima amiga Gabriela Ludeña (Cabe resaltar que Gaby no sabe que es un MVP, pero como es una verdadera amiga igual me felicita), como se pueden dar cuenta aquí:

image

Luego también hice lo mismo con el BlackBerry y lo publiqué en el Facebook, los primeros en brindarme las felicitaciones fueron los amigos que están más pegados en el Facebook, como es el caso de Lucho Quiroz (Perú), Raúl Guerrero (México), Rodrigo Díaz Concha (México), Carlos Rojas (Perú), Elías Mereb (Venezuela) y muchos más:

image

Al conectarme a internet empecé a acceder a los beneficios de un MVP encontrándome con esta pantalla:

Sin título

La verdad estoy contentísimo por haber recibido este reconocimiento de Microsoft Corp. en Internet Explorer, sin lugar a dudas es el mejor reconocimiento que he podido recibir por el trabajo que vengo realizando en las comunidades de todo el Perú.

Para terminar quisiera agradecer a Jorge Oblitas, Ronald Armas, Freddy Vidal, Rodrigo Díaz Concha, Elías Mereb, Juan Mestas, Mauricio Sougarret, César Fong, Danny Sánchez, Rafael Campos, Víctor Altamirano, a los Microsoft Influencers, a la familia de Microsoft Student Partners y a todos los que me han brindado su apoyo en el FY2010.

Gracias a todos!!!

Aquí parte del mensaje de Microsoft:

Estimado/a Francis Urteaga,
Enhorabuena. Nos complace presentarle el programa de nombramiento MVP de Microsoft® de 2011. Este nombramiento se concede a los líderes excepcionales de la comunidad técnica que comparten de forma activa su experiencia de alta calidad y de la vida real con otras personas. Le agradecemos especialmente la contribución que ha realizado en las comunidades técnicas en el área de Internet Explorer a lo largo del pasado año.

El programa de nombramiento de MVP de Microsoft nos proporciona una oportunidad única de celebrar y reconocer sus aportaciones importantes, así como de decir “Gracias por su liderazgo técnico”.

Felicitaciones, ahora es usted una de los pocas personas reconocidas como Profesional Más Valioso (MVP) de Microsoft en el mundo.

Toby Richards
Director general
Soporte En-línea Comunidad

 


logo_mvpFrancis Urteaga
Microsoft MVP | Internet Explorer
Microsoft Student Partner Senior | Microsoft Perú
MUG | STC | Email | Blog
clip_image006clip_image008clip_image010clip_image012clip_image014