Skip to content
This day’s portion

In defence of view page source

Ever late to the web discussion party, I read CSS Tricks’ hardline stance on View Source, where Chris argues he’d be happy to get rid of it because you can glean more info about a page from dev tools.

The Firefox right-click menu in OS X with View Source highlighted

View page source is just a right-click away

While this is true, I think View page source offers a quick glimpse into the document author’s (or designer’s) mind; what they consider important, what they’re good at, what they’re not good at, even their “ethics” (assuming the bastard hasn’t inlined and minified everything, although even this suggests something):

The source code from the Skinny Guardian website

Skinny Guardian, inlined and minified. You can maybe make out a canonical link in the document head.

This is not information you’ll get quite as readily from dev tools, which focuses on the page’s granular, technical foundations rather than the way it’s been authored. When you View page source you can figure out the author’s “style” – how they indent their HTML, any comments they’ve added, how keen they are on divs, whether they use classes, whether they overuse IDs and what approach (if any) they take to CSS. That’s a lot of information from skimming a page:

The source code from leonpaternoster.com

Is that an unnecessary closing div I can spy?

So, interpreting my page, you could perhaps conclude I generally employ the correct HTML elements (a possibly “proper” b, no less), use divs sparingly but practically (and erroneously), controversially use abbr with a title, use Tachyons (or some form of atomic CSS framework) and use a templating system that messes up indentation slightly. Or that I’m not overparticular about indenting. This looks like a static site. As to what all this says about me, I’ll leave up to you, but you can no doubt form a picture.

The document’s head is always interesting, giving clues as to how SEO-crazy the author is, what software they use and some of what sort of “ethical” decisions I referred to earlier they’ve (not) made:

The source for the head of leonpaternoster.com

All that meta about me and the page

What is my head telling you? Well, I’m using an HTML 5 doctype (this would have meant a lot more in 2010, admittedly) and I’ve added a lang attribute to the html element. This makes me a fairly good web citizen. Perhaps more interestingly, the html element also has a class fearlessly attached to it, which would perhaps suggest I’m using rems to size stuff, which, in turn, may suggest a certain CSS competency (of course, we’re assuming I’m both document and template author).

Sometimes I self-close elements with />, sometimes >. Again, this would have been contentious in 2010, although there is perhaps some interest in seeing the method authors choose. Actually, this just annoys me, as I hadn’t noticed it. It indicates (quite rightly), that I’ve just been copying and pasting without editing. It’s a bit lazy, sloppy even.

And then there’s quite a lot of meta data. A Twitter card. There’s also some Dublin Core stuff – perhaps I’m bothered about semantics, and making my site understandable to machine readers, or maybe I’m worried about its SEO. Or maybe some combination. I definitely must be a good guy – there’s an RSS feed there (several, depending on the page you’re reading).

Finally, there’s some indie web stuff: webmention.io and a micro.blog link. Does that make me an up to date, independent freethinker, or another middle–aged web bloke? You decide.

It’s interesting investigating an author’s style and choices from their source code – it’s always one of the first things I do when I visit a designer or agency’s website. Take a quick look behind the scenes to get an idea of what’s really going on and the person (or machine) serving you words, pictures and layout. Although what this says about Twitter, I’m not sure:

The page source of Mobile Twitter consisting mainly of javascript

This says something, but you'll need dev tools to find out what

Liked this?

Consider subscribing to the RSS feed. That way, you’ll get notified whenever I post anything new. If you’re not sure about RSS feeds, I wrote a guide to RSS.

https://www.thisdaysportion.com/in-defence-of-view-page-source/

Previous post

Next post

Comments

Add a comment

Required fields marked * I won’t publish or share your email address. Privacy statement.

Comments are moderated and won’t appear straight away. Subscribe to the comments feed to see when new comments are published.

Poorchop

I agree with everything that you wrote here. I use this feature constantly, which means that Mozilla will probably remove it from Firefox soon enough. I think that trying to view a page’s source in Safari opens up the dev tools, and it’s just not the same.

I’m generally pretty particular about how I format my HTML and I write it under the assumption that someone might some day actually look at the source. I like using this feature to look at the source of other pages for all of the reasons that you mentioned. It’s also really nice to have a context menu option that opens a new tab where I can quickly do a ctrl+F for rss, xml, atom, or feed in order to locate the RSS feed address since more often than not, people don’t include the link anywhere on the page and web browser developers took the liberty of removing the feed discovery icon from browsers years ago.

Leon

Absolutely. View page source is a link between “real”, proper HTML and the reader.

I didn’t realise Safari had the option at all. Unsurprising I guess as it seems to want to hide absolutely every bit of UI from the user.