ACSS 101.12: The Official ACSS Workflow (BEM + AUTOBEM)
ฝัง
- เผยแพร่เมื่อ 30 มิ.ย. 2024
- There are essentially three workflows that people use with page builders:
1. ID Styling (01:00)
2. Utility-First (11:28)
3. Custom Classes (Official Approach - 19:27)
This video will show you the pros and cons of all three, and teach you the officially proposed workflow (Method #3 using BEM and AUTOBEM).
Here are some additional videos to help you go deeper on this topic:
BEM 101 - • BEM 101: How to Make W...
Utility Classes vs Custom Classes in ACSS - • Utility Classes vs Cus...
Interested in using Automatic.css on your sites and accessing the private ACSS support and strategy community? Get a license here: automaticcss.com
Interested in using Frames on your sites and accessing the private Frames support and strategy community? Get a license here: getframes.io
Want more helpful dev tutorials and agency-related trainings? Check out Kevin's channel: / @gearyco - บันเทิง
You explained BEM and I now understand the power of Automatic.css! Your videos are extremely valuable. Every one I watch helps me another step closer to being able to create any layout required efficiently and beautifully. Thank you!
Great video for easily explaining why class-first design is best.
Bookmarked! I'll return here after work. Because when Kevin is in a video, it must be watched.
Okay. I watched it! And as always, marvelous!
Happy Birthday Kevin, your content means the world to me,
Ferdi
🙏
Excellent video as always Kevin 👍🏻
Anyone who’s hand-coded HTML & CSS websites should understand the power and benefit of a class-based workflow. Also, how important solid class naming conventions like BEM are, in boosting future maintenance and scalability of a website.
At least I’m not the only old-school web developer who cringes when a page builder focuses on styling completely at the ID level 😞
To anyone newer to building websites, take Kevin’s advice here, because you’ll be glad you did later on 😉
Love how much effort you put into these videos.
I just bought the full package and frames, and sadly had a sarcastic rude interaction with your support though, as frames would not activate under current instructions, I managed in the end to activate it, but not from how it is shown in the instructions, support just kept pointing me to instructions with an exclamation mark at the end of every sentence or silly face emojis making out I'm stupid.
When I picked him up on it he just came back with another rude message. Don't let this guy ruin the excellent work you are doing.
Thx I’ll review the thread.
Great Approach, Thankyou !!!
Thanks Kevin, I had to watch it twice, think it thru, and now trying it
Thank you for being a great contributor to the landscape of web :)
Fantastic video 🙌👏
Another excellent video. I also think you should make a video on BEM. It took me a while to grasp and I'm still learning. ACSS is "magic"! Thanks Kevin for all your videos, each one a gem!
Page Building 101 lesson 08 ..there is also a 2 year old video called BEM 101
I already made one. It is linked in the description.
Great video. I learned the BEM approach when starting with ACSS 2.x and through your prior videos. I'm loving BEM now and wouldn't shy away from using it.
another fundamental and essential video! Thank you, Kevin.
Thanks
Thank you Kevin!
The best solution would be the possibility to import the utility class into the Custom classes, in the BEM approach. What do you think?
That's not really how CSS works.
Thank you for making this video! I was getting too granular with naming based on section then block and element so if I wanted to use the block in another section the class name no longer made sense because the section wasn't aligned.
Glad it was helpful!
How did you get the bricks elements to show as a list😲
Acss new feature
@@dovber Is it realy?
yes version 3.0
ACSS 3 > Options > Bricks Enhancements > Stack the 'Add Elements' Panel.
It's all great until you wish to add another element to the card.
That’s why we need components and why I’ve been fighting to get them added as a feature for years. That’s not something a CSS framework can help with.
@@AutomaticCSS Agreed. 9 months and still counting since that preview. Better be good 😃
Where can I find the syntax reference for the @ipsum shortcut (or is @ipsum-short the only option)?
All the available shortcuts are in the cheat sheet. Ipsum-short is the only ipsum for right now. More to come.