Marcelo Ferreiro

Categoría Artículos

Mi nueva web sobre desarrollo web

12 de enero de 2010

www.Pixelar.mePixelar.me | con ese divertido (y geek) nombre, lancé a finales del pasado año un proyecto que se gesto durante la segunda mitad de 2009, que consistía en agrupar, contener y alentarme a producir más contenidos y artículos sobre desarrollo web, en español y de libre acceso.

También me sirvió para, de una vez por todas, poder organizar todos mis artículos, tutoriales, posts en un solo sitio, un blog sobre desarrollo web, que cuenta con más de 100 artículos, hasta hoy, y la idea es que siga creciendo (cualitativa y cuantitativamente, en ese orden ;) ).

Si quieres puedes conocer un poco más sobre el proyecto, o la historia de su nombre o su diseño ^_^

Es viernes! qué opinas de empezar a cuidar tu postura?

9 de agosto de 2009

Todos quienes trabajamos frente a una PC deberíamos tomar bien en serio nuestra dieta, cuidar nuestro cuerpo y en particular de lo que quiero hablar hoy, preocuparnos nuestra higiene postural. Tras sufrir por semanas un intenso dolor lumbar, consecuencia principalmente de una mala postura, me interesé en el tema y aprendí algunos tips que quiero compartir aquí.

Pero primero, ¿qué es la higiene postural?

La higiene postural son una serie de normas o buenas prácticas que nos sugieren como sentarnos, mantener la postura o realizar ciertos movimientos de forma que causen el menor impacto negativo en nuestra columna vertebral. Lo que nos sugiere es que una misma acción puede realizarse de diferentes posturas (incluso el estar sentados), y debemos intentar siempre realizarla de la forma más segura para nuestra espalda. Veamos varios ejemplos prácticos.

Algunas normas básicas, pero importantes.

  • Siempre flexionar las rodillas. Para agacharnos, levantar o depositar un peso, debemos siempre hacer la fuerza con los músculos de las piernas, nunca con la espalda.
  • Mantener siempre la espalda lo más recta posible, en toda actividad o incluso descansando. Este es uno de los conceptos claves de la higiene postural, ya que es lo que nos ayudará a evitar muchos problemas lumbares.
  • Al cargar un peso, debemos llevarlo lo más cerca de nuestro cuerpo que nos sea posible, dado que cuanto más lejos lo sostengamos más esfuerzo nos requerirá.
  • No mantenernos mucho tiempo en una misma posición (incluso sentados), intentar hacer pequeñas pausas cada 30-60 mins. aunque solo sea para dar una vuelta.
  • Intentar estar atentos y realizar siempre fuerza con brazos y piernas antes de con la espalda (ej: al pararnos, al mover algo, etc.).
  • Intentar distribuir parejo el peso, por ejemplo al cargar un bolso, siempre es mejor una mochila (de ambos hombros) que un bolso/cartera en un solo hombro.

Un ejemplo concreto: ¿cómo es la forma correcta de sentarse?

Higiene Postural
Imágen desde tufisio.net.

En primer lugar, debemos sentarnos bien al fondo del asiento ya que eso nos permite luego asegurarnos de mantener toda la espalda recta y la cabeza alineada, en posición vertical, aunque sin exagerar la posición. Poniendo ambos pies en el piso, sin cruzar las piernas, para no curvar la columna hacia los lados y mantener una posición simétrica. Es ideal tener en nuestra silla pasamanos donde apoyar los brazos y así lograr una posición más relajada. Al principio puede que nos fuerce física (o mentalmente) mantener la postura erguida, sobre todo si estamos acostumbrados a una mala postura, pero es cuestión de semanas para que lo introduzcamos como un buen hábito y nos sea sumamente natural. Al ponernos de pie, la mejor forma es apoyar nuestras manos en las piernas y hacer la fuerza con éstas últimas y nunca con la espalda. Por último, recuerda que todas las malas posturas o malas prácticas no nos dañan al realizarlas una vez, pero la repetición de malos movimientos, esfuerzos mal realizados o posturas no saludables, con los años pueden traernos problemas que pueden no ser reparables. Ten conciencia y comienza hoy, que es viernes a mejorar tu calidad de vida!

