Веб-сервис для автоматизированной проверки решений учебных заданий по HTML-верстке

Автор: Рыженков Артем Дмитриевич, Лукьянов Константин Валерьевич

Журнал: Сетевое научное издание «Системный анализ в науке и образовании» @journal-sanse

Статья в выпуске: 3, 2023 года.

Бесплатный доступ

Задача автоматизированной проверки заданий по html-верстке востребована в процессе обучения основам веб-технологий как в учебных заведениях, так и при самоподготовке по соответствующим направлениям. В статье рассматриваются особенности проверки таких заданий, которые необходимо учитывать в случае автоматизированной проверки. Приводится алгоритм системы для реализации в виде веб-сервиса. Особенностью предлагаемой системы является реализация сравнения результата верстки с эталонным образцом различными методами, в том числе с использованием нейросети VGG16. Показано, что при должном задании порога схожести система сравнения изображений дает удовлетворительные результаты и может применяться для автоматизированной проверки заданий по верстке.

Еще

Информационная система, веб-сервис, html-верстка, headless-браузер, сравнение изображений, нейросети

Короткий адрес: https://sciup.org/14128799

IDR: 14128799

Список литературы Веб-сервис для автоматизированной проверки решений учебных заданий по HTML-верстке

  • Университет «Дубна»: Прикладная информатика в компьютерном дизайне. – URL: https://new2.uni-dubna.ru/directions/ae6b4579-ee8c-477e-b13a-783c33bc9fae (Дата обращения: 02.08.2023).
  • Reliable Screenshot API | Screenshot Machine. – Devtica s.r.o., 2012 - 2023. – URL: https://www.screenshotmachine.com/ (Дата обращения: 02.08.2023).
  • Screenshot API / Competitor Archive, LLC. – URL: https://www.screenshotapi.io/ (Дата обращения: 02.08.2023).
  • Using the Screen Capture API - Web APIs | MDN // MDM Web Docs. – URL: https://developer.mozilla.org/en-US/docs/Web/API/Screen_Capture_API/Using_Screen_Capture (Дата обращения: 02.08.2023).
  • html2canvas - Screenshots with JavaScript / Niklas von Hertzen. – URL: https://html2canvas.hertzen.com/ (Дата обращения: 02.08.2023).
  • Chrome Headless: How to take full page page screenshot // Open source code library - OneLinerHub. – URL: https://onelinerhub.com/chrome-headless/how-to-take-full-page-page-screenshot (Дата обраще-ния: 02.08.2023).
  • HtmlUnit // GitHub: [web platform]. – GitHub, Inc., 2023. – URL: https://github.com/HtmlUnit (Дата обращения: 24.02.2023).
  • PhantomJS - Scriptable Headless Browser. – PhantomJS contributors, 2010-2018. – URL: https://phantomjs.org (Дата обращения: 24.02.2023).
  • История версий Firefox - Firefox version history. – URL: https://ru.abcdef.wiki/wiki/Firefox_version_history (Дата обращения: 02.03.2023).
  • Firefox 55 — Mozilla — Новости. – URL: https://www.linux.org.ru/news/mozilla/13599508/page2 (Дата обращения: 03.03.2023).
  • Truong, T. Headless Chrome - What is it? – Дата публикации: 25.09.2021. – Дата обновления: 7.10. 2021. – URL: https://dev.to/thanhtr99270163/today-i-learned-headless-chrome-what-is-it-1dd.
  • MaxRokatansky. Headless тестирование в браузере. Плюсы и минусы // Хабр:[сайт]. – Habr, 2006–2023. – Дата публикации: 18.03.2019. – URL: https://habr.com/ru/companies/otus/articles/444248.
  • Statcounter Global Stats - Browser, OS, Search Engine including Mobile Usage Share. – StatCounter, 1999-2023. – URL: https://gs.statcounter.com/ (Дата обращения: 02.08.2023).
  • Кацапа Л. Среднеквадратическая ошибка (MSE). – Дата публикации: 03.04.2021. – URL: https://www.helenkapatsa.ru/sriedniekvadratichieskaia-oshibka.
  • Структурное сходство - Structural similarity. – URL: https://ru.abcdef.wiki/wiki/Structural_similarity (Дата обращения: 01.04.2023).
  • Милютин И.VGG16 — нейросеть для выделения признаков изображений // Neurohive – Нейронные сети: [сайт]. – Дата публикации: 23.11.2018. – URL: https://neurohive.io/ru/vidy-nejrosetej/vgg16-model.
  • Вектор средних и матрица ковариации. – URL: https://ab.al-shell.ru/articles/vektor-srednih-i-matritsa-kovariatsii (Дата обращения: 02.08.2023).
  • Рыженков А. Д. Веб-сервис для автоматизированной проверки корректности решения учебных заданий по верстке: Магистерская диссертация. — Дубна, 2023.
  • GitHub - JaidedAI/EasyOCR: Ready-to-use OCR with 80+ supported languages and all popular writing scripts including Latin, Chinese, Arabic, Devanagari, Cyrillic and etc. // GitHub: [web platform]. – GitHub, Inc., 2023. – URL: https://github.com/JaidedAI/EasyOCR (Дата обращения: 18.04.2023).
  • GitHub - opencv/opencv: Open Source Computer Vision Library // GitHub: [web platform]. – GitHub, Inc., 2023. – URL: https://github.com/opencv/opencv (Дата обращения: 18.04.2023).
  • Ермолаев, И. Алгоритм быстрого нахождения похожих изображений // Хабр:[сайт]. – Habr, 2006–2023. – Дата публикации: 22.06.2011. – URL: https://habr.com/ru/articles/122372.
  • Как измерить сходство между двумя изображениями? – URL: https://utyatnishna.ru/info/42419/how-can-i-measure-the-similarity-between-two-images (Дата обращения: 02.08.2023).
  • Сравнение сходства изображений и обнаружение конкретных объектов на изображениях // Русские блоги: [сайт]. – russianblogs.com, 2020-2023. – URL: https://russianblogs.com/article/71441215538 (Дата обращения: 02.08.2023).
  • NewTechAudit. ML-подходы по поиску похожих изображений / NewTechAudit // Хабр:[сайт]. – Habr, 2006–2023. – Дата публикации: 31.03.2023. – URL: https://habr.com/ru/articles/726122.
  • AutomaticLayoutCheck: [Веб-сервис по автоматизированной проверке учебных заданий по верстке] // GitHub: [web platform]. – GitHub, Inc., 2023. – URL: https://github.com/Jaldsky/AutomaticLayoutCheck (Дата обращения: 22.05.2023).
Еще
Статья научная