Posts etiquetados ‘CSS3’

EnjoyCSS, Generador Avanzado de Código CSS3 Online y Gratis

enjoycss

EnjoyCSS” es un generador de código CSS3 disponible Online, y el cual podremos usar de forma gratuita.

El editor nos proporciona una interface bastante intuitiva, con la cual podremos crear o aplicar estilo a texto, botones, fondos, transiciones, transformaciones, cajas, sombras, etc. Por medio del menú lateral podremos aplicar los estilos a los elementos deseados, así como ajustar sus atributos de una forma bastante sencilla. Una ves tenemos el elemento como lo deseamos, podremos guardarlo y obtener el código CSS, LESS o SCSS, para ser usado directamente en nuestros proyectos Web.

EnjoyCSS además nos proporciona una galería con elementos y estilos ya creados, los cuales a su ves podremos modificar para ajustar a nuestras necesidades y obtener el código CSS.

Sin duda un excelente proyecto, que nos ahorrará tiempo al momento de crear o dar estilos CSS a los elementos en nuestros proyectos Web.

Enlace
sitio oficial EnjoyCSS

Proyecto de la guía practica de Desarrollo Web Frontend

todo-list

Para aprender HTML5, CSS3 y Javascript lo mejor es realizar un proyecto practico, por eso miramos varias alternativas y ahora hemos elegido hacer una “Lista de tareas” o lo que se conoce en ingles como “ToDo list“, en la imagen superior podremos ver las diferentes partes que conforman la página que desarrollaremos, en la cual practicaremos temas muy frescos como es el responsive design, los Web Fonts o alineación, así también veremos como lograr el diseño, la estructura y funcionalidad con lo más reciente de HTML5 + CSS3 + Javascript.

Sino sabes de que se trata la guía te invito a que leas la presentación.

Si ya sabes de que se trata, te invitamos a que estés atento a la primera parte de la guía que esperamos sea de tu interés y por supuesto te ayude a ser un verdadero ninja del desarrollo Web Frontend.

Tendremos imágenes y lo necesario disponible de una fuente profesional que nos ayudará en el curso, para la primera parte de nuestra guía.

Curso: Guía practica de Desarrollo Web Frontend

guia-desarrollo-web

Desde “LoqueNecesita” queremos desarrollar una serie de artículos enfocados al desarrollo Web frontend, estos artículos se crearán en un orden especifico a la ves que vamos realizando practicas con determinado proyecto.

La idea es tratar temas acerca de HTML5, CSS3 y Javascript, veremos temas puntuales con relación a la nueva tecnología de HTML5, así como detalles y herramientas de CSS3, que nos ayudarán a lograr cosas muy comunes, como el centrado de texto tanto horizontal como vertical, alineación, sombras, curvas, fuentes, responsive design, etc. Así también queremos profundizar un poco en la programación con Javascript y como contribuye este a las grandes mejoras de la nueva Web, así también echaremos un vistazo a librerías del lenguaje muy comunes que nos pueden ayudar muchísimo.

La idea es ir desarrollando la guía practica entorno a un proyecto frontend, que anunciaremos en la primera parte, pero también están invitados a proponer un proyecto para desarrollar la guía practica. A medida que vamos avanzando, tal vez tengas mejores soluciones a implementaciones que queremos hacer, en tal caso te invitamos a que escribas tus soluciones al igual que tus comentarios y consultas, en los comentarios del articulo o en Facebook o Twitter, así estas también estarán dentro de la guía final que construiremos entre todos, por esto su participación es muy importante.

Al final unificaremos los artículos, los comentarios que contribuyen con soluciones, dudas o aportes, y así tendremos una guía de desarrollo web frontend lista para su descarga, que te servirá de referencia para el desarrollo de tus futuros proyecto, obviamente su código fuente estará disponible.

¿Te animas a aprender y aportar, en esta guía de desarrollo web frontend?

Si tu respuesta es afirmativa, compártelo con tus amigos en las redes sociales, y si quieres propone un proyecto que te gustaría desarrollar a medida que hacemos la guía.

Create CSS3, generador de CSS3

create-css3

Navegando la Web me encuentro esta interesante aplicación llamada “Create CSS3“, la cual nos permite generar código CSS3 de forma muy sencilla.

