Buscador de imagenes cc en flikcr

En el blog de loreta han creado un buscador para flickr en el cual busca fotos con licencia creative commons. Así nos evitamos muchas veces el quebradero de cabeza de tener que estar mirando el tipo de licencia para poder poner las fotos en nuestras webs.

Enlace: buscador flickr

Vista sobre MacBook

Sabemos que se puede correr windows vista sobre los nuevos macbook pro, pero que en la presentación del nuevo sistema operativo ya lo hagan latente de esta forma.

Esto ocurrió en Belgica presentando la versión de ste OS a un grupo de bloggeros.

Foto: Pieter Baert

Fuente: applesfera.

Comunidad beos en mac programadores

En macprogramadores.org han decidido alojar una web dedicada al sistema beos por varias razones:

* Es un gran sistema operativo para PC

* Fue creado por ingenieros de Apple, que abandonaron Apple con la intención de desarrollar un gran SO, y acabar con el spaghetti code de Mac OS Classic. Con la llegada a Apple de NextStep bajo el nombre de Mac OS X, se acabó el spaghetti code en favor de un SO de calidad, lo cual acabó con las perspectivas de Be Inc. de vender su maravilloso SO a Apple. Actualmente el proyecto open-beos.sourceforge.net está implementando una nueva versión de BeOS de código abierto.

Puede visitar esta web aquí:

http://www.macprogramadores.org/beos/

Esta web es una continuación de la web www.beprogramadores.org la cual llegó a reunir a buena parte de los programadores BeOS de habla hispana.

Diseñar webs con plantillas

Segun Garrett Dimon, se puede plantear los diseños de las paginas web con una plantilla, la cual ponemos de fondo y asi no estamos perdiendo el tiempo con calculos innecesarios.

Enlace: smiley cat

Descarga: plantilla

Zooomr intenta desvancar a flikr

En zooomr intentan desvancar a flickr dando versiones pro gratuitas. Estoy provandola, ya que la pro de flikr cueta 24 €, la cual no me parece cara, pero como que esta sale mas economica. En enlace para hacer esto es : http://blog.zooomr.com/2006/07/07/do-we-love-bloggers-yes-we-do/
Lo he estado probando y aun le falta que importe las fotos al formato original, pero el transfondo es muy bueno.

photoblogsmagazine imagenes con personalidad

Aquí nos podemos descargar las revistas en ofrmato pdf gratuitamente, y podemos disfrutar de sus maravillosas fotografias.

Punto referente para tomar apuntes sobre iluminacion, y como captar la sonrisa de los edificios.

Tambien vemos que está patrocinada por expresions, otro alojamiento para fotografia digno de ver.

Enlace: photoblogsmagazine

Google open source repository

Segun cuentan los desarrolladores de google este espacio es similar a sourceforge, pero que no intentan competir con ellos, si no mas bien para crear un espacio para desarrolladores de software libre.

Otro más, teniendo en cuenta el tirón cada vez más grande que tiene google, no estaria de más que, si lo hacen de buena fé que pusieran tambien los links de sourceforge y freshmeat en su sitio.

Enlace : google

Gobelins imagen francesa

Gobelins es la escuela una escuela de imagen francesa que en su pagina nos muestra sus ultimos trabajos.

Es un lugar donde hay que pasar para inspirarse tanto en 3d como en 2D.

De esta escuela salen los futuros artistas de la animacion europea. Vale la pena mirarlo.

Teneis como ejemplo estos artistas: In-Ah RÖDIGER, Simon Pierre ANDRIVEAU, Yann AVENATI, Hervé BARBEREAU and Louis CLICHY. del proyecto jurannessic, que provienen de esta escuela.

Enlace: gobelins

Fuente: kotecinho

Open clipart library

Una pagina repleta de librerias para tus diseños en inkscape, openoffice o lo que se tercie. En ella podras sacar probecho a tu creatividad y sin tener que gastar un duro. Enlace: Clipart.org

20 consejos para ser un gran diseñador web

La diferencia entre un buen diseñador de webs y un gran diseñador es la capacidad de saber tomar atajos y ahorrar tiempo sin comprometer la calidad del trabajo. Jason Arber de Pixelsurgeon ha puesto juntos 20 puntos y trucos superiores que debes utilizar para dar a tu trabajo ese toque profesional todo importante

1. Planeamiento

