En los mundos que corren ahora mismo, sabemos que las aplicaciones se han vuelto más que necesarias, tanto para el mundo web como para el offline. Y aunque los diseñadores por norma no conocemos el código de programación, les puedo decir que hay alternativas que no lo requieren y nos ayudan a crear, o bien accesos directos a nuestras webs, o bien aplicaciones interesantes para llamar la atención de los visitantes, clientes o incluso para trabajos empresariales, las cuales empiezan a estar muy demandadas. Y ya dejándome de rollos míos y suyos, paso a presentarles la aplicación que les va a permitir precisamente crear apps sin tener ni idea de código, y que al estar desarrolladas en HTML5 son compatibles con todos los sistemas operativos móviles. Se llama Apps Builder, y simplemente tendrán que arrastrar cuales son las funciones que les van a añadir y luego elegir la configuración de diseño ...

Si estás buscando una buena plantilla para comenzar a desarrollar tu tienda en internet, quizás te interese echar un vistazo a estas plantillas. Se trata de una pequeña recopilación de temas que podrás implementar en WordPress, Joomla, Drupal y que además son gratuitas. iPhone App (Descargar) Shop Around (Demo | Descargar) Ikonik (Demo | Descargar) Speed Racing (Demo | Descargar) PinkShop (Demo | Descargar) Book Store (Demo | Descargar) Visto en ...

Si ayer os mostramos un tema para wordpress sencillo hoy vamos a ver una plantilla CSS/XHtml con un aspecto más profesional. Se trata de RIGHTdirection de chocotemplates que se puede utilizar para desarrollar una página de empresa, portfolio de trabajos o para mostrar un producto en internet. El diseño de esta plantilla se puede implementar en CMS como WordPress, Joomla, Drupal. Se proporcionan archivos necesarios en PSD, XHtml y CSS para hacerlo. Dispone de un área para productos destacada desarrollada en Javascript con un diseño en PSD como de vaquero. Por lo demás se trata de un sencillo diseño pero que causará un buen impacto visual a tus visitantes. RIGHTdirection tiene una licencia especial por la que puedes utilizar esta plantilla de forma gratuita si enlazas con chocotemplates. También tiene otra versión extendida que incluye el archivo PSD del Layout para poder editar cada elemento además de que podrás quitar el enlace al ...

Como podéis ver últimamente se proporcionan multitud de herramientas online a base de proyectos, que te ayudan a diseñar o construir un sitio web. En este caso pongamos el caso de querer construir una hoja de estilos propia, para una intranet, para una página de empresa o sitio en internet. Para ello cuentas con Instant CSS Code, una fantástica aplicación web que te permitirá hacerlo. Además tendrá el formato valid HTML/xHTML y podrás generarlo según tus preferencias en pocos pasos. Los pasos a seguir según su desarrollador son los siguientes: Introduce el nombre de tu proyecto. Selecciona las opciones. Introduce etiquetas de Identificadores. Enviar. …. Instant CSS Code hace el resto. Parece fácil y realmente lo es. Personalmente me guardo el enlace. Muchas veces no se trata de saber realizar una tarea sino de automatizar el proceso. Para ello Instant CSS Code es perfecto. Puedes acceder a la página del proyecto Instant CSS ...

La plantilla web que os queremos mostrar hoy, SugarCoated, de chocotemplates, con un diseño web al estilo de los blogs más actuales tiene un diseño final bastante bueno, además se puede orientar para ofrecer servicios web, como porfolios de diseñadores pero también como página de servicios profesionales. Además la puedes implementar fácilmente a otras plataformas como WordPress, Joomla, Drupal… Se administra un archivo PSD con el que poder trabajar, como cada tema de chocotemplates. Hemos elegido esta plantilla porque nos ha parecido de un diseño final bastante bueno, aunque puedes acceder a múltiples plantillas, también gratuitas sobre las que podrás trabajar. SugarCoated además cuenta con múltiples diseños de plantillas diferentes, para distintos tipos o esquemas de página, Home, Blog, página de contacto, portfolio, productos, que puedes adaptar según las necesidades de tu proyecto. Demo SugarCoated Descargar SugarCoated Galería plantillas ...

