CSS es un lenguaje de diseño gráfico que permite definir y crear la presentación de un documento estructurado escrito en un lenguaje de marcado.
Es muy usado para establecer el diseño visual de los documentos web e interfaces de usuario escritas en HTML.
La web de hoy es casi irreconocible desde los primeros días de las páginas blancas con listas de enlaces azules.
Ahora, los sitios están diseñados con diseños complejos, fuentes únicas y esquemas de color personalizados. Este curso le mostrará los conceptos básicos de las hojas de estilo en cascada (CSS3).
El énfasis estará en aprender cómo escribir reglas CSS, cómo probar el código y cómo establecer buenos hábitos de programación.
Cuando se hace correctamente, el estilo de una página web puede mejorar su página. Cuando se hace incorrectamente, el resultado puede ser peor que ningún estilo.
Para asegurarse de que sus sitios no impongan barreras para las personas con discapacidades cognitivas y/o físicas, aprenderá a evaluar las páginas utilizando las pautas de accesibilidad POUR estandarizadas.
Al finalizar el curso, los alumnos podrán esbozar un diseño para una página HTML determinada. Usando ese diseño, usarán CSS para implementar el diseño agregando fuentes, colores y diseños.
Este es el segundo curso de la especialización Web Design For Everybody. Los cursos posteriores se centran en agregar interacción con JavaScript y mejorar el estilo con un diseño receptivo.
Será difícil completar este curso si no tiene acceso a una computadora portátil o de escritorio para la tarea.
Lo que aprenderás:
- Semana uno: Comenzando con el estilo simple
- ¡Bienvenido a Introducción a CSS3! En este curso aprenderá cómo diseñar sus páginas aprovechando el poder de CSS3.
Nos centraremos tanto en la sintaxis adecuada (cómo escribir sus reglas de estilo) como en la importancia del diseño de accesibilidad (asegurándose de que su estilo mejore su sitio, no que dificulte la navegación).
Es muy importante que esté listo para cometer errores y errores tipográficos en este curso. La única forma en que realmente comprenderá el material es practicar escribirlo por su cuenta con la mayor frecuencia posible.
- Segunda semana: estilo avanzado
- Los colores y las fuentes son solo el comienzo para diseñar su página. Lo bueno de comenzar con estas propiedades es que, por lo general, son muy sencillas de implementar.
Eliges un color y boom: resultados instantáneos y esperados. Esta semana pasamos a nuevas propiedades que tienden a requerir un poco de ajuste para obtener los resultados deseados.
En particular hablaremos sobre el Box Model, imágenes de fondo, opacidad, float, columnas, visibilidad y diseño para diferentes navegadores.
- Semana Tres: Psuedo-clases, Pseudo-elementos, Transiciones y Posicionamiento
- ¿Alguna vez has notado en una página web que algunos enlaces son azules y otros son morados, dependiendo de si has hecho clic en los enlaces? ¿Cómo es posible diseñar algunas etiquetas de anclaje y otras no?.
Esta semana aprenderá a diseñar pseudoclases (por ejemplo, un enlace que ha estado visitando, un elemento que tiene el mouse sobre él) y pseudoelementos (por ejemplo, la primera letra de un encabezado, la primera línea de un párrafo ).
Estos elementos no son difíciles de diseñar, pero requieren una codificación cuidadosa. También es el primer paso para agregar una animación simple a su sitio.
Terminamos esta semana con el tema del posicionamiento: cómo lograr que los elementos se adhieran a una determinada parte de su página.
Piense en los molestos anuncios emergentes. ¿Cómo logran los programadores que permanezcan JUSTO EN EL MEDIO DE LA PANTALLA a pesar de que sigues tratando de alejarlos?
- Semana cuatro: poner todo junto
- Esta semana voy a hacer una revisión de código. Le mostraré cómo usé pseudoclases y pseudoelementos para diseñar una tabla.
Luego le doy una demostración de tres barras de navegación diferentes que utilizan diferentes opciones de estilo.
Querremos dar un paso atrás y hablar sobre cómo estas diferentes opciones pueden afectar la accesibilidad de nuestro sitio.
El paso final para completar este curso es completar el proyecto calificado por pares. Tendrá la oportunidad de demostrar la capacidad de seguir las pautas de estilo mientras le da su toque personal al proyecto.
Solo recuerde, necesita validar su trabajo para una sintaxis y accesibilidad adecuadas.
- ¿A dónde ir desde aquí?
- Si desea hacer más ahora que ha terminado este curso, tengo algunas recomendaciones.
Lo más importante es que continúes practicando tus habilidades y siempre tengas “algo” en lo que estés trabajando.
¿Cómo obtengo el curso?
Este curso es ofrecido desde la plataforma de Coursera, es un curso que puedes obtener de manera gratuita bajo ciertas condiciones.
La primera opción es elegir la opción de “Curso gratuito sin certificado”, de esta manera podrás acceder al contenido del curso y finalizarlo, pero no podrás obtener un certificado de finalización avalado por la plataforma.
La segunda opción es elegir “auditar curso”, con esta opción podrás acceder al contenido de video del curso, pero no podrás realizar los exámenes ni obtener el certificado de finalización. Si no ves la opción de auditar curso, debes verificar en la parte de abajo usando el scroll (en forma de link).
Las opciones varían dependiendo el curso, pero con cualquiera de las dos podrás acceder gratuitamente al contenido. Por si fuera poco, algunos cursos tienen la opción de ayuda económica, con los cuales puedes solicitar dicho apoyo y ser acreedor de un curso de pago.
Para obtener el curso de manera gratuita da clic en el siguiente botón: