• sacbuntchris@lemmy.world
      link
      fedilink
      English
      arrow-up
      24
      ·
      8 months ago

      Interestingly, focus states are used in accessibility. So while this code isn’t to cure cancer, it likely does improve the lives of those with different needs.

      • Skullgrid@lemmy.world
        link
        fedilink
        arrow-up
        5
        ·
        8 months ago

        it’s starting to make sense, what exactly does the meme want me to do about focus states so it can be read properly by screen reader software/used by keyboard navigation?

        • Strawberry@lemmy.blahaj.zoneOP
          link
          fedilink
          arrow-up
          17
          ·
          edit-2
          8 months ago

          CSS has a pseudo-class, :focus-visible, that matches when an element is focused using keyboard navigation. It also has :focus-within, which matches when the current focused element is the selected element or one of its descendents. However, this applies not only for keyboard navigation but also mouse and tap focus. A pseudo-class that combines the two, :focus-visible-within, would be useful, but does not currently exist. Here’s an article about it: https://larsmagnus.co/blog/focus-visible-within-the-missing-pseudo-class

          The code in the meme implements the logic of :focus-visible-within using the new :has() functional pseudo-class, and has a snippet of fallback behavior for slightly older browsers

      • 𝕱𝖎𝖗𝖊𝖜𝖎𝖙𝖈𝖍@lemmy.world
        link
        fedilink
        arrow-up
        6
        ·
        edit-2
        8 months ago

        Thanks for posting this.

        Good frontend work is HARD. It requires both design and engineering knowledge, and it’s very easy to write unmaintainable or inaccessible code. It also requires a high amount of backend work via BFFs, load balancing, hosting and serving, credential management, and more. The cherry on top is that it’s basically all async code.

        To be clear, I’m talking about the types of FEs used by thousands internationally, fully adherent to WCAG 2.2 (and above), and with rich interactivity. I’m not talking about someone’s hobby project with a couple dozen users at best.

        Seeing backend elitists diminish its worth is tiring as all hell. To me, it indicates that the person is either new to the industry or looking for a sense of superiority because they don’t understand FE work. It’s meaningless and exhausting to read.

        Tldr: I agree

      • Ethan@programming.dev
        link
        fedilink
        English
        arrow-up
        6
        arrow-down
        1
        ·
        8 months ago

        The first part of this article is taking about naming, and then heavily implies “CSS/HTML is not a programming language” is equivalent to devaluing front end developers. But that’s not the case, at least not for me.

        Front end is hard. It is obnoxiously hard and requires both artistry and technical skill. And it’s critical to the success of anything that has a front end.

        But I still say, “CSS/HTML is not a programming language”, because they’re not Turing complete. A programming language is something you can write a program in, without any other languages. It’s a matter of definition, not a matter of valuation. CSS and HTML are difficult and critical to get right but they’re a different kind of thing from programming languages.

        • F04118F@feddit.nl
          link
          fedilink
          arrow-up
          7
          ·
          8 months ago

          And semantically, logically, you are 100% correct. But there are other, subjective, emotional, layers to language. Billionaire, business magnate, and oligarch can mean the exact same thing, but they have very different emotional meanings and associated contexts.

          I think the author may have a point that by spreading the “HTML is not a programming language” meme, we may be contributing to its lower subjective status.

          But this thesis is, by its very nature, subjective, of course.

          • Ethan@programming.dev
            link
            fedilink
            English
            arrow-up
            2
            ·
            8 months ago

            To me that ‘meme’ is like someone making an “Eggs aren’t meat” meme. Technically correct, I agree with the factual part of the statement, but the meme is dumb and pointless, like a bad joke. Unless the point is to belittle, in which case the poster deserves to be forced to do front end dev and deal with irrational user complaints until they repent or end up huddled in a corner mumbling incoherently, either or.

            It’s like sexism. I don’t have time for that shit. If people were being sexist, bigoted, or belittling frontend devs at my job I’d tell them to get their heads out of their asses, or find a new job and then tell them. Fortunately I currently work with people who don’t suck.

      • idefix@sh.itjust.works
        link
        fedilink
        arrow-up
        2
        ·
        8 months ago

        I feel like this article is completely missing my point. I’ve done my share of programming websites but not for the past 2 decades. And now I’m completely lost at reading CSS. I can’t make sense of the code shown in the picture. And that’s always been my trouble with CSS: the tendency to unnecessarily over-complicate things while reinventing the wheel. They have created a huge barrier for entry to the world of website programming and I think it’s a shame.

        • F04118F@feddit.nl
          link
          fedilink
          arrow-up
          3
          ·
          edit-2
          8 months ago

          That’s an honest criticism that does not intend to devalue frontend. But there’s an overlap where “over-complicate” may imply that frontend (tools) should be uncomplicated.

          Having only done a few frontend projects in recent years, I see obvious value to new, more powerful CSS selectors and even things like Tailwind. I can’t read Tailwind yet, but making intuitive user interfaces that work well on all kinds of devices for all kinds of people (screen readers?) is difficult and should not be expected to be simple, IMO. But this is a matter of opinion.

          The ones most qualified to deal with that issue are, obviously, experienced frontend devs and they build these things.

          • idefix@sh.itjust.works
            link
            fedilink
            arrow-up
            2
            ·
            8 months ago

            I agree with everything you said, that’s fair. But I do not remember having to much difficulties coding UI interfaces in Qt while supporting numerous end-user configurations.

      • Skullgrid@lemmy.world
        link
        fedilink
        arrow-up
        2
        arrow-down
        8
        ·
        edit-2
        8 months ago

        I see you are a thin skinned idiot that can’t understand your own fucking link

        I find what most of those people actually mean is: HTML and CSS aren’t scripting languages. Which: a) of course they aren’t; and b) is not really the point at all.

        my point is that css is meant to determine appearance and logic should be handled elsewhere.

        • F04118F@feddit.nl
          link
          fedilink
          arrow-up
          7
          ·
          8 months ago

          Well, ehm… Thank you for the feedback I guess?

          I appreciate your clarification: you mean that the logic part of conditional appearance should be handled by, for example, changing a property on an HTML node, and styling that property in CSS, did I get that right?

          If I may offer some feedback in return, I would recommend you work on your phrasing. Insulting people can easily lead to being ignored or having low-value interactions. Asshole. 😉

        • Strawberry@lemmy.blahaj.zoneOP
          link
          fedilink
          arrow-up
          4
          ·
          8 months ago

          CSS has always combined the styling and the logic for the styling. CSS selectors implement logic to determine where to apply styles

  • wise_pancake@lemmy.ca
    link
    fedilink
    arrow-up
    22
    arrow-down
    2
    ·
    8 months ago

    I miss when CSS was tables. Now I don’t even recognize it with variables and compilers.

    • Strawberry@lemmy.blahaj.zoneOP
      link
      fedilink
      arrow-up
      6
      ·
      8 months ago

      It’s so much more fun now though! Things like grid layout and flex box have really changed the game. Also idk if you were saying otherwise but this has no variables and is vanilla CSS

      • wise_pancake@lemmy.ca
        link
        fedilink
        arrow-up
        2
        ·
        8 months ago

        I do like flex layout, it’s very cool!

        I’ve been out of the css game for a while though, so now I’m totally lost