Сайт для школи: сучасна онлайн-платформа для закладу освіти

Сайт для школи — це не лише вимога закону, а й головний канал зв'язку з батьками. Розбираємо, що на ньому має бути, як його вести без окремого програміста і скільки він коштує.

Сайт для школи сьогодні виконує дві ролі одночасно. Перша — офіційна: заклад освіти зобов'язаний публікувати про себе низку документів і даних. Друга — щоденна: батьки шукають там розклад дзвінків, умови вступу до першого класу, телефон секретаря й новини про екскурсію. Коли сайт не справляється з другою роллю, усе це переїжджає в десяток Viber-груп, а сайт перетворюється на архів PDF-файлів, який ніхто не відкриває.

У цій статті розберемо, як зробити сайт для школи, ліцею, приватної школи чи мовних курсів так, щоб він був і законним, і зручним: які розділи потрібні, що вимагає закон, як організувати новини й розклад, як не порушити права дітей на фото та скільки це коштує. Скажемо чесно: готового шкільного кейсу в нашому портфоліо поки немає, тому ми опишемо, як підійшли б до такого проєкту, спираючись на досвід інших сайтів з великою кількістю сторінок і документів.

Навіщо школі власний сайт, якщо є соцмережі

Сторінка у Facebook чи Instagram добре підходить для фотозвітів зі свят. Але вона погано зберігає інформацію: пост про правила прийому за два місяці опиняється глибоко в стрічці, а знайти його через Google майже неможливо. Батьки, які переїхали в новий район і шукають «школа поруч з домом», бачать у пошуку сайти, а не пости.

Сайт — це місце, де інформація лежить за постійною адресою і структуровано. Розклад — на сторінці «Розклад», документи — в розділі «Прозорість», контакти — в шапці на кожній сторінці. Його можна дати посиланням у відповіді на запитання, роздрукувати QR-код на дверях, вказати в Google-профілі закладу.

• Для батьків: розклад, оголошення, умови вступу, харчування, гуртки, контакти класних керівників чи адміністрації.
• Для учнів: розклад уроків і консультацій, олімпіади, посилання на дистанційні платформи, бібліотека.
• Для громади й контролюючих органів: установчі документи, звіти, кошторис, інформація про вакансії.
• Для приватної школи чи курсів: ще й маркетинг — програми, вартість, викладачі, запис на пробне заняття.

Соцмережі — для новин і емоцій. Сайт — для інформації, яку мають знайти за хвилину і через рік.

Що школа зобов'язана публікувати на сайті

Головна норма — стаття 30 Закону України «Про освіту» про прозорість та інформаційну відкритість закладу освіти. Вона вимагає, щоб заклади, які мають сайт, оприлюднювали на ньому перелік документів та інформації. Для закладів без власного сайту ці дані публікують на сайті засновника, але власний сайт значно зручніший і для школи, і для батьків.

Перелік у законі довгий і періодично змінюється, тому перед запуском варто звіритися з чинною редакцією. Зазвичай до нього належать:

• статут, ліцензії на провадження освітньої діяльності, сертифікати про акредитацію освітніх програм;
• структура та органи управління закладом, кадровий склад згідно з ліцензійними умовами;
• освітні програми, що реалізуються, і перелік освітніх компонентів;
• територія обслуговування, закріплена за закладом (для шкіл комунальної форми власності);
• ліцензований обсяг та фактична кількість учнів, мова (мови) освітнього процесу;
• наявність вакантних посад і порядок конкурсного заміщення;
• матеріально-технічне забезпечення, умови доступності для навчання осіб з особливими освітніми потребами;
• результати моніторингу якості освіти, річний звіт про діяльність закладу;
• правила прийому, розмір плати за навчання й перелік додаткових освітніх послуг (для тих, хто їх надає);
• правила поведінки здобувача освіти, план заходів, спрямованих на запобігання та протидію булінгу, порядок подання і розгляду заяв про булінг;
• кошторис і фінансовий звіт про надходження й використання коштів, інформацію про отримані благодійні внески.

Ще дві вимоги, які легко пропустити. Закон «Про забезпечення функціонування української мови як державної» передбачає, що інтерфейс сайту за замовчуванням відкривається українською; інші мовні версії можливі як додаткові. А Закон «Про захист персональних даних» стосується всього, що ви публікуєте про людей: прізвищ учнів у списках переможців, фото з заходів, контактів працівників.

Структура сайту для школи: розділи і сторінки

