@dgfrancisco

“There must be a better way.” – Steve Jobs

dgfrancisco — Thu, 06 Oct 2011 03:38:53 +0000

“En el vocabulario de la mayoría de las personas, el diseño significa apariencia. Es decoración de interiores. Es la tela de las cortinas o la del sofá. Pero para mí, nada podría estar más lejos del significado del diseño. El diseño es el alma fundamental de una creación del hombre que termina expresándose en capas exteriores sucesivas de un producto o servicio”. – Sitio de CNN Money, enero 24 de 2000.

Gracias por recordarnos que todo lo que hacemos es para seres humanos.

Stellar

dgfrancisco — Wed, 31 Aug 2011 04:58:25 +0000

This project began from the theory that humans are made of cosmic matter as a result of a stars death. I created imagery that showcased this cosmic birth through the use of dust and reflective confetti to create galaxies. The models organic bodily expressions as they are frozen in time between the particles suggest their celestial creation. In addition, space and time is heightened by the use of three-dimensional animated gifs. Their movement serves as a visual metaphor to the spatial link we share with stars as well as their separateness through time.

URL: Ignacio Torres site

Acaso el !DOCTYPE importa?

dgfrancisco — Sun, 07 Nov 2010 04:46:02 +0000

Asumo que sabemos que es HTML y CSS, sim embargo aqui dejo una pequeña descripción a cerca de estos dos lenguajes. Todos los sitios web son creados a partir de dos lenguajes básicos: HTML y CSS. El HTML es un lenguaje de marcado, un lenguaje de etiquetas; describe la estructura y el contenido de una página y el CSS especifica los aspectos visuales de la página en diferentes medios (pantalla, impresion, dispositivos, etc).

Las implementaciones de estos lenguajes en navegadores web, particularmente la de CSS, fueron al principio mínimas y conocidas por contener muchos errores o “quirks”. Es por eso que la Etiqueta !DOCTYPE básica, es MUY IMPORTANTE !!!, esta etiqueta es tan básica que ya nunca nos preocupamos por ello y es muy importante, siempre tenerla en cuenta como primera definición en un desarrollo web. El !DOCTYPE, en términos muy simples, le dice al Browser como debe renderizar.

XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

En la anatomía del !DOCTYPE (que debe ser escrito en mayusculas), definimos el tipo de lenguaje de marcado a usar y su verison, definimos si vamos a usar XHTML o HTML, o HTML 4.0, tipo de lenguaje + version (ya debe estar por salir la definicion para HTML5), la palabra PUBLIC hace referencia al tipo de disponibilidad del documento (en nuestro caso público, por lo que está a disposición de toda la WWW), se define luego el tipo de documento, las letras EN indican que el sistema de caracteres en el que está escrito el DTD es el correspondiente a la lengua inglesa y definimos los DTDs, los cuales definen excatamente qué se permite dentro del documento que forma la página y qué no, basicamente le dan reglas de render a los navegadores (la ruta es por si se llama externo el archivo).

Ahora pues el !DOCTYPE tiene basicamente 3 opciones, 3 tipos de documentos:Strict, Transitional y Frameset. cada uno de estos define reglas de juego diferentes, todo depende de que tan expertos somos con el CSS o que tipo de contenido tenemos en el sitio; Asi pues las diferencias entre cada uno son:

Strict: Este tipo de documento está pensado principalmente para la aplicacion de CSS, separando completamente el contenido y el disenio.Asi que no permite la utilización de etiquetas y atributos, que esten en desuso, atributos orientados a la presentación, como etiquetas: , y otros. Escribiendo páginas en XHTML 1.0 Strict se consiguen páginas bien estructuradas y fácilmente adaptables mediante CSS, pero tiene la desventaja de crear incompatibilidades con ciertos navegadores.

Transitional: Incluye todas las características de XHTML 1.0 Strict, pero añade características orientadas a la presentación ya en desuso.
Frameset: es una variante del Transitional para las páginas que utilizan frames

Ejemplos del !DOCTYPE para desarrollo web

HTML 4.01 Strict: Esta es la DTD HTML 4.01 Strict, que excluye los atributos y elementos que W3C espera eliminar (como font) pasando así todos los atributos a las hojas de estilo. No incluye soporte para frames. En general todo desarrollador debería usar esta DTD, exceptuando casos en los que es imprescindible el uso de elementos y atributos en el mismo HTML, donde usaremos el DTD Transitional.

“http://www.w3.org/TR/html4/strict.dtd”>

HTML 4.01 Transitional: Esta DTD es igual que la anterior, exceptuando que esta si que da soporte a atributos y elementos (como font) que no da la DTD Strict. No incluye soporte para frames.