Nos proporciona una lista de propiedades en la parte izquierda de la página, de las cuales podremos agregar y editar sus valores de forma muy simple, a medida que realizamos las ediciones, podremos ir viendo el resultado en la parte de abajo de la aplicación. En la parte superior veremos el código que se genera, el cual podremos copiar fácilmente a nuestras aplicaciones.

Podremos usar fuentes, sombras, bordes, transformaciones, opacidad, columnas, entre otras opciones; no solo ideal para acortar desarrollos, sino también para entender mejor el funcionamiento de CSS3.

[Tal ves te interesa: extractCSS, extrae el CSS de cualquier documento HTML]

Enlace:
Create CSS3 (Sitio oficial)

HTML KickStart: Recursos de HTML5, CSS3 y Javascript

HTML KickStart

“HTML KickStart” es un conjunto bastante liviano de archivos, patrones y elementos en HTML5, CSS y jQuery (Javascript), diseñado para ayudarnos ahorrándonos tiempo, gracias a las etiquetas, menús, tipografías, galerías de imágenes, botones, formularios, listas, iconos, entre otros, que pueden ser descargado gratuitamente para basar nuestros desarrollos en su código, además son compatibles con tus navegadores favoritos.

Así que si diseñas o desarrollas sitios o aplicativos Web, te invitamos a que le heches un vistazo a HTML KickStart, sin duda te ayudará.

Enlace:
99Lime

Adobe edge: Herramienta de Adobe para crear animaciones en HTML5, CSS3 y Javascript

“Adobe edge” es la nueva herramienta de Adobe para desarrollar aplicaciones Web en HTML5, CSS3 y Javascript de forma sencilla, tal como nos tiene acostumbrados la compañía detras de Flash.

La nueva herramienta no reemplazará a Flash ya que como dicen sus creadores, hay funciones que aun no se pueden simularse.

De momento se pueden hacer solo animaciones Web, aunque se pretende ampliar para desarrollar juegos.

Adobe edge esta disponible para PC y Mac, en su versión de prueba, lo puedes descargar y probar desde aquí.

Después del salto puedes ver algunos vídeos con los primeros tutoriales de la herramienta.

Leer el resto de la entrada »

CSS3 Menu te permite crear un menú para tu sitio web, en unos cuantos pasos

CSS3CSS3 Menú es una herramienta gratuita, que te permite crear un menú desplegable para tu sitio web, de una forma fácil y rápida.

El menú se crea en unos cuantos pasos: Primero que todo se crea el menú, luego seleccionamos el template, ajustamos la apariencia del menú, guardamos el proyecto y por último pegamos el código HTML en nuestra web.

Esta aplicación que está disponible para Mac y Windows, no utiliza imágenes ni Javascript para crear el menú. Funciona con Firefox, Opera, Chrome y Safari, además trabaja en navegadores que no soportan CSS3 como IE7+, aunque en este caso los bordes redondeados y las sombras no se muestran.

Para acceder a la aplicación y empezar a usarla, puedes ir a CSS3 Menu.

Vía: Adictosalared

52framework: Framework de HTML5 y CSS3

52framework52framework es un framework que pretende facilitar el trabajo con las tecnologías recientes de HTML5 y CSS3, el punto que llama mucho la atención es que sus creadores quieren que sea colaborativo, es decir que si tu sabes de HTML, CSS o eres buen escritor puedes contribuir de una u otra forma al proyecto.

52framework permite crear de forma fácil esquinas redondeadas, texto con sombra, cajas con sombra, marco HTML5, sistemas de grilla, CSS reset, y muchas cosas más. Puedes ver aquí un demo.

Por estos días se crea un debate en torno a la aparición de HTML5, hay quienes apuntan a que podría ser un reemplazo para Flash, desde mi humilde opinión pienso que puede ser una dura competencia pero de momento es un poco duro destronar a Flash, ya que muchas personas aman a Flash por su facilidad de manejo, ya que puedes lograr algo bueno sin necesidad de programar, pero claro si quieres algo mejor igualmente debes sumergirte en el mundo de la programación con ActionScript. Hay quienes no quieren mucho a Flash principalmente por sus bugs, pero si estos son corregidos pienso que permanecerá por lo menos unos cuantos años más en su posición.

Enlace: 52framework (Sitio oficial)

Descarga: Librería 52framework