5 TIPS para ESCRIBIR un mejor CSS (Usado por PROFESIONALES)

Подписаться 13 тыс.

Просмотров 31 тыс.

50% 1

Es muy fácil adquirir algunos MALOS HÁBITOS cuando empezamos a aprender CSS. Hoy te voy a enseñar 5 buenas PRÁCTICAS CSS, que debe conocer para escribir un código LIMPIO y MANEJABLE, que te permitirán acelerar el progreso del mantenimiento de tus proyecto a largo plazo.
Son 5 consejos sencillos y fáciles de asimilar, usado por PROFESIONALES del Diseño web, estoy seguro que te servirá.
Lista de Propiedades CSS abreviadas:
developer.mozilla.org/en-US/d...
Si quieres saber mucho más de CSS, te invito a visitar la escuela del Aulaideal, tenemos un curso avanzado de CSS3:
www.aulaideal.com/cursos/curs...
Si te gusta esta temática, te dejo aquí algunos vídeos más sobre ello:
7 RAZONES para usar BOOTSTRAP: • 7 RAZONES para usar BO...
El MEJOR plugin para BOOTSTRAP en VSCODE: • El MEJOR plugin para B...
**********************************
ÍNDICE DEL VIDEO::
● 00:00 ¿Qué aprenderemos hoy?.
● 00:18 La Intro.
● 00:24 TIPS 1:Usar shorthand Properties.
● 02:45 TIPS 2: No repitas código.
● 06:20 TIPS 3: Nombrar CORRECTAMENTE los selectores.
● 08:53 TIPS 4: No utilice estilos CSS en línea.
● 14:30 TIPS 5: Agrega comentarios cuando sea necesario.
● 16:50 Palabras finales y despedida.
**********************************

Опубликовано:

3 июн 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 81

@aulaideal 3 года назад

💪🏻Si te gustó este tutorial, te dejo aquí más vídeos sobre Bootstrap: 🎥7 RAZONES para usar BOOTSTRAP: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-_1QYo_K6-5o.html 🎥El MEJOR plugin para BOOTSTRAP en VSCODE: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-BirHkAV2FcY.html

@marcoantoniovalencia8694 3 года назад

Que modelo es tu pc?

@roxanap2653 3 года назад

Muchas gracias

@gerardoanaya6159 2 года назад

1:44 una mejor forma de ver como funciona la propiedad margin con 4 valores es que cada uno se coloca en el mismo orden que se mueve la aguja de un reloj

@raulgallegos240 3 года назад

me encantaron tus consejos , solo es chistoso e irónico que cuando dijiste "Legible" , estuviera mal escrito asi "leguible" jeje

@aulaideal 3 года назад

Ahahaha achaques del oficio!

@Cachiporra3000 2 года назад

este video lo vi cuando apenas sabia CSS basico, por lo tanto no podia aplicar estas reglas en su totalidad todavia, ahora estoy a una semana de acabar CSS avanzado y me alegra poder hacer al menos 4 de estas 5 reglas y saber que estoy haciendo buenas practicas, no tengo palabras:D

@aulaideal 2 года назад

Me alegra haber contribuido en tu progreso mi amigo. Saludos

@jesusramirezserrano6427 2 года назад

¿En donde tomaste el curso?

@CesarGonzalez-uh3qo Месяц назад

La ver DRY es uno de los errores más comunes te llegas a dar cuenta es después, se debe entender que efectivamente es una hoja en cascada, lo que ocurre es que el desarrollador debe tener una idea de que estilos comunes va a tener el proyecto para ello no redundar en líneas

@davidcode22 3 года назад

Puedo decir con toda sinceridad que era uno de los que solia cometer algunos de los errores que mencionaste, normalmente cuando te centras en aprender JS y olvidas mejorar en CSS asi fue hasta que un día sentía que mi hojas de estilos eran muy desordenadas y decido mejorar, aprender y ser un profesional en CSS hoy en día me siento muy bien al ayudar a mis compañeros en el área a tener un código limpio y enseñarles buenas practicas. Like por los consejos...

@virusmelissa6948 Год назад

¡Excelente! Muchas gracias. ✌😃

@harveyaguilarc.555 3 года назад

gracias por tu cursos son cheveres

@davidramirez9727 Год назад

Voy a estudiar css este mes así que me vienen bárbaro tus consejos, gracias por compartir!