“http://www.w3.org/TR/html4/loose.dtd”>

HTML 4.01 Frameset: Esta DTD es igual a la Transitional, pero incorpora el soporte para frames.

< "http://www.w3.org/TR/html4/frameset.dtd">

XHTML 1.0 Strict: Esta DTD incluye todos los atributos de HTML, pero excluye la presentación de atributos y elementos que W3C espera eliminar (como font) pasando así todos los atributos a las hojas de estilo. No incluye soporte para frames. Y al ser XHTML, las etiquetas deben escribirse como XML.

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

XHTML 1.0 Transitional: Esta DTD incluye todos los atributos de HTML y también incluye los atributos y elementos (como font). No incluye soporte para frames. Y al ser XHTML, las etiquetas deben escribirse como XML.

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

XHTML 1.0 Frameset: Esta DTD incluye todos los atributos de HTML y también incluye los atributos y elementos (como font). Incluye soporte para frames. Y al ser XHTML, las etiquetas deben escribirse como XML.

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd”>

Así que de aquí en adelante cuidado con esta etiqueta, podrían ahorrarse muuucho tiempo en debug y hacer mejores y mas estandar versiones de sus sitios o de sus trabajos.

Scriptsrc.net

dgfrancisco — Mon, 19 Jul 2010 04:52:37 +0000

Las librerías Js, son cada ves más populares en los desarrollos web, con el paso del tiempo tanto los diseñadores como los desarrolladores están más preocupados por agregar efectos, transiciones y funcionalidades que faciliten la experiencia de usuario en nuestros sitios y aplicaciones web.

The most current library script tags just a mouse click away.

Scriptsrc.net nos ayuda a incluir la última versión estable de la librería Js que prefiramos, siempre y cuando Google tenga hosteado el código en algún lugar de su API; Las actualizaciones y los status de su código, los informa a través de su cuenta en @scriptsrc, de esta forma nuestros sitios no se verán afectados y siempre tendremos tiempo de hacer pruebas y decidir sí nuestro sitio necesita la actualización.

La forma de uso es muy sencilla, cada librería tiene un espacio en el home, cada espacio tiene 2 botones y un contador de veces que ha sido copiada esa librería anteriormente, por ejemplo para este momento librerías como jQuery ha sido copiada 10.330 veces, UIjQuery2.790 veces; con esta información podremos intuir cual es más popular en los desarrollos y de alguna forma saber cual podría ser más confiable (al ser más usada tendrá, mayor soporte, mayor comunidad y mayor información disponible).

Con respecto a los botones tenemos 2 opciones ver el sitio de la librería dentro de Google para ver más documentación y detalles, o podemos copiar el tag HTML que irá en nuestro header y a nuestra aplicación finalmente. Así que el proceso es simple, solo dar clic en el botón COPY (+) y este cargará en nuestro clipboard el tag necesario que debemos copiar en el de nuestro sitio y listo la librería estará disponible para nuestro uso.

Pio.la – Comunidad de Innovadores de América Latina

dgfrancisco — Fri, 13 Nov 2009 04:55:50 +0000

Pio.la es una plataforma de conferencias virtuales y abiertas para innovadores latinoamericanos. Nosotros creamos eventos donde cualquier persona, a través de video en-línea (streaming), puede inscribirse para realizar sus propias presentaciones en vivo por 20 minutos.

Comunidad de innovadores de América latina.

La idea de hacer PiolaBarcamp nació después del FOWA en Miami, cuando César Salazar, Carlos Cobos, Mauricio Pastrana, Alejandro Corpeño, Roberto Brevé y Hernán Aracena se reunieron y vieron la necesidad de continuar en contacto de manera online. Así que decidieron crear un espacio llamado Piola, nombre del restaurante en el que se encontraban. Todos pusieron dinero para comprar el dominio y se creó un wiki. En este mismo día se decidió que se haría reuniones el 23 de cada mes a las 7:30 de la noche hora del Este.

La primera edición se realizó en 23 de Mayo de 2009, para ello se utilizaron diferentes canales de streaming como Ustream y Livestreaming. Desde el principio Hernán Aracena fue quien continuó con la idea y posteriormente entró Lina Ceballos, quien lo apoyo en las labores de difusión y promoción del evento. Desde eso se han realizado cuatro ediciones en las que han participado cientos de personas en América latina, quienes se han mantenido informados desde el Wiki, la cuenta de Twitter y la página de Facebook. Vale decir, que en estas reuniones se ha conservado la misma filosofía de los Barcamp offline que se realizan en el mundo, donde se propone que cualquier persona pueda compartir su conocimiento a modo de desconferencia.