Este artículo fue publicado en MaestrosDelWeb para la serie de artículos Es Viernes! ;)

Es viernes, qué tal si haces un respaldo de información?

24 de julio de 2009

Respalda tu información!Creo que todos quienes de alguna forma estamos vinculados a la informática, estaremos de acuerdo en que tener nuestros datos a salvo, debe ser una prioridad. Aún así, muchas veces no tomamos las precauciones necesarias, o no de la mejor forma. Puesto que hoy es viernes, quiero invitarte a realizar un backup de tu información digital.

¿Por qué respaldar?
Es muy necesario tener respaldos de nuestra información personal, nuestros datos laborales, e incluso fotos y cualquier documento, email o archivos que tengamos en nuestra PC, ya que es nuestro salvavidas ante cualquier eventualidad que pudiera suceder con nuestra PC o servidor.
Recordemos que los archivos que tenemos en nuestra PC muchas veces representan años de trabajo, recuerdos de vacaciones y amistades, o correos que pueden ser importantes. Nuestra “vida digital” no puede estar dependiendo de que un disco falle.

¿Qué respaldar?
En lo personal, intento respaldar todo, desde lo más personal (documentos de texto, fotos, imágenes, emails, chats) hasta mis archivos de trabajo (webs, PSDs, scripts y demás). Intento tener todo en varios sitios para estar tranquilo acerca de la integridad y seguridad de mi información digital.

No olvidemos respaldar:

  • Emails, si utilizamos un cliente de correo de escritorio.
  • El perfil de nuestro navegador favorito (bookmarks, cookies, plugins, themes).
  • Las tipografías que tenemos instaladas (en Windows generalmente se encuentran en C:\Windows\Fonts\).
  • Drivers, siempre es bueno tener una copia de los drivers de nuestra PC.
  • Todos los documentos de texto, hojas de cálculo, archivos PDFs.
  • Todas nuestras webs, diseños, scripts y trabajos.
  • Las fotografías; de seguro no queremos perder nuestros mejores recuerdos!
  • Recursos, libros y tutoriales que tengamos guardados en la PC.
  • Opcionalmente: conversaciones de chat, videos, música, películas, documentales…

¿Cómo respaldar?
En primer lugar debemos definir el medio, que irá de acuerdo al equipo con que contemos, las opciones son variadas; podemos realizar respaldos en CDs, DVDs, Unidades USB, Discos Duros Externos y hasta en servidores web.
La decisión depende del volumen de datos a respaldar, así como de tus posibilidades y lo que más cómodo te resulte.
Luego tenemos diferentes métodos para el respaldo de información: podemos optar por un respaldo manual (copiar o grabar directamente los archivos), utilizar algún programa que realice backups (como el Every Day Auto BackUp) o algún servicio de web-backup o backup remoto.

En general, es buena idea guardar los respaldos físicos (disco externo, CDs o DVDs) en otro sitio distinto de dónde tenemos el ordenador, para estar cubiertos en caso de cualquier tipo de siniestro (incendio, hurto o similar).

¿Cuándo respaldar?
Es importante tomar conciencia de realizar nuestros respaldos periódicamente.
¿Cada cuánto tiempo?, dependerá de la velocidad con que tu volumen de datos crezca o se modifique. En lo personal intento hacer un respaldo completo cada mes y un respaldo rápido cada semana (archivos que varían mucho, nuevos proyectos o documentos que se van creando).

Lo importante es que tengas tu información segura y que esos datos sean relativamente actuales, de poco sirve un respaldo completo pero de hace dos años!
De modo que te invito, ya que hoy es viernes, a que realices un respaldo de tus datos y los tengas seguros!

Es viernes, qué tal si chequeas tu HTML?

10 de julio de 2009

Hoy tuve mi segunda participación (mi primer artículo como autor en MaestrosDelWeb) en la serie Es Viernes!
El artículo de esta semana fue: Es viernes, qué tal si le dedicas un rato a validar tu HTML!

En el mismo, hablé acerca de los estándares web, y las ventajas que tiene apegarnos al uso correcto de los mismos.

Hoy es viernes, quiero motivarte para validar el código HTML y CSS de tu sitio web. Para empezar, lee un rato sobre las ventajas de la validación, la importancia de cumplir con los estándares web y los beneficios para tus sitios.

