tag:blogger.com,1999:blog-30407778364662380712024-03-13T12:24:43.450+01:00gloB ... iris611... BlogMultimedia & Web: Diseño, programación, video, fotografía,<br>...para recordar y compartirUnknownnoreply@blogger.comBlogger69125tag:blogger.com,1999:blog-3040777836466238071.post-36613181265747920352015-01-09T13:29:00.003+01:002015-01-09T13:37:59.271+01:00Problemas con las anotaciones en Youtube cuando el nombre de usuario del canal tiene un punto o guiónRecientemente hemos añadido algunos videos a nuestro espacio <a href="https://www.youtube.com/channel/UCK4idxqjkrNSyvxK5MRmlTA">hilovisual.TV</a> en Youtube.<br />
<br />
Una vez has subido el video, el siguiente paso es completar los datos descriptivos, aplicar el protocolo SEO, ... e incluir anotaciones y llamadas a la acción.<br />
<br />
En el momento de añadir una anotación para <a href="http://www.youtube.com/channel/UCK4idxqjkrNSyvxK5MRmlTA?sub_confirmation=1" target="_blank">facilitar la suscripción a nuestro canal</a>, nos encontramos que "el canal hilovisual.TV no existe con ese nombre". Seguramente ya sabrás que actualmente para personalizar la URL del canal de Youtube, hay quer superar una serie de requisitos. O sea que por ahora nuestro canal se llama oficialmente "<b>UCK4idxqjkrNSyvxK5MRmlTA</b>". El origen de este mix de letras y números se corresponde con la última parte de la <b>dirección URL de tu canal</b>, en nuestro caso es <a href="https://www.youtube.com/channel/UCK4idxqjkrNSyvxK5MRmlTA">https://www.youtube.com/channel/UCK4idxqjkrNSyvxK5MRmlTA</a><br />
<br />
Vamos a añadir una anotación para incluir un mensaje en el video llamando a la suscripción a nuestro canal. Nos vamos al "<b>Gestor de videos</b>" y seleccionamos nuestro video ... y la opción "<b>Editar</b>" ... "<b>Anotaciones</b>"<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-9Xrhm6NTzko/VK_Jo3_TwnI/AAAAAAAAAYs/jjG1xlvd1_s/s1600/anotaciones-suscribirse.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://2.bp.blogspot.com/-9Xrhm6NTzko/VK_Jo3_TwnI/AAAAAAAAAYs/jjG1xlvd1_s/s1600/anotaciones-suscribirse.jpg" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-J52segxDx3k/VK_DURWEvoI/AAAAAAAAAYU/4r0RTAfNNe8/s1600/anotaciones-suscribirse.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><br /></a></div>
Si tienes dificultades para definir la suscripción en tus anotaciones escribiendo <b>tu nombre de usuario de canal porque éste contiene un punto o guión</b>, la solución es utilizar directamente el mix de letras y números de la URL del canal.<br />
<br />
Saludos!!!
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-76020321494696961552012-11-01T22:54:00.002+01:002012-11-01T22:57:55.963+01:00Actualización de Windows 7 a Windows 8En tan sólo un par de horas he actualizado de Windows 7 (Pro 64bits) a Windows 8 (Pro 64bits) de mi PC. He seleccionado la posibilidad de mantener todos los programas, configuraciones y datos que ya tenía en W7. El proceso no ha tenido incidencias, todo fue bien. Después de haber instalado y actualizado a lo largo de los años varias versiones de Windows, ésta ha sido muy sencilla.<br />
<br />
Así que enseguida he tenido el ordenador disponible con programas, correos, datos,...<br />
<br />
He probado las suites de Adobe CS5.5 para Web y CS5.5 Production para video con Windows 8 Pro y van estupendamente. Ya estamos operativos para realizar páginas web, edición de videos y animaciones. Genial!!!<br />
<br />
Norton 360 va OK. Caramba el Firefox 12 ok, ...acabo de actualizarlo porque está un pelín desfasado, en este ordenador. Actualizo a F16.02 pero Norton no tiene la protección disponible, será cuestión de días. Así que usaré Internet Explorer 10 con la barra de Norton activada.<br />
<br />
Estoy familiarizándome con la interfaz. Cómo es un ordenador de sobremesa, para ir al menú de inicio encuentro que lo más práctico es usar la <b>Tecla "Ventana"</b> de toda la vida.<br />
<br />
Puedes configurar la pantalla de inicio como más te guste, con los enlaces directos a aplicaciones online y offline. Para añadir los iconos, mover el ratón hacia la parte derecha de la pantalla, en la opción "Buscar", tras la lupa, están todos los accesos a los programas, panel de control, ...<br />
<br />
La primera aplicación online que he instalado desde la Tienda de Windows ha sido Kindle para Windows 8, gratuita, como podemos hacer con el tablet o el smatphone en la tienda de aplicaciones, esto ya es el siglo XXI para los PC. Están las clásicas de Skype, ... hay mucho terreno para explorar.<br />
<br />
<br />
Puedo utilizar la tableta Wacom Bamboo Fun con interfaz táctil y lápiz, modelo CTH-461, no es lo último pero va estupenda para retoques sencillos con Photoshop.<br />
<br />
Por supuesto, sigo probando, e informando ...<br />
<br />
<br />
<br />
<br />
<iframe frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://rcm-es.amazon.es/e/cm?t=iris611blog-21&o=30&p=8&l=as1&asins=B008VBJ7SG&ref=tf_til&fc1=000000&IS2=1&lt1=_blank&m=amazon&lc1=FF7800&bc1=000000&bg1=FFFFFF&f=ifr" style="height: 240px; width: 120px;"></iframe>
<iframe frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://rcm-es.amazon.es/e/cm?t=iris611blog-21&o=30&p=8&l=as1&asins=B007OZO03M&ref=tf_til&fc1=000000&IS2=1&lt1=_blank&m=amazon&lc1=FF7800&bc1=000000&bg1=FFFFFF&f=ifr" style="height: 240px; width: 120px;"></iframe>
<iframe frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://rcm-es.amazon.es/e/cm?t=iris611blog-21&o=30&p=8&l=as1&asins=B009QDEAP8&ref=tf_til&fc1=000000&IS2=1&lt1=_blank&m=amazon&lc1=FF7800&bc1=000000&bg1=FFFFFF&f=ifr" style="height: 240px; width: 120px;"></iframe>
<iframe frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://rcm-es.amazon.es/e/cm?t=iris611blog-21&o=30&p=8&l=as1&asins=B0083Q04M2&ref=tf_til&fc1=000000&IS2=1&lt1=_blank&m=amazon&lc1=FF7800&bc1=000000&bg1=FFFFFF&f=ifr" style="height: 240px; width: 120px;"></iframe>
<iframe frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://rcm-es.amazon.es/e/cm?t=iris611blog-21&o=30&p=8&l=as1&asins=B005890FUI&ref=tf_til&fc1=000000&IS2=1&lt1=_blank&m=amazon&lc1=FF7800&bc1=000000&bg1=FFFFFF&f=ifr" style="height: 240px; width: 120px;"></iframe>
<iframe frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://rcm-es.amazon.es/e/cm?t=iris611blog-21&o=30&p=8&l=as1&asins=B007HCCOD0&ref=tf_til&fc1=000000&IS2=1&lt1=_blank&m=amazon&lc1=FF7800&bc1=000000&bg1=FFFFFF&f=ifr" style="height: 240px; width: 120px;"></iframe>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-68085998017859684232012-11-01T18:02:00.001+01:002012-11-01T18:12:52.681+01:00Windows 8, The New ExprerienceEstoy a punto de actualizar mi PC con el super Windows 7 a 64bits al ultimísimo Windows 8.<br />
<br />
Hace unos días vi en la FNAC algunos ultrabooks con Windows 8 y pantalla táctil y la primera impresión fue bastante buena.<br />
<br />
No soy muy partidaria de instalar un sistema operativo cuando se acaba de lanzar al mercado. Pero personalmente aunque me encanta Windows 7, esta oferta de lanzamiento hace irresistible que me arriesgue a actualizarlo para comprobar de primera mano las novedades de Windows 8.<br />
<br />
Para empezar, podemos utilizar el asistente de actualización que indica las compatibilidades de hardware y software de la máquina: <a href="http://windows.microsoft.com/es-ES/windows-8/upgrade-to-windows-8" target="_blank">Asistente de actualización a Windows 8</a>. Esta herramienta la proporciona Windows desde su web y se puede probar sin haber comprado o instalado Windows 8.<br />
<br />
En unas horas más ... <br />
<br />
<br />
<br />
<iframe frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://rcm-es.amazon.es/e/cm?t=iris611blog-21&o=30&p=8&l=as1&asins=B008VBJ7SG&ref=tf_til&fc1=000000&IS2=1&lt1=_blank&m=amazon&lc1=FF7800&bc1=000000&bg1=FFFFFF&f=ifr" style="height: 240px; width: 120px;"></iframe>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-13221693823057644652012-10-18T19:12:00.000+02:002012-10-18T23:21:48.331+02:00Algunos trucos del comercio ... aplicados al e-commerceEn el magnífico libro de Martin Lindstrom, "<a href="http://www.amazon.es/gp/product/B006GFT5H2/ref=as_li_qf_sp_asin_tl?ie=UTF8&tag=iris611blog-21&linkCode=as2&camp=3626&creative=24790&creativeASIN=B006GFT5H2">Así se manipula al consumidor: Cómo las empresas consiguen lavarnos el cerebro y que compremos sus marcas</a><img alt="" border="0" height="1" src="http://www.assoc-amazon.es/e/ir?t=iris611blog-21&l=as2&o=30&a=B006GFT5H2" style="border: none !important; margin: 0px !important;" width="1" />", se recogen, entre muchos otros aspectos, algunos "trucos" empleados por los establecimientos comerciales para mejorar el proceso de venta.<br />
<br />
Algunos son ampliamente conocidos, como por ejemplo la estudiada distribución de los productos en los locales, la iluminación, el uso del hilo musical y el color.<br />
<br />
Una cuestión fundamental es el cuidado de la "primera impresión" que recibe el usuario al entrar en el local, con una ambientación acorde a los productos que se vendan, y facilitando el acceso al establecimiento eliminando las barreras arquitectónicas. Una vez dentro del lugar, la distribución y disposición por categorías, te "guiará" hasta tu objeto deseado no sin antes "tentarte" con otras exquisiteces.<br />
<br />
Llegados a este punto, las similitudes entre el punto de venta y nuestra tienda virtual de comercio electrónico podríamos recogerlas en:<br />
<br />
- un cuidado diseño del sitio web, acorde a los productos que se vendan,<br />
- llamadas a la acción (compra, suscripción, registro) accesibles y claras, <br />
- facilitar el acceso al producto con el menor número de clics posibles,<br />
- una categorización intuitiva de los productos<br />
- vincular productos relacionados para ampliar las posibilidades, ...<br />
<br />
Como ves no son técnicas de manipulación psicológica propiamente, más bien hablamos de usabilidad en la web. Y los libros Steve Krug , así como Jakob Nielsen son referencias imprescindibles.<br />
<br />
Steve Krug, en su primer libro sobre usabilidad web "<a href="http://www.amazon.es/gp/product/8483222868/ref=as_li_tf_tl?ie=UTF8&tag=iris611blog-21&linkCode=as2&camp=3626&creative=24790&creativeASIN=8483222868">No me hagas pensar 2ed.</a><img alt="" border="0" height="1" src="http://www.assoc-amazon.es/e/ir?t=iris611blog-21&l=as2&o=30&a=8483222868" style="border: none !important; margin: 0px !important;" width="1" />",
recomienda la lectura de este estudio de accesibilidad, realizado por Mary Theofanos y Janice Redish con personas invidentes, que también nos ayudará a comprender mejor las necesidades del usuario de nuestra web o tienda online:
<a href="http://www.redish.net/content/papers/InteractionsPaperAuthorsVer.pdf" target="_blank">http://www.redish.net/content/papers/InteractionsPaperAuthorsVer.pdf</a>
<br />
<br />
<br />
<iframe frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://rcm-es.amazon.es/e/cm?lt1=_blank&bc1=000000&IS2=1&bg1=FFFFFF&fc1=000000&lc1=FF7800&t=iris611blog-21&o=30&p=8&l=as1&m=amazon&f=ifr&ref=qf_sp_asin_til&asins=B006GFT5H2" style="height: 240px; width: 120px;"></iframe>
<iframe frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://rcm-es.amazon.es/e/cm?t=iris611blog-21&o=30&p=8&l=as1&asins=8483222868&ref=tf_til&fc1=000000&IS2=1&lt1=_blank&m=amazon&lc1=FF7800&bc1=000000&bg1=FFFFFF&f=ifr" style="height: 240px; width: 120px;"></iframe>
<iframe frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://rcm-es.amazon.es/e/cm?t=iris611blog-21&o=30&p=8&l=as1&asins=8441520925&ref=tf_til&fc1=000000&IS2=1&lt1=_blank&m=amazon&lc1=FF7800&bc1=000000&bg1=FFFFFF&f=ifr" style="height: 240px; width: 120px;"></iframe>
<iframe frameborder="0" marginheight="0" marginwidth="0" scrolling="no" src="http://rcm-es.amazon.es/e/cm?t=iris611blog-21&o=30&p=8&l=as1&asins=B001QA4SY2&ref=tf_til&fc1=000000&IS2=1&lt1=_blank&m=amazon&lc1=FF7800&bc1=000000&bg1=FFFFFF&f=ifr" style="height: 240px; width: 120px;"></iframe>
Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-27965457786287835442012-08-21T19:45:00.000+02:002012-08-21T20:52:21.701+02:00Tipografías ... online<a href="http://2.bp.blogspot.com/_Sdh5XXSb4JU/Ro1uebwZGaI/AAAAAAAAABE/whPYr4tFuMg/s1600-h/%40.jpg"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5083841023497017762" src="http://2.bp.blogspot.com/_Sdh5XXSb4JU/Ro1uebwZGaI/AAAAAAAAABE/whPYr4tFuMg/s200/%40.jpg" style="cursor: hand; cursor: pointer;" /></a><br />
<br />
<br />
<a href="http://www.dafont.com/" target="_blank">DaFont</a> es uno de mis lugares favoritos para encontrar typos gratis ... y por supuesto también de pago.<br />
<br />
Otros son:<br />
- <a href="http://www.myfonts.com/">My Fonts</a><br />
- <a href="http://www.fonts.com/">Fonts</a><br />
- <a href="http://www.highfonts.com/">Highfonts</a><br />
- <a href="http://www.1001fonts.com/">1001 Fonts</a><br />
- <a href="http://www.fontshop.com/" target="_blank">Fontshop </a><br />
- TypeNavigator (descubrir la tipo a partir de una imagen by Fontshop ) hace un tiempo que no está disponible, lástima!<br />
<br />
Añado a la lista las tipografías para la web disponibles en:<br />
- <a href="http://www.google.com/webfonts" target="_blank">Google web fonts</a> - gratuitas<br />
- <a href="http://www.fontsquirrel.com/" target="_blank">Fontsquirrel</a> - gratuitas. Incluye fuentes tipográficas con licencia para usarlas con @font-face en css embebido y gracias al generador @font-face kit.<br />
- <a href="https://typekit.com/" target="_blank">Typekit</a><br />
- <a href="http://fontdeck.com/" target="_blank">Fontdeck</a><br />
<br />Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-82958665220458957082012-08-18T14:32:00.004+02:002012-08-18T14:49:21.118+02:00Trucos para practicar lectura rápidaEn esta infografía publicada por mindflash.com, <a href="http://visual.ly/how-train-yourself-speed-read" target="_blank">"Cómo entrenarte para leer más rápido"</a>, se recogen algunas prácticas indicaciones para alcanzar mayor velocidad de lectura y mejorar la productividad cuando requerimos adentrarnos en largos textos.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://visual.ly/how-train-yourself-speed-read" target="_blank"><img border="0" src="http://thumbnails.visually.netdna-cdn.com/how-to-train-yourself-to-speed-read_50290b418f018.png" width="99%" height="99%" /></a></div>
<br />
<div class='visually_embed' data-category='How To' rel='infographic'>
<span class='visually_embed_cycle'><span>by </span> <a target='_blank' href='http://www.mindflash.com/'>Mindflash</a>.Browse more <a href='http://visual.ly' target='_blank'>data visualization</a>.</span>
<a id='visually_embed_view_more' target='_blank' href='http://visual.ly/how-train-yourself-speed-read'></a>
<link rel='stylesheet' type='text/css' href='http://visual.ly/embeder/style.css' />
<script type='text/javascript' src='http://visual.ly/embeder/embed.js'></script>
</div>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-77049625075016875082012-03-29T23:56:00.004+02:002012-03-30T00:09:32.684+02:00Posicionando la web en buscadoresEn esto del posicionamiento de webs, hay miles de trucos y maneras de hacer. Pero el fundamento está en <a href="http://www.iris611.com/estudio-paginas-webs-barcelona.htm">diseñar y optimizar una web</a> desde el inicio.<br />
<br />
Creo que el desarrollo de una web se asemeja a la construcción y mantenimiento de una casa de calidad. Conceptualizar, planificar y modelar son unos buenos cimientos y los mejores materiales y profesionales son fundamentales para la mejor ejecución de una página web.<br />
<br />
Es esencial construir la web pensando en un contenido ameno para el usuario y accesible a los buscadores con la mayor transparencia y sin engaños para escalar de forma natural las mayores posiciones en los buscadores como Google.<br />
<br />
Es aconsejable estructurar el contenido para concretar y definir los conceptos en páginas individuales (segmentación según temas) y utilizar las palabras clave adecuadas, tanto en los títulos como en los metas y contenidos, para definir cada uno de sus objetivos. Cuidaremos mucho los keywords en los h1, h2, ..., utilizando la negrita para resaltar las palabras relevantes. Se considera una buena densidad de palabras clave entre 1% y el 5% del total del texto. Si abusásemos, los buscadores podrían considerarlo spam y nos penalizarían.<br />
<br />
El posicionamiento web requiere mucho esfuerzo y dedicación, por eso es básico trabajar con un <a href="http://www.iris611.com/">webmaster profesional con conocimientos en SEO</a> (Search engine optimization) que desarrolle con esmero estos pasos para incrementar pacientemente la visibilidad de nuestra web de forma natural en los resultados de los buscadores.<br />
<br />
Por supuesto, también es necesario que éste realice un <b>mantenimiento periódico de los objetivos</b> para que la web esté viva y sea atractiva en el tiempo para los buscadores y usuarios . ¿Porque quién va a querer consultar una web abandonada y sin actualizar?<br />
<br />
Aquí encontraremos los <a href="http://google.dirson.com/posicionamiento.net/">viejos y buenos consejos de Google</a> para posicionar nuestra webUnknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-26079669321328623532012-03-22T11:38:00.004+01:002012-03-22T11:55:51.464+01:00La tabla periódica del SEO<div class="separator" style="clear: both; text-align: left;"><a href="http://searchengineland.com/seotable/" target="_blank"><img border="0" height="248" width="200" src="http://searchengineland.com/download/seotable/SearchEngineLand-Periodic-Table-of-SEO-condensed-small.png" /></a></div>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-50375360426611565372012-03-03T20:19:00.000+01:002012-03-03T20:19:00.066+01:00Creadores de paleta de color online1.- <a href="http://www.colorblender.com/" target="_blank">Color Blender</a><br />
<br />
2.- <a href="http://colorschemedesigner.com/" target="_blank">Color Scheme Generator</a><br />
<br />
3.- <a href="http://kuler.adobe.com/" target="_blank">Adobe Kuler </a><br />
<table border="0" cellpadding="0" cellspacing="1"><tbody>
<tr><td><br />
</td></tr>
<tr><td align="center" style="font: 10px Arial, Helvetica, sans-serif;"><br />
</td></tr>
</tbody></table>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-22899696996332217502012-02-25T17:50:00.011+01:002012-03-03T19:59:46.174+01:00Cómo vemos las páginas web. Datos de usabilidad de Google<a href="http://googlewebmaster-es.blogspot.com/2012/01/investigaciones-y-pruebas-basicas-de.html?spref=bl">El Blog para Webmasters de Google - Investigaciones y pruebas básicas de usuarios de sitios web</a>: <br />
<br />
Google, sugiere que se deben hacer unas sencillas pruebas de usabilidad, con un grupo reducido de personas para encontrar las incidencias habituales de navegación pricipalmente. Según <a href="http://www.useit.com/alertbox/20000319.html">Nielsen</a>, con un grupo de sólo 5 personas por test se desvelan el 85% de los problemas de usabilidad . <br />
<br />
Nos propone <a href="http://support.google.com/plus/bin/static.py?hl=en&guide=1257349&page=guide.cs&answer=1215273">Google+ para hacer encuentros virtuales</a> con una herramienta muy parecida a Skype, pero dentro de la red de Google. (no sé si con esta herramienta se puede compartir el escritorio de forma remota,¿?)<br />
<br />
Bueno a lo que vamos, también nos proporcionan algunas claves de sus "lecciones aprendidas" con usuarios reales, algunas son consejos muy básicos pero no por ello menos importantes:<br />
<br />
- Cuando se utilizan diseños en los que se oculta y muestra contenido, es probable que como usuario no nos demos cuenta de que hay información desplegable. Nuestro trabajo como webmaster consistirá en resaltarlo gráficamente o rediseñar la funcionalidad del contenido para aumentar su visibilidad.<br />
<br />
- Evitemos el uso de "Más información..." en el texto de los enlaces. Es mejor utilizar una descripción del contenido del enlace al que se dirige y que sea un texto fácil de entender fuera de contexto. Este sería un objetivo fundamental, muy SEO, que también mejorará el posicionamiento de la web.<br />
<br />
- Botones con textos descriptivos, atractivos e interesantes. <br />
<br />
- Probar la web con una conexión lenta. Podemos usar <a href="https://developers.google.com/pagespeed/">Page Speed Online</a>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-73513702833703271272012-02-25T17:32:00.005+01:002012-02-25T17:44:17.728+01:00El Blog para Webmasters de Google: Cómo hacer formularios más rápidos y sencillos<a href="http://googlewebmaster-es.blogspot.com/2012/01/como-hacer-formularios-mas-rapidos.html?spref=bl">El Blog para Webmasters de Google - Cómo hacer formularios más rápidos, sencillos e inteligentes</a>: <br />
<br />
Uno de los principales obstáculos de cualquier embudo de conversión es rellenar un formulario online. Para facilitar el uso del formulario y que se autocomplete ...<br />
<br />
proponen para Google Chrome y HTML5 del futuro añadir un atributo al elemento de introducción de datos, por ejemplo, el campo de dirección de correo electrónico puede tener una apariencia similar a la siguiente:<br />
<br />
< input type=”text” name=”field1” x-autocompletetype=”email” /><br />
<br />
Podemos consultar <a href="http://wiki.whatwg.org/wiki/Autocompletetype">el texto completo de la propuesta </a>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-87069071128555480652012-02-06T01:07:00.000+01:002012-02-06T01:07:46.282+01:00tutorial como dibujar de un ojo femenino fotorrealista<div style='padding-bottom: 2px; line-height: 0px'><a href='http://pinterest.com/pin/86905467779260092/' target='_blank'><img src='http://media-cdn.pinterest.com/upload/86905467779260092_aun9T5AC_c.jpg' border='0' width='178' height ='880'/></a></div><div style='float: left; padding-top: 0px; padding-bottom: 0px;'><p style='font-size: 10px; color: #76838b;'>Source: <a style='text-decoration: underline; font-size: 10px; color: #76838b;' href='http://www.duitang.com/people/mblog/17549972/detail/'>duitang.com</a> via <a style='text-decoration: underline; font-size: 10px; color: #76838b;' href='http://pinterest.com/beanbot/' target='_blank'>S</a> on <a style='text-decoration: underline; color: #76838b;' href='http://pinterest.com' target='_blank'>Pinterest</a></p></div>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-33126504511980451252011-11-14T19:31:00.006+01:002011-11-15T09:34:41.079+01:00Modos de compatibilidad con IE9Con "Herramientas de Desarrollo" de IE9, podemos seleccionar el modo de compatibilidad deseado (IE7, IE8 Ó IE9) desde nuestro navegador IE9: <br />
<a href="http://www.desarrolloweb.com/articulos/ie9-developer-tools.html">http://www.desarrolloweb.com/articulos/ie9-developer-tools.html</a><br />
<br />
Si queremos determinar desde el código HTML qué navegardor es compatible con nuestra web: <a href="http://msdn.microsoft.com/en-us/library/cc288325%28v=vs.85%29.aspx">Definir la compatibilidad del documento con IE</a><br />
<br />
- escribimos en HTML5: ‹ ! doctype html›<br />
<br />
- p.e. compatible con IE9:<br />
‹!-- Enable IE9 Standards mode --›<br />
‹ meta http-equiv="X-UA-Compatible" content="IE=9" ›<br />
<br />
- p.e. simular IE7:<br />
‹!-- Mimic Internet Explorer 7 --›<br />
‹meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" ›Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-55467169241879372312011-08-10T21:15:00.018+02:002012-03-03T20:00:22.384+01:00Cómo añadir el botón +1 de Google en tu webDesde hace un tiempo nos encontramos con el botón +1 en nuestras búsquedas en Google. Si el usuario hace clic en el +1 adyacente a la URL, muestra públicamente su interés por esa página web. Viene a ser la versión googliana del "me gusta" para los círculos de Google+. Y actualmente se está utilizando unas 2.3 billones de veces al día.<br />
<br />
Google considera que la información que proporciona con este botón es relevante como resultado para una búsqueda de esa página porque da a conocer los gustos de sus visitantes y cuantifica la opinión del público en general.<br />
<br />
Puede ser útil, para destacar nuestro sitio web en buscadores y facilitar el proceso de recomendación con Google+, <a href="http://www.google.com/intl/es/webmasters/+1/button/">el añadir el botón +1 de Google</a> en el HTML. Así pues podemos incluir +1s a la lista de utilidades SEO para ayudar a mejorar la visibilidad y posicionamiento de nuestra web. <br />
<br />
Google ha habilitado en <a href="https://www.google.com/webmasters/tools/">Herramientas para webmasters</a>, el apartado "Métricas +1" para que podamos conocer su impacto en las búsquedas.<br />
<br />
Recientemente nos han proporcionado unas últimas <a href="http://googlewebmaster-es.blogspot.com/2011/05/mas-recomendaciones-para-construir.html">recomendaciones para obtener un mejor posicionamiento en buscadores</a> con el actualizado algoritmo <i>Panda</i>.Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-67654954264651794472011-05-27T13:12:00.004+02:002011-05-29T12:20:50.509+02:00Para guardar las pestañas con Firefox 41. Abrir una pestaña nueva y escribir en la barra de navegación: <br />
<b>about:config</b>, hacer click en "tendré cuidado lo prometo"<br />
<br />
2. Cuando estemos dentro de la configuración, buscar <b>"browser.showquitwarning"</b> (sin las comillas), hacer doble click sobre la opción que aparece para que el valor cambie de false a <b>true</b><br />
<br />
<br />
Otras soluciones a algunos problemas que tuve con Firefox 4:<br />
- Si <a href="http://support.mozilla.com/es/kb/No%20puedo%20hacer%20scroll%20con%20la%20rueda%20del%20rat%C3%B3n%20o%20el%20touchpad">no puedes hacer scroll</a> con la rueda del ratón o el touchpad.Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-44924603481218960802011-03-14T18:34:00.002+01:002011-03-14T18:56:02.688+01:00Los Diseñadores Web [infografia]Datos estadísticos sobre el mundo del diseñador web. La infografía ilustra la información principalmente de los años <a href="http://aneventapart.com/alasurvey2009/">2009</a> - <a href="http://webdesign.about.com/b/2010/04/01/poll-what-do-you-charge-for-web-design-work-per-hour.htm">2010</a>, aunque sigue siendo interesante.<br />
<br />
<p><a href="http://www.testking.com/techking/infographics/all-you-need-to-know-about-web-designers-infographic/"><img src="http://www.testking.com/techking/wp-content/uploads/2010/10/WD_600.jpg" border="0" height="3115" width="500" alt="All You Need To Know About Web Designers " /></a></p><p>Infographic: <a href="http://www.testking.com/techking/infographics/all-you-need-to-know-about-web-designers-infographic/">All You Need To Know About Web Designers </a> by <a href="http://www.testking.com/techking/">Tech King</a></p><p>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-23395661119978478342010-12-23T04:16:00.000+01:002010-12-23T04:16:37.871+01:00Bon Nadal y estupendo 2011 !!!<div class="separator" style="clear: both; text-align: center;"><a href="http://www.giottofilms.com/felicitacion_2010_2011/Alvaro_Glo_2010_2011.jpg" imageanchor="1" style="clear:left; float:left;margin-right:1em; margin-bottom:1em"><img border="0" height="266" width="400" src="http://www.giottofilms.com/felicitacion_2010_2011/Alvaro_Glo_2010_2011.jpg" /></a></div>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-77369490068061719242010-07-10T12:36:00.029+02:002010-07-17T14:32:16.250+02:00Cómo sobrevivir en el ecosistema global - online - TEDxBarcelona y Thinking partyEsta semana hemos podido disfrutar de 2 "maratones" culturales desde la red muy interesantes, el <a href="http://www.tedxbarcelona.com/">TEDxBarcelona 2010</a> y la <a href="http://www.fundacion.telefonica.com/debateyconocimiento/thinking_party/index.htm">Thinking party de Fundación Telefónica</a>. Quisiera agradecerles la oportunidad que nos brindan al transmitir estos eventos online en directo. <br />
<br />
Me gustaría compartir mis impresiones y algunas menciones de los pensadores participantes.<br />
<br />
Podemos ver Internet no sólo como el ecosistema online sino como parte indisoluble del ecosistema global, que se rige por las leyes de la naturaleza, evolución y darwinismo: "Sobrevive el mejor adaptado a su ambiente y circunstancias" y <br />
"la Diversidad es el motor del cambio para evolucionar". <br />
<br />
Algunos de los consejos que nos aportaron estos diversos pensadores para sobrevivir en un mundo global son:<br />
<br />
- Gestión emocional - Inteligencia social y Formación: <br />
<b>Aprendizaje social y emocional</b> para adaptarse a un mundo globalizado, diverso y cambiante: focalizar la atención, colaboración y trabajo en equipo, solución de conflictos, gestión de las emociones. (<a href="http://twitter.com/epunset">@epunset</a>)<br />
<br />
- Pensar en las personas y para las personas <br />
<br />
- Emociones y Actitud: empatía, optimismo, esfuerzo, motivación y entusiasmo.<br />
<br />
- No hay que rendirse, potencia lo que te guste<br />
<br />
- No nos quedemos "parados", no dejemos de movernos. Si paramos, el cerebro empequeñece y nosotros empequeñecemos (<a href="http://twitter.com/epunset">@epunset</a>)<br />
<br />
- Pensamiento crítico<br />
<br />
- No aceptes lo obvio, porque no siempre 2+2=4, mentes abiertas y esfuerzo, la filosofía del <a href="http://www.kipp.org/">KIPP</a>, escuelas públicas de alto rendimiento académico desarrolladas por Mike Feinberg and Dave Levin<br />
<br />
- "Hay preguntas que no tienen respuesta", aceptémoslo y viviremos mucho mejor (<a href="http://twitter.com/epunset">@epunset</a>)<br />
<br />
- los juegos online como motor de cambio social ( Jane Mc Gonigal)<br />
<br />
- Design thinking: El Diseño puede ser una herramienta útil para el cambio social, creando objetos útiles, que resuelvan problemas cotidianos.<br />
<br />
- Hablamos de "Tecnologías", queda aparcado el término "Nuevas tecnologías".<br />
<br />
- Web: el Universo que se rige por leyes físicas, entropía, gravedad, relatividad <a href="http://twitter.com/anamariallopis">@anamariallopis</a><br />
<br />
- El cambio en la sociedad necesitará más tiempo <a href="http://twitter.com/genisroca">G. Roca</a><br />
<br />
- Cuidado con la "nube tóxica", se añade ruido informativo. <a href="http://twitter.com/genisroca">G. Roca</a><br />
<br />
- Hay exploradores y explotadores: "Vigila quien manda a quien" <a href="http://twitter.com/genisroca">G. Roca</a><br />
<br />
- Productividad: no es trabajar más, es trabajar mejor (<a href="http://twitter.com/yoriento">@yoriento</a>)<br />
<br />
- Los problemas nunca se acaban, pero las soluciones tampoco (<a href="http://twitter.com/yoriento">@yoriento</a>)<br />
<br />
Los videos del TED se podrán ver en <a href="http://www.youtube.com/user/TEDxTalks">TEDxTalks</a> y algunos conceptos del Thinking Party están en <a href="http://bit.ly/9UCpNe">Mediateca</a> y registrados en Twitter <a href="http://twitter.com/fundacionTef">@fundacionTef</a> #thinkingpartyUnknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-39831503080277653502010-06-25T13:27:00.002+02:002010-06-25T14:26:23.975+02:00probando el inventoQuiero añadir el up tweet pero no me acaba de aparecer donde me gustaría. Esta plantilla de Blogger me está matando .... grrr<br />
<br />
Finalmente añado ShareThis con la ayuda de <a href="http://blogandweb.com/web-20/blogger-sharethis/">Integrar Share This 2.0 a Blogger</a>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-78164711019551297852010-06-25T12:27:00.002+02:002010-06-25T12:56:35.664+02:00Consejos para una buena vid@ social media<a rel="nofollow" href="http://www.thesteelmethod.com/b2bdodont.html"><img src="http://www.thesteelmethod.com/img/b2b-sm.jpg" alt="Do's and Don'ts of Social Media for Business" width="400" border="0" /></a><br />
Via: <a href="http://www.thesteelmethod.com">The Steel Method</a>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-19341487916042258502010-06-08T20:53:00.007+02:002010-06-08T21:27:23.976+02:00Diseñar tu web para móviles, en busca de estandaresIniciativas para desarrollar estándares en la <a href="http://www.w3.org/standards/webdesign/mobilweb.html">Web movil</a><br /><br />Recomendaciones y <a href="http://www.w3.org/TR/mobile-bp/#d0e289">buenas prácticas</a> en el diseño de página web para dispositivos móviles. <br /><br />Algunos simples consejos de usabilidad a considerar pensando en que nuestra web puede verse también en dispositivos móviles:<br /><br />- diseñar una versión más sencilla para dispositivos móviles,<br />- ofrecer la posibilidad al usuario de elegir si desea ver esta versión simplificada o la web para ordenadores,<br />- utilizar nombres cortos para la dirección de la web,<br />- optimizar el tamaño de las imágenes para reducir al máximo los tiempos de descarga y pensando en el posible coste económico por ancho de banda consumido. No todos los usuarios disponen de tarifa plana para acceder a internet con su smartphone.Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-87165958024897043632010-06-08T18:54:00.023+02:002010-06-08T20:51:19.748+02:00Dispositivos para ver tu web - Media types y Media QueriesEn <a href="http://www.w3.org/TR/CSS2/media.html">CSS 2.1</a>, podemos especificar hasta 10 tipos de dispositivos posibles:<br /><br /> - all ... apto para todos los dispositivos, es el valor por defecto<br /> - aural / speech ... para sintetizadores de habla<br /> - braille ... dispositivos que reciben feedback táctil en braille<br /> - embossed ... para impresoras braille<br /> - handheld ... para ordenadores de bolsillo (PDA, pantallas pequeñas, ...)<br /> - print ... para material imprimible<br /> - projection ... para presentaciones en proyector (por páginas, sólo visual, interactivo)<br /> - screen ... para pantallas de ordenador en color<br /> - tty ... para teletipos y terminales, no usar pixels como unidad,<br /> - tv ... para televisores ( baja resolución, en color, movimiento limitado por la pantalla, sonido disponible)<br /><br />En <span style="font-weight:bold;">HTML4</span>, se definen:<br /><br /> <LINK REL="stylesheet" TYPE="text/css" MEDIA="print, handheld" HREF="estilo.css"><br /><br /> @media print { p { font-size: 14pt;}<br /><br /> @import url("otroestilo.css") screen; <br />(cuidado, los "media types" con <a href="http://reference.sitepoint.com/css/at-import">@import</a> son ignorados por IE5, IE6, IE7 e IE8)<br /><br />En <a href="http://www.w3.org/TR/css3-mediaqueries/"><span style="font-weight:bold;">las recomendaciones para CSS3</span></a>, se introduce el concepto <span style="font-weight:bold;">Media Queries</span> que amplía el control en el rendeado basado en algunas características más concretas de los dispositivos, por ejemplo el ancho de pantalla. La hoja de estilos CSS sólo será aplicable en el dispositivo especificado si la expresión es "verdadera".<br /><br /><link rel="stylesheet" media="screen and (color)" href="example.css" /><br /><link rel="stylesheet" media="only screen and (color)" href="example.css" /><br /><link rel="stylesheet" media="screen and (device-height: 600px)" /><br /><br /><br />@import url(example.css) screen and (color), projection and (color);<br /><br /><?xml-stylesheet media="all and (min-color-index: 256)" <br /> href="http://www.example.com/..." ?><br /><br /><br />@media screen and (color), projection and (color) { ... }<br /><br />@media all and (orientation: portrait) { ... }<br />@media (orientation: portrait) { ... }<br />@media (min-width: 100px) { ... }<br />@media handheld and (min-width: 20em), <br /> screen and (min-width: 20em) { ... }<br /><br />@media screen and (device-aspect-ratio: 16/9) { ... }<br />@media screen and (device-aspect-ratio: 32/18) { ... }<br /><br />@media tv and (scan: progressive) { ... }<br />@media tv and (scan: interlace) { ... }Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-46881709771812303662010-06-03T23:54:00.002+02:002010-07-10T17:46:36.582+02:00<div xmlns="http://www.w3.org/1999/xhtml"><a href="http://4.bp.blogspot.com/_Sdh5XXSb4JU/TAgkes-HHfI/AAAAAAAAAEE/W-0Bw_K-1Nc/s1600/image-upload-171-742450.jpg"><img src="http://4.bp.blogspot.com/_Sdh5XXSb4JU/TAgkes-HHfI/AAAAAAAAAEE/W-0Bw_K-1Nc/s320/image-upload-171-742450.jpg"/></a><br />
</div>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-55450624074282676832010-05-23T14:41:00.000+02:002010-05-23T14:42:11.887+02:00Anocheciendo<a href="http://twitpic.com/1qc0dq" title="anocheciendo ... on Twitpic"><img src="http://twitpic.com/show/thumb/1qc0dq.jpg" width="150" height="150" alt="anocheciendo ... on Twitpic"></a>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-3040777836466238071.post-59927532296969984172010-05-22T00:47:00.001+02:002010-05-22T00:48:30.392+02:00Japan - The Strange Country (English)<object style="background-image:url(http://i3.ytimg.com/vi/rgsbIfI0uIg/hqdefault.jpg)" width="480" height="295"><param name="movie" value="http://www.youtube.com/v/rgsbIfI0uIg&hl=es_ES&fs=1"><param name="allowFullScreen" value="true"><param name="allowscriptaccess" value="always"><embed src="http://www.youtube.com/v/rgsbIfI0uIg&hl=es_ES&fs=1" width="480" height="295" allowScriptAccess="never" allowFullScreen="true" wmode="transparent" type="application/x-shockwave-flash"></embed></object>Unknownnoreply@blogger.com0