[MUSIC]
Los marcos de interfaz de usuario web front-end se están convirtiendo en su enfoque habitual para
diseñar e implementar sus sitios web recientes.
Preguntémonos qué son exactamente los marcos de interfaz de usuario web front-end,
y aprenda un poco más de detalles sobre ellos.
A continuación, por lo que obviamente
en esta lección nos vamos a preguntar, ¿qué son los marcos front-end?
¿ Qué contienen?
¿ Cuáles son algunos de los marcos de interfaz de usuario front-end populares?
¿ Y por qué necesitamos hacer uso de marcos de interfaz de usuario front-end cuando diseñamos
nuestros sitios web?
Entonces, ¿qué son los marcos de interfaz de usuario web front-end?
Demos un paso atrás e
imaginemos que solo conoces HTML, CSS y JavaScript.
Si se le pide que diseñe un nuevo sitio web, obviamente iría a construir
e implementar todo el sitio web usando las habilidades técnicas que
usted tiene basadas en su conocimiento de HTML, CSS y JavaScript.
A menudo te darías cuenta de que hay muchos
componentes repetidos que usarías en tu sitio web.
Y terminarías diseñando tu propio conjunto de clases CSS.
Estará diseñando componente basado en JavaScript.
Y luego, una vez que obtenga un grupo de estos juntos,
cada vez que necesite diseñar un nuevo sitio web estaría haciendo uso de estos
conjuntos predefinidos de clases CSS y
componentes basados en JavaScript para implementar rápidamente un nuevo sitio web.
¿ Por qué no llevar esto a su conclusión lógica?
¿ Qué tal si diseñamos un marco completo que consiste en
componentes de interfaz de usuario web listos para usar HTML, CSS y JavaScript colocados.
Por lo tanto, aquí, un marco de interfaz de usuario web front-end
puede definir un montón de clases CSS
que nos permitirán incluir componentes como botones
, tablas, barras de navegación, desplegables, alertas,
modales, pestañas, acordeones y muchos más.
Y rápidamente nos permiten diseñar e implementar un sitio web.
Entonces esto es lo que logra un marco de interfaz de usuario web front-end.
Es una colección de todos estos componentes.
No sólo eso, le da un método para definir una
tipografía consistente que puede utilizar para todo el diseño de su sitio web.
Y le permite andamiar rápidamente
un sitio web o el terreno de juego.
Si busca marcos web front-end,
encontrará una gran cantidad de ellos en Internet.
Ahora varias personas han hecho su propio servicio de
todos estos diferentes marcos de interfaz de usuario web, y
han publicado sus diez listas principales de marcos de interfaz de usuario front-end.
Este es uno de tales que
puede o no estar de acuerdo con este ranking, pero
Bootstrap resulta ser el más popular entre todos los marcos de interfaz de usuario web front-end.
Bootstrap se clasifica consistentemente como el número uno
en muchas de las listas de marcos de interfaz de usuario web front-end.
El resto de esta lista puede variar, pero a menudo encontrará Semantic-UI,
Foundation by Zerp, Materialize, Material UI, y
algunas de estas otras aparecen en muchas de esas listas de gama superior.
La siguiente pregunta obvia es,
¿por qué querría usar marcos de interfaz de usuario web front-end?
En primer lugar, le proporcionan una forma consistente de diseñar sitios web.
Y, la mayoría de estos marcos front-end
admiten lo que se denomina diseño web receptivo.
Vamos a examinar más acerca del diseño web adaptable en la siguiente lección,
pero resumiendo rápidamente, usted no se da cuenta de que su sitio web puede ser accedido desde
varios tipos de dispositivos de diferentes protectores de pantalla que van
desde teléfonos móviles pequeños hasta un escritorio completo.
Usted desea poder diseñar su sitio web para adaptarse automáticamente a
las limitaciones de tamaño de cada uno de estos
diferentes dispositivos, desde los que se accede a su sitio web.
Así que el diseño web receptivo está preocupado por este aspecto.
El segundo problema que la mayoría de estos marcos de Franken intentan
abordar es la compatibilidad entre navegadores.
Si ha jugado con navegadores tanto como yo lo
he hecho, estoy bastante seguro de que ha llegado a darse cuenta de que
no hay dos navegadores renderizan el mismo sitio web exactamente de la misma manera.
Así que cuando diseñas un sitio web para renderizar consistentemente a través de
muchos navegadores diferentes, vas a estar enfrentando una batalla cuesta arriba.
Ahora estos marcos front-end han logrado abordar la mayoría de estas
idiosincrasias de los diferentes navegadores de tal manera que usted puede ofrecer una
representación consistente de su sitio web en diferentes navegadores.
Entonces, esa es la segunda razón por la que es posible que desee recurrir al
uso de un marco de interfaz de usuario web front-end.
Y el tercer aspecto, por supuesto, es que cuando necesitas diseñar un sitio web,
siempre estarás bajo una terrible presión de tiempo. De este
modo, aumentar su productividad para
que no pierda su energía y tiempo en
problemas de configuración de esos componentes individuales de su sitio web.
En su lugar, deje que se ocupe de eso
con un marco de interfaz de usuario web front-end diseñado consistentemente.
Así que eso le ahorra mucho tiempo en términos de implementación de su sitio web.
Han despedido.
Y finalmente, por supuesto, la
mayoría de estos marcos de interfaz de usuario front-end que están todos allí tienen su propia comunidad.
Son usuarios que utilizan estos marcos para implementar sitios web.
Por lo tanto, esta comunidad de usuarios le proporcionará una
forma muy eficiente de poder resolver los problemas que pueda
surgir al aplicar cualquiera de estos marcos para el diseño de su sitio web.
Entonces, dadas estas diferentes ventajas,
¿por qué no querría recurrir al uso de un marco de interfaz de usuario web front-end?
Con esta comprensión de los marcos de interfaz de usuario web front-end,
vamos a seguir adelante para aprender más acerca de Bootstrap,
el marco de interfaz de usuario web front-end más popular.
[ MÚSICA]