Toucan Css Reset es un framework en CSS que te permitirá minimizar las diferencias de renderizado de objetos entre los diferentes navegadores web y realizará un reset en código Css para mostrar esta compatibilidad. Además recompondrá con las nuevas reglas genéricas para tipografía, cabeceras, listas, formularios, tablas… para que sean compatibles con cualquier navegador y tu página se visualice de igual forma en los distintos navegadores. Toucan Css Reset se trata de un ligero framework, tan solo pesa 2,5 kb comprimido y realmente es fácil de enteder lo que hace. Lo puedes utilizar y aplicar a tus propios trabajos y beneficiarte de la compatibilidad que te proporcionará en todas tus páginas web. Dispones de una Demo, para probar el código con cada elemento en diferentes navegadores y comprobar tu mismo la compatibilidad que ofrece. Perfecto para el diseño ya creado en tus páginas web. Demo Toucan Css Reset Código Toucan Css Reset Introducción y forma de ...

En el Área Innovación habrá esta tarde una charla de “HTML 5” por Jose Manuel Cantera. Acutalizaremos en este artículo toda la información relativa al mismo. También podéis ver el streaming en la web de Campus Party TV . Estaros atentos…  - En los primeros minutos hemos estado viendo la historia del HTML, desde sus inicios hasta el día de hoy, HTML 5. - Hemos estado viendo los estilos de diseño que lleva HTML 5, tales como elemento content, video, imagen, pie de página, etc. - Anteriormente, el lenguaje de codificación de HTML era puro text/html, mientras que por el contrario ahora en HTML5 cambia la serialización a application/xhtml+xml o application/xml. - Algunas de las diferencias entre XHTML vs HTML en cuanto a etiquetas tales como rel=”stylesheet”, span, etc. que en HTML5 mejoran con diferencia. También algunas de las nuevas mejoras son los atributos globales que implementa HTML5 (ejemplo: @style, @title, @role, @draggable, etc.). - Surgen nuevos ...

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 ...

Si eres usuario de Apple agradecerás la velocidad de navegación en Safari. Hace pocos días se actualizó a su versión 5 ofreciendo compatibilidad con extensiones. Esto como de costumbre era demandado de hacía tiempo por sus usuarios, en los que me incluyo y por cierto agradezco esta posibilidad ya que añade mucha funcionalidad al navegador de Apple, así como lo hace Firefox en Windows. A través de appstorm que hacen recopilaciones de aplicaciones estupendas hemos visto 30 extensiones para Safari que le dan mucha versatilidad a Safari en Apple. Para instalar extensiones debes activar el menú de Desarrollo en Safari, después desde el menu desarrollo > activar extensiones y ahora te aparecerá una nueva opción en preferencias de Safari por la que sólo tendrás que arrastrar la extensión a la ventana. ZooTool Lasso Añade esta extensión para recopilar imágenes, vídeos y documentos en internet de forma rápida a través de un simple botón en ...

WordPress es una de las plataformas por excelencia en el mundo de los Blogs en internet. También permite crear plantillas para página web más completas, en las que mostrar información a través de aplicativos Web. Existen herramientas online para creación de plantillas directamente desde internet. Si necesitas de una plantilla simple para después poder editarla o algo sencillo para crear tu propio blog o página web te recomendamos que pruebes templatr. Actualmente se encuentra en fase beta pero ya permite configurar plantillas web completas online. Se puede ir configurando cada parte de la plantilla, como el header o cabecera, footer o pié de página, index o página principal para conseguir un estilo propio. De esta forma aplicarás a cada sección o módulo el estilo Css que quieras, podrás añadir color, fuentes, color de fondo, imágenes, cada elemento en Css de forma sencilla. Además te permite elegir el formato o layout de la ...

Un thumbnail en Html es una imagen que se muestra miniaturizada para que se carga en la página web sea más rápida. También se puede utilizar para mostrar galerías de fotos con lo que no mostramos el tamaño real de la imagen y así podemos mostrar un mayor número en menos dimensiones. Para crear un thumbnail lo podemos hacer mediante código Css y también con el propio Html. Codigo Html Es la forma más sencilla de realizar ya que se puede hacer con una sola línea de código. [html] [/html] Codigo Css En Css también es sencillo de utilizar [html] .thumbnail ...

Google Font Library es un nuevo servicio de Google por el que nos permitirá darle forma a nuestro Sitio Web. Puedes elegir entre tipos de letra alojadas en servidores de Google y utilizarla para tu Sitio Web. Como están alojadas en internet la carga de las fuentes será rápida, además de segura. Se trata de una nueva herramienta online con la que podemos contar para Diseño de páginas web. A través de  Google Font Directory podrás ver los tipos de letra que Google Propone para tu página web, además de en sus variantes, normal, negrita, italica… Para utilizarla primero la cargaremos a través de un tag link para más tarde utilizarla como una fuente estándar en nuestra página. (sigue leyendo para ver como ...

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 ...