Categoría: CSS (y más)

  • Los tuits de la semana (57)

    (Si las semanas tuviesen 40 días, claro.)

    Diseño y desarrollo web

    Social Share Privacy. «me gusta», «+1» y demás… que respetan la privacidad de tus usuarios http://obm.as/WVn6XO

    De navegadores…

    RT @brucel «IE11 to disguise itself as WebKit (and not Firefox!)» says ol’ @ppkhttp://mobilism.nl/blog/2013/03/ie11-to-disguise-itself

    ¿qué significa que un navegador «sea webkit»? http://obm.as/XI1MVS

    imprescindible Anil Dash sobre el riesgo de que tu navegador dependa de Apple+Google o Microsoft http://obm.as/ZSZ1OR

    Un poco de WordPress y sus problemas…

    RT @WPMigrations RT @wptavern: Dire state of WordPress https://news.ycombinator.com/item?id=5407879 not full of bashing and the comments are good reading.

    ¡Herramientas!

    Mozilla Shows Off Powerful New Developer Tools for Firefox (Webmonkey) http://obm.as/YEqmDs

    RT @rakelka Getting Started with Sass http://www.sitepoint.com/getting-started-with-sass/

    webplatformtools.org

    Rendimiento…

    #performance Making the Mobile Web Faster (ACM Queue) http://obm.as/XpP2jU

    Ars Technica cuenta que lo que ha presentado CloudFlare hoy sobre optimización web podría estar muy bien… http://obm.as/WoWwmy

    Movimientos en el W3C…

    RT @html5_yoda The <picture> element the future is, published as a working draft it has been: http://www.w3.org/TR/html-picture-element/

    RT @webaxe New W3C rough Draft: Easy Checks – A First Review of Web Accessibility http://www.w3.org/WAI/EO/Drafts/eval/checks #CSUN13 #a11y

    ..y ya que hablamos de accesibilidad…

    RT @UOCicommunity RT @webaxe How to use #NVDA and #Firefox to test your web pages for accessibility: http://bit.ly/X0YCeC #a11y #testing

    Tipografía…

    Timepiece Rounded is an OpenType-Font, which displays time as an analogue timepiece http://obm.as/WOYph3

    RT @stereochromo Symbolset uses font magic to change words into icons. Made with love for computers and people • http://symbolset.com

    Typeplate, a typographic starter kit. We define proper markup with extensible styling for common typographic patterns http://obm.as/WAQnE1

    Mal diseño…

    va a ser que no todo era culpa de flash, al final: 14 lousy web design trends that are making a comeback http://obm.as/YsmWDH

    Para reir un rato…

    RT @WPMigrations RT @speckyboy: Awesome: The 11 Phases of a Web Developer’s Career (As Illustrated by Memes) http://ow.ly/jmQze

    Un montón de charlas interesantes…

    RT @w3cConf Missed #W3Conf or the live stream? Check out our videos, available on YouTube (Vimeo and SitePoint coming soon) http://www.w3.org/conf/2013sf/video.html

    …pero me quedo con esta:

    la genial charla de @omixam en el #webcat sobre esqueuomorfismo ya está en @MosaicUOC http://obm.as/X9obOa

    http://vimeo.com/62684973

    Seguiremos hablando de Reader

    Bees, sobre el cierre de Reader y su riesgo para los editores, en TechCrunch. comparto su inquietud… http://obm.as/ZmkYbD

    Paul Krugman sobre el cierre de Google Reader (via @koalillo) http://obm.as/10dheYM

    Tiny Tiny RSS, otra posible alternativa a Google Reader http://obm.as/YxSSe6

    ¿alguien ha probado NewsBlur como sustituto de Google Reader? http://obm.as/sXAOzs

    RT @koalillo En el blog, unos primeros pasos para crear una web móvil para Normandy, el clon de la API de Google Reader de Feedly http://alex.corcoles.net/2013/03/amigo-lector/

    Magnet.io (aún no lanzado) podría ser una buena alternativa a Google Reader… http://obm.as/ZwHi1f

    #longreads de tecnología

    Big data, Open Data, Open Source…

    RT @UOCeimt El NYTimes sobre las posibilidades del #bigdata #opendata para las #smartcities: http://ow.ly/jpXkJ

    RT @UOCeimt La UE estrena su portal de datos abiertos: en beta y con +6000 BBDD. http://ow.ly/iyq3j via @_opendata #opendata

    pieza de opinión en wired sobre la ‘revolución github’ http://obm.as/10q97cc

    RT @BBHLabs The city of Chicago is now on #Github https://github.com/Chicago The first of many #OpenSourceCities ?

    Historia de miedo sobre seguridad:

    RT @robertclariso RT @arstechnica: How I became a password cracker http://ars.to/ZD9v4Y

    Dichoso DRM:

    RT @brucel The DRM graveyard: A brief history of digital rights management in music http://red.ht/ul12lo Time to get this out again

    @cshirky DRM isn’t for preventing copyright violations. It’s for giving content providers leverage over playback devices. http://goo.gl/FT3I3

    Con lo que habéis soñado cada vez que habéis ido de conferencia:

    ¿un estadio con wifi para 68,500, a 20 megabits *por usuario*? el futuro estadio de los #49ers, claro http://obm.as/YSi12d

    Golosinas visuales

    RT @softmodeling RT @jonnyauk: Amusing client comments turned into posters – how many of these have you heard? http://www.boredpanda.com/sharp-suits-worst-client-comment-posters/

    indie + helvetica y diseño suizo. lo más gafapasta que vas a ver hoy… http://www.swissted.com

    :-) Movies reimagined for another time & place http://obm.as/YgP2Tg

    RT @xeotico Scientists Minimalist Posters – Fubiz™ http://www.fubiz.net/2013/03/06/scientists-minimalist-posters/

    …y una lección de arquitectura

    Mies van der Rohe y su legado en Chicago. arquitectura con mayúsculas http://obm.as/11POzyf

    ¡Feliz puente!

  • Los tuits de la semana (56)

    Llevaba tanto tiempo sin limpiar de enlaces mi cuenta de Twitter que la cosa se me ha acumulado bastante. Me quedo sólo con las cosas relacionadas con diseño y desarrollo web…

    Una herramienta a probar:

    John Nack on Adobe : Come download Reflow, Adobe’s new responsive-Web design tool http://obm.as/12TxPpo

    HTML:

    Introducing the New HTML5 <main> Element http://obm.as/X2rWPE

    CSS:

    RT @WPMigrations RT @devseo: http://is.gd/vCSogm – Roole – A Language that Compiles to CSS

    CSS Explain (una especie de calculadora de especificidad) http://obm.as/YsJPgh

    GitHub’s CSS Performance (via @lucascepeda) http://obm.as/V4Ctep

    SMACSS: Scalable and Modular Architecture for CSS. A flexible guide to developing sites small and large. http://obm.as/UNqFi3

    En algún momento me preguntaron por dónde empezaría si tuviese que ponerme a aprender HTML y CSS hoy. Mi respuesta en dos tuits:

    yo recomiendo tomar el tiempo de seguir http://mosaic.uoc.edu/ac/le/es :-)

    …pero probablemente comenzaría por http://learn.shayhowe.com/html-css/ si el inglés no es problema

    Accesibilidad:

    RT @EasyChirp Excellent! Accessible University 2.0, fictional pages to teach web accessibility http://www.washington.edu/accesscomputing/AU/ HT @webaxe @pauljadam #a11y

    Accessible HTML5 Media Players and More http://obm.as/14FtzIo

    RT @kazuhito Manual Accessibility Testing as Part of Your 360˚ Approach to Web Testing http://bit.ly/Vinaxc

    JavaScript:

    Introducing Collie: A high-performance animation library for JavaScript http://obm.as/YaLqAW

    Numeric Javascript. cálculo numérico en javascript. #yalohevistotodo #cuandoyoerajovenestosehacíaenfortran77 http://obm.as/VQfx1c

    #muyinteresante cgSceneGraph is a powerful cross-platform easy-to-use animation framework for <canvas> (via @juanfrasr) http://obm.as/UXfOVd

    Mistakes is a tool for teaching Javascript to people, mostly on projectors. http://obm.as/127IeJf

    emulador de 6502 en javascript o.O http://obm.as/126Deon

    MathBox is a library for rendering presentation-quality math diagrams in a browser using WebGL http://obm.as/10DQ8tj

    PolyCrypt: A WebCrypto API Polyfill In JavaScript Funded by the US Department of Homeland Security http://obm.as/TszIXe

    Developing in HTML5 with JavaScript and CSS3 Jump Start – Microsoft Virtual Academy /via @rakelka http://obm.as/102D804

    Audio5js is a library-agnostic, cross-browser Javascript API for HTML5 Audio, with a Flash fallback http://obm.as/V9qujj

    Form Follows Function. preciosos experimentos ‘HTML5’ http://obm.as/W0Z0Iu

    *muy* chulo, Flowtime.js, para hacer presentaciones con soporte web. de @marcolago, via @xeotico http://obm.as/UX3X6c

    BLK, a voxel world tech demo. con el código abierto en github http://obm.as/ZaGGkX

    WordPress:

    de cero a WordPress corriendo sobre Amazon Web Services EC2 via @antonello http://obm.as/Wbehrg

    RT @WPMigrations RT @FreelanceWP: FAQ My site was hacked « WordPress Codex http://su.pr/1TN3Z9

    bastante buena pinta: >Generate WP provides tools for developers to create advanced systems built on WordPress. http://obm.as/Wx5EZn

    #omg se cumplen DIEZ años (y un día) de la entrada de blog de la que saldría una pequeña herramienta llamada #WordPress http://obm.as/W4PtCR

    .htaccess codes to secure your WordPress site (via @WPMigrations) http://obm.as/VWipMv

    De interfaces:

    interesante concepto en diseño de interfaces: Progressive Reduction http://obm.as/XRKOSZ

    Sobre la muerte de Presto (protagonista de nuestra anterior entrada):

    Bruce Lawson on Opera’s Move to WebKit http://obm.as/VVi5eo

    RT @brucel Please don’t remove -o- vendor prefixes (very few: http://bit.ly/12xrQCi ) Presto browsers will still be in market for a while in TV, cars

    RT @sideshowbarker Wondering whether browser-engine diversity really matters? It does: http://robert.ocallahan.org/2013/02/and-then-there-were-three.html Today’s news is a loss for the Web, not a win.

    RT @jaffathecake You probably underestimated Presto – Some waffling about the Opera announcement https://plus.google.com/116237864387312784020/posts/iRRPVaaPQvo

    Puñetitas personales:

    con todo el respeto por A List Apart (o no), pero si usas <p class=»question»>, ¿para qué tienes RSS, si va a ser inusable?

    De tipografía:

    RT @aza Googling for «kerning» gives a funny hidden joke for typography geeks: https://www.google.com/search?q=kerning

    (tentado de usar el polyfill *ya*) Adobe Proposes New Standard for Better Web Typography http://obm.as/X08NRE

    Grid­lover. Scale & Rhythm for Your Web Type http://obm.as/VQicto

    gran charla de Jason Santa Maria introduciendo el tema de la tipografía en la web http://obm.as/V3WWnz

  • Réquiem por Presto

    La bomba ha explotado hoy, pero la liebre saltó hace casi un mes:

    Sí. Opera, los noruegos del navegador que casi nadie conoce (en mi entorno: Chris Mills nos contaba en Mosaic, hace dos años largos, que en mercados como Rusia, Bielorrusia y Ucrania tenían un share nada desdeñable (una entrevista en la que yo halagaba la capacidad de desarrollo de los noruegos, por cierto)) pero que, entre otras cosas, dio a luz el elemento de interfaz sin el que no podríamos pensar en los navegadores (las pestañas) y una tecnología sin la que la web no habría podido llegar a donde ha llegado (CSS, nada más y nada menos)… se proponía lanzar un navegador sustituyendo su motor de rendering, Presto, por el que ‘anima’ a Chrome y Safari: Webkit. Hell. Freezes. Over.

    Pero si aquello sonaba cataclismático, lo de hoy ha ido mucho más allá…

    Opera va a abandonar Presto y Carakan, su excelente motor de JavaScript, por WebKit y V8, el motor JavaScript de Chrome y su hermano de código abierto, Chromium. Quizá no sea tan doloroso como el día que murió Netscape, pero dentro de nada vamos a pasar de tener cuatro grandes motores de rendering (Presto, Webkit, Gecko y Trident) a tres (y lo mismo pasará con los motores JavaScript). La biodiversidad del entorno se ha reducido en un 25%. Eso, en cualquier ecosistema, es, ya usaba la palabra antes, un cataclismo.

    Como dice Bruce Lawson, Presto va a seguir vivo una buena temporada:

    https://twitter.com/brucel/status/301741861163384832

    (buena parte del negocio de Opera se alimenta de los navegadores embebidos en teles y otros dispositivos)… pero si ese tuit no suena a entierro, so sé qué lo hará…

    Si hay que buscar culpables, la lista va a ser inacabable:

    Mientras para muchísimos desarrolladores sólo exista Webkit primero (en la forma de Chrome y Safari, principalmente), y Firefox y el inevitable Internet Explorer (que se mueve muy lento y es víctima de muchísimas inercias imparables, pero hoy en día es un navegador más que aceptable, en sus últimas versiones) después, y ni dios tenga en cuenta el resto, la vida de Opera dependiendo de respetar los estándares pasaba por decisiones tan controvertidas como las de ‘adoptar’ los prefijos -webkit- (y pensar que creímos que el ruido que oímos entonces era el del infierno congelándose…). Y eso, aceptémoslo, era insostenible.

    Como sucede en todos los sepelios, ahora resulta que el muerto era un tipo fantástico:

    Lo jodido (disculpad el vocabulario, pero es que todo esto me ha dolido bastante) es que el muerto de verdad era un tipo fantástico. Personalmente, durante mucho tiempo ignoré Opera tan absolutamente como cualquier otro. Pero un Mac con sólo 2 gigas de RAM y una época de versiones Firefox especialmente voraces me llevaron a adoptar al navegador noruego durante unos meses. Al final dos gigas de RAM más y una moderación del apetito de Firefox hicieron que volviese a los orígenes (la cabra tira al monte, y ahora se siente culpable), pero durante aquel periodo tuve la oportunidad de comprobar que Opera era, efectivamente, un software fantástico… maltratado hasta la saciedad por propios y extraños (con el coloso Google a la cabeza del pelotón) con prácticas como el sniffing de agentes de usuario implementado con el culo (se me vuelve a descontrolar el vocabulario, me temo que me vais a tener que aguantar). La rendición de Opera me duele como al que más, pero no queda más remedio que aceptar (hasta aplaudir, con dolor) la decisión…

    Para los que no veáis la dureza del mazazo que se llevan hoy los estándares web (que se culmina hoy, quizá habría que decir mejor), el tuit que, creo, dice más en menos:

    Apenas ha hecho ruido fuera de una comunidad de freaks, pero hoy ha sido un muy mal día para la web. Descansa en paz, Presto.


    Una recopilación de artículos sobre el tema:

  • Hackers de bien

    Estos días Antonio ‘Error 500’ Ortiz se ha marcado un par de entradas en el blog que me han llamado poderosamente la atención… por un lado El valor de Change.org y de la cultura de la adscripción y, por otro, Derechos civiles, intelectuales y “geeks” (no os perdáis el origen, Geeks are the New Guardians of Our Civil Liberties), que están íntimamente relacionadas entre sí (y si alguien no seguía Error 500, también puede aprovechar para repasar Aaron Swartz, in memoriam, bastante en la línea).

    El tema lleva, casi automáticamente, a pensar en un puñado de proyectos que han visto la luz en los últimos tiempos, como España en llamas, Fixmedia.org o tuderechoasaber.es, por citar los tres que más han sonado en mi entorno (por cierto, todoos ellos salidos de esa fantástica fábrica de proyectos que es GOTEO, de la que hemos hablado recientemente en Mosaic, por aquello de tirar aún más de serendipia). Además, los dos últimos manifiestan características prodemocracia que me llevan al siguiente punto…

    En unos días marcados por iniciativas legislativas populares y los problemas de nuestros partidos políticos mayoritarios con entender la democracia y lo que esta significa, los problemas de legitimidad con que carga Change.org últimamente me retrotraen a una iniciativa de la que me hice eco por aquí hace cosa de dos años y medio y que podría haber significado el paso adelante que Change no ha querido, sabido o podido dar hasta el momento: Usa tu DNI electrónico: recogida de firmas con e-ilp.org (que también recogieron en su momento Antonio en Recogida de firmas en internet con DNI electrónico e Ismael Peña en Firma online contra el Canon (este último en SociedadRed, otro recurso imprescindible sobre estas materias, que echa humo estos días)). A día de hoy www.e-ilp.org (un proyecto del grupo de investigación CCSG de la UAB con el soporte del Plan Avanza del Ministerio de Industria), languidece un poco (un mal endémico y casi inevitable entre los proyectos que nacen en las universidades cuando se seca el pozo del dinero público :-S), hasta el punto que os hará saltar una advertencia de seguridad porque el certificado de seguridad, mucho me temo, debe haber caducado. Aún así, el proyecto, afortunadamente, sobrevive como Recsig en SouceForge (una de las grandes virtudes del código abierto es que facilita que el código sobreviva al proyecto que le hizo nacer).

    Y de ahí saltamos a otra iniciativa genial, hackforgood.net/barcelona, que se celebrará en el Campus Nord de la UPC los próximos 1, 2 y 3 de marzo. Ojalá se pudiese recuperar, mejorar y ampliar Recsig en ese marco. Pero, aunque no se consiga, es otro escenario en que dar unos cuantos pasos más adelante para demostrar que la comunidad hacker es una de las mejores vías con que contamos para salir de una situación que se me antoja cada vez más insostenible si no cambiamos de rumbo urgentemente.

  • Poder e internet

    (Lo que sigue es una traducción (no autorizada) de lo aparecido en el blog de Bruce Schneier, Power and the Internet el 31 de enero de 2013. Como siempre que hago estas cosas, el interés es ponerlo al alcance de aquellos para los que el inglés es una barrera. Y siempre es mucho más recomendable leer el texto original.)


    Todas las tecnologías disruptivas afectan a los equilibrios de poder tradicionales, e Internet no es una excepción. La historia estándar es que da poder a los más débiles, pero eso es sólo la mitad de la historia. Internet da poder a todo el mundo. Puede que las grandes instituciones sean lentas en hacer uso de ese nuevo poder, pero como son poderosas, pueden usarlo con mayor eficacia. Los gobiernos y las corporaciones han tomado conciencia del hecho de que no sólo pueden utilizar Internet, sino que les interesa controlarla. A menos que comencemos un debate deliberado sobre el futuro en que queremos vivir, y las tecnologías de la información que permiten la existencia de ese mundo, acabaremos con una Internet que beneficia a las estructuras de poder y no a la sociedad en general.

    Todos hemos vivido durante la historia disruptiva de Internet. Industrias enteras, como las agencias de viajes y las tiendas de alquiler de vídeos, han desaparecido. La edición tradicional —libros, periódicos, enciclopedias, música— han perdido poder, mientras que Amazon y otros lo han ganado. La empresas basadas en la publicidad como Google y Facebook han ganado una gran cantidad de poder. Microsoft ha perdido una parte del suyo (por difícil de creer que parezca).

    Internet también ha cambiado el poder político. Algunos gobiernos perdieron poder cuando los ciudadanos se organizaron en línea. Los movimientos políticos se hicieron más fáciles, ayudando a derrocar gobiernos. La campaña de Obama hizo un uso revolucionario de Internet, tanto en 2008 como en 2012.

    E Internet ha cambiado el poder social, mientras coleccionábamos cientos de «amigos» en Facebook, tuiteábamos nuestro camino hacia la fama, y encontrábamos comunidades para las aficiones e intereses más oscuros. Y algunos delitos se han hecho más fáciles: el fraude de suplantación de personalidad se convirtió en robo de identidad, la violación de derechos de autor se convirtió en intercambio de archivos, y acceder a materiales censurados —políticos, sexuales, culturales— se convirtió en trivialmente fácil.

    Ahora intereses poderosos buscan dirigir deliberadamente esta influencia en su beneficio. Algunas empresas están creando entornos de Internet que maximizan su rentabilidad: Facebook y Google, entre muchas otras. Algunas industrias presionan para que se redacten leyes que hagan más rentables sus modelos de negocio particulares: las compañías de telecomunicaciones quieren ser capaces de discriminar entre diferentes tipos de tráfico de Internet, las empresas de entretenimiento quieren acabar con el intercambio de archivos, los anunciantes quieren tener acceso sin restricciones a los datos sobre nuestros hábitos y preferencias.

    Por la parte de los gobiernos, más países censuran Internet —y lo hacen de forma más eficaz— que nunca. Las fuerzas policiales de todo el mundo están utilizando los datos de Internet con fines de vigilancia, con menos supervisión judicial y, a veces, antes de que se haya cometido ningún delito. Los militares están fomentando una carrera ciberarmamentista. La vigilancia en Internet —tanto gubernamental como comercial— va en aumento, no sólo en los estados totalitarios, sino también en las democracias occidentales. Tanto las empresas como los gobiernos confían más en la propaganda para crear falsas impresiones en la opinión pública.

    En 1996, el ciberlibertario John Perry Barlow publicó su «Declaración de Independencia del Ciberespacio». Le dijo a los gobiernos: «Ustedes no tiene el derecho moral de gobernarnos, ni poseen ningún método de ejecución que debamos temer verdaderamente». Era un ideal utópico, y muchos lo creímos. Creíamos que la generación de Internet, rápida en adoptar los cambios sociales que traía esta nueva tecnología, sería capaz de maniobrar más deprisa que las instituciones de la era anterior, más pesadas y lentas.

    La realidad resultó ser mucho más complicada. Lo que se nos olvidó es que la tecnología magnifica el poder en ambas direcciones. Cuando los que no tenían poder encontraron Internet, de repente tuvieron poder. Pero aunque los no organizados y ágiles fueron los primeros en hacer uso de las nuevas tecnologías, con el tiempo los poderosos gigantes se dieron cuenta de su potencial —y tienen más poder que amplificar. Y no sólo los equilibrios de poder cambian con internet, sino que los poderosos también pueden hacer cambiar Internet. ¿Alguien más recuerda lo incompetente que era el FBI investigando delitos en Internet a principios de los noventa? ¿O cómo los usuarios de Internet daban vueltas a los censores de China y la policía secrecta de Oriente Medio? ¿O cómo el dinero digital iba a hacer obsoletas las monedas de los gobiernos, y la organización de Internet iba a hacer obsoletos los partidos políticos? Ahora todo eso suena a historia antigua.

    No todo va para un solo lado. Las masas de vez en cuando logran organizarse en torno a un tema específico —SOPA y PIPA, la primavera árabe, etcétera— y logran bloquear algunas de las acciones de los poderosos. Pero no dura. Los desorganizados vuelven a ser desorganizados y los intereses poderosos retoman las riendas.

    Los debates sobre el futuro de Internet son moral y políticamente complejos. ¿Cómo equilibramos la privacidad personal con lo que la ley requiere para evitar violaciones de los derechos de autor? ¿O la pornografía infantil? ¿Es aceptable ser juzgado por algoritmos informáticos invisibles cuando se te sirven resultados de búsqueda? ¿Cuando te sirven artículos de noticias? ¿Al ser seleccionado para un examen adicional por la seguridad del aeropuerto? ¿Tenemos derecho a corregir los datos acerca de nosotros? ¿De eliminarlos? ¿Queremos sistemas informáticos que olviden las cosas después de un cierto número de años? Son temas complicados que requieren un debate significativo, cooperación internacional y soluciones iterativas. ¿Alguien cree que estamos a la altura de la tarea?

    No lo estamos, y esa es la preocupación. Porque si no estamos intentando entender cómo dar forma a Internet para que sus efectos positivos superen a los negativos, los intereses de los poderosos serán los que lo hagan. El diseño de Internet no viene fijado por unas leyes naturales. Su historia es un accidente fortuito: una inicial falta de interés comercial, benigna negligencia gubernamental, requisitos militares de supervivencia y capacidad de recuperación, y la inclinación natural de los ingenieros informáticos de crear sistemas abiertos que funcionan de manera sencilla. No se puede confiar en esta combinación de fuerzas que crearon la Internet de ayer para la creación de la del mañana. Las batallas por el futuro de Internet están sucediendo en este preciso momento: en las legislaturas de todo el mundo, en organizaciones internacionales como la Unión Internacional de Telecomunicaciones y la Organización Mundial del Comercio, y en los cuerpos de estándares de Internet. Internet es lo que lo hacemos con ella, y es creada y recreada constantemente por organizaciones, empresas y países con intereses y agendas. O bien luchamos por un lugar en la mesa, o el futuro de Internet se convierte en algo que se nos hace a nosotros.