Próximos a la quinta edición, se vio la necesidad de replantear PiolaBarcamp y hacerlo un evento más amigable para la audiencia. Para ello se creó PiolaLab, un experimento en el que se convocó a las personas interesadas en crear una plataforma llamada Pio.la. En éste participaron 10 personas, quienes, durante el 5 y 6 de septiembre, de manera online, estuvieron en la primera etapa de la creación de Pio.la y en la realización de un plan de negocios. Luego se realizó una segunda etapa de finalización, en la que sólo participaron cuatro personas, quienes le dieron el enfoque actual y fundaron la plataforma de Pio.la .

El equipo de trabajo de Pio.la está conformado los cuatro fundadores del proyecto, y quienes están encargados del diseño, desarrollo, difusión y gestión de Pio.la.

Camilo Sánchez @pollinoco
Lina Ceballos @linaceballos
Hernán Aracena @aracena
Francisco Rodríguez @dgfrancisco

Así mismo, existen seis colaboradores directos que fueron los que participaron en el PiolaLab:

uan Guillermo Gallego @juanggallego
José Rojas @joserojas
Arturo Garrido @arturogarrido
Albeiro Ochoa @albeirochoa
Iván acosta Rubio @ivanacostarubio
Antonio Escallon @aescallon

Enlaces relacionados

Pattern Tap | Fill up on good web, tasty, tasty web

dgfrancisco — Tue, 09 Jun 2009 04:57:14 +0000

Desde la creación del “web world” todos los diseñadores y desarrolladores web soñamos con este tipo de sitios que nos ayudan a lidiar con el síndrome de pagina en blanco, este sitio construido por dos personajes, Matthew Smith y Chris Pollock (desarrollador); han logrado redefinir el proceso de los diseñadores en cuanto a su proceso creativo. Así que sí es cierta la celebre frase “.. los buenos diseñadores copian, los excelentes roban“, pues Pattern tap nos abre la puerta a decidir que robarnos.

Patterntap - Tasty, tasty web

Pattern tap es un proyecto web que tiene como objetivo, estimular la inspiración de los desarrolladores web proporcionando capturas o los comúnmente llamados “pantallazos”, de distintas partes de un sitio web, de módulos, paginas completas, botones, headers, footers, todo tipo de recursos que conforman una web, es el grueso del contenido de Pattern tap; todo con la firme intención que estos “ejemplos”, funcionen como materia prima para nuestra imaginación a la hora de realizar una página web.

Este tipo de ayuda a la imaginación es particularmente útil para los diseñadores que tenemos que estar permanentemente buscando una nueva y mejor manera de hacer aquello que hacemos, diseñar web. Por más creativos, se llega a un punto en el que se necesitan ideas frescas y originales para hacer de nuestros diseños piezas nuevas y frescas y no diseños similares a anteriores desarrollos o a otros sitios.

El sitio posee varios modelos de las secciones características de un sitio se del tipo que sea, como por ejemplo, las páginas de error 404, los headers, formularios de contacto, formularios de login, entre otros.

Para hacer uso completo de los servicios del sitio solo hace falta registrarnos gratuitamente, pero si no deseamos hacerlo igual podremos navegar de una forma más superficial por los contenidos de la web.

Así mismo, podremos enviar nuestras contribuciones para que las añadan a la galería, las cuáles antes de publicarse pasarán por una prueba de “calidad”.

Links relacionados

Más opciones de sitios como este, via Smashingmagazine.com, link
Site Online www.patterntap.com
~~Site Version Alpha, experiemental alpha.patterntap.com~~

Alpha and experimental new Patterntap.

Smashing Magazine – “We smash you with the information…”

dgfrancisco — Sun, 30 Nov 2008 04:58:19 +0000

Smashing Magazine es una revista dedicada a diseñadores y desarrolladores web; su propósito principal es difundir y promocionar contenido de calidad relacionado a la actualidad del diseño web y lo que esto implica. Este sitio es mantenido por varios personajes, Vitaly Friedman, un desarrollador web freelancer, autor del libro Praxisbuch Web 2.0 y el creador del sitio Web Developer’s Handbook; Sven Lennartz, editor general o editor en jefe de contenidos del sitio alemán Dr. Web y April Michael Dobler quien se ocupa del mercadeo y la publicidad de la revista.

