Layout Land
February 28, 2018 2:34 PM   Subscribe

Jen Simmons, Mozilla Designer and Developer Advocate, is publishing a great youtube channel called "Layout Land", full of valuable information and guidance in how to use the latest CSS techniques. It provides detailed information in how to use them, but also how to make sure they are accessible and useful for all browsers and users. Great stuff if you're a web designer or developer.
posted by jenkinsEar (17 comments total) 62 users marked this as a favorite
 
I've been mainlining this channel since it started a month ago. Smart and useful all the way through.
posted by maudlin at 2:47 PM on February 28, 2018


Needs the DIV tag.
posted by Artw at 2:59 PM on February 28, 2018 [6 favorites]


Wow

Why aren't we all using CSS Grid for everything already? Flexbox was everywhere before it had nearly this level of support.
posted by Artw at 4:15 PM on February 28, 2018 [1 favorite]


I sometimes still bemoan the rise of CSS. Static sites with plain HTML served a purpose, and CSS and javascript are too often abused. Don't get me wrong, I would never go back, and I love responsive design, but gone are the days where if you wanted to learn to make a website all you had to do was view the code of a site you liked to understand what was going on.
posted by cjorgensen at 4:38 PM on February 28, 2018


Wow, these are AWESOME. Really enjoying the "Resilient CSS" series.
posted by azarbayejani at 4:42 PM on February 28, 2018


sometimes still bemoan the rise of CSS.

Remember Tables

        within tables

               within tables

               within tables

                             within tables
                                                   within tables

               within tables

                             within tables
posted by sammyo at 5:17 PM on February 28, 2018 [7 favorites]


Still better than some of the float bullshit.
posted by Artw at 5:29 PM on February 28, 2018 [6 favorites]


Remember Tables within tables...

I remember like it was yesterday this afternoon.

Yes, we have key users whose browsers still don't support doing anything reasonable in a grid without nested tables. Weep for me.
posted by Riki tiki at 5:33 PM on February 28, 2018 [1 favorite]


In fairness there are some perfectly legitimate uses for tables, such as rendering an actual table. Not much call for nested tables though.

(And yes, back in the day a few over enthusiastic anti tables types would push for doing tabular data as divs and CSS, but that’s actually less semantically correct and therefore missing the point.)
posted by Artw at 5:47 PM on February 28, 2018 [1 favorite]


Frank Chimero: Everything easy is hard again
I wonder if I have twenty years of experience making websites, or if it is really five years of experience, repeated four times. If you’ve been working in the technology industry a while, please tell me this sounds familiar to you. ... I made my first website 20 years ago. I know this because I was a teenager doing the Lord’s work: transcribing the lyrics to Radiohead’s OK Computer. It was 1997, I was learning HTML, and there was one problem with the design that was confusing me: How do I put two things next to each other? Twenty years later, we’re still working out the answer to that very basic question. ...
posted by maudlin at 5:49 PM on February 28, 2018 [12 favorites]


I built my first production Grid layout last month, and I was definitely feeling my way a little bit to figure out the best way to set things up. Eager to learn more about the evolving best practices.

This was an old-school Wordpress modification, and I'll be curious to see how it interacts with an upcoming React project. These videos look very interesting, thanks!
posted by Kwine at 7:23 PM on February 28, 2018 [1 favorite]


Yes, we have key users whose browsers still don't support doing anything reasonable in a grid without nested tables. Weep for me.

I feel for them.

In 2017 if you are not uptodate browser-wise you're already dead and nobody has told you because they are having too much fun with your corpse.
posted by srboisvert at 6:12 AM on March 1, 2018


maybe I can learn all this new stuff before everyone decides it's old hat and won't do anymore, this time!
posted by thelonius at 6:18 AM on March 1, 2018 [1 favorite]


There is nothing simple about learning how to lay pages out with DIVs and CSS, especially now. This is why UI/UX is a dedicated practice. Tables may have been clunky and easily abused but the fact was there was a 1-1 relationship between what you put in your HTML and what you saw when you rendered it. They had ugly-ass borders by default! It was great for learning how to quote-unquote "code" and made the web feel approachable for just about anyone. This is no longer the case.

And as a professional web developer who has UI/UX people to handle that stuff, I love it! The fact that one page can render effectively on a desktop or mobile (and seamlessly switch between two layouts while just resizing the page) is amazing and the way things should be. But if I were just starting out and wanted to code my own site, I would be completely lost, much like when I thought it would be fun to set up by BBS as a FIDONet node. That, suffice it to say, did not happen.
posted by grumpybear69 at 6:42 AM on March 1, 2018


And regarding the article that @maudlin linked to, it is great and brings up a key point about the web in general: things are always changing, and not necessarily for the better (or worse) - they change because there's a mindset in tech that constant change and reinvention is somehow critical to the field. And these changes really are cyclical. Embrace the latest trend at your peril! Back in 2000 when EJB became the hotness and everyone was pushing turning your DB tables into EJBs I was all "eat my shorts, I'm rolling my own lightweight ORM" and that was a fantastic move, because who was using EJBs for ORM even a year later? Almost nobody, and those that had invested in it were suffering. Sometimes really simple things like naming conventions are packaged as revolutionary paradigm shifts - I'm looking at you, BEM! - and you have to wade through the glitter and Jock Jamz to see things for what they really are.

CSS Grid is making me LOL.

Stay the course, do good work. Clients don't need the bleeding edge, they need a site that works well and makes them money. New fads are like the windstoms in Journey - just hide behind a rock and let them pass.
posted by grumpybear69 at 6:58 AM on March 1, 2018


Heh, I was just about to post these videos to my first year IT students (I held a lecture on CSS Grid today). It is a remarkable technology, so much more elegant than JS driven layout frameworks.
posted by bouvin at 12:40 PM on March 2, 2018


Most of the big frameworks are CSS only or use JS only for interactive elements tBH. If your page layout is heavily reliant on JS then you have probably taken a wrong turn.
posted by Artw at 1:55 PM on March 2, 2018 [3 favorites]


« Older The Wild Parrots of San Diego   |   "Yeah, that's going to really haunt me for a while... Newer »


This thread has been archived and is closed to new comments