Cuando estás tecleando para empezar, es fácil pasar por alto el paso más obvio: planeamiento. Si está dibujando wireframes y diagramas del sitio en OmniGraffle o Visio, o aún en un papel, ahorrarás tiempo teniendo una descripción de tu diseño en el nivel del sitio y de la página antes de que comiences a construir. Los errores claros pueden ser detectados y ser solucionados antes de que sea demasiado tarde y hace que puedas explicar tus ideas a los clientes y a los colegas mucho más facil que agitando tus manos en el aire.

2. Hacerlo a mano

Aunque hay algunas herramientas excelentes para generar portales, tales como adobe golive y el adobe (antes Macromedia) Dreamweaver, los "monos" del código profesional prefiere cifrar a mano. ¿Son masoquistas locos? tal vez ;-).

Hay solamente una dirección, aprender el HTML, y eso es pelarse los codos con un cierto código real. Pero no tengas miedo : El HTML tiene una de las curvas de aprendizaje más fáciles que existe. Parecerá qie siempre puedes crear un Web básica con solamente un par de líneas. Escribir el código a mano asegura que tengas el código mas limpio y ajustado posible, que es la obsesión de todos los geeks del HTML.

No tires la copia de Golive o Dreamweaver todavía. Ambos tienen ambientes excelentes de la escritura del código, y tienen características útiles, tales como bloques plegables del código y de visiónes partidas así que de ti puede cifrar y ver los resultados al mismo tiempo. Si deseas intentar el codigo a mano , cualquier editor de texgto te servirá.

3. Hojas de estilo, enlazar o importar:

Hay dos maneras de unir un CSS externo a tu pagina HTML, y no todos los navegadores entienden ambos métodos. por ello se puede usar los dos metos para que tanto navegadores antiguos como modernos puedan ver el CSS.

El secreto es crear un stylesheet simple que trabaje en Netscape 4, con un CSS más complejo relegado a un stylesheet adicional se una que usando el @import, de que Netscape 4.x no hará caso:

<link rel="stylesheet" href="simple. css" type="text/css" media="screen">

<style type="text/css" media="screen">

@import url(simple.css);

</style>

4. Fondos más elegantes que los gradientes

El CSS te da mucho control ye flexibilidad sobre el ajuste de las imágenes de fondo. Y la gran cosa es que las imágenes de fondo no están limitadas al fondo del cuerpo y se puede también aplicar a cualquier DIV, nivel del bloque o elemento en línea.

Las imágenes que se incrustan convencionalmente o apenas a lo largo del eje X o de Y pueden ser fijadas con la página o seguir siendo fijas mientras que el resto de las imagenes de la página se deslizan sobre él. Los fondos pueden también ser compensados. Esto significa que es fácil crear un fondo verticalmente graduado, con gráficos que son solo ocupan algunos kilobytes de tamaño.

Usando el código siguiente, el archivo de background.png necesita solamente ser tan alto como el gradiente y un pixel de par en par. Este ejemplo asume que el gradiente se descolora en blanco, pero la cualidad del backgroundcolor podría ser cualquier valor.

cuerpo {fondo-color: blanco; fondo-imagen: URL (background.png); fondo-repetir: repetir-x; }

5. Comentarios

Cuando te vuelves a un sitio que diseñaste hace meses, no hay nada peor que intentar calcular lo que hiciste y procurar desenredar el espagueti del código. Hacerte un favor(y a cualquier persona que desee comprobar tu código) poniendo comentarios en tu HTML. Los comentarios pudieron agregar algun kilobyte, pero los ahorros del tiempo son inestimables.

El comentar también te anima a que mantengas tu código ordenado rompiéndolo en pedazos lógicos. El uso de algunos codificadores incluso comenta para crear un contenido para la página, que es solamente visible en la opinión del código.

Estar enterado que el HTML y el CSS utilizan dos diversas clases de comentar, así que puedes aprender la diferencia.

<! -- El HTML se comenta como esto y es incluido dentro de los soportes de ángulo y de dos guiones. La etiqueta de la abertura incluye una marca del exclamation. -->

/* los comentarios de CSS son incluidos por una raya vertical delantera y un asterisco. */

6. Utilizar PHP simple para construir sitios

No hay necesidad de ser un experto de PHP para comenzar a usarla en tu sitio. Si tu servidor soporta PHP, puedes rápidamente utilizar fácilmente ese lado del servidor para construir una biblioteca de elementos de uso general, insertándolos en tu pagina Web con un acoplamiento simple. Esto es bueno para los elementos como los menús, que pueden existir como solo caso, y significa que si agregas un nuevo artículo de menú o cambias el diseño, tú necesitaras cambiar solo el archivo incluido, que entonces pondrá al día el sitio entero.

