Herramientas de desarrollo e implementacion

Monday, December 5, 11
Herramientas de
     desarrollo e
     implementacion
         OMG esto era facil!




Monday, December 5, 11
Internet esta
       avanzando



Monday, December 5, 11
http://html5readiness.com/
Monday, December 5, 11
http://caniuse.com/
Monday, December 5, 11
http://findmebyip.com/litmus
Monday, December 5, 11
Monday, December 5, 11
IE6 ESTA MUERTO




Monday, December 5, 11
en uno de estos esta
                                el IE6!




   No solo yo lo digo!
Monday, December 5, 11
http://gs.statcounter.com/#browser_version-CL-
                          monthly-201011-201110-bar

Monday, December 5, 11
http://www.ie6countdown.com/

Monday, December 5, 11
NO MAS IE6!!
                         no mas freno a la internet




Monday, December 5, 11
Creemos experiencias innovadoras
                         que se adapten en navegadores antiguos




Monday, December 5, 11
Progressive
     Enhancement




Monday, December 5, 11
Progressive
   Enhancement
                     Mejorar progresivamente la experiencia, segun las
                     capacidades del usuario.




Monday, December 5, 11
<video>



        <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="550"
        height="400" id="movie_name" align="middle">
            <param name="movie" value="movie_name.swf"/>
            <!--[if !IE]>-->
            <object type="application/x-shockwave-flash" data="movie_name.swf"
        width="550" height="400">
                <param name="movie" value="movie_name.swf"/>
            <!--<![endif]-->
                <a href="http://www.adobe.com/go/getflash">
                     <img src="http://www.adobe.com/images/shared/download_buttons/
        get_flash_player.gif" alt="Get Adobe Flash player"/>
                </a>
            <!--[if !IE]>-->
            </object>
            <!--<![endif]-->
        </object>




Monday, December 5, 11
Fun
                                                                              cio
                                                                          tod na e
                                                                       nav os l n
   <video>                                                                ega os
                                                                             dor
      <source src=”loremipsum.mp4” >
                                                                                  es!!
      <source src=”loremipsum.webm” >
      <source src=”loremipsum.oga” >

      <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="550" height="400"
      id="movie_name" align="middle">
          <param name="movie" value="movie_name.swf"/>
          <!--[if !IE]>-->
          <object type="application/x-shockwave-flash" data="movie_name.swf" width="550"
      height="400">
              <param name="movie" value="movie_name.swf"/>
          <!--<![endif]-->
              <a href="http://www.adobe.com/go/getflash">
                   <img src="http://www.adobe.com/images/shared/download_buttons/
      get_flash_player.gif" alt="Get Adobe Flash player"/>
              </a>
          <!--[if !IE]>-->
          </object>
          <!--<![endif]-->
      </object>




  </video>

Monday, December 5, 11
Monday, December 5, 11
Polyfills:




Monday, December 5, 11
Polyfills:
                    Proveen la tecnologia que esperamos que funcione
                    nativamente en el codigo




Monday, December 5, 11
Polyfills:
                    Proveen la tecnologia que esperamos que funcione
                    nativamente en el codigo.




Monday, December 5, 11
Monday, December 5, 11
Monday, December 5, 11
Monday, December 5, 11
webworkers




Monday, December 5, 11
webworkers




        webworkers                    Polyfill




Monday, December 5, 11
webworkers




        webworkers                    Polyfill




Monday, December 5, 11
https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-
                      Browser-Polyfills

Monday, December 5, 11
CSS3




Monday, December 5, 11
CSS3

                    Podemos usarlo con seguridad en sitios web
                    profesionales




Monday, December 5, 11
Border redondeados




                         http://css3pie.com/

Monday, December 5, 11
Border redondeados




                         http://fetchak.com/ie-css3/


Monday, December 5, 11
Prefijos

                         -webkit
                         -moz
                         -o




Monday, December 5, 11
Prefijos




                         http://cssprefixer.appspot.com/


Monday, December 5, 11
Prefijos




                         http://leaverou.github.com/prefixfree/

Monday, December 5, 11
Selectores




                         http://selectivizr.com/
Monday, December 5, 11
Herramientas de
     Desarrollo




Monday, December 5, 11
http://muse.adobe.com/

Monday, December 5, 11
http://www.youtube.com/watch?v=dlJzRdVrDmA

Monday, December 5, 11
http://labs.adobe.com/technologies/edge/


Monday, December 5, 11
http://www.youtube.com/watch?v=8FnNtX73v8k


Monday, December 5, 11
Frameworks




Monday, December 5, 11
http://www.modernizr.com/


Monday, December 5, 11
http://html5boilerplate.com/


Monday, December 5, 11
Que sigue?




Monday, December 5, 11
Monday, December 5, 11
Monday, December 5, 11
Monday, December 5, 11
MUCHAS GRACIAS!!




                         @siddharta
Monday, December 5, 11

Herramientas de desarrollo e implementacion