Вставьте исходный код страницы — и увидите её глазами нашего
обходчика: заголовок, описание, канонический адрес, заголовки первого уровня,
объём видимого текста и то, сколько весит разметка. Ровно те же выражения,
что и в нашем коде, — не «похожая логика», а её копия, сверяемая тестом.
Почему вставить, а не ввести адрес. Сходить по адресу
страница не может: браузер запрещает, а сервер, который сделал бы это за вас,
узнал бы, какие адреса вы проверяете. Исходный код открывается в браузере
сочетанием Ctrl+U (⌥⌘U на Mac).
")
.reduce((sum, m) => sum + new TextEncoder().encode(m).length, 0),
text: html.replace(/<(script|style)[^>]*>[\s\S]*?<\/\1>/gi, " ")
.replace(TAG, " ").replace(/\s+/g, " ").trim()
};
}
// RU: Замечания — те же пороги, что в нашем аудите: заголовок до 70 символов,
// описание до 180, один h1. Пороги названы числами прямо в тексте замечания:
// «слишком длинный» без числа заставляет гадать, насколько.
// EN: The remarks use the same thresholds as our own audit: a title up to 70 characters, a
// description up to 180, one h1. The thresholds are named as numbers inside the remark: "too
// long" without a number leaves people guessing by how much.
const TITLE_MAX = 70;
const DESCRIPTION_MAX = 180;
function pageRemarks(page) {
const remarks = [];
if (!page.title) remarks.push("нет заголовка — в выдаче он и есть ссылка");
else if (page.title.length > TITLE_MAX) {
remarks.push("заголовок длиннее " + TITLE_MAX + " символов (" + page.title.length +
"): хвост обрежется в выдаче");
}
if (!page.description) remarks.push("нет описания: сниппет соберётся из текста наугад");
else if (page.description.length > DESCRIPTION_MAX) {
remarks.push("описание длиннее " + DESCRIPTION_MAX + " символов (" +
page.description.length + ")");
}
if (page.h1.length === 0) remarks.push("нет h1: у страницы нет главного заголовка");
if (page.h1.length > 1) remarks.push("h1 больше одного (" + page.h1.length +
"): непонятно, о чём страница");
if (!page.canonical) remarks.push("нет канонического адреса: дубликаты разойдутся по индексу");
if (page.text.length < 200) {
remarks.push("видимого текста " + page.text.length +
" символов: индексировать почти нечего");
}
return remarks;
}
// ==== /ЯДРО ====
const $ = id => document.getElementById(id);
const NAMES = {title: "Заголовок", description: "Описание", canonical: "Канонический адрес",
h1: "Заголовки h1", scripts: "Скриптов", bytes_html: "Размер разметки, байт",
inline_css: "Стили в странице, байт", inline_js: "Скрипты в странице, байт"};
$("run").addEventListener("click", () => {
const page = inspectPage($("html").value);
const remarks = pageRemarks(page);
const box = $("out");
box.className = "verdict " + (remarks.length ? "no" : "yes");
box.innerHTML = remarks.length
? "<b>Замечаний: " + remarks.length + "</b><p class=\"why\">" +
remarks.map(x => "· " + x).join("<br>") + "</p>"
: "<b>Замечаний нет</b><p class=\"why\">Страница читается так, как задумана.</p>";
const rows = ["<tr><th>Поле</th><th>Что видим</th></tr>"];
for (const key of Object.keys(NAMES)) {
const value = Array.isArray(page[key]) ? page[key].join(" · ") : page[key];
rows.push("<tr><td>" + NAMES[key] + "</td><td>" +
String(value === "" ? "—" : value).replace(/</g, "<") + "</td></tr>");
}
rows.push("<tr><td>Видимого текста, символов</td><td>" + page.text.length + "</td></tr>");
$("fields").innerHTML = rows.join("");
$("fields").hidden = false;
});
</script>
<footer>
<p>Инструмент работает целиком в браузере: введённые данные никуда не отправляются
и страницу не покидают. Проверить просто — отключите сеть, страница продолжит работать.</p>
<p><a href="/tools/">Все инструменты</a> · <a href="/bot">О боте</a> ·
<a href="/">Yottis</a></p>
</footer>
</div>
</body>
</html>