CSS Fundamentos: diseño y presentación de sitios web

Aprende a crear y aplicar estilos CSS para definir la presentación de tus páginas web (fuentes, colores, posición, etc)
4.7 (5 ratings) Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
243 students enrolled
Instructed by Marlon Ceballos Design / Web Design
$19
$30
37% off
Take This Course
  • Lectures 56
  • Length 4.5 hours
  • Skill Level Beginner Level
  • Languages Spanish
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works

Discover

Find online courses made by experts from around the world.

Learn

Take your courses with you and learn anywhere, anytime.

Master

Learn and practice real-world skills and achieve your goals.

About This Course

Published 1/2014 Spanish

Course Description

Ya sabes estructurar archivos HMTL? Ahora aprende a aplicar la apariencia gráfica modificando propiedades como tamaños, colores, fuentes, posición, etc.

En éste curso grabado por un "Adobe Certified Instructor - Web Master" aprenderás a usar correctamente la sintaxis de CSS para aplicar la capa de presentación a tus sitios web usando mejores prácticas que mejoren las características visuales e incluso el desempeño y velocidad.

El contenido de este curso inicia con la explicación de los fundamentos de CSS, su correcta sintaxis y uso para formatear cajas, texto, color, etc. y finaliza con un taller 100% práctico donde verás cómo aplicar la capa de presentación a a una estructura HTML.

Iniciaremos el curso trabajando con Adobe Edge Code, posteriormente usaremos Brackets y finalizaremos trabajando con Adobe Dreamweaver, sin embargo tu puedes seguir los ejercicios del curso con el editor de código que prefieras mediante los mismos archivos que uso en los diferentes ejercicios y que tu podrás descargar.

Este curso también sirve para las personas que deseen formatear o editar eBooks en formato ePub.

Si deseas contratar este u otro curso para un grupo empresarial o universidad de forma presencial u online puedes contactarme al email marceb[at]gmail[dot]com

What are the requirements?

  • Conocimientos básicos de HTML
  • Cualquier editor de código (Dreamweaver, Brackets, Coda, Sublime text, etc)

What am I going to get from this course?

  • Entender las características del lenguaje CSS
  • Conocer la sintaxis del lenguaje CSS
  • Usar de forma eficiente los selectores CSS

What is the target audience?

  • Diseñadores gráficos
  • Diseñadores web
  • Diseñadores y maquetadores de eBooks
  • Personas que quieran ingresar al apasionante mundo del diseño web

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.

Curriculum

Section 1: Introducción
01:15

Bienvenida y breve explicación del curso

01:50

En este video veremos el uso de los archivos de ejemplo que hacen parte del curso

Section 2: Conceptos fundamentales de CSS
03:57

En este video conoceremos qué es CSS y cuál es su función

04:29

En este video conoceremos las principales características del lenguaje CSS

05:21

En este video entenderás el concepto de herencia

03:31

En este video entenderás las diferencias de renderizado entre los diferentes navegadores web

05:57

En este video conocerás las diferentes ubicaciones donde puedes escribir las reglas CSS

06:51

En este video verás de forma práctica cómo escribir reglas CSS en las diferentes ubicaciones posibles

02:45

En este video conocerás la correcta sintaxis de CSS

01:57

En este video conocerás diferentes editores de código que puedes usar para trabajar con CSS

Section 3: Selectores CSS
05:07

En este video conocerás qué son los selectores y para qué los debemos usar

06:07

En este video aprenderás a usar los selectores de tipo Element, Tag o Etiqueta

05:26

En este video aprenderás a usar los selectores de tipo Class o Clase

04:19

En este video aprenderás a usar los selectores de tipo ID

02:49

En este video conocerás otros selectores que también necesitarás usar

03:45

En este video aprenderás a usar los selectores de tipo Descended o Compound

02:44

En este video aprenderás a especificar los selectores para identificar más fácilmente los elementos a formatear

01:40

En este video aprenderás a agrupar selectores para optimizar el código CSS

02:44

En este video conocerás importantes recomendaciones para nombres de selectores y recomendaciones generales

Section 4: Box model o Modelo de caja en CSS
02:51

En este video entenderás el modelo de caja y los elementos que la componen

08:40

En este video aprenderás a trabajar con las propiedades width y height para modificar el tamaño de divs

06:02

En este video aprenderás a calcular los tamaños de los elemento como la suma de diferentes propiedades del modelo de caja