@enpuertovallarta Год назад

muchas gracias hermano, me gustó tu explicación.

@ayudameviolan6883 2 года назад

Gracias estoy por aprender css y encerio tus tips me están ayudando a aprender un poco la lógica de esto gracias ☺️

@rosiibarra390 2 года назад

Muy muy buenos estos Tips, estaba buscando algo asi para crear mis css de manera profesional

@yoanestradablanco1608 Год назад

Buenisimo mnano gracias por el contenido

@profesoredwin 2 года назад

¡Buren consejo, gracias!

@desitechlearn Год назад

Hola llegué a tu video buscando optimizar css y me gustó la forma como se debe realizar a poner en práctica 👩🏼‍💻Gracias!!

@nelingenio 2 года назад

Nuevo Suscriptor! :D

@elbertjosesalasbrochero6318 3 года назад

Aceves uno hace estilos son escribir el selector que es por ejemplo .Color: red; Qué dicer car que es un p , o ul li.

@khisus20 2 года назад

Excelente video. Muy buenas ejemplos. Explicas de forma perfecta. La única pega es la calidad del sonido que no es muy buena. Por lo demás 10/10

@aldorsan 3 года назад

Lindo video. Pero el shorthand de background no me ha funcionado. Quizás podrías hablar al respecto de como usarlo correctamente con todas las propiedades. A mí no me funcionó usando position, repeat, size y origin

@cristian20035 3 года назад

Excelente contenido, muchas gracias

@aulaideal 3 года назад

Gracias Cristian.

@federicoaldana5952 2 года назад

Muy buenos, disculpa una pregunta la metodología Bem ya no sé usas si usamos Sass?

@danipsicocbd 2 года назад

No entendí nada jaja, recién me estoy iniciando. Pero buena onda tu explicación Bro!

@musiccurrent9975 3 года назад

realmente al colocarle estilos a un elemento por medio de javascript, los estilos quedan en las etiquetas. Así que en algunas ocasiones no es culpa de el desarrollador si no que esta hecho así.

@mauriciovillalba1065 2 года назад

Buenos los tips, sin embargo no es necesario estigmatizar a los que no lo usan, no importa si es o no un novato, sencillamente hay una mejor forma de hacerlo. Gracias

@davidsoycolombiano 3 года назад

Explicas muy bien, me animo a tomar cursos contigo. Felicitaciones!

@aulaideal 3 года назад

Gracias!

@elbertjosesalasbrochero6318 3 года назад

Cómo cambiarias estilos con nombres de clases o con Selectores

@juanvera2288 2 года назад

Con esos tips y con la metodologia bem, ya puedo hacer maravilla.

@juanvera2288 2 года назад

TE agrdeceria si haces UN video de mas tips de css y html. Thanks so much.

@lRedMonkey Год назад

A mi me están pidiendo que duplique los elementos para separarlos en color y tamaño, me parece una locura duplicar una enorme cantidad de elementos por un capricho.

@alfons1554 11 месяцев назад

la neta son muy buenos consejos lo de repetir código no se me había ocurrido verlo de esa manera jsjsjj Gracias PA, aunque otra forma de hacerlo es poniendo nth-child { aquí va el número de la etiqueta que quieres editar }

@h1-hackermater Год назад

Qué buen video 💯💯💯. te ganaste nuevo sub ❤️💻⚛️

@gerardosantana2563 Год назад

Si mi página web tiene varias páginas internas, es buena práctica crear un CSS para cdsa HTML o se hace todo el estilo en 1 solo CSS ?

@tvargentina 3 года назад

lo del estilo en línea, de no usarlo nunca, he leído de otros desarrolladores que se debe usar css crítico para optimizar tiempos de carga. Que hago? jaja

@JavierSanchez-qo6jg 3 года назад

Yo creo que en primer tip la primer forma de codear es más legible que el segundo método

@davidcode22 3 года назад

Puede ser legible solo para los que no conocen bien de Css, de lo contrario para un profesional en el área siempre será mejor un sola linea.

@CesarICAO 3 года назад

Si, en unos casos es mejor tener lineas más descriptivas, es una buena práctica tener el código claro y entendible para cualquier developer. No siempre una linea es la mejor opción. Yo creo que en la primera del margen tiene razón peronla del backgroun se equivoca.