Найчастіша помилка шкільних сайтів — меню з двадцяти пунктів, у якому розділ «Прозорість» сусідить з «Нашими досягненнями 2019». Краще розкласти все за тим, хто і навіщо приходить на сайт. Ось робоча структура, яку можна адаптувати під державну школу, ліцей чи приватний заклад.

Гортайте таблицю вбік →

Для приватної школи, дитячого садка чи мовних курсів структура зміщується в бік продажу: на перше місце виходять програми, вартість, викладачі, відгуки та запис на пробний урок. Тут сайт ближчий до корпоративного сайту з елементами лендінгу, а кожна програма отримує власну сторінку під пошуковий запит.

Новини, оголошення й розклад: як вести сайт без програміста

Сайт школи живий, лише коли його регулярно оновлюють. Тому ще до дизайну треба вирішити, хто це робитиме: заступник директора, вчитель інформатики, секретар. І зробити так, щоб цій людині не доводилося розбиратися з HTML чи кликати розробника через кожне оголошення.

Ми підключаємо до сайту просту адмінку: форму, у якій відповідальна людина додає новину із заголовком, текстом і фото, міняє розклад чи завантажує новий документ у потрібний розділ. Новина одразу з'являється на головній і в стрічці, а документ — у розділі прозорості з датою публікації.

1. Новини — з категоріями (оголошення, події, досягнення, батьківські збори), щоб батьки могли відфільтрувати лише важливе.
2. Розклад — таблицею, яку зручно оновлювати й читати на телефоні, а не фото паперового аркуша.
3. Документи — з назвою, датою, описом і ознакою «актуальний» чи «архів».
4. Календар подій — канікули, свята, ДПА, батьківські збори.
5. Термінові оголошення — плашка вгорі сайту: «Завтра навчання дистанційно», яку видно на кожній сторінці.

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

Фото дітей і персональні дані: як не порушити закон

Фотозвіти — найулюбленіший контент шкільних сайтів і водночас найризикованіший. Зображення дитини — це персональні дані, і публікувати його можна лише за згодою батьків чи законних представників. Ту саму обережність варто застосовувати до списків учнів з прізвищами, класами й датами народження.

• Збирайте письмову згоду батьків на фото- й відеозйомку та публікацію на сайті й у соцмережах — зазвичай на початку навчального року.
• Для дітей без згоди обирайте ракурси зі спини або загальні плани, де обличчя не видно.
• Не публікуйте повні списки учнів з датами народження, адресами чи телефонами.
• Для переможців олімпіад достатньо імені, прізвища й класу — і теж за згодою.
• Додайте на сайт політику конфіденційності: які дані збирає форма звернення і як їх використовують.
• Форми запису й звернень надсилайте на захищену пошту чи в закритий чат адміністрації, а не в загальну групу.

Сайт працює через захищене з'єднання (SSL) — замок у адресному рядку. Для шкільного сайту це не опція: через нього проходять звернення батьків, а браузери позначають сайти без SSL як небезпечні.

Доступність і мобільна версія

Більшість батьків відкривають шкільний сайт з телефону — у черзі, в транспорті, на перерві. Тому верстку ми робимо спершу під мобільні: таблиця розкладу має читатися на вузькому екрані, а телефон секретаря — набиратися одним дотиком.

Доступність — окрема тема. На сайт заходять люди з порушеннями зору, літні бабусі й дідусі, діти з особливими освітніми потребами. Орієнтиром тут є міжнародні рекомендації WCAG. На практиці це означає кілька простих речей:

• достатній контраст тексту й фону, шрифт, який можна збільшити без поломки верстки;
• підписи до зображень (alt-текст) — їх зачитують програми екранного доступу;
• навігація з клавіатури, без елементів, до яких можна дістатися лише мишею;
• зрозумілі назви посилань: «Правила прийому», а не «Детальніше» чи «тут»;
• документи в текстовому форматі, а не лише скани.

Швидкість — теж частина доступності. Шкільний інтернет і мобільний зв'язок не завжди ідеальні, тому сайт, написаний кодом на Next.js без важких тем і плагінів, відкривається помітно легше за перевантажений шаблон. Фото з фотозвітів ми автоматично стискаємо й віддаємо у сучасних форматах.

Сайт для приватної школи чи курсів: залучення учнів