08:09

En este video conocerás y aprenderás a usar las sintaxis para el padding y margin tanto en modo extendida como en modo abreviada

04:07

En este video conocerás y aprenderás a usar las sintaxis para agregar bordes y contornos tanto en modo extendida como en modo abreviada

08:04

En este video conocerás y aprenderás a usar las sintaxis para agregar fondos o backgrounds tanto en modo extendida como en modo abreviada

Section 5: Layouts o estructuras básicas
04:27

En este video conocerás los posibles valores de la propiedad position para modificar la posición de un elemento

08:28

En este video veremos de forma práctica el uso de la propiedad position y sus diferentes valores

05:27

En este video conocerás el uso de la propiedad z-index para editar el orden de apilamiento por defecto de los elementos html

05:18

En este video conocerás el uso de la propiedad clear para evitar que elementos flotantes se superpongan a otros elementos

03:52

En este video conocerás el uso de los valores relative y absolute para posicionar un elemento respecto a su contenedor

12:38

En este video realizaremos varios ejemplos prácticos de layouts o estructuras de páginas htm

03:40

En este video aprenderás a usar la propiedad overflow para solucionar un típico inconveniente con elementos flotantes

Section 6: Dar formato al texto con CSS
05:26

En este video conocerás la sintaxis de las principales propiedades CSS para formatear texto

07:08

En este video aprenderás a definir fuentes y tamaños de fuentes con CSS

06:51

En este video conocerás y aprenderás a usar otras propiedades CSS para formatear texto

03:11

En este video aprenderás a usar la sintaxis la sintaxis acortada o shothand notation con la propiedad font de CSS para formatear texto

03:39

En este video conocerás y aprenderás a usar más propiedades CSS para formatear texto

Section 7: Trabajar con color
02:05

En este video conocerás las propiedades para trabajar con color en CSS así como la notación de Keywords

02:23

En este video conocerás la notación Hexadecimal para usar color en CSS

04:37

En este video aprenderás a usar de forma práctica las propiedades CSS para color así como la notación Hexadecimal

02:04

En este video conocerás la notación RGB para usar color en CSS

04:11

En este video aprenderás a usar de forma práctica las notaciones de color Keywords y RGB en CSS

03:24

En este video conocerás herramientas y aplicaciones que te pueden facilitar el trabajo con color en CSS

Section 8: Taller práctico
02:07

En este video explicaremos el taller que vamos a realizar en este capítulo final del curso de CSS

04:32

En este video conoceremos la interfaz de Dreamweaver y definiremos un nuevo sitio web

07:13

En este video crearemos y enlazaremos hojas de estilo usando diferentes técnicas

03:07

En este video crearemos las reglas CSS body

04:17

En este video crearemos la regla #contenedor para modificar sus propiedades

03:39

En este video iniciamos a agregar formato a los elementos que hacen parte del contenido

03:58

En este video finalizamos el formato de los elementos que hacen parte del contenido

05:31

En este video agregamos formato a los elementos que hacen parte del lateral

05:13

En este video agregamos formato a los elementos que hacen parte del footer

11:02

En este video agregamos formato a los elementos que hacen parte del menú de navegación

05:37

En este video realizaremos un ajuste final a la página de promociones y crearemos y enlazaremos la hoja de estilos para el formulario de contacto

06:37

En este video agregaremos el formato al formulario de contacto

Section 9: Finalización
01:00

Despedida del curso CSS - Fundamentos

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

Marlon Ceballos, Adobe Community Professional y Adobe Certified Instructor

Consultor en tecnologías y aplicaciones Adobe para multimedia, web y publicaciones digitales con más de 20 años de experiencia asesorando empresas latinoamericanas que van desde diarios e imprentas hasta agencias interactivas.

Adobe Community Professional, Adobe Certified Expert y Adobe Certified Instructor en las últimas versiones de Photoshop, Lightroom Illustrator, InDesign, Acrobat, Flash, Dreamweaver y Muse. Posee las certificaciones especializadas ACE - Design Master y ACE - Web Master. Ha desarrollado y grabado cursos para Lynda y Udemy.

Actualmente es director de Xpert[dot]co, un centro de capacitación online sobre tecnologías gráficas y de Xpert[dot]video, una biblioteca de contenidos de aprendizaje.

Ready to start learning?
Take This Course