Dakoo http://www.dakoo.cl ¿Te gusta la web? Fri, 04 Nov 2011 03:03:16 +0000 en hourly 1 http://wordpress.org/?v=3.3 Twittcel en todo Chile – twiteros separados por comunas http://www.dakoo.cl/twittcel-en-todo-chile-twiteros-separados-por-comunas/ http://www.dakoo.cl/twittcel-en-todo-chile-twiteros-separados-por-comunas/#comments Fri, 04 Nov 2011 03:02:43 +0000 admin http://www.dakoo.cl/?p=195 Continue reading →]]> Bueno este post lo haré con mucha alegría. Twittcel lo pasé a nivel nacional. Para los que no saben que es, se trata de una aplicación que busca twiteros de la región del maule, Chile ordenándolos por comuna. La cosa es que ahora después de algunos cambios y de mucho leseo(especialmente por falta de tiempo), les traigo la nueva versión la cuál ya tiene identificados alrededor de 49000 twiteros de todo Chile.
Prometo en un pronto Post explicar como funciona y dentro de lo posible seguir agregándole funcionalidad

Link

Espero les guste

saludos a todos

]]> http://www.dakoo.cl/twittcel-en-todo-chile-twiteros-separados-por-comunas/feed/ 0 Audio en HTML5 http://www.dakoo.cl/audio-en-html5/ http://www.dakoo.cl/audio-en-html5/#comments Tue, 21 Dec 2010 01:35:08 +0000 admin http://www.dakoo.cl/?p=182 Continue reading →]]> Reconozco que desde hace mucho tiempo que no escribía nada, entre trabajo, proyectos y novia no queda mucho tiempo para escribir nada en este blog. Hoy escribo sobre un tema que hace tiempo quería seguir tratando, HTML5. Acabo de leer un libro sobre este tema llamado "HTML5 for web designers" de Jeremy Keith. En el cuál explican varios temas y entre estos uno bien interesante es el tag AUDIO.
Un "problema" que sucedía antes de HTML5 era que al momento de querer reproducir algún archivo de música en una web había que utilizar algún reproductor flash y por ende tener que instalar un plugin en el browser. Ahora luego de mucho tiempo HTML nos provee de un tag que permite reproducir un archivo de audio.
Pero vamos por un ejemplo inmediatamente:

PLAIN TEXT
HTML:
  1. <!DOCTYPE html>
  2.     <meta charset = "UTF-8">
  3.     <head>
  4.     </head>
  5.     <body>
  6.         <audio id = "player" src = "ejemplo.ogg" controls preload="true"></audio>
  7.         <button onClick = "document.getElementById('player').play();">Play</button>
  8.         <button onClick = "document.getElementById('player').pause();">Stop</button>
  9.         <button onClick = "document.getElementById('player').volume += 0.1;">Volume Up</button>
  10.         <button onClick = "document.getElementById('player').volume -= 0.1;">Volume Down</button>
  11.     </body>
  12. </html>

Analizemos lo que nos dice este código, en el primer tag tenemos la declaración de AUDIO, en src colocamos la dirección donde se encuentra nuestro archivo, al escribir controls le decimos a la página que muestre un reproductor, el cuál tiene play, pause y volume. Por otro lado si queremos manejar nuestro archivo mediante javascript en los siguientes tag button está como se pueden utilizar.
Ahora ¿Qué archivos podemos reproducir?
Bueno para variar esto depende en muchos casos del browser que estemos utilizando. Pero una buena opción que nos da HTML5 es poder colocar más de una fuente (src) en nuestros archivos por ejemplo si no estamos seguros que el browser de nuestros usuarios reproduce podemos colocar también una versión en ogg de nuestro archivo, incluso podemos decirle el tipo de archivo que es, de la siguiente manera

PLAIN TEXT
HTML:
  1. <audio controls>
  2. <source src = "ejemplo.ogg" type = "audio/ogg">
  3. <source src = "ejemplo.mp3" type = "audio/mpeg">
  4. </audio>

Incluso dentro de el tag audio podemos poner un objeto flash , el orden en que trata de reproducir el browser es de arriba hacia abajo.

Si quieres ver un ejemplo funcionando y tienes un browser que soporta HTML5 puedes verlo funcionando en este link

saludos tuto

]]> http://www.dakoo.cl/audio-en-html5/feed/ 3 Los 7 mejores plugins para desarrollo web en firefox http://www.dakoo.cl/los-7-mejores-plugins-para-desarrollo-web-en-firefox/ http://www.dakoo.cl/los-7-mejores-plugins-para-desarrollo-web-en-firefox/#comments Mon, 07 Jun 2010 13:40:17 +0000 admin http://www.dakoo.cl/?p=179 Navegando por aquí por allá encontré esta lista, aunque para mi gusto faltan Firebug y Selenium hay algunas herramientas que sirven en gran manera.

http://technologytosoftware.com/fresh-mozilla-firefox-add-ons-web-development-2010.html

Espero les sirva

