Есть ли метод (кроме проб и ошибок), который я могу использовать, чтобы найти неиспользуемые файлы изображений? Как насчет объявлений CSS для идентификаторов и классов, которые даже не существуют на сайте?
Кажется, что может быть способ написать скрипт, который сканирует сайт, профилирует его и видит, какие изображения и стили никогда не загружаются.
[удалено устаревший ответ]
..................
Вам не нужно платить за какой-либо веб-сервис или искать дополнение, у вас уже есть это в Google Chrome под F12 (Inspector)->Audits->Remove unused CSS rules
Снимок экрана: 
Обновление: 30 июня 2017 г.
Теперь Chrome 59 обеспечивает покрытие кода CSS и JS. Смотрите https://developers.google.com/web/updates/2017/04/devtools-release-notes#coverage
На уровне файла:
используйте wget, чтобы настойчиво развернуть сайт, а затем обработать журналы http-сервера, чтобы получить список файлов, доступ к которым можно получить, разделить это с файлами на сайте
diff \
<(sed some_rules httpd_log | sort -u) \
<(ls /var/www/whatever | sort -u) \
| grep something
CSS Redundancy Checker - это инструмент, который вы запускаете локально, в котором вы передаете таблицу стилей и либо список URL-адресов, либо каталог файлов HTML, Здесь описание, приведенное на сайте инструмента:
Простой script, который, учитывая таблицу стилей CSS и файл .txt перечисление URL-адресов файлов HTML или каталога файлов HTML, будет повторяться над ними и перечислить инструкции CSS в таблице стилей, которые никогда не вызывается в HTML.
В основном, это помогает вам сохранить ваши файлы CSS релевантными и компактными. А также это достаточно точно.
Попробуйте WARI - Инспектор ресурсов веб-приложений.
Он находит неиспользуемые изображения, неиспользуемые и повторяющиеся CSS/JS.
Ссылка: wari.konem.net
Как отметил Тим Муртау на блоге A List Apart, "Два инструмента для сохранения вашего CSS-чипа:
csscss будет анализировать любые файлы CSS, которые вы им даете, и сообщите, какие в наборах правил дублируются объявления.
И самое актуальное для вопроса:
helium-css
Гелий - это инструмент для обнаружения неиспользуемого CSS на многих страницах в Интернете сайт.
Инструмент основан на javascript и работает в браузере.
Helium принимает список URL-адресов для разных разделов сайта, тогда загружает и анализирует каждую страницу, чтобы создать список всех таблиц стилей. Это затем посещает каждую страницу в списке URL-адресов и проверяет, найденные в таблицах стилей, используются на страницах. Наконец, он генерирует отчет, в котором описывается каждая таблица стилей и селекторов, которые не были найденный для использования на любой из указанных страниц.
Кажется, я вспоминаю, что Adobe Dreamweaver или Adobe Golive имеют функцию поиска как сиротных стилей, так и изображений; не могу вспомнить, что сейчас. Возможно, оба, но функции были хорошо скрыты.
TopStyle имеет набор инструментов для поиска и работы с сиротскими классами. Он также предоставит вам отчеты о том, где идентификаторы и классы используются в HTML, позволяя вам быстро открыть и перейти к соответствующей разметке. Здесь размещена реклама с веб-сайта относительно этой функции:
Отчеты о сайтах: см. стили используются на вашем сайте. Узнать где вы применяли классы стиля которые не определены ни в одном стиле листы или посмотрите, какие классы стиля вы определили, что не используются.
Очень полезно для рассечения незнакомых сайтов.
Однако он не находит неиспользуемые изображения.
У Chrome canary build есть опция в панели инструментов разработчика для " Покрытие CSS" как одна из экспериментальных возможностей разработчика. Эти параметры отображаются на вкладке временной шкалы и могут использоваться для получения списка неиспользуемого CSS.
Обратите внимание, что вам также необходимо включить эту функцию в настройках на панели инструментов разработчика. Эта функция должна, вероятно, перейти на официальный релиз хрома.
Я нашел этот инструмент, который работает со всеми версиями Firefox! Понадобится немного времени, чтобы узнать, как это работает, но как только оно начинается, это кажется очень хорошим. Он сохранит новую версию CSS с отмеченными селекторами CSS, чтобы вы могли быстро вернуться, если вам нужно.
Этот небольшой инструмент дает вам список правил CSS, используемых некоторыми html.
Здесь он находится на Code Pen
Нажмите Run code snippet, затем нажмите Full page, чтобы войти в него. Затем следуйте инструкциям в фрагменте. Вы можете запустить полную страницу, чтобы увидеть, как она работает с вашим html/css.
Но проще всего пометить ручку кода как инструмент.
/* CSS CLEANER INSTRUCTIONS
1. Paste your HTML into the HTML window
2. Paste your CSS into the CSS window
5. The web page result now ends with a list of just the CSS used by your HTML!
*/
function cssRecursive(e) {
var cssList = css(e);
for (var i = 0; i < e.children.length; ++i) {
var childElement = e.children[i];
cssList = union(cssList, cssRecursive(childElement));
}
return cssList;
}
function css(a) {
var sheets = document.styleSheets,
o = [];
a.matches = a.matches || a.webkitMatchesSelector || a.mozMatchesSelector || a.msMatchesSelector || a.oMatchesSelector;
for (var i in sheets) {
var rules = sheets[i].rules || sheets[i].cssRules;
for (var r in rules) {
if (a.matches(rules[r].selectorText)) {
o.push(rules[r].cssText);
}
}
}
return o;
}
function union(x, y) {
return unique(x.concat(y));
};
function unique(x) {
return x.filter(function(elem, index) {
return x.indexOf(elem) == index;
});
};
document.write("<br/><hr/><code style='background-color:white; color:black;'>");
var allCss = cssRecursive(document.body);
for (var i = 0; i < allCss.length; ++i) {
var cssRule = allCss[i];
document.write(cssRule + "<br/>");
}
document.write("</code>");Все перечисленные здесь инструменты отлично подходят для CSS. Я не знаю о Dreamweaver и Co. Но я сделал небольшую программу некоторое время назад, чтобы помочь мне очистить мои проекты веб-сайтов.
Это не помогает с CSS и другими, но вместо этого с потерянными изображениями и другими типами файлов.
Надеюсь, что это поможет!
Helium CSS - отличный инструмент для этого. Следует отметить, однако, что вы должны запустить этот инструмент для разработки или локальной версии вашего сайта. Если вы запустите это на производственной версии, ваши посетители смогут увидеть тестовую среду Helium.
Чтобы ответить на вопрос об инструменте поиска неиспользуемых файлов изображений, вы можете использовать Xenu Link Sleuth, чтобы развернуть свой сайт, чтобы найти все изображения, которые использует ваш сайт. Затем Xenu предлагает вам доступ к ftp, чтобы он мог сканировать ваши каталоги, чтобы найти потерянные файлы. Я еще не использовал его на производственном сервере, но это кажется достойным изучения.
EDIT: вам просто нужно быть осторожным, чтобы не удалять изображения, которые используются javascript.