{"id":3752,"date":"2017-11-16T22:18:19","date_gmt":"2017-11-16T22:18:19","guid":{"rendered":"http:\/\/disenodepagina.com\/disenoweb\/?p=3752"},"modified":"2017-11-16T22:18:19","modified_gmt":"2017-11-16T22:18:19","slug":"diseno-de-paginas-web-queretaro","status":"publish","type":"post","link":"https:\/\/disenodepagina.com\/disenoweb\/diseno-de-paginas-web-queretaro\/","title":{"rendered":"Dise\u00f1o de p\u00e1ginas web Quer\u00e9taro"},"content":{"rendered":"<h1>Dise\u00f1o de p\u00e1ginas web Quer\u00e9taro<\/h1>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-3753\" src=\"http:\/\/disenodepagina.com\/disenoweb\/wp-content\/uploads\/2017\/11\/images-1.jpg\" alt=\"Dise\u00f1o de p\u00e1ginas web Quer\u00e9taro\" width=\"243\" height=\"208\" \/><\/p>\n<p>CODECS, LA NUEVA GUERRA<\/p>\n<p><a href=\"http:\/\/disenodepagina.com\"><em><strong>Dise\u00f1o de p\u00e1ginas web Quer\u00e9taro<\/strong><\/em><\/a> en los primeros borradores de la especificaci\u00f3n de HTML5, se indicaba que se deb\u00eda de ofrecer soporte para al menos dos codecs multimedia: Ogg Vorbis para audio y Ogg Theora para v\u00eddeo. Sin embargo, estos requisitos fueron eliminados despu\u00e9s de que Apple y Nokia se opusieran, de modo que la especificaci\u00f3n no recomendase ning\u00fan codec en concreto. Esto ha creado una situaci\u00f3n de fragmentaci\u00f3n, con diferentes<br \/>\nnavegadores optando por diferentes formatos, bas\u00e1ndose en sus ideolog\u00edas o convicciones comerciales <em><strong>pagina web<\/strong><\/em>.<br \/>\nActualmente, hay dos codecs principales que debemos tener en cuenta: el nuevo formato WebM, construido sobre el formato VP8 que Google compr\u00f3 y ofrece de manera libre, y el formato MP4, que contiene el codec propietario H.264.<br \/>\nWEBM MP4 OGV<br \/>\nOpera S\u00ed No S\u00ed<br \/>\nFirefox S\u00ed S\u00ed S\u00ed<br \/>\nChrome S\u00ed No S\u00ed<br \/>\nIE9+ No S\u00ed No<br \/>\nSafari No S\u00ed No<br \/>\nWebM funciona en IE9+ y Safari si el usuario ha instalado los codec de manera manual<em><strong> paginas web<\/strong><\/em>.<br \/>\nPor lo tanto, la mejor soluci\u00f3n en estos momentos es ofrecer tanto el formato libre WebM, como el propietario H.264.<\/p>\n<p>6.2.1 MULTIPLES ELEMENTOS &lt;SOURCE&gt;<\/p>\n<p>Para poder ofrecer ambos formatos, primeramente debemos codificarlos por separado. Existen diversas herramientas y servicios on-line para realizar esta tarea, pero quiz\u00e1s el m\u00e1s conocido sea Miro Video Converter. Este software, disponible para Windows y Mac, nos permite convertir los v\u00eddeos en formato Theora, o H.264 (y muchos otros) optimizados para diferentes tipos de dispositivos como iPhone, Android, PS2, etc <em><strong>dise\u00f1o web Ciudad de M\u00e9xico<\/strong><\/em>.<br \/>\nUna vez dispongamos el v\u00eddeo en los distintos formatos, es necesario indicar todas las localizaciones de estos formatos, para que sea el navegador el que decida que formato reproducir. Evidentemente, no podemos especificarlos todos dentro del atributo scr, por lo que tendremos que hacerlo de manera separada utilizando el elemento &lt;source&gt;<em><strong> dise\u00f1o web Guadalajara<\/strong><\/em>.<br \/>\n&lt;video controls&gt; &lt;source src=\u00bbleverage-a-synergy.mp4&#8243; type=&#8217;video\/mp4; codecs=\u00bbavc1.42E01E, mp4a.40.2&#8243;&#8216;&gt; &lt;source src=\u00bbleverage-a-synergy.webm\u00bb type=&#8217;video\/webm; codecs=\u00bbvp8, vorbis \u00ab&#8216;&gt; &lt;p&gt;Your browser doesn\u2019t support video. Please download the video in &lt;a href=\u00bbleverage-a-synergy.webm\u00bb&gt;webM&lt;\/a&gt; or &lt;a href=\u00bbleverage-a-synergy.mp4&#8243;&gt;MP4&lt;\/a&gt; format. &lt;\/p&gt; &lt;\/video&gt;<\/p>\n<p>6.2.2 MEDIA QUERIES PARA VIDEO<\/p>\n<p>Los ficheros de v\u00eddeo tienden a ser pesados, y enviar un v\u00eddeo en alta calidad a un dispositivo con un tama\u00f1o de pantalla reducido es algo totalmente ineficiente. No hay ning\u00fan inconveniente en hacerlo, pero si comprimimos el v\u00eddeo y disminuimos sus dimensiones, conseguiremos reducir su tama\u00f1o (en MB), algo de agradecer en entornos m\u00f3viles y que dependen de una conexi\u00f3n de datos.<br \/>\nHTML5 permite utilizar el atributo media en el elemento &lt;source&gt;, ofreciendo la misma funcionalidad que los Media Queriesen CSS3. Por lo tanto, podemos consultar al navegador por el ancho de la pantalla, la relaci\u00f3n de aspecto, colores, etc, y definir el video correcto seg\u00fan las caracter\u00edsticas del dispositivo.<br \/>\n&lt;video controls&gt; &lt;source src=\u00bbhi-res.mp4&#8243; media=\u00bb(min-device-width: 800px)\u00bb&gt; &lt;source src=\u00bblo-res.mp4&#8243;&gt; &lt;\/video&gt; <em><strong>dise\u00f1o web Df<\/strong><\/em><\/p>\n<h2><em><strong>Dise\u00f1o de p\u00e1ginas web Quer\u00e9taro <\/strong><\/em><\/h2>\n","protected":false},"excerpt":{"rendered":"<p>Dise\u00f1o de p\u00e1ginas web Quer\u00e9taro CODECS, LA NUEVA GUERRA Dise\u00f1o de p\u00e1ginas web Quer\u00e9taro en los primeros borradores de la especificaci\u00f3n de HTML5, se indicaba que se deb\u00eda de ofrecer soporte para al menos dos codecs multimedia: Ogg Vorbis para audio y Ogg Theora para v\u00eddeo. Sin embargo, estos requisitos fueron eliminados despu\u00e9s de que [&#8230;]\n","protected":false},"author":2,"featured_media":3753,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[478,477,8],"tags":[559,84,24,13,138,527],"class_list":["post-3752","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-desarrollo-web","category-diseno-de-pagina","category-diseno-web","tag-diseno-de-paginas-web-queretaro","tag-diseno-web-ciudad-de-mexico","tag-diseno-web-df","tag-diseno-web-guadalajara","tag-pagina-web","tag-paginas-web"],"_links":{"self":[{"href":"https:\/\/disenodepagina.com\/disenoweb\/wp-json\/wp\/v2\/posts\/3752","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/disenodepagina.com\/disenoweb\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/disenodepagina.com\/disenoweb\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/disenodepagina.com\/disenoweb\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/disenodepagina.com\/disenoweb\/wp-json\/wp\/v2\/comments?post=3752"}],"version-history":[{"count":1,"href":"https:\/\/disenodepagina.com\/disenoweb\/wp-json\/wp\/v2\/posts\/3752\/revisions"}],"predecessor-version":[{"id":3754,"href":"https:\/\/disenodepagina.com\/disenoweb\/wp-json\/wp\/v2\/posts\/3752\/revisions\/3754"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/disenodepagina.com\/disenoweb\/wp-json\/wp\/v2\/media\/3753"}],"wp:attachment":[{"href":"https:\/\/disenodepagina.com\/disenoweb\/wp-json\/wp\/v2\/media?parent=3752"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/disenodepagina.com\/disenoweb\/wp-json\/wp\/v2\/categories?post=3752"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/disenodepagina.com\/disenoweb\/wp-json\/wp\/v2\/tags?post=3752"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}