La vCard es un formato estándar que se utiliza para intercambiar información de contacto, pueden llamarse también tarjetas personales electrónicas (Electronic Business Cards) y es el equivalente a nuestras tarjetas de visita convencionales.
La tarjeta virtual se suele adjuntar a un email y podemos utilizarla en nuestros ordenadores personales con casi cualquier programa de correo electrónico. Su uso es más popular en dispositivos móviles, reconociendo, mostrando y facilitando el intercambio de estas tarjetas virtuales de unos sistemas a otros. Como ejemplo, un dispositivo con sistema Android puede leer una tarjeta vCard creada con Microsoft Outlook.
Los ficheros vCard llevan extensión “.vcf” o “.vcard”
Las tarjetas virtuales solventan parte de las limitaciones de las clásicas tarjetas de visita. Por medio de la vCard podemos compartir la misma información con más amplitud, permitiendo anotar datos como el nombre, diversas direcciones postales, nombre de la empresa, cargo, varios números de teléfono fijo o móvil, número de FAX, logotipo, dirección Web, numerosas direcciones de correo electrónico, imágenes, información de posicionamiento GPS e incluso audio.
La vCard se puede compartir a través de un enlace en páginas webs, ser transferida haciendo uso de cualquier medio inalámbrico, como bluetooth u otras tecnologías. Cada vez es más usual encontrar en tarjetas convencionales un código QR o similar. Al leer este código con cualquier dispositivo compatible, obtenemos directamente los datos de la vCard y con ello facilitamos añadir su información a la lista de contactos, efectuar una llamada, ir a un enlace Web e incluso disfrutar de contenido multimedia.
Su origen
Las vCard también llamadas Versitcard, se propusieron en el año 1995 por el consorcio Versit, conformado por Apple Computer, AT&T (luego Lucent), IBM y Siemens. Posteriormente, en diciembre del año 1996, la propiedad del formato pasó a una asociación de empresas llamada Internet Mail Consortium para promoverlo como estándar para el intercambio de datos a través del email.
¿Cómo es por dentro un archivo vCard?
A continuación te muestro un ejemplo de archivo vCard (version vCard 2.1) conteniendo mi información de contacto:
BEGIN:VCARD
VERSION:2.1
N:Costa Ros;Jose
FN:Jose Costa Ros
ORG:josecostaros.es
TITLE:Asesor Nuevas Tecnologías
TEL;CELL;+34 690 016 779
URL;WORK:http://www.josecostaros.es
EMAIL:escribeme@josecostaros.es
END:VCARD
Si copias este texto en un fichero “.txt” y posteriormente cambias su extensión por “.vcf”, por ejemplo “josecosta.vcf”, obtendrás una vCard con mis datos.
¿Cómo puedo crear mi vCard?
Casi todos los programas que manejan vCard disponen de la posibilidad de crear estas tarjetas de visita electrónicas. Una forma sencilla, es crear tu propio registro de contacto en un programa compatible vCard como Outlook y elegir exportar a archivo vCard.
Por otro lado, hay sitios webs con herramientas para crear vCard que pueden ser de utilidad.
vCardmaker es una herramienta que nos ofrece la posibilidad de incluir una amplia cantidad de datos, fácil e intuitiva herramienta que tras introducir los datos en los campos que deseemos rellenar y pulsar en “generate”, nos crea un fichero “.vcf”.
Moongate tras rellenar el formulario, nos permite obtener una vCard con los datos indicados, por otro lado nos muestra el código de la tarjeta virtual que podemos copiar, así mismo, nos crea un código QR y otro Data Matrix con la información de la vCard que podemos descargar.
¿Cómo agrego una vCard a mi página Web o Blog?
Una forma sencilla, elegante y rápida de hacer llegar nuestros datos o los de nuestra empresa a un usuario, es por medio de una tarjeta virtual, bien por un enlace directo al fichero o si queremos ser más creativos y eficientes, ¿por qué no generar un código QR con nuestros datos y lo añadimos al diseño de nuestro sitio? Un ejemplo de ello, puedes verlo en mi página de contacto.
Cuando me dispuse a probar el enlace de mi vCard en mi página de contacto, no se comportó como esperaba. Al hacer click sobre el código QR, en lugar de descargar el fichero “josecostaros.vcf” me mostraba una página con el texto que contiene la vCard. Esto me llevó a investigar; encontré una solución, tenemos que indicar al servidor Apache cómo manejar este tipo de archivo, esto se hace añadiendo la siguiente línea de código en un archivo .htaccess :
AddType text/x-vcard. Vcf
Comprueba que funciona haciendo click en la imagen: , podrás descargar mi vCard y agregarme a tu lista de contactos.
Cuando recibas un mensaje o correo electrónico con un archivo vCard haz clic en él para incluir su información a tu lista de contactos de forma sencilla.
Te sugiero que añadas a tu móvil un contacto con tus propios datos, incluso guarda en tu PC y teléfono móvil tu propia vCard. Esta información puedes adjuntarla a email, transferirlo por Bluettoth, programas de mensajería, etc.
Utilizando tarjetas virtuales, apoyamos al medio ambiente ya que evita la impresión de gran parte de papel que conllevan las tarjetas convencionales.
Muy bueno
Gracias por tu comentario Melissa. Me alegra que te guste. Saludos!
Hola Jose, gracias por tu artículo. Estaba buscando precisamente algo para leer sobre las vCards :-) La información que ofreces es bastante detallada. ¡Excelente!
Me alegra que te guste y de que te sea útil. Gracias por tu comentario, saludos!
Muchas gracias por el post, muy completo aunque no me ha funcionado al 100%.
Ahora mismo estoy creando mi página web, y quería meter la vcard, pero no me funciona correctamente el enlace en todos los navegadores.
He modificado el archivo .htcaccess, añadiendo la línea que indicas. Sin embargo en Chrome y Opera no funciona correctamente, en Firefox e increiblemente en Internet Explorer si. En el móvil (Android) he probado y tampoco.
El archivo .htcaccess, ha quedado así:
# Use PHP5 as default
AddHandler application/x-httpd-php5 .php
AddType text/x-vcard. Vcf
Las dos primeras líneas venían por defecto y no me he atrevido a borrarlas, después he añadido la línea que indicabas en el post.
Muchas gracias por todo. A partir de ahora esta página estará en mis favoritos.
Hola Myriam,
En primer lugar gracias por tu mensaje y me alegra que te sea útil esta información.
Acabo de probar en Chrome, Internet Explorer, Firefox, Opera y Safari. En todos los casos funciona (no lo he probado desde que lo puse).
Recuerda borrar la caché de tu sitio y de tus navegadores, a veces juega malas pasadas.
La línea: AddType text/x-vcard .vcf la tengo puesta en la primera línea del archivo .htaccess.
Espero que esto te ayude.
Un saludo.
Jose Costa.
Gracias Jose por responder tan rápido.
Ya está solucionado, al final directamente entre las opciones del servidor (Bluehost) me permite configurar directamente los tipos MIME en el cPanel
Tipo MIME: text/vcard
Extension: .vcf
Ahora ya, va a la perfección en todos.
Muchas gracias,
Myriam.
¡Me alegra!, Pronto tendrás tu sitio en marcha,
Saludos!
Jose.
Hola Myriam,
Que bueno que pudiste solucionarlo, yo tengo el mismo problema, he probado con la visualizacion a travez de Internet Browser para Ordenadores, y el resultado es el siguiente:
Chrome: No funciona
I. Explorer: Funciona
Firefox: Funciona
Opera: Funciona
Safari: No funciona
Podrias por favor detallar la solucion que escribiste, te lo agradeceria muchisimo.
Saludos
Hola Jose,
muchas gracias por compartir esta información, se hace muy útil para quienes nos iniciamos en este mundillo de los codigos de programación encontrar posts que expliquen de forma humana las funciones de estos =)
Al probar desde un Tablet o Smartphone tengo el problema que dices tu
“Al hacer click sobre el código QR, en lugar de descargar el fichero “josecostaros.vcf” me mostraba una página con el texto que contiene la vCard.”
He probado tambien con un Smartphone y un Tablet en tu sitio y tu tienes el mismo problema.
Saludos
Hola Andi,
gracias por tu comentario. Supongo que algunos navegadores móviles y otros de escritorio menos utilizados pueden presentar el problema que me ocurría con los navegadores Chrome, Safari, Opera, Internet Explorer y Firefox (no he probado con otros).
Solucioné el problema añadiendo la linea de código indicada en el post al fichero .htaccess de mi página.
Acabo de probar en mi smartphone (Samsung Galaxy S4) con el navegador que viene por defecto y con Chrome para móviles y descarga el fichero en lugar de aparecer la página de texto, se comporta correctamente.
¿Qué navegador estas utilizando en tus dispositivos móviles?, prueba borrando datos de navegación del navegador que utilizas en tu tablet y smartphone.
Saludos!
Hola Jose,
gracias por tu rapida respuesta.
En la carpeta raiz de mi sitio tengo el archivo .htaccess y he copiado el codigo en la primera linea. (es el unico codigo que tengo dentro hasta el momento)
AddType text/x-vcard. Vcf
Mi vCard esta hubicada en un sub-directorio en formato .vcf
El codigo html para efectuar la descarga es el siguiente:
Contact
Estan bien estos pasos, o me estoy saltando algo….?
Los Navegadores que he útilizado en los Smartphone (Samsung G. II & G. III) han sido:
Internet Browser predeterminado para Android version 4.1.2
Internet Browser predeterminado para Android version 4.4
Dolphin Browser version 10.10
Y el navegador útilizado en Tablet (Galaxy Tab 3) ha sido:
Internet Browser predeterminado para Android version 4.2
Dolphin Browser version 10.10
disculpa, ingrese el codigo html a lo bestia y olvide poner las cremillas para evitar activarlo.
Aquí va el codigo que tengo en mi pagina para efectuar la descarga:
“Contact”
He probado con la opcion:
“target=”_blank””
Pero no veo ninguna diferencia en el comportamiento, a demas de abrir una nueva ventana para mostrar el codigo.
…. Lo dije, soy un primerizo en esto de programación! Disculpad…..
una vez mas el código html para la descarga, esta vez con etiqueta de comentario. Si esta vez no funciona lo dejo…
Contact
Lo siento, veo la ruta en tu página finalexport:
/download/andijoc.vcf
similar a la de mi sitio:
/vcard/josecostaros.vcf
y me funciona en ambos casos, en tu sitio y en el mio.
He corregido la dirección URL en tu último comentario y también me funciona.
Espero que puedas solucionarlo (borra caché de cada navegador antes de revisar cambios de tu sitio web).
No se me ocurre que otra cosa puede ser, además de que tu servidor pueda tener alguna opción como el caso de MyriamT.
Si lo solventas, espero que puedas compartir con nosotros la solución.
Un saludo.
Hola
Recibi en mi movil un SMS sin numero (anonimo) que pone “Borrador: BEGIN:VCARD VERSION:2.1…” Lo abro y no hay nada. Lo intento borrar y no me lo permite. Esta instalado el primero de la lista de los SMS, posteriormente los que voy recibiendo de otra gente se colocan siempre detras de ese, que permanece el primero. Todos los demas los puedo leer, borrar etc. y con este nada. Sera algun tipo de virus o troyano etc.?
Como lo podria eliminar?
Gracias y un saludo
Hola Salvador,
gracias por tu comentario; no se exactamente que te ha ocurrido, puede ser que te hayan enviado una tarjeta electrónica vía mensaje y tu terminal no lo haya interpretado bien. En lugar de mostrarte los datos como nombre y teléfono lo tomó todo como si fuera texto.
Como cualquier otro mensaje de texto, el terminal tendría que permitirte eliminarlo.
Quizá te convenga reiniciar el terminal.
Un saludo.
Hola! tengo un problema. He creado mi codigo QR, sin embargo, lo quiero insertar en mi web y no me aparece si lo inserto como png. mi web esta echa con wordpress. Me podría ayudar? Gracias.
Hola Amalia,
El código QR generado se trata como cualquier otra imagen, no tendrías que tener ningún problema para insertarlo en tu página.
Para poder ayudarte más, tendría que ver tu sitio y saber que generador utilizas.
Si te parece bien, envíame por medio del email que indico en “contacto” la URL de tu WEB, el QR que has generado y la dirección URL del generador de QR que has utilizado, veré que puedo hacer.
Un saludo.
Hola
he puesto un vcf en esa web, la he probado con iphone y ordenador y va sin problemas.pero con varios android no hay manera, sale el texto en la web. y eso que la vcf la cree con android 2.3.4
Alguien sabe si se puede solucionar? y como? la pagina no tiene php
gracias
Hola mirasu:
Pruebo mi vcard desde mi Android y va perfectamente… yo la generé con una de las páginas que indico en el post… sigue todos los pasos.
Suerte!
Un saludo.
Gracias, pero yo me refiero a bajarla desde una web. pero tampoco me funciona la tuya. y parece que por lo que he leido es normal que no funcione con el navegador de android :-(.
De momento lo unico que se me ocurre es ponerla en dopbox y desde ahi si se baja y no se abre como txt.
aunque me gustaria alguna otra manera mas estetica :-D
Gracias por el post
Hola mirasu,
En Chrome de Android… si me funciona… pruébalo.
Me alegra que te haya gustado el post.
Un saludo.
Fácil y conciso para algo simple, útil y que ignoraba hasta ahora.
Buen post.
Gracias Zektor,
me alegra que te haya sido útil.
Un saludo.
Muchas gracias por la información, muy buen trabajo.
Me ha sido de mucha utilidad.
¡Me alegra Daniel!.
Saludos.
Muy buen artículo, una pregunta como agrego la foto a la vcard como en tu caso, gracias.
Hola Felipe,
mi vCard con imagen la creé con Outlook Express.
Agregué mi contacto con todos los datos y adjunté mi imagen, posteriormente abro el contacto voy a Archivo > Guardar como > nombredetuvcard.vcf
Espero poder haberte ayudado.
Un saludo.
hola, buen articulo, tengo una duda.
si agrego mi foto en outlook y guardo la vcard, como puedo importar esa vcard en el generador de códigos para que cuando cree el qr lleve la foto incluida para que cuando se agregue a la agenda añada todos los datos incluida la foto?
gracias
Hola,
Gracias por tu comentario.
Eso no es posible dada las limitaciones del código QR, yo mismo lo intenté sin éxito.
Un saludo!
Hola Jose Muy Buen aporte pero yo estoy haciendo un programa que a partir de una lista de nombres y numeros telefonicos me genere un archivo vcard. El programa me escribe un archivo .vcf con el siguiente contenido
begin:vcard
version:2.1
n:david;eduardo;flores;
nf:david eduardo flores
tel;cell:71039910
end:vcard
este es un contacto solamente al momento de importar me sale que no hay o no existen tarjetas electronicas.
quisiera contactarme contigo ya que no encontre a nadie que hable de este tema a profundidad
mi correo
puntomath@gmail.com
whatsapp:+59171039910
facebook : David eduardo flores Beltran
Gracias
Sin Embargo esto funciona
BEGIN:VCARD
VERSION:2.1
N:flores beltran;david;eduardo
FN:david eduardo flores beltran
TEL;CELL;VOICE:71039910
END:VCARD
BEGIN:VCARD
VERSION:2.1
N:flores beltran;felimon;
FN:felimon flores beltran
TEL;CELL;VOICE:71039911
END:VCARD
Hola David, no se que utilidad le vas a dar a la vcard pero me alegra que te funcione y le des uso. Un saludo!
Hola José. Gracias por el artículo tan iteresante.
Entendiendo que el tema vCard se enmarca en un entorno de modo texto, quisiera preguntarte si en una vCard se puede ir un poco más allá.
Me explico: se podria crear un formato visual donde se vean estilos de texto (Negritas, itálicas, tamaños…) así como contener también imágenes, por ej. Logo, Fotos, fondo… que visualmente el receptor la vea como la “tipica tarjeta de cartulina” y que al hacer clik en ella, se comporte como una vCard a la vez que esta “tarjeta visual” se pueda almacenar con posibilidad de hacer reenvios. Estoy pensando en Whatsapp, SMS…
Quizás esto es otra historia más compleja que ya se aleja de la simple vCard, pero seria tan bonito…
Gracias por anticipado.
Hola Ramón:
La vCard está limitada, para lo que indicas hay otros sistemas mucho más avanzados.
Saludos.
Buenos días José,
Primero felicidades por tu blog!
Es posible descargar los datos de una vcard clicanco en un código QR desde un CORREO ELECTRÓNICO, o sólo se puede hacer si el código QR está incrustado en una página web?
Siempre puedes crear una VCARD y descargarla al hacer clic en una imagen como puede ser en un código QR. Es posible descargarlo por medio de un email en formato HTML. Espero haberte ayudado. Saludos.
Hola!
Cómo estás? He realizado dos de los pasos que aconsejas. Crear el archivo tt y modificarle a un vcf en panel y después añadir esa línea de código al htaccess. Pero no sé cómo seguir procediendo para introducir la tarjeta en mi página web. ¿cuál sería el siguiente paso para poner incrustarla en código QR, imagen, etc?
Gracias
Hola Úrsula,
Antes tienes que crear el fichero “.vcf” o “.vcard” como se indica en el punto “¿Cómo es por dentro un archivo vCard?” y guardarlo en tu sitio web (subirlo por medio de FTP por ejemplo: http://tudominio.es/vcard/tunombre.vcf ). Luego puedes hacer un código QR con la ruta publica, al escanearlo el dispositivo móvil te muestra el contacto.
Espero haber podido ayudarte. Saludos.