Conceptos básicos del diseño moderno: curso gratuito de Hexlet, formación de 9 horas, Fecha: 5 de diciembre de 2023.

Introducción
El curso "Fundamentos del diseño moderno" es la base para aprender los conceptos básicos del diseño de sitios web HTML y CSS. En esta lección hablaremos brevemente sobre lo que aprendemos en el curso y cómo se puede aplicar este conocimiento en la práctica.

Introducción a HTML
La lección está dedicada al diseño HTML desde cero. Hablamos sobre el papel de los atributos y estudiamos el esquema general para describir etiquetas HTML.

modelo de bloque
¿Qué elementos son responsables del marco de la página y cuáles ayudan en el proceso de diseñarla o agregar partes funcionales? Familiaricémonos con los elementos HTML en línea y en bloque y estudiemos la influencia de los estilos en el ancho final de los elementos.

HTML semántico
El objetivo principal de cualquier diseño HTML es transmitir el significado de los bloques. En esta lección, exploraremos las capacidades semánticas del último estándar HTML5 y aprenderemos sobre la accesibilidad web.

Estructura básica de un documento HTML
Cualquier documento HTML tiene una estructura básica que consta de etiquetas y elementos de servicio. El navegador los necesita para mostrar la información correctamente. En esta lección veremos cada línea de esta estructura.

Conceptos básicos de CSS
El lenguaje CSS fue creado para el diseño visual de una página web. Estudiamos las capacidades básicas del lenguaje y descubrimos cómo utilizarlas junto con HTML. Aprendemos a incluir archivos CSS y nos familiarizamos con los tipos básicos de selectores.

Cascada en CSS
¿Qué es la cascada y cómo funciona en CSS? La lección está dedicada a las diferencias en las prioridades del selector y la capacidad de utilizarlas en sus proyectos.

Herramientas de desarrollo de Chrome
Al diseñar un sitio web, es importante encontrar errores a tiempo o comprender cómo convertir correctamente el bloque que necesitamos. Anteriormente esto se hacía principalmente a mano. Hoy en día, los navegadores modernos tienen una función de inspección web. Consideremos las capacidades de uno de ellos: Chrome DevTools.

editores de código
Para guardar su trabajo, necesita un editor de código. En esta lección veremos cómo instalar Visual Studio Code. Esta es una herramienta poderosa que se puede utilizar no solo para maquetar, sino también para programar en cualquier lenguaje.

Hormiga
Estudiemos uno de los complementos más útiles para los diseñadores de diseño: Emmet. Acelerará el marcado del código HTML y eliminará la mayoría de los pasos de rutina.

Publicación en Internet
Para publicar un proyecto en Internet, debe utilizar hosting, un servidor especial que almacenará archivos y brindará acceso a ellos a través de un nombre de dominio. En este tutorial veremos el alojamiento gratuito de GitHub.

editor gráfico
Hay varios editores importantes en el mercado. Algunos de ellos son específicos de un solo sistema operativo, otros pueden instalarse en cualquiera de ellos. En esta sección, veamos los pasos principales cuando un diseñador de diseño trabaja con el editor en línea Figma.

Trabajo independiente
Tareas adicionales que te permitan consolidar la teoría adquirida.

Materiales adicionales
Artículos y vídeos seleccionados por el equipo de Hexlet. Te ayudará a profundizar en el tema del curso.