Los estándares web como todos sabemos son ciertas pautas o recomendaciones que indican cómo debería ser un código XHTML y CSS correcto. La entidad que regula éstos estándares es el W3C (World Wide Web Consortium).

Un sitio desarrollado acorde a dichos estándares web debe tener un código limpio, basar su diseño en CSS y ser accesible y amigable, tanto para el usuario (cualquiera sea su condición), como para los motores de búsqueda.

Ver entrada completa »

Es viernes! y si ordenas tu escritorio?

3 de julio de 2009

Desde el viernes pasado se comenzó a publicar en Maestros del Web una serie de artículos que me pareció super interesante, la consigna es “Es Viernes! que tal si haces X cosa”. La idea me pareció tan buena que estuve hablando con Stephanie Falla acerca de algunas ideas que tenía y hoy publicamos en conjunto el 2º artículo de Es Viernes: Es viernes! tira los papeles y ordena tu escritorio.

La idea de estos artículos, en los cuáles participaré como redactor, es motivar y motivarnos a realizar tareas sencillas que por una cosa u otra terminamos dejando de lado, y encontrarnos un ratito para hacerlas ya que es viernes ;)

Ya tenemos varias otras ideas, y en particular ahora me toca comenzar a preparar mi artículo para el proximo “Es Viernes”, casualmente el viernes próximo :P

¿Qué tan desordenado está tu escritorio? ¿Tienes medicinas, residuos de comida, vasos sucios, un par de camisas por allí? si te sientes aludido creo que es momento de pensar que hoy es viernes! y puedes dedicarle un poco de tiempo a tu escritorio para ordenar ese caos que como buen diseñador, programador o creador siempre justificas por ser creativo.

Aquí puedes leer el artículo completo

[ironic] Que buenos son mis artículos [/ironic]

5 de enero de 2008

Navegando en Internet, llegé a una página de una empresa de desarrollo web con sede en Uruguay, Argentina y Estados Unidos, en la que me topé con un artículo que me era… digamos, … familiar!

Resulta que era un artículo que yo había escrito (o.o), y para el que nunca me habían pedido permiso (oO) y en el que NO se me nombraba como autor (WTF!).
El artículo en cuestión era este: ¿Qué es un sitio web? y estaba reproducido textualmente!

Sin casi poder salir de mi asombro, ni formulario de contacto, ni email, llamo directamente a la empresa. Me atiende una señorita (supongo telefonista, recepcionista o similar) y le pido con el responsable del sitio web de la empresa, luego de un par de preguntas y una músiquita un tanto aburrida, me atiende una voz masculina, un tal Pablo, le comunico mi “problemilla” y me dice que ya mismo agregaban mi nombre, a lo que respondí de que no quería que agregaran mi nombre, que directamente retiraran inmediatamente MI artículo de SU página. Ya que si bien mis artículos están publicados en algunas páginas, no quiero que sean usados como arma de ventas, por ninguna empresa con fines de lucro.

La empresa en cuestión era Esquemas (buscar en google), la cuál obviamente deja mucho que desear respecto a redactar sus propios anuncios / artículos de venta… digamos que prefiero no enterarme de la procedencia de los demás textos de su página, pero cabe destacar que se portaron muy bién y en cuestión de minutos retiraron mi artículo.

Saludos y feliz año!

Las 15 mejores extensiones para Firefox… …por un desarrollador web

5 de diciembre de 2007

Firefox A continuación les presento las que para mi (un desarrollador web) son las extensiones vitales para trabajar en Firefox, ¿y tú, que opinas?