Для приватного закладу сайт — головний інструмент набору. Батьки порівнюють кілька шкіл, читають програми, рахують вартість і шукають відгуки. Тут працюють ті самі правила, що й для будь-якого бізнесу: зрозуміла пропозиція, довіра і простий шлях до заявки.

• окрема сторінка на кожну програму чи вікову групу: що вивчають, розклад, формат, вартість;
• викладачі з фото, освітою й досвідом;
• відгуки батьків і учнів, бажано з посиланням на Google-профіль;
• фото класів, кабінетів, території — реальні, не зі стоків;
• форма запису на пробне заняття чи екскурсію, заявки з якої одразу приходять у Telegram адміністратору;
• відповіді на часті запитання: харчування, трансфер, продовжений день, документи.

Щоб сайт знаходили за запитами на кшталт «приватна школа Оболонь» чи «англійська для дітей Львів», потрібна правильна структура під пошук, мікророзмітка й заповнений Google-профіль. Базове технічне SEO ми закладаємо під час розробки, а регулярне просування можна продовжити окремо — про це на сторінці SEO-просування.

Ще один інструмент, який добре працює для приватних закладів, — AI-помічник на сайті. Батьки часто пишуть увечері й у вихідні: «Чи є місця в 3 класі?», «Скільки коштує продовжений день?». Помічник відповідає за вашими даними цілодобово і передає контакт адміністратору.

Як ми підійшли б до сайту для школи

Шкільного проєкту в нашому портфоліо поки немає, тож не будемо прикрашати. Але задачі, з яких складається такий сайт, — багато сторінок, документи, новини, адмінка, форми, мобільна версія — ми регулярно вирішуємо на інших проєктах, наприклад на сайті стоматології «Оптіма» з блогом і каталогом напрямів лікування. Процес виглядав би так:

Сайти, які ми зробили для інших ніш

Стоматологія · СайтHealthy DentСайт центру імплантації в Києві: 30+ послуг, запис на прийом, оплата частинами, страхові, відгуки пацієнтів.Будівництво · СайтBUDE GOODСайт ремонтно-будівельної компанії (Львів і Київ): калькулятор вартості, портфоліо, відгуки Google 4.8, callback-віджет.Стоматологія · СайтСтоматологія ОптімаСайт стоматологічної клініки в Києві: запис на прийом, каталог з 8 напрямів лікування, ціни, блог і сторінка про команду.

Усі роботи в портфоліо →

1. Бриф. Короткий дзвінок: тип закладу, хто вестиме сайт, що вже є (старий сайт, документи, соцмережі).
2. Структура. Карта розділів з урахуванням вимог статті 30 Закону «Про освіту» і того, що найчастіше шукають батьки.
3. Тексти. Допомагаємо зібрати й відредагувати матеріали, переводимо ключові документи з PDF у текст.
4. Дизайн. Індивідуальний, у кольорах і символіці закладу. Спершу головна, потім внутрішні сторінки.
5. Розробка. Код на Next.js, адмінка для новин, розкладу й документів, форми звернень.
6. Перевірка. Телефони, браузери, швидкість, доступність, SEO.
7. Запуск і навчання. Передаємо доступи й показуємо відповідальній людині, як додавати новини та документи.

Домен реєструємо на заклад чи засновника — доступи залишаються у вас, а не в розробника. Ціна й обсяг фіксуються в договорі до старту; ви бачите готове демо перед фінальною оплатою. Зразок договору можна переглянути на сторінці договору.

Скільки коштує сайт для школи

Вартість залежить від обсягу сторінок і того, що має вміти адмінка. Невеликим курсам чи гуртку з однією-двома програмами часто вистачає сайту-візитки — від 20 000 грн, запуск до 14 робочих днів. Повноцінний сайт школи з розділом прозорості, новинами, розкладом і кількома десятками сторінок ближчий за обсягом до корпоративного сайту.

Гортайте таблицю вбік →

Точну суму для вашого випадку можна прикинути в калькуляторі вартості. Якщо приватна школа приймає оплату за навчання онлайн, додається підключення оплати.

Після запуску сайт потребує уваги: оновлення документів, нові розділи, зміни в законодавстві. Дрібні правки в межах договору ми робимо безкоштовно, а для регулярної роботи є підтримка й доопрацювання за підпискою.

Автор

Павло Погуляйло

Засновник Deveteria. 7+ років у веброзробці, колишній техлід в EPAM, Top Rated на Upwork. Сам пише код сайтів і ботів студії та веде проєкти від брифу до запуску.

LinkedInGitHubUpworkYouTube