Descubre qué ha cambiado en nuestro medio

1

Todo sobre el diseño de páginas web acaba de cambiar

Conceptos que forman parte del diseño en CSS

2

La importancia de recordar las herramientas existentes

3

Flujo normal del documento: display block, inline e inline-block

4

Contextos de formato: Formato de Contexto de Bloque (BFC)

5

Posicionamiento + Dinámica: ¿Cómo se vería?

¿Flexbox o CSS Grid?

6

Diferencias entre Flexbox y CSS Grid

7

Similitudes entre Flexbox y CSS Grid

8

¿Puedo trabajar con Flexbox y CSS Grid al tiempo?

9

Dinámica: ¿Qué usarías? (Parte 1)

10

Dinámica: ¿Qué usarías? (Parte 2) + Reto

11

¿Cuándo usar Flexbox y cuándo usar CSS Grid?

Modern Layouts con CSS Grid

12

¿Qué son los Modern CSS Layouts?

13

Patrones para usar como punto de partida

14

Layouts: Super Centered, The Deconstructed Pancake, Sidebar Says, Pancake Stack, Classic Holy Grail Layout

15

Layouts: 12-Span Grid, RAM (Repeat, Auto, MinMax), Line Up, Clamping My Style, Respect for Aspect

Diseño web para desarrolladores

16

Dinámica: No puedo dejar de ver

17

Design System y detalles visuales a tener en cuenta

18

Tendencias de diseño UI/UX: Fase de inspiración y creatividad

19

Wireframes y comunicación visual simple, intuitiva y atractiva

20

Figma para devs: Auto Layout y Neumorphism (Parte 1)

21

Figma para devs: Auto Layout y Neumorphism (Parte 2)

Del diseño al código

22

Primeros pasos y estructura inicial

23

Ubicación y creación de elementos

El futuro de CSS Grid

24

Entendiendo las versiones de CSS: ¿existirá CSS4?

25

CSS Subgrid

26

Native CSS Masonry Layout

27

CSS feature queries: @supports

28

Nosotros y el futuro de la web: tips para seguir aprendiendo y mantenerse al día

Aún no tienes acceso a esta clase

Crea una cuenta y continúa viendo este curso

Primeros pasos y estructura inicial

22/28
Recursos

Aportes 9

Preguntas 0

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesión.

Me encanta el término de ponerse/quitarse las gafas de desarrollador porque es algo que siempre hago cuando inicio con un diseño, básicamente miro todo con el menor detalle posible para poder empezar a armar el esqueleto de la página y así jaja

sin duda cuando vas por el camino de frontend y llevando las rutas establecidas, vas adquiriendo tus gafas, y cada ves que veas un nuevo proyecto automáticamente las gafas aparecen y paralelo a eso tus gafas van siendo mas robustas, te permitirán identificar cada parte del esqueleto de algún diseño

Emmet del html

header.header+section.cards+section.progress__bar+footer.buttons

Lo primordial es tener ganas de hacer las cosas bien para mejorar poco a poco. De eso se trata siempre.

¡Amo a la profesora! Tremendo Insight el termino de Gafas de desarrollador.

y si no tengo gafas?

💚

👌

Mi prototipo en FIgma:



Ahora a intentar llevarlo a código 😉