Лучник *range attack +10*

И да, и нет: у вас очень расплывчатая формулировка. Непонятно, насколько осмысленным и обработанным должен быть итоговый результат, насколько допустим мусор.

Скачать страницу, построить дерево документа и какими-то элементарными эвристиками вырезать ненужное (меню, сайдбары, подвалы, рекламу и т.п.) относительно просто, но результат будет довольно грубый с неудовлетворительным соотношением сигнал/шум.

Для повышения универсальности инструмента, потребуется увеличивать количество и сложность этих эвристик. А ещё можно подключить туда машинное обучение, чтобы они сами себя улучшали.
И вот вы уже хотите написать что-то вроде поискового паука. Представьте, сколько сил вложено в разработку паука Яндекса или Гугла. У вас есть такие возможности? А ведь мало его просто написать, надо поддерживать, следить за новыми стандартами...

Парсинг сайтов - это задача, которая легко решается людьми, но плохо даётся роботам. Если смотреть с точки зрения бизнеса, то гораздо дешевле и эффективнее будет посадить джуниора, который будет писать отдельные правила парсинга под каждый сайт, чем пытаться конкурировать с Гуглом.

responsinator

Есть ли какой-нибудь веб-сервис или набор браузеров разных версий, чтобы тестировать сайт можно было легко и быстро под кучей старых версий?

browserstack.com

птому что флоат это не прижимание а обтекание.

Ваше спасение - gulp-svg-sprite.
Умеет собирать спрайты в четырёх разных режимах, режим для css-background тоже есть. Генерирует стили с уже установленными координатами иконки в спрайте. Для интерактивного svg background не подходит.
Я пользуюсь режимом symbol, всё работает примерно так:

1. В svg-иконке в качестве цвета необходимого атрибута пишем currentColor (fill="currentColor" или stroke="currentColor", смотря что нужно красить).
   
2. Собираем спрайт, рендерим его на странице. Элементы symbol не отображаются до вызова.
   
3. В элементе, где нужна иконка, используем
   

   <svg>
       <use style="color: rebeccapurple" xlink:href="id_элемента_спрайта"></use>
   </svg>

   
   
   

Цвет из color наследуется внутри иконки везде, где используется currentColor. Можно развлекаться с CSS! (transition вам в помощь)

Минусы:

• Активно управлять можно только одним цветом.
  
• Это не background.
  

Мой gulp, там найдёте конфигурацию gulp-svg-sprite.
Пример использования (иконки соцсетей в правом верхнем углу).

Только что решал эту задачу. Вернее, пытался решить - невозможно это сделать. Есть костыли с фильтрами и масками, но они не везде поддерживаются, не всегда применимы и вообще костыли (статья).
Единственный вариант - инлайнить svg в документ, но это тоже нетривиальная задача (SO-1, SO-2, SO-3).

Живосайт отображает Ваш сайт во фрейме, чтобы когда Вы переходили по ссылкам виджет не скрывался