TEMAS MES DE OCTUBRE

TEMAS DE INTRODUCCION

 

"¿Qué es el responsive web design?"

Descripción: Este fue mi primer trabajo, consistió en un trabajo de investigación sobre RWD (Responsive Web Design), fue un documento con Normas APA en el que se hizo una redacción mediante libros virtuales para poner información sobre el tema. También, se hizo un producto audiovisual (en mi caso, presentación) para exponer la información recolectada.

Este primer trabajo fue una muy buena manera de introducción hacía el tema general del trimestre, ya que tuve que investigar por mi cuenta el concepto a fondo del tema, lo cual fue bastante útil a la hora de llegar a la práctica.

"Unidades de medida relativas"

Descripción: Este subtema es sobre las dos principales unidades de medidas principales en CSS5. Primero vi las relativas, son aquellas que definen un tamaño en función de otro valor de referencia. Permitiendo diseños flexibles y responsivos que se adaptan a diferentes contextos y resoluciones de pantalla.

Este subtema es bastante importante ya que me presentó nuevas medidas que se acoplan mejor a los nuevos trabajos que he venido realizando, sinceramente me parecen mejores este tipo de medida ya que no me complica mucho el estilo al momento de pasarlo a otras resoluciones.

"Unidades de medida absolutas"

Descripción: Este es el otro tipo de unidad de medida. Son aquellas fijas y definidas, que no dependen de un factor de referencia como el padre o la resolución de la pantalla.

Esta era la unidad de medida que utilizaba (cuando no hacía nada para otros dispositivos, solo PC). Cuando ya estábamos en el tema de hacer "adaptable" para otros dispositivos, tuve que cambiarme a las relativas, ya que como dije en la descripción, son medidas fijas que no dependen de la resolución de la pantalla, lo que claramente me generaría problemas.

"BreakPoints"

Descripción: Son puntos de quiebre (por eso su nombre en ingles) donde el diseño de la página web cambia para adaptarse a diferentes tamaños de pantalla, asegurando una mejor experiencia para los usuarios de todos los dispositivos (móviles, tablets y escritorios). Los principales BreakPoints que vi son: 1400px, 1200px, 992px, 768px, 576px.

Este subtema es bastante importante, ya que con estas resoluciones es bastante simple hacer mínimo 3 diferentes diseños de la página, ya que solo se necesitan 3 breakpoints, uno de pantalla grande (1400/1200), uno de pantallas medianas (992/768) y otro para pequeñas (768/576).

"Enfoques de desarrollo"

Descripción: Este tema trata sobre con que "estructura" se puede aplicar al momento de codificar los media-queries (que más adelante explicaré ese tema), siendo dos las opciones que se pueden usar: Desktop-First (de la pantalla grande a la pequeña) y Mobile-First (de la pantalla pequeña a la grande).

En resumidas cuentas, son dos tipos de estructuras que ayudan a orientar los diseños de las páginas. El desktop-first vas poniendo los diseño del más grande al más pequeño y el mobile-first va a la inversa, del más pequeño al más grande. En clase me enseñaron que no hay uno mejor pero mi favorito es mobile-first porque me parece mejor ir agregándole cosas a un diseño que quitarle cosas.

"Media Queries"

Descripcion: Los media queries son etiquetas de CSS que permiten aplicar diferentes estilos a la página web dependiendo de la resolución de la pantalla. Este subtema se conecta con los dos anteriores (Breakpoints y enfoques) ya que prácticamente están en su estructura la cual es la siguiente: (@media screen) la etiqueta que señala que esto es un media query, (and (max-width/min-width) la parte en la que se da el enfoque escogido siendo max-width el desktop-first y min-width el mobile first, (: resolución en px) y por último, aquí va el breakpoint escogido.

Este tema para mí es el más importante ya que como se puede ver, junta todo lo anteriormente aprendido y aquí es donde finalmente se entra en la etapa de práctica.