Hoy volvemos a hablarles en nuestro blog de diseño de herramientas online que de seguro ayudan a los que les han encargado nuevos proyectos web. Ya saben que en Diario tHC intentamos mantener el equilibrio entre los artículos dedicados al mundo blogger, así como aquellos pensados tanto para los diseñadores gráficos, como los del mundo online, así que hoy nos toca diseñar en el mundo de internet, y en concreto dentro del mundo CSS3. ¿Quieren crear grandes degradados para sus trabajos? Pues echemos un vistazo. En realidad, la herramienta de la que les estamos hablando es CSS3 Gradient Generator, un generador de degradados para web, con lo que podrían apostar por un montón de opciones para aplicar al diseño mejorando en muchos casos la interfaz de una manera interesante, y sobre todo adaptándola a su imagen corporativa, lo cuál es más que interesante para conseguir mayor notoriedad. A continuación les vamos a dejar ...

Hoy en  Diario THC les traemos una aplicación que les va a permitir crear un efecto de texto en curva en CSS3. Estamos hablando de la herramienta CSSWarp la cual simplemente nos presenta un panel en el navegador en el que introducir el texto y cambiar la curva según nos interesa. Como ven en la imagen inferior, hay 4 controles en los que hacer que el texto se convierta en lo que nosotros queramos. Por un lado el texto que queremos introducir junto con la tipografía, de la cual hay una gran variedad de modelos entre los que elegir. Luego tiene el tipo de curva al que elegir y el punto de inflexión en el que el texto sube y baja. A mi me parece un buen modo de conseguir un efecto de texto deseado, de manera sencilla y sin necesidad de grandes herramientas gráficas. Y sobre todo, gratis Más info | wwwhat´s ...

Blogger tiene una actividad “frenética” en los últimos tiempos y nos está brindando poco a poco novedades y anuncios de nuevas características muy interesantes para el futuro próximo de la plataforma de blogging de Google. Hace poco realizaron una esperanzadora preview de las principales mejoras del servicio para 2011 y recientemente añadieron la posibilidad de suscripción por email. Ahora se desvelan cinco nuevas plantillas dinámicas para Blogger. Las nuevas plantillas, que estarán dentro de poco tiempo disponibles para todos los usuarios y con la posibilidad de personalización,  hacen uso de las últimas tecnologías como AJAX (aquí lo de “últimas tecnologías” puede sonar un poco a tomadura de pelo pero son palabras textuales de Google) y estándares web (HTML5 y CSS3). Al margen de la discusión sobre si a estas alturas AJAX es una tecnología novedosa en si misma (para Blogger sí lo es), estos nuevos diseños ofrecen un mayor nivel de interactividad, ...

Más de un año ha pasado desde la última gran actualización del navegador de la Fundación Mozilla. Durante este tiempo la competencia se ha hecho extrema y el crecimiento en la base de usuarios de Firefox se ha estancado. Todo gracias a que los navegadores rivales han sabido ofrecer alternativas y se han esforzado en dar lo que el usuario quiere: mayor compatibilidad con los estándares web emergentes como HTML5 y sus tecnologías asociadas, un interfaz minimalista que priorice el contenido sobre el navegador, un consumo de recursos controlado y velocidad. Se puede decir que todos y cada uno de estos puntos han sido cubiertos de forma extraordinaria con Firefox 4. El nuevo interfaz se basa absolutamente en las pestañas y hasta permite definir cuales quiere el usuario que permanezcan siempre abiertas para los servicios web que usa de forma regular. No es nuevo, ya habíamos visto esta filosofía en Opera o ...

Bajo el título de página “Beauty of the Web” Microsoft está presentado el nuevo Internet Explorer 9, a través de una beta, ya disponible para descargar. Normalmente suelo usar otros navegadores para el uso de internet, como Firefox, ya que actualiza mejor el código CSS, por los addons y por otras razones. En cualquier caso ya se puede probar esta nueva versión. Entre sus características principales, se menciona el uso de aceleración por hardware, según Microsoft los navegadores aprovechan tan solo un 10% de las capacidades del procesador del equipo. Con este nuevo navegador podrás mejorar el rendimiento utilizando más el procesador. Dispone de una nueva Interfaz de usuario que brilla y que permite una navegación mucho más rápida. Además se añaden otras características como accesos directos a tus páginas más visitadas, se ha implementado Aero Snap de Windows 7 en el mismo navegador, así como nueva funcionalidad cuando pasas el ratón por ...

CSS3 Menu es una aplicación online gratuita para crear tu propia barra de menús dinámica completamente en CSS3 y además sin utilizar para ello nada de Javascript. Puedes elegir desde la página de este proyecto el diseño que quieres, dispone de estilo Android, Mac y Apple, con variaciones en colores y estilos. Luego puedes visualizar el resultado y descargar el código para tu página, así de sencillo. Además está disponible para Windows y para Mac. Los menús se generan con una estructura de listas en Html y se pueden implementar en horizontal o vertical, con submenús múltiples. Como decimos puedes previsualizar el menú generado, depués de que elijas tu estilo propio y luego descargar el código, listo para usar en tu página web. Puedes ver este ejemplo con estilo Mac o acceder directamente a la página de CSS3 Menu para elegir tu propio diseño. Página web CSS3 ...