tuto

]]> http://www.dakoo.cl/los-7-mejores-plugins-para-desarrollo-web-en-firefox/feed/ 1 Mas HTML 5 y 3 videos de Douglas Crockford explicando javascript avanzado http://www.dakoo.cl/mas-html-5-y-3-videos-de-douglas-crockford-explicando-javascript-avanzado/ http://www.dakoo.cl/mas-html-5-y-3-videos-de-douglas-crockford-explicando-javascript-avanzado/#comments Fri, 04 Jun 2010 18:38:38 +0000 admin http://www.dakoo.cl/?p=170 Continue reading →]]> Siguiendo con los ejemplos de HMTL 5, este post escrito por Thomas Fuchs( no ssabes quien es?, el creador de script.aculo.us) en que nos muestra un ejemplo muy práctico y rápido de implementar.
Por otro lado hay 3 videos en que Douglas Crockford explica Javascript Avanzado.

ojalá les sirva

saludos TUTO

]]> http://www.dakoo.cl/mas-html-5-y-3-videos-de-douglas-crockford-explicando-javascript-avanzado/feed/ 0 Ray Tracing con javascript y Apple se lanza hacia HTML 5 http://www.dakoo.cl/ray-tracing-con-javascript-y-apple-se-lanza-hacia-html-5/ http://www.dakoo.cl/ray-tracing-con-javascript-y-apple-se-lanza-hacia-html-5/#comments Fri, 04 Jun 2010 14:26:57 +0000 admin http://www.dakoo.cl/?p=166 Continue reading →]]> Via Ajaxian me entero que Javascript cada dia está avanzando más y ya hay personas haciendo Ray tracing en tiempo real. Por otro lado Apple definitivamente se lanza a la "caza" de HTML 5, con una serie de demos que muestran su potencial unido con js y css3

saludos tuto

]]> http://www.dakoo.cl/ray-tracing-con-javascript-y-apple-se-lanza-hacia-html-5/feed/ 0 Fast Notes http://www.dakoo.cl/fast-notes/ http://www.dakoo.cl/fast-notes/#comments Fri, 04 Jun 2010 14:06:27 +0000 admin http://www.dakoo.cl/?p=164 Continue reading →]]> Nueva categoría que tiene como objetivo escribir notas que sean cortas y que generalmente apuntan a otro sitio pero con un poco de información, osea, es una algo mas largo que Twitter pero más corto que un Post :D

Espero les guste

saludos cordiales

]]> http://www.dakoo.cl/fast-notes/feed/ 0 HTML 5 – nav http://www.dakoo.cl/html-5-nav/ http://www.dakoo.cl/html-5-nav/#comments Thu, 03 Jun 2010 03:41:33 +0000 admin http://www.dakoo.cl/?p=159 Continue reading →]]> Al igual que nuestro anterior post donde vimos el tag section en esta ocasión nos centraremos en el tag nav. El objetivo de este elemento al igual que section es describir de forma más semántica la página, con esto se logra una estructura más ordenada y quizás en el futuro los buscadores puedan tomarlos en cuenta para la Web semántica.
Este tag se utiliza para introducir los menús de navegación del sitio, esto generalmente se hacía con:

PLAIN TEXT
HTML:

Ahora al introducir este elemento como dijimos anteriormente mejora la forma semántica del sitio, como se ve en este ejemplo.

PLAIN TEXT
HTML:
  1. <nav>
  3. <li><a href="#l">Inicio</a></li>
  4. <li><a href="#">Acerca de</a></li>
  5. <li><a href="#">Contacto</a></li>
  6. </ul>
  7. </nav>

Creo que no hay mucho que hablar sobre este tag ya que es simple su objetivo

Espero les sirva

saludos tuto

]]> http://www.dakoo.cl/html-5-nav/feed/ 0 HTML 5 – section http://www.dakoo.cl/html-5-section/ http://www.dakoo.cl/html-5-section/#comments Wed, 02 Jun 2010 04:26:23 +0000 admin http://www.dakoo.cl/?p=154 Continue reading →]]> Hoy comenzamos con la revisión de la especificación html 5 y en esta ocasión nos centraremos en el tag section.

Este elemento se utiliza para darle una nueva estructura al código, por ejemplo en este código se ve una estructura de html 5 con varios nuevos elementos

PLAIN TEXT
HTML:
  1. <header>
  2.   <p>Cabecera</p>
  3. </header>
  4. <nav>
  5.   <p>Menu de navegacion</p>
  6. </nav>
  7. <section>
  8.   <p>Seccion</p>
  9.     <article>Articulo</article>
  10. </section>
  11. <footer>
  12.   <p>Pie de pagina</p>
  13. </footer>

Si nos damos cuenta la estructura es más fácil de entender ya que los nuevos elementos le dan una estructura definida y una forma que al solo leer los elementos involucrados se saben las partes que están dentro del sitio.
En cuanto al tag section viene unido a acción de ordenar semánticamente el código, ojo que no viene a sustituir los div, ya que si lo que se busca es dar estilos al código para por ejemplo utilizar efectos javascript conviene tener divs y no section o articles.
En esta página encontré un resumen super bueno de lo que no se debe hacer al usar el tag section y la voy a traducir.

  • No use section cuando quieras utilizarlo para dar estilos o ejecutar scripting
  • No lo use si los tag nav, articles o aside es más apropiado
  • No lo uses si a continuación de abrir la etiqueta no viene un título

En resumen un interesantenuevo tag con el que se pueden construir sitios más semanticamente correctos.

Espero les sirva

saludos tuto

]]> http://www.dakoo.cl/html-5-section/feed/ 2