diff --git a/site/about.html b/site/about.html new file mode 100644 index 0000000..9b154df --- /dev/null +++ b/site/about.html @@ -0,0 +1,320 @@ + + + + + + О проекте - EasyAccess + + + + + + +
+
+ +
+
+ +
+
+
+

О проекте EasyAccess

+

Инновационное решение для повышения доступности веб-сайтов

+
+
+ +
+
+
+
+

Что такое EasyAccess?

+

+ EasyAccess представляет собой комплексное браузерное расширение, разработанное для универсальной + модификации веб-страниц с целью повышения доступности контента, отраженного на сайте. + Приложения предназначено для лиц с ограниченными возможностями здоровья. +

+

+ Расширение объединяет в себе возможности нескольких специализированных решений и предоставляет + дополнительные функции, включая работу с документами и распознавание голоса. Основная цель проекта - + сделать интернет более доступным для всех пользователей, независимо от их физических ограничений. +

+
+
+ Иллюстрация концепции EasyAccess +
+
+
+
+ +
+
+

Проблема веб-доступности

+
+
+
+ Иконка проблемы +
+

Статистика

+

+ По данным Всемирной организации здравоохранения, более 1 миллиарда людей в мире живут с той или иной + формой инвалидности. В России насчитывается около 11,9 миллионов людей с ограниченными возможностями. + Все эти люди могут испытывать трудности при использовании веб-ресурсов, не адаптированных должным образом. +

+
+
+
+ Иконка стандартов +
+

Стандарты

+

+ Существуют международные стандарты и рекомендации по обеспечению веб-доступности, такие как WCAG + (Web Content Accessibility Guidelines), разработанные W3C. В Российской Федерации вопросы доступности + веб-ресурсов регулируются ГОСТ Р 52872-2019, который устанавливает требования к доступности интернет-ресурсов. +

+
+
+
+ Иконка решения +
+

Решение

+

+ EasyAccess предлагает уникальный подход к решению проблемы веб-доступности через систему пакетов + модификаций, которые могут быть применены к определенным веб-сайтам для повышения их доступности. + Это позволяет адаптировать контент под конкретные потребности пользователей с различными ограничениями. +

+
+
+
+
+ +
+
+

Цели и задачи проекта

+
+
+

Основная цель

+

+ Разработать универсальное браузерное расширение EasyAccess, способное повышать доступность веб-сайтов + и добавлять к ним новую функциональность через систему пакетов модификаций. +

+
+
+

Задачи проекта

+
    +
  • Провести анализ существующих решений по обеспечению доступности веб-ресурсов
  • +
  • Разработать архитектуру расширения, позволяющую гибко настраивать его функциональность
  • +
  • Спроектировать и реализовать базу данных для хранения пакетов модификаций
  • +
  • Разработать серверную инфраструктуру для обеспечения работы расширения
  • +
  • Создать систему пакетов модификаций для повышения доступности веб-сайтов
  • +
  • Реализовать модули для сканирования документов и обработки аудио файлов
  • +
  • Обеспечить удобный пользовательский интерфейс, соответствующий принципам доступности
  • +
  • Разработать веб-редактор для создания пакетов модификаций
  • +
  • Подготовить инфраструктуру для развертывания проекта с использованием Docker
  • +
  • Сформировать документацию проекта и поддерживать её актуальность
  • +
+
+
+
+
+ +
+
+

Архитектура проекта

+

+ Разрабатываемое расширение EasyAccess имеет многокомпонентную архитектуру, которая обеспечивает + эффективное разделение функциональности, безопасность и высокую производительность приложения. +

+
+ Диаграмма архитектуры EasyAccess +
+
+
+

Клиентская часть (Frontend)

+

+ Разработана с использованием TypeScript и библиотек React/Solid.js. Клиентская часть включает интерфейс браузерного расширения, + компоненты для редактирования пакетов модификаций и взаимодействие с Chrome Extension API. Ключевые компоненты разработаны + с применением реактивной архитектуры для оптимальной производительности. +

+
+
+

Серверная часть (Backend)

+

+ Реализована на языке Go для основной серверной части и взаимодействия с базой данных. Выбор Go обусловлен + высокой производительностью и эффективностью при обработке параллельных запросов. Дополнительные модули + на Python отвечают за обработку данных, распознавание голоса и документов с использованием библиотек машинного обучения. +

+
+
+

База данных

+

+ Основана на PostgreSQL с расширением TimescaleDB для эффективной работы с временными рядами данных. + База данных включает 12 основных таблиц и использует материализованные представления для оптимизации + запросов. Применяется Supabase для управления пользователями и аутентификации. +

+
+
+

Система пакетов модификаций

+

+ Ключевой компонент расширения, позволяющий создавать, управлять и применять наборы CSS/JavaScript + модификаций к веб-страницам. Система пакетов реализует изоляцию скриптов и механизмы безопасности + при внедрении в DOM-структуру страниц. +

+
+
+
+
+ +
+
+

Уникальные преимущества EasyAccess

+
+
+
+
Функциональность
+
EasyAccess
+
Другие решения
+
+
+
Универсальный подход
+
+
+
+
+
Система пакетов модификаций
+
+
+
+
+
Расширенная функциональность
+
+
~
+
+
+
Фокус на российский рынок
+
+
+
+
+
Открытая платформа
+
+
~
+
+
+
+

+ В результате сравнительного анализа подтверждена актуальность разработки EasyAccess как комплексного + решения, объединяющего возможности существующих специализированных расширений и предлагающего + дополнительную функциональность для повышения доступности веб-ресурсов. +

+
+
+ +
+
+

Практическая значимость

+

+ Практическая значимость проекта заключается в создании универсального инструмента, который может быть + использован для решения широкого спектра задач по повышению доступности веб-ресурсов: +

+
+
+
+ Нарушения зрения +
+

Для пользователей с нарушениями зрения

+

+ Изменение внешнего вида веб-сайтов: настройка контрастности, размера текста, цветовых схем. + Добавление альтернативного текста к изображениям и распознавание текста из изображений. +

+
+
+
+ Двигательные нарушения +
+

Для пользователей с двигательными нарушениями

+

+ Улучшение навигации и обеспечение полной доступности сайта с клавиатуры. + Голосовое управление для пользователей с ограниченными возможностями самостоятельного ввода. +

+
+
+
+ Когнитивные нарушения +
+

Для пользователей с когнитивными нарушениями

+

+ Персонализация интерфейсов: упрощение навигации, удаление отвлекающих элементов, + структурирование информации для лучшего восприятия. +

+
+
+
+ Организации +
+

Для организаций

+

+ Обеспечение доступности веб-ресурсов для всех категорий пользователей без необходимости + значительной переработки существующих сайтов и приложений. +