Si necesitas una buena recopilación de temas WordPress gratuitos y estás pensando en hacer un nuevo blog o página web pásate por topwpthemes vas a encontrar gran cantidad de temas. Además a través de esta página ya se está experimentando con diseños en HTML5 y CSS3 si exploras entre sus proyectos, verás fantásticos efectos en HTML5 y Javascript. Además cuentan con elementos para agregar fácilmente bloques Adsense o a través de Banners de publicidad que son muy populares ahora en algunos sitios. Estos temas están muy bien organizados, además puedes ver rapidamente una Preview para ver sus características y como decimos si te pasas por esta página te recomendamos que veas varios diseños porque emplean fantásticos recursos en Javascript para tratarse de Temas gratuitos. También en HTML5 y con nuevas propiedades en CSS3. Puedes acceder a través de la página de ...

HTML5Rocks es un recurso online de Google que comparte regularmente varios proyectos en Html5 y en Css3. Además añade tutoriales detallados con video en html5 o utilizando @web-fonts. A través de una interfaz realizada en Javascript y con propiedades en CSS3 y Html5 te trae código para que lo visualices de inmediato. También con HTML5Studio con lo que te trae los últimos proyectos como flip de imágenes, video player, carrusel de imágenes, geolocalización y otros proyectos de tipo open source. Además de servirte de inspiración puedes atreverte a implementar estos códigos en tu web. Puedes acceder a todos estos recursos a través de la página del proyecto de HTML5Rocks desde la que puedes navegar y visualizar el contenido con el código implementado en ellas. Página proyecto ...

Siguiendo con las nuevas propiedades que nos aporta CSS3 hemos visto en css3.info una nueva funcionalidad que aporta mucho dinamismo a las cajas de texto o textareas, usadas a día de hoy para Formularios, Comentarios en WordPress, páginas de contacto y para páginas de empresa. Hablamos de la propiedad resize de CSS3, con la que vas a poder redimensionar una caja de texto dinámicamente (por parte del usuario). Esta funcionalidad antes implementada en Javascript dispone de su homólogo en CSS3 y como decimos es muy dinámico, ideal para una plantilla de comentarios en el que el usuario puede agrandar la caja a su antojo. El codigo en CSS para esta propiedad: [php]div.resize { width: 100px; height: 100px; border: 1px solid; resize: both; overflow: auto; }[/php] El Ejemplo de Resize en CSS3: Gracias a ...

Una de las nuevas funciones disponibles con CSS3 es box-shadow por la que puedes añadir sobre a las cajas de texto o contenedores con CSS. Esta función ya está añadida en Safari 3 y Firefox 3.1 por lo que la puedes incluir en tus diseños sin problema. Esta propiedad toma 2 valores de largo y un color. box-shadow toma 3 propiedades: offset horizontal: el valor positivo significará que la sombra se situará a la derecha del elemento y una valor negativo a la izquierda del mismo. offset vertical: que tomará un valor negativo para colocar la sombra por encima del elemento y un calor positivo por debajo del mimo. blur radios: este parámetro con valor 0 cojerá la máxima definición para la sobra y conforme subamos en número ofrecerá un aspecto más difuminado. Ahora vamos a ver un ejemplo de uso: (tras el salto) [html] Esto es un ejemplo de box-shadow… [/html] Fuente ...

PIE, Progressive Internet Explorer es un archivo .htc que le dará la opción a versiones de Internet Explorer 6-8 de reconocer y visualizar un buen número de propiedades en CSS3. A la hora de estilar no requiere que realices cambios drásticos en el Codigo CSS. Además no requiere de menciones a vendedores del estilo:  border-radius -moz-border-radius, (como es el caso de navegadores Firefox) Simplemente tendrás que enlazar con un adjunto en el Código CSS de la siguiente manera: [html]behavior: url(PIE.htc);[/html] y habilitará parcialmente todas las propiedades CSS3 como: border-radius box-shadow border-image multiple background images linear-gradient as background image Fuente ...

Desde dzinepress nos llega esta recopilación de Tutoriales, un buen material para diseñadores que te puede ayudar a simplificar tu trabajo. Son Tutoriales al detalle para redondear contenedores, botones con CSS3 y RGBA, Hojas de estilo en Cascada. También otros para aplicar borde a las imágenes con estilo en CSS3, Colores en CSS3,Bordes con gradiente. Puedes echar un vistazo ya que es una gran recopilación que debes tener a mano en cualquier momento para maquetar un Sitio. Perfecto para diseñadores. Cajas con esquinas redondeadas en CSS3 Super Botones con Css3 y RGBA Hojas de estilo en cascada Nuevos selectores introducidos en Css3 Border-image: Usando imágenes para tu borde Enlace | 50 Tutoriales en ...