Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Moving away from Tailwind, and learning to structure my CSS

jvns.ca

Post reply on HN
Print view View original

51–60 of 435 posts

Re: Moving away from Tailwind, and learning to structure my CSS

#51

Post by gjsman-1000 »

TonyAlicea10 wrote: post #13
flossly wrote: post #8

Earlier quoted context omitted.

While I agree I do think there's some "aspiration of purity/correctness" in your approach that I've long let go of. I look at the royal mess that is HTML/CSS/JS as a necessary evil, required when we want to target browsers. To me it's "just the presentation layer". In my work I put a lot more emphasis on correctness in the db schema, or business logic in the backend. When it comes to the messy presentation layer I pr…

This isn't about "purity/correctness" it's about the real experience of a blind person. Accessibility means caring about the HTML. Your comment only mentions developers as the audience of HTML authoring, as opposed to users, which is a common attitude and the core problem with Tailwind.

But why would I spend any time mastering this skill when we have AI now?

Disability software that uses both the markup and the on-screen visual for decision making is likely imminent and would render most of this no longer necessary.

Claude Cowork is already doing navigation and web browsing by screenshot showing this is possible.

Re: Moving away from Tailwind, and learning to structure my CSS

#52

Post by throwaway24274 »

flossly wrote: post #18
TonyAlicea10 wrote: post #13

Earlier quoted context omitted.

This isn't about "purity/correctness" it's about the real experience of a blind person. Accessibility means caring about the HTML. Your comment only mentions developers as the audience of HTML authoring, as opposed to users, which is a common attitude and the core problem with Tailwind.

I use Tailwind and have all kinds of "screen reader" directives in my templates. Not sure if it helps, but if we get our first blind user I will gladly make some admends to make it more usable for them. It seems that Tailwind is now blamed for the mess that is HTML/CSS. Tailwind certainly allows for accessible designs; it may not be the ideal solution, sure, but what we aim for is "good enough".

It's not just blind people, but also people with reduced eyesight. As I'm getting older, I really appreciate good contrast and the possibility to zoom in without breaking the layout.

Re: Moving away from Tailwind, and learning to structure my CSS

#54

Post by danaw »

TonyAlicea10 wrote: post #3

> I got curious about what writing more semantic HTML would feel like. I've been teaching semantic HTML / accessible markup for a long time, and have worked extensively on sites and apps designed for screen readers. The biggest problem with Tailwind is that it inverts the order that you should be thinking about HTML and CSS. HTML is marking up the meaning of the document. You should start there. Then style with CSS.…

you're unfairly conflating things and putting the blame for a lack of care or understanding on tailwind vs on the dev themselves. nothing about tailwind forces you to build inaccessible or "div soup" apps

can tailwind be used poorly? absolutely. but that's true of any tool

i've been writing CSS for ~20 years and am quite capable with it, having used CSS, Less, SASS/SCSS, Stylus, PostCSS etc. the reason i have settled on Tailwind for the last few years is precisely because it enables me to build more robust application styling.

tailwind frees you from having to spend excessive time building abstractions of styles/classes that will invariably change. placing the styles directly into the markup that is affected by it reduces cognitive load, prevents excessively loose selectors affecting styles unintentionally and really aids in debugging. jumping into codebases with bespoke css frameworks is always more complex and fragile than a tailwind codebase for anything but the most simple sites/apps

add to that the ability to have consistent type, color and sizing scales, reduced bundle sizes, consistency for any developer who knows tailwind and a very robust ecosystem (and thus llms are very familiar with it) and tailwind is a really excellent choice for a lot of teams

tailwind is like most tools; it can be used well or poorly depending on who is using it

Re: Moving away from Tailwind, and learning to structure my CSS

#55

Post by u_fucking_dork »

throwaway24274 wrote: post #52
flossly wrote: post #18

Earlier quoted context omitted.

I use Tailwind and have all kinds of "screen reader" directives in my templates. Not sure if it helps, but if we get our first blind user I will gladly make some admends to make it more usable for them. It seems that Tailwind is now blamed for the mess that is HTML/CSS. Tailwind certainly allows for accessible designs; it may not be the ideal solution, sure, but what we aim for is "good enough".

It's not just blind people, but also people with reduced eyesight. As I'm getting older, I really appreciate good contrast and the possibility to zoom in without breaking the layout.

And how does tailwind or the structure of the underlying html of the page change or affect that?

Re: Moving away from Tailwind, and learning to structure my CSS

#57

Post by hstaab »

aejm wrote: post #32
bryanhogan wrote: post #28

I have been writing a "clean" web development guide focusing on writing HTML and CSS that scales well: https://webdev.bryanhogan.com/ Maybe it's useful for people here. I don't use Tailwind or similar for styling, just CSS with modern frameworks like Astro or Svelte. For every project I have the following CSS files: - reset.css - var.css - global.css - util.css Other styling is scoped to that specific component or la…

Using a JavaScript framework kind of defeats the whole purpose doesn’t it?

css modules with react are really nice to work with. Plain css scoped to a component. The two arnt always at odds

Re: Moving away from Tailwind, and learning to structure my CSS

#58

Post by bel8 »

villgax wrote: post #2

Relying on React or Typscript in LLM era seems very stupid, just have the LLM setup whatever dom manipulation you want and have it write decent JS without slop. Far more offline compatible development almost negligible supply chain issues as well. At least ones you can control.

React maybe (because there are alternatives).

But for mid/large projects, I find that TypeScript brings sanity to JavaScript.

I love some quick and dirty JS project. But after a certain project size I begin the see runtime errors like undefined, NaN, 'false/true' concatedted to URLs, and so on. TypeScript eliminates a ton of those.

Re: Moving away from Tailwind, and learning to structure my CSS

#59

Post by zero_shift »

TonyAlicea10 wrote: post #13
flossly wrote: post #8

Earlier quoted context omitted.

While I agree I do think there's some "aspiration of purity/correctness" in your approach that I've long let go of. I look at the royal mess that is HTML/CSS/JS as a necessary evil, required when we want to target browsers. To me it's "just the presentation layer". In my work I put a lot more emphasis on correctness in the db schema, or business logic in the backend. When it comes to the messy presentation layer I pr…

This isn't about "purity/correctness" it's about the real experience of a blind person. Accessibility means caring about the HTML. Your comment only mentions developers as the audience of HTML authoring, as opposed to users, which is a common attitude and the core problem with Tailwind.

What does Tailwind have to do with accessibility? Most significant HTML markup is block level elements. The CSS is completely orthogonal.

I feel like old-school frontend devs bring up accessibility as a kind of bogeyman.

It reminds me of the myth that CSS style X or Y breaks accessibility "because screen readers expect semantic CSS classes". Zeldman (of A List Apart) promulgated that disinformation for years, until someone actually told him screen readers don't work that way. 90% of people who use a11y as a rhetorical cudgel have never actually used AT themselves.

Post reply on HN