15. Downloads in Tab – [Descargar]
Ésta extensión nos permite eliminar la molesta ventana de descargas que se nos pone encima cada vez que iniciamos la descarga aunque sea de una pequeña imagen, lo que nos ofrece en cambio es una pestaña que maneja nuestras descargas, tal como la ventana (pero sin ser tan molesta (conserva la opción de que continúe descargando aunque cerremos la pestaña y sigue abriéndose y cerrándose con CTRL + J). ¿Qué tal?

14. Gmail Space (GSpace) – [Descargar]
Nos permite (con un formato muy similar a lo que sería un FTP), manejar archivos y guardarlos en nuestra cuenta de GMAIL utilizandola como un disco virtual. Se carga en una pestaña y no nos impide continuar trabajando en Firefox mientras dejamos cargando o descargando algún archivo desde el servidor de GMAIL.
También nos permite enviar por correo los archivos que tenemos en el GSpace, directamente sin tener que descargarlos a nuestro ordenador. ¡Para no perdérsela!

13. Tab Mix Plus – [Descargar]
Esta extensión nos ofrece un mundo nuevo en la navegación por pestañas, difícil entender de que se trata sino es probandola, pero algunas de sus funcionalidades son cambiar los modos en que abrimos, cerramos o cambiamos de pestaña, cambiar la estética de las pestañas, los botones y la barra de pestañas, permitirnos definir accesos rápidos a eventos relativos a las pestañas, combiar el menú contextual de las pestañas y muchas funcionalidades más, toda una revolución en la navegación con pestañas en Firefox!

12. Tempomail – [Descargar]
Crea una dirección de correo, que redirige (temporariamente) a nuestra casilla real, de esta forma no tenemos que poner nuestra verdadera casilla que tanto cuidamos del spam, al registrarnos en cualquier sitio poco confiable. Simplemente configuramos una casilla inventada (que genera el programa) y le decimos que nos reenvie el correo durante las próximas horas o días, por lo que nos llegará el correo de activación pero no todo el spam y boletines que nos enviarán luego… Un arma letal contra el SPAM!

11. Live PageRank – [Descargar]
Vieja y conocida extensión. Tan simple como que nos muestra el PageRank de google en el pie de página.

10. Email This! – [Descargar]
Nos agrega al menú contextual una opción para enviar una página (o el texto seleccionado) por correo electrónico, a través y hacia cualquier sistema de correo.
Además nos incluye un link a la página completa en caso de mandar solamente un párrafo.
Como negativo: no logré enviar imágenes y los tildes funcionan mal. Creo que a pesar de eso es una extensión muy útil.

09. Extended Copy Menu – [Descargar]
En el menú contextual, nos agrega dos opciones para copiar texto de una forma diferente.
Copy as HTML (nos copia el código html de lo que estamos seleccionando)
Copy as plain text (nos copia como texto sin formato, lo que nos evita el clásico para muchos “pasar por block de notas” para ‘des-formatear’ un texto). ;)

08. HackBar – [Descargar]
Esta barra de herramientas nos permite probar y testear código contra posibles injecciones de código SQL. Muy completa y útil!

07. HTML Validator – [Descargar]
Todos los que estamos en contacto con el mundillo del desarrollo web conocemos el querido “validador HTML”, esta extensión nos muestra en la barra de estado, la información de validación HTML de la página.
Además nos permite ampliar y nos muestra los errores en detalle haciendo doble clic sobre ella.

06. CSS Validator - [Descargar]
Al igual que el validador HTML, éste nos permite validar el código CSS de una página.

05. FireFTP – [Descargar]
Un cliente FTP muy cómodo, que se carga en una pestaña del Firefox.
Como ventajas cabe destacar que nos permite tener guardadas las cuentas a distintas páginas y servidores, nos permite abrir varios clientes FTP en distintos dominios e incluso en el mismo dominio y hacer más de una transferencia simultánea. Una maravilla!

04. IE Tab – [Descargar]
Ésta extensión nos permite ver un sitio web como se vería en Internet Explorer dentro de una pestaña del Firefox.
Aparte podemos cambiar de IE a Firefox con tan solo un click, o abrirla externamente en Internet Explorer con CTRL + Click.
Dato: no funciona en linux.

03. ColorZilla – [Descargar]
Es una herramienta que nos permite seleccionar colores de un sitio web que estemos navegando, y copiarlo al portapapeles en hexadecimal o RGB.
Ademas permanece siempre visible en la barra de estado y tiene su propia paleta de colores para poder variar la tonalidad una vez seleccionado el color.
Personalmente de las extensiones que más uso. Realmente muy práctica.

02. Screen Grab! – [Descargar]
Nos permite hacer y guardar automáticamente (o hacer y copiar) una impresión de pantalla de toda una página web o de la porción visible.
Enormemente útil para no tener que hacer varias impresiones de pantalla y luego unirlas.

