Fast Company inline images are pulled into article

[leibovic]

http://www.fastcompany.com/3042433/steve-jobs/the-real-legacy-of-steve-jobs

[n1k0]

These inline images are in the form:

<p>
  … text…
  <a href="//www.fastcompany.com/person/jon-rubinstein" class="fc-plugin people-page" data-name="peoplePages" data-id="fastcompany|node|3022797">
    <img src="//f.fastcompany.net/multisite_files/fastcompany/imagecache/320x240/p-1-mcp-Jon-Rubenstein-P4A0246.jpg">Jon Rubinstein</a>
  … text…
</p>

Removing these is tedious task, as we can't rely on computed styles to see if they're hidden or not. In this case this is especially bad as they're using very large images.

The more I think about it, the more Gavin's idea of having per-site rules for readability seems to be the way to go, at least for very popular sites like this one.

[gijsk]

Seems like we should be able to just remove images inside links if there is also text inside the link in all cases?

[n1k0]

Seems like we should be able to just remove images inside links if there is also text inside the link in all cases?

That could be a very fast first step indeed (though that would add more processing to something already heavy), but the argument for a longer-term strategy having site-specific rules still stands, as we're much likely to find other edge cases like this one in the future, and covering all the different edge cases using a common universal algorithm will probably tend to become even more complicated (yes, that's a bet)…

[n1k0]

Seems like we should be able to just remove images inside links if there is also text inside the link in all cases?

Now I think a little more about it, imagine a website having markup like this:

<div>
  lorem ipsum…
  <a href="images/full.jpg" style="display:block">
    <img src="images/small.jpg"/><br>
    image caption
  </a>
  blah
</div>

:/

[gijsk]

Right, but then there's another element inside the <a>.

[leibovic]

It's kinda gross, but as a short-term solution, could we use some site-specific CSS selector to just hide these images in aboutReader.css?

[n1k0]

That could be a good short-term solution, though that wouldn't scale imho, see #89 (comment)