is there a tool that will let me take 'functional screenshots'?

Question

It's one thing to grab screenshots of web sites and return to them for design and interface ideas and inspiration.

But increasingly I've found that when I want to examine something that previously caught my eye, the actual web site has since been altered, so I can no longer learn from the code.

I wonder: is there a tool available that would allow me to save interfaces in a format that would retain the html/css?

Thanks

Answer 1

Firefox. File -> Save page as..., select "Webpage, complete" and choose a destination directory. A file will be created, say example-page.htm with a directory containing other resources like CSS, images and javascripts in example-page_files.

Note: the HTML is modified to point to the directory with resources.

Answer 2

There are many places to view previous versions of a web page after the site has been updated. the web gets archived in a myiad of ways including user's browser caches, router caches, isp caches, search provider caches, ad tracking caches, third party caches, etc. Many are publicly searchable though none are perfectly reliable.

The two easiest resources to use are Google's cache and the Wayback Machine Internet Archive.