+
+
+
+
+
+ + + + + + diff --git a/site/css/about.css b/site/css/about.css new file mode 100644 index 0000000..efec55e --- /dev/null +++ b/site/css/about.css @@ -0,0 +1,525 @@ +/* Database Structure */ +.database-structure { + padding: 5rem 0; + background-color: var(--bg-secondary); +} + +.database-tables { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 2rem; + margin: 3rem 0; +} + +.table-card { + background-color: var(--bg-color); + border-radius: var(--border-radius-lg); + padding: 1.75rem; + box-shadow: var(--shadow-md); + transition: transform var(--transition-normal); +} + +.table-card:hover { + transform: translateY(-5px); +} + +.table-card h3 { + font-size: 1.1rem; + color: var(--primary-color); + margin-bottom: 0.75rem; +} + +.table-card p { + font-size: 0.95rem; + color: var(--text-secondary); + margin-bottom: 0; +} + +.database-features { + background-color: var(--bg-color); + border-radius: var(--border-radius-lg); + padding: 2rem; + box-shadow: var(--shadow-md); + margin-bottom: 3rem; +} + +.database-features h3 { + font-size: 1.25rem; + margin-bottom: 1rem; +} + +.database-features ul { + list-style-type: none; + padding: 0; + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 1rem; +} + +.database-features li { + position: relative; + padding-left: 1.75rem; + font-size: 0.95rem; + color: var(--text-secondary); +} + +.database-features li::before { + content: '✓'; + position: absolute; + left: 0; + color: var(--accent-color); + font-weight: bold; +} + +.database-diagram { + max-width: 900px; + margin: 0 auto; + border-radius: var(--border-radius-lg); + overflow: hidden; + box-shadow: var(--shadow-lg); +} + +.database-diagram img { + width: 100%; + height: auto; + display: block; +} + +.image-caption { + display: block; + padding: 0.75rem; + text-align: center; + background-color: var(--bg-tertiary); + color: var(--text-tertiary); + font-size: 0.875rem; +} + +@media (max-width: 768px) { + .database-features ul { + grid-template-columns: 1fr; + } +}/* Стили для страницы О проекте */ + +/* Page Hero */ +.page-hero { + padding: 8rem 0 4rem; + background: linear-gradient(135deg, var(--secondary-color) 0%, #f0f7ff 100%); + text-align: center; + position: relative; + overflow: hidden; +} + +.page-hero::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-image: url('../images/pattern.svg'); + background-size: cover; + opacity: 0.1; + z-index: 1; +} + +.page-hero .container { + position: relative; + z-index: 2; +} + +.page-subtitle { + font-size: 1.25rem; + color: var(--text-secondary); + max-width: 700px; + margin: 0 auto; +} + +/* About Intro */ +.about-intro { + padding: 5rem 0; +} + +.about-content { + display: flex; + align-items: center; + gap: 4rem; +} + +.about-text { + flex: 1; +} + +.about-text p { + font-size: 1.125rem; + color: var(--text-secondary); + margin-bottom: 1.5rem; +} + +.about-image { + flex: 1; + display: flex; + justify-content: center; + align-items: center; +} + +.about-image img { + max-width: 100%; + height: auto; + border-radius: var(--border-radius-lg); + box-shadow: var(--shadow-lg); +} + +/* Accessibility Info */ +.accessibility-info { + padding: 5rem 0; + background-color: var(--bg-secondary); +} + +.info-blocks { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 2rem; + margin-top: 3rem; +} + +.info-block { + background-color: var(--bg-color); + border-radius: var(--border-radius-lg); + padding: 2rem; + box-shadow: var(--shadow-md); + transition: transform var(--transition-normal); +} + +.info-block:hover { + transform: translateY(-5px); +} + +.info-icon { + width: 64px; + height: 64px; + background-color: var(--secondary-color); + border-radius: 16px; + display: flex; + align-items: center; + justify-content: center; + margin-bottom: 1.5rem; +} + +.info-icon img { + width: 32px; + height: 32px; +} + +.info-block h3 { + margin-bottom: 1rem; + font-size: 1.25rem; +} + +.info-block p { + color: var(--text-secondary); + font-size: 1rem; +} + +/* Project Goals */ +.project-goals { + padding: 5rem 0; +} + +.goals-content { + display: flex; + gap: 4rem; + margin-top: 3rem; +} + +.goal-main, .goals-list { + flex: 1; +} + +.goal-main { + background-color: var(--bg-secondary); + border-radius: var(--border-radius-lg); + padding: 2.5rem; + box-shadow: var(--shadow-md); +} + +.goal-main h3 { + color: var(--primary-color); + margin-bottom: 1rem; +} + +.goal-main p { + font-size: 1.125rem; + color: var(--text-secondary); +} + +.goals-list h3 { + margin-bottom: 1.5rem; +} + +.goals-list ul { + list-style: none; + padding: 0; +} + +.goals-list li { + position: relative; + padding-left: 2rem; + margin-bottom: 1rem; + font-size: 1.05rem; + color: var(--text-secondary); +} + +.goals-list li::before { + content: '✓'; + position: absolute; + left: 0; + color: var(--accent-color); + font-weight: bold; +} + +/* Project Architecture */ +.project-architecture { + padding: 5rem 0; + background-color: var(--bg-secondary); +} + +.section-intro { + font-size: 1.125rem; + color: var(--text-secondary); + max-width: 800px; + margin: 0 auto 3rem; + text-align: center; +} + +.architecture-diagram { + max-width: 900px; + margin: 0 auto 4rem; + border-radius: var(--border-radius-lg); + overflow: hidden; + box-shadow: var(--shadow-lg); +} + +.architecture-description { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 2rem; +} + +.arch-component { + background-color: var(--bg-color); + border-radius: var(--border-radius-md); + padding: 1.5rem; + box-shadow: var(--shadow-md); +} + +.arch-component h3 { + color: var(--primary-color); + font-size: 1.1rem; + margin-bottom: 0.75rem; +} + +.arch-component p { + color: var(--text-secondary); + font-size: 0.95rem; +} + +/* Unique Features */ +.unique-features { + padding: 5rem 0; +} + +.features-comparison { + max-width: 800px; + margin: 3rem auto; +} + +.features-table { + width: 100%; + border-radius: var(--border-radius-lg); + overflow: hidden; + box-shadow: var(--shadow-md); +} + +.table-row { + display: flex; +} + +.table-row:nth-child(odd) { + background-color: var(--bg-color); +} + +.table-row:nth-child(even) { + background-color: var(--bg-secondary); +} + +.table-header { + background-color: var(--primary-color) !important; + color: white; + font-weight: var(--font-weight-bold); +} + +.table-cell { + flex: 1; + padding: 1rem 1.5rem; + display: flex; + align-items: center; + justify-content: center; +} + +.feature-name { + justify-content: flex-start; + font-weight: var(--font-weight-medium); +} + +.check { + color: var(--accent-color); + font-size: 1.5rem; +} + +.cross { + color: #e11d48; + font-size: 1.5rem; +} + +.partial { + color: #f59e0b; + font-size: 1.5rem; +} + +.features-note { + max-width: 800px; + margin: 2rem auto 0; + text-align: center; + color: var(--text-secondary); + font-size: 1rem; +} + +/* Practical Significance */ +.practical-significance { + padding: 5rem 0; + background-color: var(--bg-secondary); +} + +.significance-points { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 2rem; + margin-top: 3rem; +} + +.point-card { + background-color: var(--bg-color); + border-radius: var(--border-radius-lg); + padding: 2rem; + box-shadow: var(--shadow-md); + display: flex; + flex-direction: column; + height: 100%; +} + +.point-icon { + width: 64px; + height: 64px; + background-color: var(--secondary-color); + border-radius: 16px; + display: flex; + align-items: center; + justify-content: center; + margin-bottom: 1.5rem; +} + +.point-icon img { + width: 32px; + height: 32px; +} + +.point-card h3 { + font-size: 1.1rem; + margin-bottom: 1rem; +} + +.point-card p { + font-size: 0.95rem; + color: var(--text-secondary); + flex-grow: 1; +} + +/* Responsive Styles */ +@media (max-width: 1024px) { + .about-content { + gap: 3rem; + } + + .goals-content { + gap: 3rem; + } +} + +@media (max-width: 768px) { + .about-content { + flex-direction: column-reverse; + } + + .about-image { + margin-bottom: 2rem; + } + + .goals-content { + flex-direction: column; + } + + .table-row { + flex-direction: column; + } + + .table-header { + display: none; + } + + .table-cell { + padding: 0.75rem; + } + + .feature-name { + background-color: var(--primary-light); + color: white; + padding: 0.75rem; + font-weight: var(--font-weight-medium); + border-top-left-radius: var(--border-radius-sm); + border-top-right-radius: var(--border-radius-sm); + } + + .table-cell:not(.feature-name) { + border-bottom: 1px solid var(--bg-tertiary); + } + + .table-cell:nth-child(2)::before { + content: 'EasyAccess: '; + margin-right: 0.5rem; + font-weight: var(--font-weight-medium); + } + + .table-cell:nth-child(3)::before { + content: 'Другие решения: '; + margin-right: 0.5rem; + font-weight: var(--font-weight-medium); + } +} + +@media (max-width: 576px) { + .page-hero { + padding: 6rem 0 3rem; + } + + .page-subtitle { + font-size: 1.1rem; + } + + .info-blocks, .architecture-description, .significance-points { + grid-template-columns: 1fr; + } + + .goal-main, .goals-list { + padding: 1.5rem; + } +} \ No newline at end of file diff --git a/site/css/home.css b/site/css/home.css new file mode 100644 index 0000000..8a3986f --- /dev/null +++ b/site/css/home.css @@ -0,0 +1,429 @@ +/* Стили для главной страницы */ + +/* Hero Section */ +.hero { + padding: 5rem 0; + background: linear-gradient(135deg, var(--secondary-color) 0%, #f0f7ff 100%); + position: relative; + overflow: hidden; +} + +.hero::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-image: url('../images/pattern.svg'); + background-size: cover; + opacity: 0.1; + z-index: 1; +} + +.hero .container { + position: relative; + z-index: 2; + display: flex; + align-items: center; + justify-content: space-between; + gap: 2rem; +} + +.hero-content { + flex: 1; + max-width: 600px; +} + +.hero h1 { + font-size: 3.5rem; + line-height: 1.1; + margin-bottom: 1.5rem; +} + +.hero-description { + font-size: 1.25rem; + color: var(--text-secondary); + margin-bottom: 2rem; + max-width: 500px; +} + +.hero-cta { + display: flex; + gap: 1rem; +} + +.hero-image { + flex: 1; + display: flex; + justify-content: flex-end; + align-items: center; +} + +.hero-image img { + max-width: 550px; + width: 100%; + filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.1)); + animation: float 6s ease-in-out infinite; +} + +@keyframes float { + 0% { + transform: translateY(0px); + } + 50% { + transform: translateY(-20px); + } + 100% { + transform: translateY(0px); + } +} + +/* Project Summary */ +.project-summary { + padding: 5rem 0; +} + +.summary-content { + display: flex; + gap: 4rem; + align-items: flex-start; +} + +.summary-text { + flex: 3; +} + +.summary-text p { + font-size: 1.125rem; + margin-bottom: 1.5rem; + color: var(--text-secondary); +} + +.summary-stats { + flex: 2; + display: flex; + flex-wrap: wrap; + gap: 2rem; + justify-content: space-between; +} + +.stat-item { + display: flex; + flex-direction: column; + align-items: center; + text-align: center; + min-width: 120px; +} + +.stat-number { + font-size: 3.5rem; + font-weight: var(--font-weight-bold); + color: var(--primary-color); + line-height: 1; + margin-bottom: 0.5rem; +} + +.stat-label { + font-size: 1rem; + color: var(--text-tertiary); +} + +/* Features Section */ +.features { + padding: 5rem 0; +} + +.features-grid { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); + gap: 2rem; + margin-top: 3rem; +} + +.feature-card { + background-color: var(--bg-color); + border-radius: var(--border-radius-lg); + padding: 2rem; + box-shadow: var(--shadow-md); + transition: transform var(--transition-normal), box-shadow var(--transition-normal); +} + +.feature-card:hover { + transform: translateY(-5px); + box-shadow: var(--shadow-lg); +} + +.feature-icon { + width: 64px; + height: 64px; + background-color: var(--secondary-color); + border-radius: 16px; + display: flex; + align-items: center; + justify-content: center; + margin-bottom: 1.5rem; +} + +.feature-icon img { + width: 32px; + height: 32px; +} + +.feature-card h3 { + font-size: 1.25rem; + margin-bottom: 1rem; +} + +.feature-card p { + color: var(--text-tertiary); + font-size: 0.95rem; +} + +/* Tech Stack */ +.tech-stack { + padding: 5rem 0; +} + +.tech-grid { + display: flex; + flex-wrap: wrap; + justify-content: center; + gap: 3rem; + margin-top: 3rem; +} + +.tech-item { + display: flex; + flex-direction: column; + align-items: center; + width: 120px; +} + +.tech-item img { + width: 60px; + height: 60px; + margin-bottom: 1rem; + filter: grayscale(30%); + transition: all var(--transition-normal); +} + +.tech-item:hover img { + filter: grayscale(0%); + transform: scale(1.1); +} + +.tech-item span { + font-size: 0.95rem; + color: var(--text-tertiary); +} + +/* Latest Updates */ +.latest-updates { + padding: 5rem 0; +} + +.updates-grid { + margin-top: 3rem; + display: flex; + flex-direction: column; + gap: 2rem; +} + +.update-card { + display: flex; + background-color: var(--bg-color); + border-radius: var(--border-radius-lg); + overflow: hidden; + box-shadow: var(--shadow-md); +} + +.update-date { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + background-color: var(--primary-color); + color: white; + padding: 1.5rem; + min-width: 100px; + text-align: center; +} + +.update-date .day { + font-size: 2rem; + font-weight: var(--font-weight-bold); + line-height: 1; +} + +.update-date .month, +.update-date .year { + font-size: 0.875rem; + text-transform: uppercase; +} + +.update-content { + padding: 2rem; + flex: 1; +} + +.update-content h3 { + margin-bottom: 0.75rem; +} + +.update-content p { + color: var(--text-secondary); + margin-bottom: 1rem; +} + +.view-all-updates { + margin-top: 3rem; + text-align: center; +} + +/* CTA Section */ +.cta-section { + padding: 6rem 0; + background: linear-gradient(to right, var(--primary-color), var(--primary-dark)); + position: relative; + overflow: hidden; +} + +.cta-section::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-image: url('../images/pattern-light.svg'); + background-size: cover; + opacity: 0.1; + z-index: 1; +} + +.cta-content { + position: relative; + z-index: 2; + max-width: 700px; + margin: 0 auto; + text-align: center; + color: white; +} + +.cta-section h2 { + color: white; +} + +.cta-section p { + font-size: 1.125rem; + margin-bottom: 2rem; + opacity: 0.9; +} + +.cta-section .btn.primary { + background-color: white; + color: var(--primary-color); + border-color: white; +} + +.cta-section .btn.primary:hover { + background-color: rgba(255, 255, 255, 0.9); + border-color: rgba(255, 255, 255, 0.9); +} + +/* Responsive Styles */ +@media (max-width: 1024px) { + .hero h1 { + font-size: 3rem; + } + + .stat-number { + font-size: 3rem; + } +} + +@media (max-width: 768px) { + .hero .container { + flex-direction: column-reverse; + } + + .hero-content, .hero-image { + max-width: 100%; + text-align: center; + } + + .hero-image { + justify-content: center; + margin-bottom: 2rem; + } + + .hero-image img { + max-width: 400px; + } + + .hero-cta { + justify-content: center; + } + + .summary-content { + flex-direction: column; + gap: 3rem; + } + + .summary-stats { + width: 100%; + justify-content: space-around; + } + + .features-grid { + grid-template-columns: 1fr; + } + + .update-card { + flex-direction: column; + } + + .update-date { + flex-direction: row; + padding: 1rem; + gap: 0.5rem; + } + + .update-date .day, + .update-date .month, + .update-date .year { + font-size: 1rem; + } +} + +@media (max-width: 576px) { + .hero h1 { + font-size: 2.5rem; + } + + .hero-description { + font-size: 1.125rem; + } + + .hero-cta { + flex-direction: column; + } + + .feature-card { + padding: 1.5rem; + } + + .tech-grid { + gap: 2rem; + } + + .tech-item { + width: 90px; + } + + .tech-item img { + width: 50px; + height: 50px; + } +} \ No newline at end of file diff --git a/site/css/journal.css b/site/css/journal.css new file mode 100644 index 0000000..ba49d4f --- /dev/null +++ b/site/css/journal.css @@ -0,0 +1,239 @@ +/* Стили для страницы журнала */ + +/* Journal Timeline */ +.journal-timeline { + padding: 5rem 0; +} + +.timeline { + position: relative; + max-width: 1000px; + margin: 0 auto; + padding: 2rem 0; +} + +.timeline::before { + content: ''; + position: absolute; + top: 0; + bottom: 0; + left: 120px; + width: 4px; + background-color: var(--secondary-color); + border-radius: 2px; +} + +.timeline-entry { + position: relative; + margin-bottom: 4rem; + padding-top: 1rem; +} + +.timeline-entry:last-child { + margin-bottom: 0; +} + +.entry-date { + position: absolute; + top: 0; + left: 0; + width: 120px; +} + +.date-box { + width: 80px; + height: 80px; + background-color: var(--primary-color); + border-radius: var(--border-radius-md); + color: white; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + text-align: center; + box-shadow: var(--shadow-md); +} + +.date-box .day { + font-size: 1.75rem; + font-weight: var(--font-weight-bold); + line-height: 1; +} + +.date-box .month { + font-size: 0.875rem; + text-transform: uppercase; + margin-top: 0.25rem; +} + +.date-box .year { + font-size: 0.75rem; + opacity: 0.8; +} + +.entry-content { + margin-left: 170px; + background-color: var(--bg-color); + border-radius: var(--border-radius-lg); + padding: 2rem; + box-shadow: var(--shadow-md); + position: relative; +} + +.entry-content::before { + content: ''; + position: absolute; + top: 2rem; + left: -20px; + border: 10px solid transparent; + border-right-color: var(--bg-color); +} + +.entry-content h2 { + font-size: 1.75rem; + margin-bottom: 1rem; + color: var(--primary-color); +} + +.entry-meta { + display: flex; + gap: 1.5rem; + margin-bottom: 1.5rem; + font-size: 0.95rem; + color: var(--text-tertiary); +} + +.entry-body { + color: var(--text-secondary); +} + +.entry-body p { + margin-bottom: 1.25rem; + line-height: 1.6; +} + +.entry-body h3 { + font-size: 1.25rem; + margin: 2rem 0 1rem; + color: var(--text-primary); +} + +.entry-body ul { + margin-bottom: 2rem; +} + +.entry-body li { + margin-bottom: 0.75rem; +} + +.entry-gallery { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 1.5rem; + margin: 2rem 0; +} + +.gallery-item { + border-radius: var(--border-radius-md); + overflow: hidden; + box-shadow: var(--shadow-md); +} + +.gallery-item img { + width: 100%; + height: auto; + display: block; +} + +.image-caption { + display: block; + padding: 0.75rem; + background-color: var(--bg-secondary); + color: var(--text-tertiary); + font-size: 0.875rem; + text-align: center; +} + +.entry-conclusion { + background-color: var(--bg-secondary); + border-radius: var(--border-radius-md); + padding: 1.5rem; + margin-top: 2rem; +} + +.entry-conclusion p { + margin-bottom: 0; + font-style: italic; +} + +/* Responsive Styles */ +@media (max-width: 768px) { + .timeline::before { + left: 30px; + } + + .entry-date { + width: 60px; + } + + .date-box { + width: 60px; + height: 60px; + } + + .date-box .day { + font-size: 1.25rem; + } + + .date-box .month, + .date-box .year { + font-size: 0.75rem; + } + + .entry-content { + margin-left: 80px; + } + + .entry-content h2 { + font-size: 1.5rem; + } + + .entry-meta { + flex-direction: column; + gap: 0.5rem; + } +} + +@media (max-width: 576px) { + .timeline::before { + left: 20px; + } + + .entry-date { + width: 40px; + } + + .date-box { + width: 40px; + height: 70px; + padding: 0.25rem; + } + + .date-box .day { + font-size: 1rem; + } + + .date-box .month, + .date-box .year { + font-size: 0.65rem; + } + + .entry-content { + margin-left: 60px; + padding: 1.5rem; + } + + .entry-gallery { + grid-template-columns: 1fr; + } +} \ No newline at end of file diff --git a/site/css/resources.css b/site/css/resources.css new file mode 100644 index 0000000..ca70296 --- /dev/null +++ b/site/css/resources.css @@ -0,0 +1,200 @@ +/* Стили для страницы ресурсов */ + +/* Resources Section */ +.resources-section { + padding: 5rem 0; +} + +.resources-grid { + display: flex; + flex-direction: column; + gap: 4rem; +} + +.resource-category { + margin-bottom: 2rem; +} + +.resource-category h2 { + position: relative; + padding-bottom: 1rem; + margin-bottom: 2rem; +} + +.resource-category h2::after { + content: ''; + position: absolute; + bottom: 0; + left: 0; + width: 80px; + height: 4px; + background-color: var(--primary-color); + border-radius: 2px; +} + +.resource-list { + display: flex; + flex-direction: column; + gap: 2rem; +} + +.resource-card { + display: flex; + background-color: var(--bg-color); + border-radius: var(--border-radius-lg); + overflow: hidden; + box-shadow: var(--shadow-md); + transition: transform var(--transition-normal), box-shadow var(--transition-normal); +} + +.resource-card:hover { + transform: translateY(-5px); + box-shadow: var(--shadow-lg); +} + +.resource-icon { + width: 100px; + min-width: 100px; + display: flex; + align-items: center; + justify-content: center; + padding: 1.5rem; + background-color: var(--bg-secondary); +} + +.resource-icon img { + width: 64px; + height: 64px; + object-fit: contain; +} + +.resource-info { + padding: 1.5rem; + flex-grow: 1; +} + +.resource-info h3 { + font-size: 1.25rem; + margin-bottom: 0.75rem; + color: var(--primary-color); +} + +.resource-info p { + color: var(--text-secondary); + margin-bottom: 1.25rem; + font-size: 0.95rem; +} + +.resource-link { + display: inline-flex; + align-items: center; + font-weight: var(--font-weight-medium); + color: var(--primary-color); + margin-right: 1.5rem; + transition: all var(--transition-fast); +} + +.resource-link:hover { + color: var(--primary-dark); + text-decoration: underline; +} + +/* Resources Downloads */ +.resources-downloads { + padding: 5rem 0; + background-color: var(--bg-secondary); +} + +.downloads-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 2rem; + margin-top: 3rem; +} + +.download-card { + background-color: var(--bg-color); + border-radius: var(--border-radius-lg); + padding: 2rem; + box-shadow: var(--shadow-md); + display: flex; + flex-direction: column; + height: 100%; + transition: transform var(--transition-normal); +} + +.download-card:hover { + transform: translateY(-5px); +} + +.download-icon { + width: 64px; + height: 64px; + background-color: var(--secondary-color); + border-radius: 16px; + display: flex; + align-items: center; + justify-content: center; + margin-bottom: 1.5rem; +} + +.download-icon img { + width: 32px; + height: 32px; +} + +.download-info { + flex-grow: 1; + display: flex; + flex-direction: column; +} + +.download-info h3 { + font-size: 1.25rem; + margin-bottom: 0.75rem; +} + +.download-info p { + color: var(--text-secondary); + margin-bottom: 1.5rem; + font-size: 0.95rem; + flex-grow: 1; +} + +.download-info .btn { + align-self: flex-start; +} + +/* Responsive Styles */ +@media (max-width: 768px) { + .resource-card { + flex-direction: column; + } + + .resource-icon { + width: 100%; + padding: 1rem; + } + + .downloads-grid { + grid-template-columns: 1fr; + } +} + +@media (max-width: 576px) { + .resource-list { + gap: 1.5rem; + } + + .resource-info { + padding: 1.25rem; + } + + .resource-info h3 { + font-size: 1.1rem; + } + + .download-card { + padding: 1.5rem; + } +} \ No newline at end of file diff --git a/site/css/style.css b/site/css/style.css new file mode 100644 index 0000000..f41b754 --- /dev/null +++ b/site/css/style.css @@ -0,0 +1,533 @@ +/* Основные стили для сайта EasyAccess */ + +:root { + /* Основная цветовая палитра */ + --primary-color: #2563eb; + --primary-dark: #1d4ed8; + --primary-light: #3b82f6; + --secondary-color: #e6ecfa; + --accent-color: #059669; + + /* Нейтральные цвета */ + --text-primary: #111827; + --text-secondary: #4b5563; + --text-tertiary: #6b7280; + --bg-color: #ffffff; + --bg-secondary: #f3f4f6; + --bg-tertiary: #e5e7eb; + + /* Структурные переменные */ + --container-max-width: 1200px; + --container-padding: 1.5rem; + --border-radius-sm: 0.25rem; + --border-radius-md: 0.5rem; + --border-radius-lg: 1rem; + + /* Типографика */ + --font-family-base: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; + --font-family-heading: 'Manrope', var(--font-family-base); + --font-weight-normal: 400; + --font-weight-medium: 500; + --font-weight-semibold: 600; + --font-weight-bold: 700; + + /* Анимации */ + --transition-fast: 150ms ease; + --transition-normal: 250ms ease; + --transition-slow: 350ms ease; + + /* Тени */ + --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05); + --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); + --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); +} + +/* Базовые стили */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +@font-face { + font-family: 'Inter'; + src: url('../fonts/Inter-Regular.woff2') format('woff2'); + font-weight: 400; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: 'Inter'; + src: url('../fonts/Inter-Medium.woff2') format('woff2'); + font-weight: 500; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: 'Inter'; + src: url('../fonts/Inter-SemiBold.woff2') format('woff2'); + font-weight: 600; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: 'Inter'; + src: url('../fonts/Inter-Bold.woff2') format('woff2'); + font-weight: 700; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: 'Manrope'; + src: url('../fonts/Manrope-Bold.woff2') format('woff2'); + font-weight: 700; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: 'Manrope'; + src: url('../fonts/Manrope-SemiBold.woff2') format('woff2'); + font-weight: 600; + font-style: normal; + font-display: swap; +} + +html { + font-size: 16px; + scroll-behavior: smooth; +} + +body { + font-family: var(--font-family-base); + font-weight: var(--font-weight-normal); + line-height: 1.5; + color: var(--text-primary); + background-color: var(--bg-color); + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +img { + max-width: 100%; + height: auto; + display: block; +} + +a { + color: var(--primary-color); + text-decoration: none; + transition: color var(--transition-fast); +} + +a:hover { + color: var(--primary-dark); +} + +h1, h2, h3, h4, h5, h6 { + font-family: var(--font-family-heading); + font-weight: var(--font-weight-bold); + line-height: 1.2; + margin-bottom: 1rem; + color: var(--text-primary); +} + +h1 { + font-size: 3rem; + margin-bottom: 1.5rem; +} + +h2 { + font-size: 2.25rem; + margin-bottom: 1.25rem; +} + +h3 { + font-size: 1.5rem; + margin-bottom: 1rem; +} + +p { + margin-bottom: 1rem; +} + +ul, ol { + padding-left: 1.5rem; + margin-bottom: 1rem; +} + +/* Utility Classes */ +.container { + width: 100%; + max-width: var(--container-max-width); + padding-left: var(--container-padding); + padding-right: var(--container-padding); + margin-left: auto; + margin-right: auto; +} + +.btn { + display: inline-flex; + align-items: center; + justify-content: center; + padding: 0.75rem 1.5rem; + border-radius: var(--border-radius-md); + font-weight: var(--font-weight-medium); + font-size: 1rem; + transition: all var(--transition-normal); + cursor: pointer; + text-align: center; + text-decoration: none; +} + +.btn.primary { + background-color: var(--primary-color); + color: white; + border: 2px solid var(--primary-color); +} + +.btn.primary:hover { + background-color: var(--primary-dark); + border-color: var(--primary-dark); +} + +.btn.secondary { + background-color: transparent; + color: var(--primary-color); + border: 2px solid var(--primary-color); +} + +.btn.secondary:hover { + background-color: var(--secondary-color); +} + +.read-more { + display: inline-flex; + align-items: center; + font-weight: var(--font-weight-medium); + color: var(--primary-color); + transition: all var(--transition-fast); +} + +.read-more:hover { + color: var(--primary-dark); + text-decoration: underline; +} + +.highlight { + color: var(--primary-color); +} + +/* Header Styles */ +header { + position: fixed; + top: 0; + left: 0; + width: 100%; + background-color: rgba(255, 255, 255, 0.95); + backdrop-filter: blur(10px); + z-index: 1000; + box-shadow: var(--shadow-sm); + transition: all var(--transition-normal); +} + +header.scrolled { + box-shadow: var(--shadow-md); +} + +.main-nav { + display: flex; + justify-content: space-between; + align-items: center; + height: 80px; +} + +.logo { + display: flex; +} + +.logo a { + display: flex; + align-items: center; + color: var(--text-primary); + font-weight: var(--font-weight-bold); + font-size: 1.25rem; +} + +.logo img { + height: 36px; + width: auto; + margin-right: 0.75rem; +} + +.nav-links { + display: flex; + list-style: none; + margin: 0; + padding: 0; +} + +.nav-links li:not(:last-child) { + margin-right: 1.5rem; +} + +.nav-links a { + display: block; + padding: 0.5rem 0; + color: var(--text-secondary); + position: relative; +} + +.nav-links a:hover { + color: var(--primary-color); +} + +.nav-links a.active { + color: var(--primary-color); + font-weight: var(--font-weight-medium); +} + +.nav-links a.active::after { + content: ''; + position: absolute; + bottom: 0; + left: 0; + width: 100%; + height: 2px; + background-color: var(--primary-color); + border-radius: 1px; +} + +.mobile-menu-toggle { + display: none; + flex-direction: column; + justify-content: space-between; + width: 24px; + height: 18px; + background: none; + border: none; + cursor: pointer; +} + +.mobile-menu-toggle span { + width: 100%; + height: 2px; + background-color: var(--text-primary); + border-radius: 1px; + transition: all var(--transition-fast); +} + +/* Main Content Sections */ +main { + margin-top: 80px; /* Компенсация фиксированного хедера */ +} + +section { + padding: 5rem 0; +} + +section:nth-child(even) { + background-color: var(--bg-secondary); +} + +/* Page Hero - общие стили для заголовков страниц */ +.page-hero { + padding: 8rem 0 4rem; + background: linear-gradient(135deg, var(--secondary-color) 0%, #f0f7ff 100%); + text-align: center; + position: relative; + overflow: hidden; +} + +.page-hero::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-image: url('../images/pattern.svg'); + background-size: cover; + opacity: 0.1; + z-index: 1; +} + +.page-hero .container { + position: relative; + z-index: 2; +} + +.page-subtitle { + font-size: 1.25rem; + color: var(--text-secondary); + max-width: 700px; + margin: 0 auto; +} + +/* Footer Styles */ +footer { + background-color: var(--text-primary); + color: white; + padding: 4rem 0 2rem; +} + +.footer-content { + display: flex; + justify-content: space-between; + margin-bottom: 3rem; +} + +.footer-logo { + display: flex; + align-items: center; + margin-bottom: 1rem; +} + +.footer-logo img { + height: 36px; + width: auto; + margin-right: 0.75rem; + border-radius: 10px; +} + +.footer-logo span { + font-size: 1.25rem; + font-weight: var(--font-weight-bold); + color: white; +} + +.footer-links { + display: flex; +} + +.footer-nav { + margin-left: 3rem; +} + +.footer-nav h4 { + color: white; + margin-bottom: 1rem; + font-size: 1rem; +} + +.footer-nav ul { + list-style: none; + padding: 0; + margin: 0; +} + +.footer-nav li:not(:last-child) { + margin-bottom: 0.5rem; +} + +.footer-nav a { + color: rgba(255, 255, 255, 0.7); + transition: color var(--transition-fast); +} + +.footer-nav a:hover { + color: white; +} + +.footer-bottom { + padding-top: 2rem; + border-top: 1px solid rgba(255, 255, 255, 0.1); + text-align: center; + color: rgba(255, 255, 255, 0.6); + font-size: 0.875rem; +} + +/* Responsive Design */ +@media (max-width: 1024px) { + h1 { + font-size: 2.5rem; + } + + h2 { + font-size: 2rem; + } +} + +@media (max-width: 768px) { + h1 { + font-size: 2.25rem; + } + + h2 { + font-size: 1.75rem; + } + + .mobile-menu-toggle { + display: flex; + } + + .nav-links { + position: fixed; + top: 80px; + left: 0; + width: 100%; + flex-direction: column; + background-color: white; + box-shadow: var(--shadow-md); + padding: 1rem 0; + transform: translateY(-100%); + opacity: 0; + visibility: hidden; + transition: all var(--transition-normal); + } + + .nav-links.active { + transform: translateY(0); + opacity: 1; + visibility: visible; + } + + .nav-links li { + width: 100%; + margin: 0 !important; + } + + .nav-links a { + padding: 1rem 1.5rem; + } + + .footer-content { + flex-direction: column; + } + + .footer-links { + margin-top: 2rem; + } + + .footer-nav { + margin-left: 0; + margin-right: 2rem; + } +} + +@media (max-width: 576px) { + h1 { + font-size: 2rem; + } + + h2 { + font-size: 1.5rem; + } + + section { + padding: 3rem 0; + } + + .footer-links { + flex-direction: column; + } + + .footer-nav { + margin-right: 0; + margin-bottom: 2rem; + } +} diff --git a/site/css/team.css b/site/css/team.css new file mode 100644 index 0000000..4db8d0f --- /dev/null +++ b/site/css/team.css @@ -0,0 +1,202 @@ +/* Стили для страницы участников проекта */ + +/* Team Section */ +.team-section { + padding: 5rem 0; +} + +.team-grid { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); + gap: 2rem; + margin-top: 3rem; +} + +.team-card { + background-color: var(--bg-color); + border-radius: var(--border-radius-lg); + overflow: hidden; + box-shadow: var(--shadow-md); + display: flex; + flex-direction: column; + height: 100%; + transition: transform var(--transition-normal), box-shadow var(--transition-normal); +} + +.team-card:hover { + transform: translateY(-5px); + box-shadow: var(--shadow-lg); +} + +.member-photo { + width: 100%; + aspect-ratio: 4/3; + overflow: hidden; +} + +.member-photo img { + width: 100%; + height: 100%; + object-fit: contain; + aspect-ratio: 1; +} + +.team-card:hover .member-photo img { + transform: scale(1.05); +} + +.member-info { + padding: 1.5rem; + flex-grow: 1; + display: flex; + flex-direction: column; +} + +.member-info h3 { + font-size: 1.25rem; + margin-bottom: 0.5rem; +} + +.member-role { + color: var(--primary-color); + font-weight: var(--font-weight-medium); + margin-bottom: 1.5rem; +} + +.contribution { + margin-top: auto; +} + +.contribution h4 { + font-size: 1rem; + margin-bottom: 0.75rem; + color: var(--text-secondary); +} + +.contribution ul { + list-style: none; + padding: 0; + margin: 0; +} + +.contribution li { + position: relative; + padding-left: 1.5rem; + margin-bottom: 0.5rem; + font-size: 0.95rem; + color: var(--text-tertiary); +} + +.contribution li::before { + content: '•'; + position: absolute; + left: 0.5rem; + color: var(--primary-color); +} + +/* Curators Section */ +.curators-section { + padding: 5rem 0; + background-color: var(--bg-secondary); +} + +.curators-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 2rem; + margin-top: 3rem; +} + +.curator-card { + background-color: var(--bg-color); + border-radius: var(--border-radius-lg); + overflow: hidden; + box-shadow: var(--shadow-md); + transition: transform var(--transition-normal); +} + +.curator-card:hover { + transform: translateY(-5px); +} + +.curator-photo { + width: 100%; + aspect-ratio: 1/1; + overflow: hidden; +} + +.curator-photo img { + width: 100%; + height: 100%; + object-fit: cover; + transition: transform var(--transition-slow); +} + +.curator-card:hover .curator-photo img { + transform: scale(1.05); +} + +.curator-info { + padding: 1.5rem; + text-align: center; +} + +.curator-info h3 { + font-size: 1.25rem; + margin-bottom: 0.5rem; +} + +.curator-role { + color: var(--primary-color); + font-weight: var(--font-weight-medium); + margin-bottom: 0.25rem; +} + +.curator-title { + color: var(--text-tertiary); + font-size: 0.95rem; +} + +/* Team Structure */ +.team-structure { + padding: 5rem 0; +} + +.structure-diagram { + max-width: 900px; + margin: 3rem auto; + border-radius: var(--border-radius-lg); + overflow: hidden; + box-shadow: var(--shadow-lg); +} + +.structure-diagram img { + width: 100%; + height: auto; + display: block; +} + +.section-outro { + max-width: 800px; + margin: 2rem auto 0; + text-align: center; + color: var(--text-secondary); + font-size: 1.125rem; +} + +/* Responsive Styles */ +@media (max-width: 768px) { + .team-grid, .curators-grid { + grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); + } +} + +@media (max-width: 576px) { + .team-grid, .curators-grid { + grid-template-columns: 1fr; + } + + .member-photo, .curator-photo { + aspect-ratio: 3/2; + } +} diff --git a/site/downloads/easyaccess_presentation.pdf b/site/downloads/easyaccess_presentation.pdf new file mode 100644 index 0000000..6f91148 Binary files /dev/null and b/site/downloads/easyaccess_presentation.pdf differ diff --git a/site/downloads/easyaccess_report.pdf b/site/downloads/easyaccess_report.pdf new file mode 100644 index 0000000..bc92116 Binary files /dev/null and b/site/downloads/easyaccess_report.pdf differ diff --git a/site/downloads/easyaccess_technical_docs.pdf b/site/downloads/easyaccess_technical_docs.pdf new file mode 100644 index 0000000..696d57e Binary files /dev/null and b/site/downloads/easyaccess_technical_docs.pdf differ diff --git a/site/images/architecture-diagram.png b/site/images/architecture-diagram.png new file mode 100644 index 0000000..ddfac02 Binary files /dev/null and b/site/images/architecture-diagram.png differ diff --git a/site/images/db.png b/site/images/db.png new file mode 100644 index 0000000..8bf5093 Binary files /dev/null and b/site/images/db.png differ diff --git a/site/images/easyaccess.svg b/site/images/easyaccess.svg new file mode 100644 index 0000000..54e3e21 --- /dev/null +++ b/site/images/easyaccess.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/site/images/extension.png b/site/images/extension.png new file mode 100644 index 0000000..4aa6043 Binary files /dev/null and b/site/images/extension.png differ diff --git a/site/images/icons/aria.svg b/site/images/icons/aria.svg new file mode 100644 index 0000000..dcf3935 --- /dev/null +++ b/site/images/icons/aria.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/chrome.svg b/site/images/icons/chrome.svg new file mode 100644 index 0000000..04ff90c --- /dev/null +++ b/site/images/icons/chrome.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/cognitive-impaired.svg b/site/images/icons/cognitive-impaired.svg new file mode 100644 index 0000000..9bdc542 --- /dev/null +++ b/site/images/icons/cognitive-impaired.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/digital.svg b/site/images/icons/digital.svg new file mode 100644 index 0000000..97b9001 --- /dev/null +++ b/site/images/icons/digital.svg @@ -0,0 +1,17 @@ + + + + + + + + + + diff --git a/site/images/icons/docs.svg b/site/images/icons/docs.svg new file mode 100644 index 0000000..5b50a99 --- /dev/null +++ b/site/images/icons/docs.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/document.svg b/site/images/icons/document.svg new file mode 100644 index 0000000..4a38391 --- /dev/null +++ b/site/images/icons/document.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/easyaccess.ico b/site/images/icons/easyaccess.ico new file mode 100644 index 0000000..7241930 Binary files /dev/null and b/site/images/icons/easyaccess.ico differ diff --git a/site/images/icons/easyaccess.svg b/site/images/icons/easyaccess.svg new file mode 100644 index 0000000..54e3e21 --- /dev/null +++ b/site/images/icons/easyaccess.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/site/images/icons/favicon.ico b/site/images/icons/favicon.ico new file mode 100644 index 0000000..08af972 Binary files /dev/null and b/site/images/icons/favicon.ico differ diff --git a/site/images/icons/firefox.svg b/site/images/icons/firefox.svg new file mode 100644 index 0000000..bd396fa --- /dev/null +++ b/site/images/icons/firefox.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/gost.svg b/site/images/icons/gost.svg new file mode 100644 index 0000000..a8dae6f --- /dev/null +++ b/site/images/icons/gost.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/interface.svg b/site/images/icons/interface.svg new file mode 100644 index 0000000..022a142 --- /dev/null +++ b/site/images/icons/interface.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/keyboard.svg b/site/images/icons/keyboard.svg new file mode 100644 index 0000000..0571f4a --- /dev/null +++ b/site/images/icons/keyboard.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/mdn.svg b/site/images/icons/mdn.svg new file mode 100644 index 0000000..022a142 --- /dev/null +++ b/site/images/icons/mdn.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/mospolytech.svg b/site/images/icons/mospolytech.svg new file mode 100644 index 0000000..ca516b1 --- /dev/null +++ b/site/images/icons/mospolytech.svg @@ -0,0 +1,4460 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/site/images/icons/motor-impaired.svg b/site/images/icons/motor-impaired.svg new file mode 100644 index 0000000..c2cdfb0 --- /dev/null +++ b/site/images/icons/motor-impaired.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/organizations.svg b/site/images/icons/organizations.svg new file mode 100644 index 0000000..aac2358 --- /dev/null +++ b/site/images/icons/organizations.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/packages.svg b/site/images/icons/packages.svg new file mode 100644 index 0000000..2e551a0 --- /dev/null +++ b/site/images/icons/packages.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/presentation.svg b/site/images/icons/presentation.svg new file mode 100644 index 0000000..4629a45 --- /dev/null +++ b/site/images/icons/presentation.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/problem.svg b/site/images/icons/problem.svg new file mode 100644 index 0000000..a5bfcda --- /dev/null +++ b/site/images/icons/problem.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/report.svg b/site/images/icons/report.svg new file mode 100644 index 0000000..a8dae6f --- /dev/null +++ b/site/images/icons/report.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/solution.svg b/site/images/icons/solution.svg new file mode 100644 index 0000000..6458f5a --- /dev/null +++ b/site/images/icons/solution.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/standards.svg b/site/images/icons/standards.svg new file mode 100644 index 0000000..1298b50 --- /dev/null +++ b/site/images/icons/standards.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/visual-impaired.svg b/site/images/icons/visual-impaired.svg new file mode 100644 index 0000000..874d8d7 --- /dev/null +++ b/site/images/icons/visual-impaired.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/visual.svg b/site/images/icons/visual.svg new file mode 100644 index 0000000..ddc7ac0 --- /dev/null +++ b/site/images/icons/visual.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/voi.svg b/site/images/icons/voi.svg new file mode 100644 index 0000000..c2cdfb0 --- /dev/null +++ b/site/images/icons/voi.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/voice.svg b/site/images/icons/voice.svg new file mode 100644 index 0000000..d7d1d6d --- /dev/null +++ b/site/images/icons/voice.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/icons/w3c.svg b/site/images/icons/w3c.svg new file mode 100644 index 0000000..9f7cd82 --- /dev/null +++ b/site/images/icons/w3c.svg @@ -0,0 +1,20 @@ + + + + + + + + diff --git a/site/images/journal/team-structure.png b/site/images/journal/team-structure.png new file mode 100644 index 0000000..0f9dea5 Binary files /dev/null and b/site/images/journal/team-structure.png differ diff --git a/site/images/logo-white.png b/site/images/logo-white.png new file mode 100644 index 0000000..199d53f Binary files /dev/null and b/site/images/logo-white.png differ diff --git a/site/images/logo.png b/site/images/logo.png new file mode 100644 index 0000000..e7800a7 Binary files /dev/null and b/site/images/logo.png differ diff --git a/site/images/team/barinova.jpg b/site/images/team/barinova.jpg new file mode 100644 index 0000000..8d422ee Binary files /dev/null and b/site/images/team/barinova.jpg differ diff --git a/site/images/team/budylina.jpg b/site/images/team/budylina.jpg new file mode 100644 index 0000000..1290750 Binary files /dev/null and b/site/images/team/budylina.jpg differ diff --git a/site/images/team/deev.jpg b/site/images/team/deev.jpg new file mode 100644 index 0000000..21d8d95 Binary files /dev/null and b/site/images/team/deev.jpg differ diff --git a/site/images/team/kireeva.jpg b/site/images/team/kireeva.jpg new file mode 100644 index 0000000..cb49d4b Binary files /dev/null and b/site/images/team/kireeva.jpg differ diff --git a/site/images/team/momina.jpg b/site/images/team/momina.jpg new file mode 100644 index 0000000..916cab3 Binary files /dev/null and b/site/images/team/momina.jpg differ diff --git a/site/images/team/myasnikov.jpg b/site/images/team/myasnikov.jpg new file mode 100644 index 0000000..38ef294 Binary files /dev/null and b/site/images/team/myasnikov.jpg differ diff --git a/site/images/team/nikolenko.jpg b/site/images/team/nikolenko.jpg new file mode 100644 index 0000000..4c75f8a Binary files /dev/null and b/site/images/team/nikolenko.jpg differ diff --git a/site/images/team/nochnoy.jpg b/site/images/team/nochnoy.jpg new file mode 100644 index 0000000..42dc949 Binary files /dev/null and b/site/images/team/nochnoy.jpg differ diff --git a/site/images/team/ostapenko_s.jpg b/site/images/team/ostapenko_s.jpg new file mode 100644 index 0000000..4ff95aa Binary files /dev/null and b/site/images/team/ostapenko_s.jpg differ diff --git a/site/images/team/ostapenko_v.jpg b/site/images/team/ostapenko_v.jpg new file mode 100644 index 0000000..8d3533f Binary files /dev/null and b/site/images/team/ostapenko_v.jpg differ diff --git a/site/images/team/pahalyuk.jpg b/site/images/team/pahalyuk.jpg new file mode 100644 index 0000000..b7c6226 Binary files /dev/null and b/site/images/team/pahalyuk.jpg differ diff --git a/site/images/team/petrachkov.jpg b/site/images/team/petrachkov.jpg new file mode 100644 index 0000000..0b9bce1 Binary files /dev/null and b/site/images/team/petrachkov.jpg differ diff --git a/site/images/team/popravkin.jpg b/site/images/team/popravkin.jpg new file mode 100644 index 0000000..39b93bb Binary files /dev/null and b/site/images/team/popravkin.jpg differ diff --git a/site/images/team/saprykin.jpg b/site/images/team/saprykin.jpg new file mode 100644 index 0000000..6d1a14d Binary files /dev/null and b/site/images/team/saprykin.jpg differ diff --git a/site/images/team/shmigovskiy.jpg b/site/images/team/shmigovskiy.jpg new file mode 100644 index 0000000..b04738c Binary files /dev/null and b/site/images/team/shmigovskiy.jpg differ diff --git a/site/images/team/starkov.jpg b/site/images/team/starkov.jpg new file mode 100644 index 0000000..0f33fa2 Binary files /dev/null and b/site/images/team/starkov.jpg differ diff --git a/site/images/team/team-structure.png b/site/images/team/team-structure.png new file mode 100644 index 0000000..0f9dea5 Binary files /dev/null and b/site/images/team/team-structure.png differ diff --git a/site/images/team/troshkin.jpg b/site/images/team/troshkin.jpg new file mode 100644 index 0000000..9d01890 Binary files /dev/null and b/site/images/team/troshkin.jpg differ diff --git a/site/images/tech/golang.svg b/site/images/tech/golang.svg new file mode 100644 index 0000000..b420283 --- /dev/null +++ b/site/images/tech/golang.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/tech/postgresql.svg b/site/images/tech/postgresql.svg new file mode 100644 index 0000000..2c1cc4b --- /dev/null +++ b/site/images/tech/postgresql.svg @@ -0,0 +1,6 @@ + + + +postgresql + + diff --git a/site/images/tech/python.svg b/site/images/tech/python.svg new file mode 100644 index 0000000..724b192 --- /dev/null +++ b/site/images/tech/python.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/tech/react.svg b/site/images/tech/react.svg new file mode 100644 index 0000000..710b30a --- /dev/null +++ b/site/images/tech/react.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/tech/solidjs.svg b/site/images/tech/solidjs.svg new file mode 100644 index 0000000..2b9aea7 --- /dev/null +++ b/site/images/tech/solidjs.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/tech/typescript.svg b/site/images/tech/typescript.svg new file mode 100644 index 0000000..3c30fe4 --- /dev/null +++ b/site/images/tech/typescript.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/site/images/work-ilustration.png b/site/images/work-ilustration.png new file mode 100644 index 0000000..9ea9191 Binary files /dev/null and b/site/images/work-ilustration.png differ diff --git a/site/index.html b/site/index.html index e69de29..3e39651 100644 --- a/site/index.html +++ b/site/index.html @@ -0,0 +1,266 @@ + + + + + + EasyAccess - Браузерное расширение для повышения доступности веб-сайтов + + + + + + +
+
+ +
+
+ +
+
+
+
+

Делаем
интернет доступным
для каждого

+

+ EasyAccess — браузерное расширение, которое повышает доступность веб-сайтов + для людей с ограниченными возможностями здоровья через систему пакетов модификаций +

+ +
+
+ Иллюстрация EasyAccess в работе +
+
+
+ +
+
+

О проекте EasyAccess

+
+
+

+ EasyAccess представляет собой комплексное браузерное расширение, разработанное для универсальной модификации + веб-страниц с целью повышения доступности контента для лиц с ограниченными возможностями здоровья. +

+

+ Расширение объединяет в себе возможности нескольких специализированных инструментов и предоставляет дополнительные + функции, включая настройку визуального отображения, голосовое управление, обработку документов и другие возможности. +

+ Подробнее о проекте → +
+
+
+ 14 + Участников команды +
+
+ 5+ + Технологий +
+
+ + Возможностей +
+
+
+
+
+ +
+
+

Ключевые возможности

+
+
+
+ Иконка визуальных настроек +
+

Визуальные настройки

+

Изменение размера текста, контрастности, цветовых схем и других визуальных элементов

+
+
+
+ Иконка голосового управления +
+

Голосовое управление

+

Распознавание голосовых команд и чтение контента вслух для незрячих пользователей

+
+
+
+ Иконка работы с документами +
+

Работа с документами

+

Распознавание текста из изображений и документов для облегчения доступа к информации

+
+
+
+ Иконка клавиатурной навигации +
+

Клавиатурная навигация

+

Улучшенная доступность управления с клавиатуры для пользователей с двигательными нарушениями

+
+
+
+ Иконка упрощения интерфейса +
+

Упрощение интерфейса

+

Удаление отвлекающих элементов для улучшения восприятия пользователями с когнитивными нарушениями

+
+
+
+ Иконка пакетов модификаций +
+

Пакеты модификаций

+

Система пакетов для комплексной настройки доступности конкретных сайтов под нужды пользователя

+
+
+
+
+ +
+
+

Используемые технологии

+
+
+ TypeScript + TypeScript +
+
+ React + React +
+
+ Solid.js + Solid.js +
+
+ Go + Go +
+
+ Python + Python +
+
+ PostgreSQL + PostgreSQL +
+
+
+
+ +
+
+

Последние обновления проекта

+
+
+
+ 28 + Февраля + 2025 +
+
+

Разработана база данных и серверная часть

+

Завершена работа над базой данных с использованием PostgreSQL и расширения TimescaleDB. Реализована серверная часть на Go с API для взаимодействия с клиентом.

+ Читать полностью → +
+
+
+
+ 10 + Марта + 2025 +
+
+

Создан интерфейс расширения и маркетплейс

+

Разработан пользовательский интерфейс расширения с использованием TypeScript и Solid.js. Реализован маркетплейс для обмена пакетами модификаций.

+ Читать полностью → +
+
+
+
+ 25 + Марта + 2025 +
+
+

Проведен анализ предметной области

+

Выполнено исследование веб-доступности и существующих решений. Определены ключевые потребности пользователей и разработана архитектура приложения.

+ Читать полностью → +
+
+
+ +
+
+ +
+
+
+

Присоединяйтесь к разработке

+

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

+ Связаться с командой +
+
+
+
+ + + + + + diff --git a/site/journal.html b/site/journal.html new file mode 100644 index 0000000..8ca25d3 --- /dev/null +++ b/site/journal.html @@ -0,0 +1,503 @@ + + + + + + Журнал проекта - EasyAccess + + + + + + +
+
+ +
+
+ +
+
+
+

Журнал разработки

+

Хроника разработки проекта EasyAccess

+
+
+ +
+
+
+
+ +
+

Разработана база данных и серверная часть

+ +
+

+ Завершена работа над базой данных с использованием PostgreSQL и расширения TimescaleDB. + Структура базы данных спроектирована таким образом, чтобы обеспечить эффективное хранение и + управление пакетами модификаций, пользовательскими настройками и другими данными расширения. +

+

+ Реализована серверная часть на языке Go, предоставляющая API для взаимодействия с клиентской + частью расширения. Серверная часть обеспечивает аутентификацию пользователей, управление пакетами + модификаций и сбор статистики использования. +

+ +

Ключевые достижения:

+
    +
  • + Спроектирована и реализована схема базы данных с учетом требований проекта +
  • +
  • + Разработаны миграции для базы данных, обеспечивающие простое развертывание +
  • +
  • + Реализована серверная часть на Go с использованием современных паттернов разработки +
  • +
  • + Протестирована производительность базы данных при высоких нагрузках +
  • +
  • + Настроена интеграция с Supabase для управления пользователями и аутентификации +
  • +
+ +
+ + +
+ +
+

+ Разработанная база данных и серверная часть обеспечивают надежную основу для + функционирования всего приложения. Следующим шагом будет интеграция серверной части + с клиентской частью расширения для обеспечения полной функциональности проекта. +

+
+
+
+
+ +
+ +
+

Создан интерфейс расширения и маркетплейс

+ +
+

+ Разработан пользовательский интерфейс браузерного расширения с использованием TypeScript + и библиотеки Solid.js. Интерфейс расширения предоставляет удобный доступ к основной + функциональности проекта и обеспечивает интуитивно понятное управление пакетами модификаций. +

+

+ Также создан маркетплейс для обмена пакетами модификаций, позволяющий пользователям + публиковать свои пакеты и устанавливать пакеты, созданные другими пользователями. + Маркетплейс включает систему рейтингов, поиск и фильтрацию пакетов по различным критериям. +

+ +

Основные компоненты пользовательского интерфейса:

+
    +
  • + Главный экран расширения с информацией о текущей вкладке и установленных пакетах +
  • +
  • + Экран управления пакетами модификаций +
  • +
  • + Редактор пакетов для создания и редактирования пакетов модификаций +
  • +
  • + Маркетплейс пакетов модификаций +
  • +
  • + Система настроек расширения +
  • +
+ +
+ + +
+ +
+

+ Разработанный интерфейс расширения и маркетплейс обеспечивают основу для взаимодействия + пользователей с проектом EasyAccess. В следующих этапах разработки планируется расширение + функциональности интерфейса и улучшение пользовательского опыта на основе обратной связи. +

+
+
+
+
+ +
+ +
+

Проведен анализ предметной области

+ +
+

+ Проведено исследование предметной области веб-доступности и существующих решений для + повышения доступности веб-сайтов. Изучены стандарты и рекомендации по обеспечению + веб-доступности, такие как WCAG (Web Content Accessibility Guidelines) и ГОСТ Р 52872-2019. +

+

+ Выполнен сравнительный анализ существующих аналогов, включая специализированные расширения + для доступности и универсальные расширения для модификации веб-страниц. На основе анализа + определены ключевые потребности пользователей и уникальные преимущества проекта EasyAccess. +

+ +

Основные выводы исследования:

+
    +
  • + Существующие решения либо специализируются на отдельных аспектах модификации веб-страниц, + либо на ограниченном наборе функций веб-доступности +
  • +
  • + Большинство решений в области веб-доступности предлагают лишь базовые настройки, не + обеспечивая глубокой модификации страниц +
  • +
  • + Отсутствуют комплексные решения, объединяющие CSS, JavaScript и конфигурацию в единые пакеты +
  • +
  • + Многие специализированные решения для доступности имеют ограниченную поддержку русского языка +
  • +
+ +
+ + +
+ +
+

+ На основе проведенного исследования разработана архитектура проекта EasyAccess, определены + ключевые компоненты системы и спланированы этапы разработки. Результаты исследования + подтверждают актуальность проекта и его уникальные преимущества по сравнению с существующими + решениями. +

+
+
+
+
+ +
+ +
+

Интеграция модулей обработки аудио и документов

+ +
+

+ Завершена работа над модулями обработки аудио и документов для расширения EasyAccess. + Модули разработаны на Python с использованием современных библиотек машинного обучения и + контейнеризованы с помощью Docker для упрощения развертывания. +

+

+ Компонент распознавания голоса позволяет пользователям управлять веб-сайтами с помощью голосовых + команд, что особенно важно для людей с двигательными нарушениями. Модуль обработки документов + обеспечивает распознавание текста из изображений и PDF-файлов, делая их содержимое доступным + для программ экранного доступа. +

+ +

Ключевые особенности модулей:

+
    +
  • + Использование gRPC для эффективного взаимодействия между компонентами на разных языках программирования +
  • +
  • + Оптимизация моделей распознавания для работы в браузерном окружении +
  • +
  • + Поддержка различных форматов документов (PNG, JPG, PDF) с извлечением структурированного текста +
  • +
  • + Реализация системы кэширования для улучшения производительности +
  • +
  • + Интеграция с основным API расширения через REST-интерфейсы +
  • +
+ +
+ + +
+ +
+

+ Интеграция модулей обработки аудио и документов существенно расширяет функциональность + расширения EasyAccess, делая его полноценным решением для обеспечения доступности + веб-контента. Следующим шагом будет оптимизация производительности и улучшение + пользовательского опыта при работе с этими функциями. +

+
+
+
+
+ +
+ +
+

Система безопасности и интеграция с Supabase

+ +
+

+ Разработана система безопасности для расширения EasyAccess и интегрирована платформа Supabase + для аутентификации пользователей и хранения данных. Архитектура безопасности обеспечивает надежную + защиту пользовательской информации и предотвращает несанкционированный доступ к функциям расширения. +

+

+ Особое внимание уделено безопасности при инъекции скриптов в веб-страницы, что является + критически важным аспектом работы расширения. Реализованы механизмы проверки и валидации + пакетов модификаций перед их применением, а также изоляция выполнения скриптов для + предотвращения конфликтов с основным кодом страницы. +

+ +

Основные компоненты системы безопасности:

+
    +
  • + Безопасная аутентификация через Supabase с использованием JWT-токенов +
  • +
  • + Разделение прав доступа и ролевая модель для разных типов пользователей +
  • +
  • + Валидация и санитизация всех пользовательских входных данных +
  • +
  • + Защищенное хранение пользовательских настроек в локальном хранилище +
  • +
  • + Система проверки пакетов модификаций на потенциально вредоносный код +
  • +
  • + Механизмы изоляции скриптов при их выполнении в контексте веб-страниц +
  • +
+ +
+ + +
+ +
+

+ Реализованная система безопасности обеспечивает надежную защиту как пользовательских данных, + так и веб-страниц, на которых применяется расширение. Интеграция с Supabase предоставляет + масштабируемую и удобную инфраструктуру для управления пользователями и данными без + необходимости разрабатывать эти системы с нуля. +

+
+
+
+
+ +
+ +
+

Тестирование расширения и исправление ошибок

+ +
+

+ Проведено комплексное тестирование расширения EasyAccess на различных веб-сайтах + и в разных браузерах. В процессе тестирования были выявлены и исправлены различные + ошибки и проблемы с совместимостью, что позволило повысить стабильность и + надежность работы расширения. +

+

+ Особое внимание было уделено тестированию доступности, чтобы убедиться, что + расширение действительно улучшает использование веб-сайтов для людей с + различными ограничениями. Для этого были привлечены потенциальные пользователи + с ограниченными возможностями, которые предоставили ценную обратную связь. +

+ +

Основные направления тестирования:

+
    +
  • + Функциональное тестирование всех компонентов расширения +
  • +
  • + Тестирование совместимости с различными браузерами (Chrome, Edge, Firefox) +
  • +
  • + Проверка работы на популярных веб-сайтах и порталах +
  • +
  • + Тестирование пользовательского интерфейса на доступность +
  • +
  • + Проверка корректности работы пакетов модификаций +
  • +
  • + Тестирование безопасности и производительности +
  • +
+ +
+ + +
+ +
+

+ В результате тестирования было выявлено и исправлено более 30 ошибок и проблем, + что значительно повысило качество расширения. Обратная связь от потенциальных + пользователей позволила лучше понять их потребности и внести соответствующие + улучшения в интерфейс и функциональность расширения. +

+
+
+
+
+
+
+
+
+ + + + + + diff --git a/site/js/main.js b/site/js/main.js new file mode 100644 index 0000000..1cc5c69 --- /dev/null +++ b/site/js/main.js @@ -0,0 +1,103 @@ +// Основной JavaScript-файл для сайта EasyAccess + +document.addEventListener('DOMContentLoaded', function() { + // Мобильное меню + const mobileMenuToggle = document.querySelector('.mobile-menu-toggle'); + const navLinks = document.querySelector('.nav-links'); + + if (mobileMenuToggle && navLinks) { + mobileMenuToggle.addEventListener('click', function() { + navLinks.classList.toggle('active'); + mobileMenuToggle.classList.toggle('active'); + }); + } + + // Изменение стиля хедера при прокрутке + const header = document.querySelector('header'); + + if (header) { + window.addEventListener('scroll', function() { + if (window.scrollY > 10) { + header.classList.add('scrolled'); + } else { + header.classList.remove('scrolled'); + } + }); + } + + // Плавная прокрутка для якорных ссылок + document.querySelectorAll('a[href^="#"]').forEach(anchor => { + anchor.addEventListener('click', function (e) { + // Проверяем, что это не просто якорь + if (this.getAttribute('href') !== '#') { + e.preventDefault(); + + const targetId = this.getAttribute('href'); + const targetElement = document.querySelector(targetId); + + if (targetElement) { + // Закрываем мобильное меню, если оно открыто + if (navLinks && navLinks.classList.contains('active')) { + navLinks.classList.remove('active'); + if (mobileMenuToggle) { + mobileMenuToggle.classList.remove('active'); + } + } + + // Прокручиваем до элемента + const headerHeight = header ? header.offsetHeight : 0; + const targetPosition = targetElement.getBoundingClientRect().top + window.scrollY - headerHeight; + + window.scrollTo({ + top: targetPosition, + behavior: 'smooth' + }); + } + } + }); + }); + + // Анимация появления элементов при прокрутке + const animatedElements = document.querySelectorAll('.feature-card, .tech-item, .update-card, .team-card, .curator-card, .point-card, .info-block, .resource-card, .download-card'); + + if (animatedElements.length > 0) { + // Функция для проверки видимости элемента + function isElementInViewport(el) { + const rect = el.getBoundingClientRect(); + return ( + rect.top <= (window.innerHeight || document.documentElement.clientHeight) * 0.85 + ); + } + + // Функция для добавления класса анимации + function handleScroll() { + animatedElements.forEach(element => { + if (isElementInViewport(element)) { + element.classList.add('animate-in'); + } + }); + } + + // Обработчик прокрутки + window.addEventListener('scroll', handleScroll); + + // Вызываем обработчик сразу для элементов, которые видны при загрузке страницы + handleScroll(); + } + + // Дополнительные стили для анимаций + const style = document.createElement('style'); + style.textContent = ` + .feature-card, .tech-item, .update-card, .team-card, .curator-card, .point-card, .info-block, .resource-card, .download-card { + opacity: 0; + transform: translateY(20px); + transition: opacity 0.6s ease, transform 0.6s ease; + } + + .animate-in { + opacity: 1; + transform: translateY(0); + } + `; + document.head.appendChild(style); +}); diff --git a/site/resources.html b/site/resources.html new file mode 100644 index 0000000..73d92ee --- /dev/null +++ b/site/resources.html @@ -0,0 +1,363 @@ + + + + + + Ресурсы - EasyAccess + + + + + + +
+
+ +
+
+ +
+
+
+

Полезные ресурсы

+

Источники информации по веб-доступности и разработке расширений

+
+
+ +
+
+
+
+

Стандарты веб-доступности

+
+
+
+ W3C +
+
+

WCAG (Web Content Accessibility Guidelines)

+

+ Стандарты и рекомендации по обеспечению доступности веб-контента, разработанные + консорциумом W3C. Включают руководства по созданию доступных веб-сайтов для людей с + различными ограничениями. +

+ + Посетить ресурс → + +
+
+ +
+
+ ГОСТ +
+
+

ГОСТ Р 52872-2019

+

+ Российский стандарт «Интернет-ресурсы и другая информация, представленная в электронно-цифровой форме. + Приложения для стационарных и мобильных устройств, иные пользовательские интерфейсы. + Требования доступности для людей с инвалидностью и других лиц с ограничениями жизнедеятельности». +

+ + Посетить ресурс → + +
+
+ +
+
+ ARIA +
+
+

WAI-ARIA (Web Accessibility Initiative - Accessible Rich Internet Applications)

+

+ Набор атрибутов, которые определяют способы создания веб-контента и веб-приложений + более доступными для людей с ограниченными возможностями. Особенно полезно для динамического + контента и интерфейсов, созданных с использованием JavaScript. +

+ + Посетить ресурс → + +
+
+
+
+ +
+

Разработка браузерных расширений

+
+
+
+ Chrome +
+
+

Chrome Extensions Documentation

+

+ Официальная документация по разработке расширений для браузера Chrome. Содержит + руководства, примеры кода и справочник по API для создания расширений. +

+ + Посетить ресурс → + +
+
+ +
+
+ Firefox +
+
+

Firefox Extensions Workshop

+

+ Портал для разработчиков расширений Firefox, содержащий документацию, руководства + и инструменты для создания расширений, совместимых с WebExtensions API. +

+ + Посетить ресурс → + +
+
+ +
+
+ MDN +
+
+

MDN Web Docs - Browser Extensions

+

+ Подробная документация по разработке кросс-браузерных расширений с использованием + стандарта WebExtensions API. Включает примеры кода, руководства и спецификации. +

+ + Посетить ресурс → + +
+
+
+
+ +
+

Партнёрские организации

+
+
+
+ Московский Политех +
+
+

Московский Политехнический Университет

+

+ Образовательное учреждение, на базе которого разрабатывается проект EasyAccess + в рамках дисциплины «Проектная деятельность». +

+ + Посетить сайт → + +
+
+ +
+
+ ВОИ +
+
+

Всероссийское общество инвалидов (ВОИ)

+

+ Организация, которая помогает с тестированием проекта и предоставляет обратную + связь от пользователей с ограниченными возможностями здоровья. +

+ + Посетить сайт → + +
+
+ +
+
+ Минцифры +
+
+

Министерство цифрового развития, связи и массовых коммуникаций РФ

+

+ Государственный орган, осуществляющий функции по выработке и реализации государственной + политики и нормативно-правовому регулированию в сфере цифрового развития. Предоставляет + информацию о требованиях к доступности государственных информационных систем. +

+ + Посетить сайт → + +
+
+
+
+ +
+

Технологии и инструменты

+
+
+
+ TypeScript +
+
+

TypeScript

+

+ Строго типизированная надстройка над JavaScript, используемая для разработки + фронтенд-части расширения и веб-редактора. +

+ + Посетить сайт → + +
+
+ +
+
+ Solid.js +
+
+

Solid.js

+

+ Декларативная библиотека для создания пользовательских интерфейсов с высокой + производительностью, используемая в проекте для разработки UI расширения. +

+ + Посетить сайт → + +
+
+ +
+
+ Go +
+
+

Go (Golang)

+

+ Современный компилируемый язык программирования, разработанный для создания + эффективного и надежного серверного программного обеспечения. +

+ + Посетить сайт → + +
+
+ +
+
+ PostgreSQL +
+
+

PostgreSQL и TimescaleDB

+

+ Система управления базами данных и расширение для работы с временными рядами, + используемые для хранения данных проекта. +

+ + PostgreSQL → + + + TimescaleDB → + +
+
+
+
+
+
+
+ +
+
+

Материалы для скачивания

+
+
+
+ Презентация +
+
+

Презентация проекта

+

Презентация с описанием проекта EasyAccess, его целей, задач и особенностей.

+ Скачать (PDF, 2.5 MB) +
+
+ +
+
+ Документация +
+
+

Техническая документация

+

Подробное описание архитектуры и технических решений проекта EasyAccess.

+ Скачать (PDF, 1.8 MB) +
+
+ +
+
+ Отчет +
+
+

Отчет о проектной практике

+

Отчет о выполнении проектной практики с описанием всех этапов работы.

+ Скачать (PDF, 3.2 MB) +
+
+
+
+
+
+ + + + + + diff --git a/site/team.html b/site/team.html new file mode 100644 index 0000000..c9baa79 --- /dev/null +++ b/site/team.html @@ -0,0 +1,416 @@ + + + + + + Участники проекта - EasyAccess + + + + + + +
+
+ +
+
+ +
+
+
+

Команда проекта

+

Люди, работающие над созданием EasyAccess

+
+
+ +
+
+

Участники разработки

+

+ Проект EasyAccess разрабатывается командой студентов Московского Политехнического Университета + в рамках дисциплины «Проектная деятельность» под руководством опытных кураторов. +

+ +
+ + +
+
+ Фото Сапрыкина Петра +
+
+

Сапрыкин Пётр Иванович

+

Frontend-разработчик

+
+

Вклад в проект:

+
    +
  • Вёрстка пользовательского интерфейса расширения
  • +
  • Реализация JavaScript-функциональности
  • +
  • Создание компонентов для редактора пакетов
  • +
  • Интеграция с Chrome Extension API
  • +
+
+
+
+ +
+
+ Фото Деева Егора +
+
+

Деев Егор Викторович

+

Лидер команды, Python разработчик

+
+

Вклад в проект:

+
    +
  • Проектирование и имплементация базы данных
  • +
  • Настройка DevOps-инфраструктуры
  • +
  • Разработка серверных компонентов на Python
  • +
  • Создание диаграмм и схем архитектуры
  • +
  • Интеграция TimescaleDB
  • +
+
+
+
+ +
+
+ Фото Старкова Руслана +
+
+

Старков Руслан Владимирович

+

Тестировщик, JavaScript-разработчик

+
+

Вклад в проект:

+
    +
  • Тестирование функциональности расширения
  • +
  • Контейнеризация с использованием Docker
  • +
  • Разработка JavaScript-модулей
  • +
  • Участие в проверке доступности интерфейса
  • +
+
+
+
+ +
+
+ Фото Трошкина Дмитрия +
+
+

Трошкин Дмитрий Александрович

+

Лидер команды, TypeScript/Go разработчик

+
+

Вклад в проект:

+
    +
  • Фронтенд разработка на TypeScript с использованием React
  • +
  • Разработка серверной части на Go
  • +
  • Интеграция с базой данных
  • +
  • Настройка DevOps-процессов
  • +
  • Координация работы команды
  • +
+
+
+
+ +
+
+ Фото Петрачкова Владимира +
+
+

Петрачков Владимир Владимирович

+

Python разработчик

+
+

Вклад в проект:

+
    +
  • Разработка модуля обработки аудио файлов
  • +
  • Контейнеризация компонентов с Docker
  • +
  • Интеграция речевых моделей
  • +
  • Оптимизация Python-скриптов
  • +
+
+
+
+ +
+
+ Фото Мясникова Дмитрия +
+
+

Мясников Дмитрий Сергеевич

+

Go разработчик

+
+

Вклад в проект:

+
    +
  • Разработка серверной части на Go
  • +
  • Проектирование и имплементация базы данных
  • +
  • Реализация API-интерфейсов
  • +
  • Оптимизация производительности
  • +
+
+
+
+ +
+
+ Фото Ночного Максима +
+
+

Ночной Максим Сергеевич

+

Python разработчик

+
+

Вклад в проект:

+
    +
  • Разработка модуля сканирования документов
  • +
  • Интеграция OCR-функциональности
  • +
  • Развитие серверных компонентов на Python
  • +
  • Тестирование модулей обработки данных
  • +
+
+
+
+ +
+
+ Фото Шмыговского Никиты +
+
+

Шмыговский Никита Сергеевич

+

Python разработчик

+
+

Вклад в проект:

+
    +
  • Интеграция gRPC для связи Django и Go
  • +
  • Разработка системы безопасности
  • +
  • Аудит безопасности кода
  • +
  • Защита от уязвимостей при инъекции скриптов
  • +
+
+
+
+ +
+
+ Фото Пахалюка Ильи +
+
+

Пахалюк Илья Николаевич

+

Тестировщик

+
+

Вклад в проект:

+
    +
  • Тестирование компонентов расширения
  • +
  • Настройка Docker для тестового окружения
  • +
  • Автоматизация тестирования
  • +
  • Документирование тестовых сценариев
  • +
+
+
+
+ +
+
+ Фото Моминой Антонины +
+
+

Момина Антонина Алексеевна

+

Frontend-разработчик

+
+

Вклад в проект:

+
    +
  • Анализ версий для слабовидящих на существующих сайтах
  • +
  • Создание WAI-ARIA справочника для команды
  • +
  • Тестирование пользовательского интерфейса
  • +
  • Проверка соответствия стандартам доступности
  • +
+
+
+
+ +
+
+ Фото Николенко Дарьи +
+
+

Николенко Дарья Романовна

+

Аналитик

+
+

Вклад в проект:

+
    +
  • Перевод и работа с документацией Accessibly
  • +
  • Разработка методологии тестирования
  • +
  • Тестирование функционала расширения
  • +
  • Выявление и документирование ошибок
  • +
+
+
+
+ +
+
+ Фото Остапенко Владислава +
+
+

Остапенко Владислав Русланович

+

Аналитик

+
+

Вклад в проект:

+
    +
  • Исследование фреймворков для распознавания голоса
  • +
  • Изучение аналогичных расширений
  • +
  • Анализ технических решений
  • +
  • Подготовка аналитических материалов
  • +
+
+
+
+ +
+
+ Фото Остапенко Святослава +
+
+

Остапенко Святослав Русланович

+

Аналитик

+
+

Вклад в проект:

+
    +
  • Изучение функционала веб-редактора
  • +
  • Анализ аналогичных расширений
  • +
  • Документирование требований
  • +
  • Подготовка технических спецификаций
  • +
+
+
+
+ +
+
+ Фото Поправкина Александра +
+
+

Поправкин Александр Валентинович

+

Технический писатель

+
+

Вклад в проект:

+
    +
  • Составление технической документации проекта
  • +
  • Создание руководств пользователя
  • +
  • Описание программных интерфейсов
  • +
  • Оформление отчетной документации
  • +
+
+
+
+
+
+
+ +
+
+

Руководство проекта

+
+
+
+ Фото Киреевой Галины Ивановны +
+
+

Киреева Галина Ивановна

+

Куратор проекта

+

к.т.н., доцент

+
+
+ +
+
+ Фото Будылиной Евгении Александровны +
+
+

Будылина Евгения Александровна

+

Куратор проекта

+

к.т.н., доцент

+
+
+ +
+
+ Фото Бариновой Натальи Владимировны +
+
+

Баринова Наталья Владимировна

+

Ответственный по проектной практике

+
+
+
+
+
+ +
+
+

Структура команды

+
+ Диаграмма структуры команды проекта EasyAccess +
+

+ Командная работа и четкое распределение ролей помогают нам эффективно развивать проект, + обеспечивая высокое качество и своевременное достижение поставленных целей. +

+
+
+
+ + + + + +