@batman68477 2 года назад

Cuando estas en css las clases o Id, se clasifican como padre padre hijo o padre hijo padre

@edwarvilchez5642 3 года назад

En lo único en lo que no estoy de acuerdo es que no se usen comentarios. Por mucho que el código sea muy bueno los comentarios son lo mejor del mundo del desarrollo

@aulaideal 3 года назад

Hola Edwar, no dije que no se use, dije "Agrega comentarios cuando sea necesario". Los comentarios son pieza clave en todo desarrollo al margen del lenguaje de programación. Saludos

@progmell 3 года назад

You right.

@lucianosandoval727 2 года назад

@@aulaideal casi un año de respuesta, pero creo que quiso decir a que no escatimes con los comentarios, pero (como vos dijiste también) cortos y al grano.. Yo comento todo, pero corto.. y le da también un "color" al proyecto.. un orden.. me explico bien? jaja

@federicoaldana5952 2 года назад

Con una función es más fácil el no repetir código, con Sass pero pues no sé si con Css sea mejor..

@Henry_Nunez 2 года назад

👉🔔

@S4MBENTZ 3 года назад

El tip 4 solo en caso extremos si se puede usar por ejemplo si necesito acomodar elementos dinamicos con js

@aulaideal 3 года назад

En su lugar agregaría clases CSS con JS. Y dichas clases realizarían el comportamiento deseado.

@diegoberistaindelamora6594 Год назад

Mounstro

@dannypacheco4425 Год назад

en el punto número uno creo que debías decir cuando en realidad es útil o no usar shorthands. pero en realidad es de mucho debate debido a que el utilizar shorthands no es tan descriptivo. yo diría que los shorthands son útiles para especificar muy bien las propiedades. Es mejor que algo sea decriptivo y largo que sea corto e ilegible. yo prefiero usar shorthands para evitar el dry pero cuando necesito especificar algo lo utilizo normal así que mala práctica no es.

@aulaideal Год назад

Hola Danny, permiteme debatir contigo de la manera mas amigable. Las propiedades shorthands no necesitan ser descriptivas. Si recien inicias claro esta, es bueno que las propiedades describan su funcionalidad, pero si tienes años definiendo el mismo: margin-left o margin-right… llega un momento en que decides ahorrar código al margen de que sea legible o no. Y eso es progresivo y a la vez va definiendo tu nivel.

@shephardhl8305 Год назад

El de especificidad es el que me cuesta :c

@galletaleekun3869 Год назад

🤣🤣🤣🤣 parece que estás describiéndome, si fui exactamente como empecé.

@aulaideal Год назад

Jajaja suele pasar…😁

@edgarmauricio7243 3 года назад

Voy a dedicarme uno lindos poemas xd

@aulaideal 3 года назад

Bienvenido sea! ajajaja

@bersuarez2741 Год назад

En este Video, Estas enpañales no le llegas a JonMircha 😅 , es broma

@moisesrodriguez4312 3 года назад

Como haría para tomar cursos contigo ?

@aulaideal 3 года назад

Hola Moises, Puedes ver los cursos avanzados que tenemos en: www.aulaideal.com/cursos Saludos

@moisesrodriguez4312 3 года назад

@@aulaideal Excelente Erick, tus trabajos son geniales :)

@moisesrodriguez4312 3 года назад

@@aulaideal Gracias

@moisesrodriguez4312 3 года назад

@@aulaideal Pero cual me recomiendas empezar uno de wordpress o de bootstrap? quiero aprender a hacer paginas wen hasta el punto de montarlas y todo

@aulaideal 3 года назад

Hola, Son dos tecnologias diferentes, pero que trabajan juntas. Wordpress te permite gestionar el contenido de forma sencilla. Y Bootstrap crear la interfase del usuario de forma totalmente limpia, cargando sólo los recursos que necesitas. Yo empezaría por Bootstrap, luego por Wordpress (que es mas sencillo). Te felicito por las ganas de aprender.

@code1866 2 года назад

No me gusta usar Shorthand, es cuestión de gustos no de novato o profesional.

@germanbaena6579 Год назад

El uso de shorthand no siempre es la mejor práctica a no ser que se declaren todas los valores de la propiedad, y con respecto a los nombres de las clases no es buena practica usar camel Case, esto: ".miClase" es una mala práctica que no se debe usar en CSS.