How does Flexbox Order fit into this?

Good question. Im gonna have somewhat of a lengthy explanation. Sorry. :p

So first off, yeah, we switch items with the order property in css when we want things to be in a different order, however, what she is saying in the video is that you may not be the only developer on a project. Imagine you coming in behind someone and trying to read their work and figure it out, it just doesnt always turn out well. I mean, when you need to make an edit to the header of a page and cant find it in the code until right before the body tag closes, this can confuse the developer. It wastes their time, your time, and leaves room for styling errors.

Second, seo can have issues. When a search engine crawls your site and looks for relevant stuff, they base their findings a millions of factors, two of the factors being where the code is on the page and the tag used. If the h1 has an important piece of data in it but at the bottom of the page, the seo crawler may question the importance. This reason I have stated is somewhat speculative but is logical based on some things ive read online over the years.

Third, screen-readers are special. They were created to help visually impaired and blind individuals understand a web page. They read displayed code. If you have you introductory paragraph is displayed at the top of the page, but exists at the bottom of your code, it wont get read until the reader reaches that point in the code. There are SEVERAL ways around this, but why mess with them when things could just....be in the right order?!?

Ignore the reason she gave about css/js turned off. Those people are use to seeing weird crap on their browsers and should expect it until they turn the normal stuff back on. It's not that she's wrong, it's just...silly for a user to do that to their browser. Though SOME users do have a different contrast level and that should be considered....but not when thinking about order.

When should you use order instead of moving your code, you ask? Ill tell you! In short: Use order if it is for certain screen sizes or you dont have access to the html(I know, this is dumb, but it happens).

Do NOT use order if you want the elements to ALWAYS be in the new order.

In long: If you build your site in mobile-first development process(when you build sites as if they will display on phones, then expand your browser and make changes and media queries for larger screens), you may see sizes on the screen where the order might need to change. For example, you may have a couple rows of text and images. Though alternating whether the image goes first or second looks good in desktop views, when they stack, you may want to have their order be consistent so you dont have two blocks of text touching or two blocks of images.

Again, sorry about the length. I love flex-box. I hope this helped you.