Includes son simplemente snippets del código del HTML tales como una tabla o una lista desordenada. La página que llama a los includes debe terminar en .php e include se inserta usando el código simple siguiente:

<?php include("filename.html"); ?>

7. Dimensiona las fuentes usando el ems

A los diseñadores les encantan el especificar el tipo tamaños en pixeles porque corresponde fácilmente con lo que hace en Photoshop. Pero la especificación del tamaño para la web, los pixeles tienen una desventaja importante: no pueden ser redimensionados correctamente en Internet Explorer. Cuando la resolución de un monitor aumenta, la fuente no va acorde con el tamaño de tu diseñoasí que ¿cuál es la solución?

La respuesta es especificar la tipografia en em. Si no conoces la unidad, un em es respecto a la anchura una em minúsculo en una fuente, y con el CSS interno por defecto de un navegador, un em es equivalente a 16 pixeles. Fijar el tamaño de fuente en la etiqueta del cuerpo a 62.5 por ciento como esto:

body { font-size: 62.5% }

Esto hace un em de diez pixeles (16 x 62.5% = 10). Ahora puedes comparar tamaños del pixel con el em. Por ejemplo, para que se fije en 12 pixeles se podría expresar como 1.2em; 9 pixeles se convierten en 0.9em y así sucesivamente. Es más, el diseñador y el usuario son felices.

8. Hack en IE el modelo de caja

En IE nos encontraremos con bugs con el tamaño de capa cuando se usa width y margin, padding o border. Se conoce la solución para que el corte del modelo de la caja, que utiliza otro bug en el IE para forzarlo para utilizar las etiquetas que otros browsers ignoran. Si tienes un div especificado válido como este:

div {_ width: 100px;_ padding: 5px;_ border: 5px solid #fff;_ }

Terminarás con una caja de 120 px de altura en la mayoria de navegadores, pero solo 100 px en IE. La solución facil es el metodo "caja sin caja" colocando un div dentro de otro:

div {_ width: 100px;_ }

div .hack {_ padding: 5px;_ border: 5px solid #fff;_ }

Esto se aplica asi:

<div>

<div class="hack">

Tu contenido aqui:

</div>

</div>

9. Ahorrar el espacio

Nadie quiere crear formularios en HTML, especialmente en navegadores que insiten en la adición del padding (acolchado) alrededor de ellos sin ninguna razón. Para evitar eso agregamos este codigo a la hoja de estilo:

<form style="margin-top: 0; margin-bottom: 0;">

10. Prueba, prueba y prueba otra vez

Mientras que el Internet Explorer todavía domina el mercado del browser por un porcentaje enorme, su fuerza está siendo erosionada gradualmente por otros browsers tales como Firefox y ópera. Hay también un montón de gente que todavía usa los browsers arcaicos como versiones del pre-Mozilla de Netscape.

Es virtualmente imposible diseñar en grande para todos las versiones de navegadores, asi que es mejor decidir con que navegadores queremos que esté soportado. Los navegadores basados en Mozilla, Los navegadores basados en WebKit (como el Safari de Apple), KHTML (como Konqieror), Opera y las versiones de Internet Explorer son generalmente considerados para tener un patron de diseño seguro. Sin embargo, debes todavía ser un buen diseñador limpio asegurándote de que tu código no desagrade, de modo que incluso los navegadores sin apoyo puedan experimentar tu sitio - incluso en una forma limitada (véase el punto 14).

11. Ajustar a formato los fundamentales

En los viejos tiempos era simple. Si la imagen contenia colores planos como una insignia, utilizar un GIF. Si era fotográfica, utilizar un JPEG. Hay también un tercer formato pasado por alto, el png que viene en dos sabores: una versión de 8-bit que contiene 256 colores, como GIFs, y versiones 24-bits con la ayuda del canal de la alfa teniendo en cuenta transparencia variable.

Las malas noticias son que el Internet Explorer no soporta los canales de la alfa del png sin el recurir a un complejo codigo. Sin embargo, los PNGs de 8-bits comprime generalmente mucho más pequeña que la versión equivalente del GIF. A menos que necesites la animación, que PNGs no puede hacer(existe el mng pero aun no tiene mucho soporte), PNGs puede substituir GIFs en la mayoría de las situaciones, dando por resultado un ahorro total del tamaño del archivo.

JPEGs crea generalmente archivos más pequeños que los PNGs 24-bit, así que a menos que te estés aprovechando de la transparencia del canal de la alfa del png (www.alistapart.com/stories/pngopacity/), entonces JPEGs sigue siendo el mejor formato para las imágenes del tono continuo.

12.Los atrivutos "title" y "alt"

Asegurate de que todas tus imágenes hagan uso el alt y las etiquetas del título de modo que los lectores de la web puedan analizar correctamente tu página:

<img src="logo.gif" alt="logo" title="logo/" />

13. El formato correcto para las pseudo clases

Para los efectos del rollover del texto, es importante que las pseudo clases estén en la orden derecha, o no trabajarán correctamente en todos los browsers. La orden correcta es:

a:link { color: blue; }

a:visited { color: purple; }

a:hover { color: purple; }

a:active { color: red; }

(para recordarlo se utiliza love & hate)

14. Utilizar la semántica

La semantica es separar el contenido de tu Web site de su aspecto. Idealmente, si quitaras las hojas de estilo, tu Web podria ser vista por navegadores más antiguos.

La colocación, el estilo y cierta cantidad de interactividad se pueden entonces agregar con las hojas de estilo y en los CSS.

15. Favicons

Favicons son los pequeños iconos del pixel 16x16 que aparecen en tus listas de los favoritos y las barras del título de Web site. Son rápidos y fáciles agregar: excepto un gráfico en formato de .ico (los usuarios del Mac pueden desear considerar el usar del convertidor gráfico pues Photoshop no apoya este formato) y ponerlo en la carpeta de la raíz de tu sitio. Es tan simple como éso.

16. Cambiar la capitalización (mayusculas) usando el CSS

Si necesitas algo escrito en capitales, tales como un título, más que reescribir una copia, dejar que el CSS hacer el trabajo de burro. El código siguiente transformará todo el texto con una cualidad h1 en todos los capitales, sin importar el formato.

h1 { text-transform: uppercase; }

17. Escribir el texto alrededor de las imágenes

Una manera rápida de envolver el texto alrededor de imágenes, es utilizar la imagen alineada a la izquierda o derecha. Mejor que el salto debajo de la imagen, así el texto fluirá a lo largo del borde.

<img src="image.jpg" align="left">

18. Juegos de caracteres universales

Los juegos de caracteres son una parte importante de la definición de una pagina Web, pero son probablemente el componente menos entendido. Los juegos de caracteres, que se definen en la sección principal invisible de un Web page, dicen al navegador qué método se está utilizando para codificar los caracteres. Un latín 1 de la ISO del charset (también conocido como ISO 8859-1) rendirá el código que encuentra con un alfabeto occidental básico, pero un charset JIS procurará leer cualquier carácter que encuentre en japonés.

Con tantos juegos de caracteres competentes, los problemas pueden ocurrir, especialmente al usar el juego de caracteres de MS Windows (que contiene ciertos caracteres que se puedan substituir por un espacio en blanco en otros sistemas operativos) o cuando varios idiomas necesitan aparecer en una sola página.

La respuesta es utilizar un solo juego de caracteres universal que pueda cubrir la mayoría de las eventualidades. Existe uno afortunadamente: UTF-8, que se basa en Unicode. Unicode es un estándar de la industria que se diseña para permitir el texto y símbolos de todas las idiomas que se representarán y manipuladas constantemente por las computadoras. UTF- 8 se está convirtiendo en rápidamente en la opción, y se debe incluir en la cabeza de tu Web page como esto:

<meta http-equiv="content-type" content="text/ html;charset=utf-8" />

19. Estilos de la impresión

Cuando la gente imprime paginas web, a menudo no está interesada en tus gráficos llamativos: apenas desean una versión simplificada de la página. Usando el CSS es posible crear un estilo separado que afecte solamente versiones impresas de tu sitio, más bien que teniendo que crear un nuevo HTML page o adaptar el existente. Agregas un estilo de la impresión exactamente de la misma manera que agregarías un stylesheet regular a tu página:

<link rel="stylesheet" type"text/css" href="print.css" media="print">

o

<style type="text/css" media="print"> @import url(print.css); </style>

Esto se asegura de que el CSS se aplique solamente a la salida impresa y no afecte cómo la página se ve en la pantalla. Con tu nuevo stylesheet impreso puedes asegurarte tienes texto negro sólido en un fondo blanco y quitar características extrañas para maximizar legibilidad.

20. Aprender de otros

Finalmente, una punto rápido y simple: aprender de los grandes sitios construidos por otros. El HTML de cualquier sitio es fácilmente accesible viendo el código de fuente de una página. Ver cómo otros han hecho cosas y aplicar tus métodos a tu propio trabajo.

Traducción de : Mtraker

Enlace original: Netmag

Reflejo con javascript

Hay muchas veces que tenemos que retocar la imagen para darle cierto efecto de reflejo e incoporarlo a nuestra pagina web. Este script nos ayuda a agilizar este efecto y compatible con la mayoria de navegadores.

No es un codigo pesado y la verdad es que agiliza muchas veces el proceso de diseño para un webmaster.

Enlace: reflection.js

Seguridad0 Parallels Desktop

Seguridad0 ha lanzado al mercado español dos productos más: Parallels Desktop y Parallels Workstation.

El primero para Mac Os y el segundo para Windows, en los cuales se puede instalar cualquier máquina virtual con practicamente cualquier sistema operativo.Y dicen en su pagina que sin mermar el rendimiento.

Tambien hay una workstation para Linux, para las versiones deribadas de Debian, Ubuntu, Red Hat/ Fedora, Gentoo, y otras.

El precio de la versión para Windows y Linux es de 40 euros (más IVA). La versión de Mac OS X cuesta 54,4 euros (más IVA). Existe una versión de prueba

Biro-art pagina de dibujo a boli

En los tiempos de la tecnologia y el pixel nos encontramos con Phillip Blackman, dibujante a la antigua usanza, incluidas las presentaciones por web que tiene. Todo lo que ahi se expone está hecho a boli.

Es una referencia a tener en cuenta para seguir indagando en nuestro propio estilo y pèrcibir la vida de una manera mas alegre.

No solo somos humanos, hay que recordar lo animales que somos. :-D

Enlace : bio-art

Linux MultiMedia Studio LMMS logo

Fruity loops en su dia y con mi viejo sistema de windows me dio sus alegrias a la hora de generar musica con el pc.

Esta alternativa libre no tiene nada que envidiar a a compañia de fruity .LMMS usa librerias QT, soporta alsa y JAck.

Lo que tengo que hacer es hecharle un vistazo para ver porque utiliza las librerias de wine...

Mas información LMMS

Lumini Mattia


Lumini Matia es otra fuente de inspiración para el mundo 3d. Podeis comprovarlo en http://www.luminimattia.com/index.htm.

Nueva versión estable de gimp

Los usuarios de Gimp ya tienen la nueva versión estable para descargar. Se han corregido disversos errores y bugs de la versión anterior: En la 2.2.12 tenemos mejoras respecto al anterior:
  • Problema en el plugin de animación.
  • Corregido el problema del dialogo de instalación
  • No usa la APi libpng desaprobada.
  • Resuelto el problema de segmento cuando se cerraba una imagen salvada.
  • Fijado el problema de escalado y redimensionado.
  • Resuelto el problema de compilacion con gcc 4.1
  • No guarda las imagenes parasitarias de los ficheros XFC
  • Resuelto el problema de valores por defecto en PNG.

Más aquí

Descargar en la pagina oficial de GIMP

Manual xhtml creative commons

Magnifico manual creative commons sobre xhtml. Un documento claro y muy agil. Son apuntes para todo aquel que quiera aprender xhtml. Enlace : manual-xhtml

Cinelerra 2.1

La última versión de Cinelerra, la 2.1, acaba de ser lanzada. Hay mejoras importantes en las cuales ya podemos comprobar que el trabajo profesional se puede hacer con soft libre. Agilidad en la interface dandole mas velocidad. Efectos de audio en tiempo real. Mas añadidos de codecs para mejor compresión. Ocultación de curso en los previos. Soporte a OpenGL, asi consiguiendo más efectos especiales como por ejemplo: brightness chromakey chromakeyhsv colorbalance deinterlace diffkey dissolve flip frames to fields freezeframe gamma gradient histogram huesaturation interpolate Pixels invertvideo linearblur overlay perspective radialblur rgb601 rotate scale threshold zoomblur Más información en: cinelerra

Nueva version de inkscape 0.44

Inkscape es un excelente programa vectorial de software libre y multiplataforma. Soporta SVG de forma nativa y con las funciones similares a CorelDraw y Freehand. Entre las mejoras encontramos un rediseño de los iconos, mas opciones en la pluma caligráfica, importación de los gradientes de GIMP (.ggr), exportación a DXF, ODG (Open Document drawing), paleta incrustada en nuestra barra de herramientas, visualización de las líneas de nuestro dibujo sin ningún tipo de coloreado o efectos, nueva opción en el panel de alinear y distribuir y Clip and mask, donde nos permitirán crear máscaras, en la primera opción tapa el objeto de abajo por completo en la zona creada mientras en la segunda nos valemos de 256 tonos de grises para hacer una máscara degradada. Enlace: Inkscape