Can I inspect websites' source in teaching video?

Question

As a web developer, I find that we can learn a ton about HTML, CSS and JavaScript by opening the Developer Tools in Chromium and inspect elements, seeing the names other developer choose for their CSS classes, how some effects are achieved, etc...

I'm thinking about making a video where I demonstrate how powerful of a learning tool this is. I'm a bit torn on this, as anyone can do it for themselves, but still, readable source is not equal to open source.

So my question is: Can I inspect websites' source in teaching video?

Answer 1

Distribution on YouTube implicates, at least, US copyright law. Shropshire v. Canning 809 F.Supp.2d 1139 (N.D. Cal. 2011), Subafilms v. MGM 24 F.3d 1088 (9th Cir. 1994)

Are you infringing?

1. Is the original work eligible for copyright? "It is undisputed that computer programs— defined in the Copyright Act as a set of statements or instructions to be used directly or indirectly in a computer in order to bring about a certain result, can be subject to copyright protection as literary works." 17 USC 102, Oracle Am., Inc. v. Google, Inc., 750 F.3d 1339 (Fed. Cir. 2014) (internal citations omitted).

2. Are you making a copy or displaying the work publicly? (17 USC 106) You concede that you are doing this in the hypothetical, so we can skip this step.

3. Do you have permission to do this? Some work is licensed to allow your proposed use. If you have permission, then this entire answer is moot.

4. Are you taking what amounts to a substantial taking of the original? Presumably, you will not need to show the entire source file to present the naming conventions and techniques that other developers have used. But, what you do show will be an exact reproduction of the original. In the case of computer programs, all US districts use the abstraction-filtration-comparison test. Computer Associates International, Inc. v. Altai, Inc., 982 F.2d 693 (2d Cir. 1992).

   The abstraction stage of this test is irrelevant in this hypothetical because the reproduction is exact. Filtration excludes any uncopyrightable elements of the original from consideration (due to scènes à faire, merger, lack of originality). The comparison stage compares what remains after the filtration stage, to determine if the new work takes substantially from the original.

Fair use defense

If your use is found to be infringing based on the above analysis, the affirmative defense of fair use is available. I can't tell you whether a fair use defense would be applicable or successful in your particular case. However, you can search the US Copyright Office's Fair Use Index for many examples successful fair use defenses when a literary work was reproduced in part or whole for educational purposes.

There are also other affirmative defenses available (implied license, for example), or defenses that directly attack the elements of copyright infringement.

---

^{Some confusion exists regarding "idea/expression merger" as a defense after a prima facie case of copyright infringement has been made. This isn't completely correct. Where idea/expression merger enters the analysis differs from circuit to circuit. In the 6th circuit, merger enters in the copyrightability analysis (paragraph 1. above). But, the 2nd and 9th circuits treat merger as part of the infringement analysis (paragraph 4. above) and in the 9th circuit, merger is an affirmative defense. Ets-Hokin v. Skyy Spirits, Inc., 225 F.3d 1068 (9th Cir. 2000)}

^{The idea/expression merger doctrine is not implicated just because "the idea one that is expressing is 'this is the code they used.'" When you need to cite/show the original work for purposes of "criticism, comment, news reporting, teaching", that is a direct implication of fair use. Using using this justification triggers the full four-factor fair use analysis. (17 USC 107). You don't get to reproduce a work just because you want to say "this is the work they created."}

Answer 2

Since software can be copyrighted, like any original work, you will need to respect Fair Use. And even though your use will be educational, a form of entertainment or non-profit, those uses are not exceptions to Fair Use https://en.wikipedia.org/wiki/Fair_use#U.S._fair_use_factors . YouTube also clearly points this out: https://www.youtube.com/yt/copyright/fair-use.html#yt-copyright-protection.

As you point out, "readable source is not equal to open source." So you will need to show only small parts of someone else's website, and not use the capabilities of Developer Tools to modify on the fly the code (technically making a derivative work).

You are free to build your own sample website to use in your videos. It's not that big of a deal to make simple html pages, and you will own the copyright on those and can use them in your videos. You can adapt general ideas and code from other sites for your own demo site, but you can't fully copy or go beyond Fair Use.

But one possible way to do what you want to do (as you originally alluded to by mentioning open source) without coding your own original website is use GPL software as the basis for your code demos in your videos. https://www.gnu.org/licenses/quick-guide-gplv3 . GPL licenses were developed and are advocated by the Free Software Foundation http://www.fsf.org and they show that educational use of software - both in an administrative use in a school and as course materials - is covered in the license:

...(with) Free Software, the teacher can explain the basic subject and then hand out the source code for the student to read and learn.... Teachers can hand out to students copies of the programs they use in the classroom so that they can use them at home. With Free Software, copying is not only authorized, it is encouraged. https://www.gnu.org/education/edu-why.html

One of several web development environments that use GPL (see https://en.wikipedia.org/wiki/List_of_content_management_systems for more) is WordPress: https://wordpress.org/about/license/ WordPress also provides GPL themes - the design and "front end" to a web site - that install with WordPress and that you will typically use as code for your Developer Tools demonstrations.

As per the GPL license, you can modify a WordPress theme or the core libraries on the fly with Developer Tools to use for your educational videos. Read the whole GPL license to find out what you need to do if you want to distribute the modified code to viewers of the videos, if you do that; you need to include a copy of the GPL license.

The easiest thing to may be to go to https://wordpress.com and open a free account and use their hosting for a site to use as a demo in you videos.

I don't see an issue with YouTube and your videos; there are many videos about WordPress on YouTube, including on how to use Developer Tools: https://www.youtube.com/results?search_query=developer+tools . And German law appears to recognize the GPL licenses for software, but I couldn't find anything definitive; one reference is http://www.twobirds.com/en/news/articles/2007/review-german-gnu-general-public-license .

Answer 3

Perhaps such use would meet all the factors to be considered as "fair use" (e.g. U.S. fair use factors).