{"id":27372,"date":"2012-12-07T09:58:58","date_gmt":"2012-12-07T08:58:58","guid":{"rendered":"http:\/\/www.outono.net\/elentir\/?p=27372"},"modified":"2012-12-08T01:22:16","modified_gmt":"2012-12-08T00:22:16","slug":"youtube-estrena-nuevo-diseno","status":"publish","type":"post","link":"https:\/\/www.outono.net\/elentir\/2012\/12\/07\/youtube-estrena-nuevo-diseno\/","title":{"rendered":"Youtube estrena nuevo dise\u00f1o"},"content":{"rendered":"

Ayer Youtube anunci\u00f3 en su blog el nuevo dise\u00f1o de ese portal multimedia<\/a>. Sobre estas l\u00edneas ten\u00e9is el nuevo aspecto de las p\u00e1ginas de v\u00eddeos. Es un dise\u00f1o que Youtube define como \"m\u00e1s limpio y simple a lo largo de todo el sitio\".<\/p>\n

Una aproximaci\u00f3n al dise\u00f1o de Facebook y Google Plus<\/big><\/p>\n

El nuevo dise\u00f1o, sobre todo en la p\u00e1gina inicial de cada usuario, acerca un poco m\u00e1s a Youtube al aspecto de Google Plus o Facebook<\/strong>, permitiendo una mayor interacci\u00f3n con otros usuarios, sobre todo con aquellos a cuyos canales est\u00e1s suscrito. En las p\u00e1ginas de v\u00eddeos ahora los usuarios disponen a la izquierda de una gu\u00eda muy parecida a la barra lateral de la aplicaci\u00f3n de Facebook para iPhone. Con ella se puede navegar por las suscripciones, p\u00e1ginas de actividad, mensajes o listas de reproducci\u00f3n sin tener que volver a la p\u00e1gina de inicio.<\/p>\n

Youtube se hace m\u00e1s ancho rompiendo la barrera de los 999 p\u00edxeles<\/big><\/p>\n

Uno de los detalles que m\u00e1s me ha llamado la atenci\u00f3n es que Youtube rompe el l\u00edmite de los 999 p\u00edxeles, un ancho que a\u00fan tienen much\u00edsimas webs<\/strong> -entre ellas este blog- ya que es el que mejor se adapta a las pantallas con una resoluci\u00f3n de 1024 p\u00edxeles de ancho, que siguen siendo las m\u00e1s habituales (aunque no tanto como hace 5 a\u00f1os). La explicaci\u00f3n de esos 999 p\u00edxeles es que los principales navegadores tienen barras de desplazamiento que var\u00edan entre los 13 y los 17 p\u00edxeles de ancho. A eso hay que a\u00f1adir los bordes de los navegadores: entre 0 y 4 p\u00edxeles seg\u00fan el navegador. Si sumamos la barra de desplazamiento m\u00e1s ancha y los bordes del navegador con m\u00e1s borde obtenemos 25 p\u00edxeles. Si a los 1024 p\u00edxeles de resoluci\u00f3n les restamos esos 25, nos quedamos en 999.<\/p>\n

El precedente del ingenioso nuevo dise\u00f1o de Mashable, presentado hace tres d\u00edas<\/big><\/p>\n

La raz\u00f3n de que Youtube haya dado ese paso es f\u00e1cilmente explicable: los ordenadores de sobremesa usan pantallas cada vez m\u00e1s grandes, mientras que los port\u00e1tiles y tablets tienen cada vez mejores resoluci\u00f3n de pantalla (por ejemplo, el nuevo iPad<\/a> y los \u00faltimos MacBook Pro de Apple ya incorporan las pantalla Retina<\/a>, que incluso supera los 300 puntos por pulgada perceptibles por el ojo humano). Obvia decir que el ancho de 999 p\u00edxeles es irrelevante en los m\u00f3viles. En el caso que nos ocupa, para las versiones m\u00f3viles Youtube aplica un dise\u00f1o diferente que tiene una gu\u00eda lateral clavada a la de la aplicaci\u00f3n de Facebook<\/strong>. No es Youtube la primera web importante que decide romper esa barrera de los 999 p\u00edxeles: hace tres d\u00edas la prestigiosa web Mashable.com presentaba tambi\u00e9n su nuevo dise\u00f1o<\/a>, usando todo el ancho de pantalla del navegador mediante un ingenioso sistema de columnas de ancho variable. Como en el caso de Youtube, el portal de Pete Cashmore tambi\u00e9n ha apostado por un dise\u00f1o m\u00e1s sencillo, en el que dominan los colores planos y las suaves tonalidades de grises.<\/p>\n

Nuevos reproductores con colores planos<\/big><\/p>\n

Youtube ha aplicado ese estilo de dise\u00f1o m\u00e1s sencillo en sus reproductores<\/strong>, con un color negro plano tanto en el bot\u00f3n como en la barra inferior, en vez del gradiente de negro a gris que usaba hasta ahora. Esta novedad aparece tanto en los reproductores del propio portal como en las versi\u00f3n para insertar en webs. Esta \u00faltima, que desde hace semanas funcionaba cada vez peor, ejecuta ahora m\u00e1s r\u00e1pidamente los v\u00eddeos, as\u00ed que he aprovechado para renovar los reproductores de Youtube en este blog<\/strong>. Ya pod\u00e9is disfrutar de los nuevos en cualquier p\u00e1gina con v\u00eddeo que visit\u00e9is en Contando Estrelas.<\/p>\n

Youtube ya no ofrece la opci\u00f3n de ocultar el t\u00edtulo, pero sigue funcionando el c\u00f3digo<\/big><\/p>\n

En lo relativo a datos interesantes para dise\u00f1adores, desarrolladores y webmasters<\/strong>, decir que los nuevos c\u00f3digos de inserci\u00f3n var\u00edan ligeramente las dimensiones existentes hasta ahora -en los de este blog ha variado 3 p\u00edxeles de altura-, incluyen el reproductor escamoteable por omisi\u00f3n y siguen permitiendo a\u00f1adir c\u00f3digos para personalizar el aspecto de los v\u00eddeos, entre ellos algunos que no ofrece el men\u00fa de insertar de las nuevas p\u00e1ginas de v\u00eddeos. Por ejemplo, \u00e9ste ser\u00eda el c\u00f3digo para mostrar un v\u00eddeo sin que salga su t\u00edtulo en la pantalla (a\u00f1adiendo ?showinfo=0) y sin que aparezcan los v\u00eddeos relacionados al final (&rel=0):<\/p>\n

[html]<iframe width="560" height="315" src="http:\/\/www.youtube.com\/embed\/1eU-5ONsWgg?showinfo=0&rel=0" frameborder="0" allowfullscreen><\/iframe>[\/html]<\/p>\n

En fin, \u00bfqu\u00e9 os parece el nuevo dise\u00f1o de Youtube? Animaos y escribid vuestras impresiones en los comentarios de esta entrada.<\/strong><\/p>\n","protected":false},"excerpt":{"rendered":"

Ayer Youtube anunci\u00f3 en su blog el nuevo dise\u00f1o de ese portal multimedia. Sobre estas l\u00edneas ten\u00e9is el nuevo aspecto de las p\u00e1ginas de v\u00eddeos. Es un dise\u00f1o que Youtube define como \u00abm\u00e1s limpio y simple a lo largo de todo el sitio\u00bb.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":"","_links_to":"","_links_to_target":""},"categories":[2856,67],"tags":[6101,6100,653],"class_list":["post-27372","post","type-post","status-publish","format-standard","hentry","category-diseno-web","category-a-breves","tag-mashable-com","tag-pete-cashmore","tag-youtube"],"publishpress_future_action":{"enabled":false,"date":"2026-08-11 19:06:39","action":"change-status","newStatus":"draft","terms":[],"taxonomy":"category","extraData":[]},"publishpress_future_workflow_manual_trigger":{"enabledWorkflows":[]},"_links":{"self":[{"href":"https:\/\/www.outono.net\/elentir\/wp-json\/wp\/v2\/posts\/27372","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.outono.net\/elentir\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.outono.net\/elentir\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.outono.net\/elentir\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.outono.net\/elentir\/wp-json\/wp\/v2\/comments?post=27372"}],"version-history":[{"count":0,"href":"https:\/\/www.outono.net\/elentir\/wp-json\/wp\/v2\/posts\/27372\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.outono.net\/elentir\/wp-json\/wp\/v2\/media?parent=27372"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.outono.net\/elentir\/wp-json\/wp\/v2\/categories?post=27372"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.outono.net\/elentir\/wp-json\/wp\/v2\/tags?post=27372"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}