01. Web Developer – [Descargar]
La barra de herramientas más completa relativa a diseño y desarrollo web.
Incluye miles de opciones que te serán extremadamente útiles si te dedicas a trabajar en desarrollo web.

¿Y tu qué opinas?, ¿qué extensiones o complementos para Firefox te resultan más útiles?
(Puedes dejar un comentario o seguir esto como un meme en tu blog)

Vía | Pixelar.meLas 15 mejores extensiones para Firefox… por un desarrollador web

El mundo se llena de bytes

15 de marzo de 2007

Una investigación realizada por la Corporación EMC y la consultora IDC revela que la capacidad de almacenamiento de las empresas podría verse sobrepasada por la cantidad de información digital generada por particulares y empresas.

El uso cada vez más masivo de la fotografía digital, los videos, música, y la posibilidad cada vez mayor de poder compartir todo este tipo de contenido multimedia ha tenido como resultado que en 2006 se generaran 161.000 millones de gigabytes (lo cuál puesto en términos de CDs, para ilustrar mejor, serían unos 235.520.000.000 CDs, sí doscientos treinta y cinco mil quinientos veinte millones de CDs :s )

Ya hay alertas que indican que la cantidad de información creada a nivel corporativo podría este año superar las capacidades de almacenamiento a nivel mundial en este sector.

Algunos datitos:

  • Cada día en Internet se publican 7 millones de páginas webs nuevas!
  • 70.000 videos son subidos cada día a YouTube.
  • Todos los días se comparten más de 1.000 millones de archivos MP3.
  • 100.000 millones de fotos digitales son tomadas día a día.
  • Y no olvidemos que (aprox.) cada segundo que pasa, se crean 2 nuevos blogs en internet.

Creo que luego de éste pequeño análisis, tanto ustedes como yo estamos convencidos de que el volumen de información está creciendo a un ritmo realmente alarmante.

“Esta masa de información cada vez mayor está poniendo una tensión considerable sobre las infraestructuras de IT que tenemos hoy en día. Este crecimiento explosivo cambiará la manera en que las organizaciones y profesionales de IT hacen su trabajo y la manera en que los consumidores utilizan la información” dijo Mark Lewis (Vicepresidente ejecutivo y Jefe de Desarrollo de EMC Corp.)

Vía | Pixelar.meEl mundo se llena de bytes

Qué es la programación?

8 de diciembre de 2006

El otro día me encargaron realizar unos sitios web muy sencillos (de una sola página) y para nada complicados.
El tema es que debía realizar 10.000 sitios diferentes (por lo que no valía el “copiar/pegar”).

Un rápido cálculo me informó que a cinco minutos por sitio, el trabajo me llevaría unas 833 horas. Eso me desilusionó un poco, porque pensé que no podría realizar ese trabajo (y me interesaba porque el pago era bueno).
La salida alternativa fue realizar un programa que hiciera ese trabajo por mi de forma automatizada. Por lo que me puse a programar, y estuve 8 horas trabajando en algo que no era lo que me habían pedido, pero que esperaba que me sirviera para llegar a mi objetivo.
Y así fue que luego de terminar este programa, y un par de “enters”, tenía las 10.000 páginas.

Entregué el trabajo, cobre y quede muy contento por haber encontrado esa salida “tangencial”.

Pero entonces, ¿qué es la programación?

Una definición fría sería: una técnica que nos permite “programar” pasos que un robot / computadora / persona debe realizar.
Por ej., si le decimos a alguien:

  • Ve al super
  • Toma 1 botella de agua
  • Paga en la caja el importe correspondiente
  • Sal del super
  • Vuelve aquí
  • Sirve un vaso

Tendríamos una serie de pasos o órdenes para llegar a un resultado deseado.

Es más habitual en computadoras, ya que estas:

  • 1. No te pueden decir “ni loco, anda vos”.
  • 2. No tienen leyes en contra de la esclavitud, jeje ;-)

Pero en esencia es lo mismo, por ejemplo para este mencionado programa, fue una serie de pasos del tipo:

  • Crea un archivo vacío
  • Abrelo
  • Ingresa el contenido
  • Guardalo
  • Verifica el nombre
  • Ponlo dentro de una carpeta