Estos desarrolladores y diseñadores web crearon una revista a modo blog, que presenta contenido especializado, está categorizada por tópicos de intereses precisos, claves para navegar por el mundo de contenido de SM. El sitio además muestra en parte la actividad de los usuarios con respecto a su contenido, que es aquello que más les ha interesado, así tienen módulos de información para mostrar popularidad, tips, y enlaces útiles.

Algo por lo que seguramente SM ha sido muy popular y seguirá siéndolo mientras mantengan su calidad de contenido, es la dedicación a los compilados de información, estos compilados son agrupaciones de recursos, tutoriales, muestras, ejemplos, handbooks y demás con respecto a un tema en particular; esto hace aún más fácil encontrar aquello que buscamos; los temas de estos compilados son tantos como aplicaciones tenga el diseño, los contenidos varían desde productividad, gerencia en diseño, hasta sitios y links de inspiración, o librerías de iconos e imágenes; este tipo de contenido creo es el principal diferenciador como producto web.

De en medio del contenido de SM me encontré esto, que creo es muy cierto: “

… Cameron Moll dijo una vez: “No diseño para adornar, diseño comunicar”. Esto es extremadamente importante. El diseño es un medio de comunicación, no responde al propósito de existir simplemente – de hecho, debe ser basado sobre la capa de la utilidad. Es importante que más diseñadores realicen sitios web usables y funcionales, El diseño magnífico puede esperar, En Smashingmagazine.com, todavía no lo tenemos. No estamos seguros si lo tendremos nunca.”.

¿Marcadores sociales sirven o no? Sabes usarlos?

dgfrancisco — Sat, 24 May 2003 04:49:55 +0000

Los marcadores sociales son sistemas que permiten guardar enlaces, de la misma manera que lo hacemos en nuestros browsers, sea Internet Explorer o Firefox; estos enlaces tienen el famoso nombre de “bookmarks” o “favoritos”. El fin de un sitio dedicado a este tipo de servicio es que el usuario siempre tenga disponible en cualquier computador con acceso a Internet, el total de su información; no solo se trata solo de información personal, estos portales también nos permiten ver la información de nuestros “amigos” o de nuestra red, este aspecto es clave cuando de investigación se trata, pues este soporte permite a grupos multidisciplinarios llevar a cabo sus investigaciones, de esta forma el grupo independientemente de su posición geográfica o su cercanía; tiene un espacio para su investigación.

El sistema parece funcionar muy bien para los usuarios que tienen idea de compartir contenido de forma clara y estandarizada, para usuarios que entienden que un “tag” representa una palabra clave de búsqueda y compilación; pero que sucede con aquellos que no son tan interesados en como funcionan las nuevas tecnologías, o que no tienen usuarios en redes sociales y blogs, herramientas que les permite entender este tema, que sucede cuando los usuarios no sabemos definir de forma clara y útil el o los tags de relación de “nuestros favoritos”?

Dentro de los diferentes portales de marcadores no hay un sistema pre-establecido de palabras clave o categorías – no existe una estructura predefinida para los tags, por lo tanto los usuarios podemos definir palabras clave muy genéricas o muy especificas, podríamos crear tags como por ejemplo: “Diseño” y bajo esta palabra añadir sitios de diseño de impresos, diseño Web, inspiración para trabajo, o sitios que simplemente los quiera por que visualmente son agradables; o al menos esa podría ser una posibilidad, podríamos incluso confundir el significado de los términos con el significado de la información que queremos definir en ella. Incluso podríamos estar seguros de su ortografía, de su exactitud de letras y definir tags de tipo: “diseño” o “diesno” sin percatarnos del error, bien lo dijo NatGeo, “No importa la posición de las letras, siempre y cuando la primera y la última estén en su lugar, de es forma el cerebro humano cree que las palabras están correctamente escritas“; siguiendo con esto volvamos al titulo de este post: ¿Marcadores sociales sirven o no?

Los portales de marcadores libres al publico deberán entonces primero ayudar a los usuarios a entender como utilizar las etiquetas, entender que estas palabras representan tipos de contenido, que las palabras claves son rótulos o anclas para que la búsqueda de contenidos sea mas sencilla, estos portales deben para que su contenido sea útil y algún día como referencia importante de información, ayudar a que los usuarios entiendan que antes de añadir un nuevo tag deben tener en cuenta, el tipo de contenido, tema, fuente, autor, productos que representa, etc. Así que la tarea empieza por los portales mismos, las herramientas funcionan pero como toda nueva herramienta debe estar acompañada por un manual de uso.

Links relacionados

Folcsonomia: Tags y Tagging – Cómo Crear Buenas Etiquetas Para Tu Website |masternewmedia.org
Folcsonomía | wikipedia.org