Веб-сервис для автоматизированной проверки решений учебных заданий по HTML-верстке
Автор: Рыженков Артем Дмитриевич, Лукьянов Константин Валерьевич
Журнал: Сетевое научное издание «Системный анализ в науке и образовании» @journal-sanse
Рубрика: Новые образовательные системы и технологии обучения
Статья в выпуске: 3, 2023 года.
Бесплатный доступ
Задача автоматизированной проверки заданий по html-верстке востребована в процессе обучения основам веб-технологий как в учебных заведениях, так и при самоподготовке по соответствующим направлениям. В статье рассматриваются особенности проверки таких заданий, которые необходимо учитывать в случае автоматизированной проверки. Приводится алгоритм системы для реализации в виде веб-сервиса. Особенностью предлагаемой системы является реализация сравнения результата верстки с эталонным образцом различными методами, в том числе с использованием нейросети VGG16. Показано, что при должном задании порога схожести система сравнения изображений дает удовлетворительные результаты и может применяться для автоматизированной проверки заданий по верстке.
Информационная система, веб-сервис, html-верстка, headless-браузер, сравнение изображений, нейросети
Короткий адрес: https://sciup.org/14128799
IDR: 14128799 | УДК: 004.5,
Web service for automated verification of solutions for HTML-layout educational tasks
The task of automated verification of html layout tasks is in demand in the process of learning the basics of web technologies both in educational institutions and during self-training in the relevant areas. The article discusses the features of checking such tasks, which must be taken into account in the case of automated verification. The algorithm of the system for implementation in the form of a web service is given. A feature of the proposed system is the implementation of comparing the layout result with the reference sample by various methods, including using the VGG16 neural network. It is shown that when the similarity threshold is properly set, the image comparison system gives satisfactory results and can be used for automated verification of layout tasks.
Список литературы Веб-сервис для автоматизированной проверки решений учебных заданий по 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).