Y luego vuelve a repetirlo 10.000 veces (crea/abre/ingresa/guarda… etc etc…)

Evidentemente en código es un poco más complejo que lo que presento arriba, pero esa es la esencia. Esa es la esencia de la programación:
Seguir pasos, órdenes, simplificar nuestro trabajo.

Cabe destacar que pase de un trabajo de 833 horas (35 días dedicado 24 horas a eso) a 8 horas (una jornada laboral normal).
Y el resultado es el mismo, el pago es el mismo, etc.

Así que luego de esto me dieron muchas ganas de contar “qué es la programación” y para que sirve, pero no desde el lado técnico (para eso ya hay muchos manuales, tutorials y libros), sino desde el lado “aplicable”.

Vía | Pixelar.me¿Qué es la programación?

Metodología de trabajo

31 de octubre de 2006

Aclaro que este más que un artículo técnico, es un medio por el cuál expresaré la forma en que me manejo ante un nuevo proyecto para un cliente.
Que utilidad puede tener este texto:

  • Si también eres desarrollador web, quizá pueda servirte para implementarlo, o al menos tener en cuenta opciones de esto.
  • Si eres un cliente o estás interesado en mis servicios como desarrollador web, quizá te interese saber la forma en que trabajo.
  • Si no eres ninguna de las otras dos, quizá te ayude a pasar 10 minutos de tu vida.

¿Qué hacer ante una persona interesada en realizar una página web?

  1. Ofrezco que vea mis trabajos anteriores en mi portfolio, no hay nada mejor que ver lo que ya hice para saber que lo que haga ahora podrá ser aún mejor.
  2. Dispongo el tiempo que sea necesario, para conversar con el posible cliente, sobre qué es lo que quiere para su página, que ideas tiene, y cómo sería la mejor manera de ponerlo en práctica.
    Generalmente en una reunión (si fuera posible) o sino vía telefónica, mensajería instantánea o e-mail.
  3. Luego de tener una idea aproximada de qué es lo que esta persona quiere o necesita, paso a ofrecerle formas de hacerlo, así como complementos o ideas que podrían complementar bien su idea de que busca para su página web.
  4. Paso importante, entrego simultáneamente un boceto y un presupuesto. El cliente (si desea realizar el proyecto), puede decidir eliminar algunas cosas para disminuir los costos, o agregar otras (que obviamente aumentarían los mismos).
  5. El cliente (si es que ya confirmó la realización del proyecto), abonaría un porcentaje previamente acordado, como seña para el trabajo, y brindaría su opinión sobre el boceto. Qué le gusta, qué no le gusta, qué cosas desea cambiar, etc. Mi idea (como ya sabrán los que han trabajado conmigo, porque siempre lo digo), es que ese borrador se cambie entre un 1% y un 99%, pero que haya algo sobre lo qué cambiar el 99%.
    Es una base, sobre la que se construirá lo que el cliente desea y como él lo decida.
  6. Luego de que ambas partes tenemos las ideas más claras, procedo a la realización de la web, de la cuál el cliente podrá ir viendo la evolución en tiempo real, dado que mientras voy realizando el desarrollo voy subiendo las cosas a internet (generalmente en un servidor y con una dirección provisoria, pero es indiferente).
  7. Al terminar el desarrollo, viene otra instancia en la que el cliente podrá pedir todos los cambios que desee, y un nuevo rediseño teniendo en cuenta los nuevos comentarios del cliente.
  8. El paso 7 se repite hasta que el cliente queda completamente conforme con su página web, porque ésa es mi idea, que la gente quede verdaderamente contenta con el sitio web que adquirió.
  9. Se entrega el sitio (se brindan los archivos, o se sube al servidor, o lo que se haya estipulado) y se realiza el pago del saldo del costo (el total menos lo previamente abonado en concepto de seña).
  10. Generalmente pido a las personas que realizaron todo este recorrido conmigo, un comentario, una opinión, una crítica o algún tipo de retroalimentación.
  • Categorias

  • Archivos

    • 2012 (10)
    • 2011 (18)
    • 2010 (29)
    • 2009 (106)
    • 2008 (160)
    • 2007 (133)
    • 2006 (77)
  • Blogs amigos

  • Páginas amigas