# Подяки Майже все тут зробили інші люди й роздали безкоштовно. Ця сторінка називає це поіменно, бо консалтингова компанія, яка не хоче казати, на чому працює, просить довіри, якої сама не запропонувала. Це водночас найкоротша чесна відповідь на питання «а з чим ви взагалі працюєте». Список нижче — не брошура про наші можливості, а власна специфікація матеріалів цього сайту, і кожен її рядок ви можете перевірити з власного браузера. **Ця копія сайту — від 9 жовтня 2026 р., 14:31 CEST** — момент, коли востаннє змінилася найновіша сторінка в цій копії. Кожен фокусований піддомен несе такий самий рядок про власну копію, яку зроблено пізніше за цю, і він це показує. ## Що доходить до вашого браузера П'ять речей, і більше нічого: HTML, одна таблиця стилів, три вебшрифти, зображення та один невеликий власний скрипт. - **HTML**, написаний повністю ще до того, як ви його попросили. Кожна сторінка — це файл на диску, а не шаблон, який збирається на кожен запит. - **Один пакет CSS**, зібраний і позначений відбитком під час збірки та відданий разом із хешем [Subresource Integrity](/uk/glossary/#sri), щоб ваш браузер міг переконатися, що той дійшов незміненим. Усередині їде [neat-annotations](https://github.com/syabro/neat-annotations) від Max Syabro (MIT) — намальовані від руки стрілки та нотатки на полях, зроблені самим лише CSS. - **Шрифт Ubuntu**, від Dalton Maag для Canonical, за ліцензією Ubuntu Font Licence. Віддається з нашої власної машини — вебшрифт із чужого CDN є третьою стороною, яка дивиться, як ви читаєте. - **Ubuntu Mono**, моноширинний накреслення тієї самої родини, за тією самою ліцензією й віддається так само. Ним набрано код на цих сторінках, і він завантажується лише там, де такий код є. - **Шрифт Shantell Sans**, створений на основі маркерного почерку художниці Shantell Martin, від [Arrow Type](https://github.com/arrowtype/shantell-sans) / Stephen Nixon, за ліцензією SIL Open Font License. Ним написані нотатки на полях, він віддається так само й завантажується лише на тих сторінках, де така нотатка є. - **Зображення WebP і PNG**, розмір яких задається під час збірки. Стіни, на яких побудовані ці сторінки, — це фотографії. Дві з [Unsplash](https://unsplash.com/license): [Tim Mossholder](https://unsplash.com/@timmossholder) зняв темну штукатурку, [Joe Woods](https://unsplash.com/@woods) — білу цеглу. Ще три — від **John Snow**, зняті на Galaxy S22 Ultra й подаровані цьому сайту: світла штукатурка, пофарбована цегла та кахляна стіна. Світла тема вбирає одну зі своїх чотирьох стін, яку тягне під час збірки сторінки, тож щоразу після публікації сайт одягнений наново. Ліцензія не вимагає згадки; сторінці, яка називає дизайнера шрифту, не треба про це нагадувати. Знак, шестерня, маскот у кожній позі, у якій ви його зустрінете, портрет і дві накладені одна на одну фотографії нашого власного офісу в Копенгагені на сторінці «Про нас» — наші, зняті або намальовані тут і очищені від метаданих, перш ніж потрапили в коміт. - **Один позичений набір піктограм.** Зображення того, з чого зроблено кожну роботу — рядок під кожним оглядом, одне за кожним числом і кожною послугою на головній сторінці — а також усі інші піктограми сайту: знаки в обох меню та за кожною сторінкою, контактний рядок, мережі, перемикач мов, стрілки й «пташки». Усі вони походять з [Font Awesome Free](https://fontawesome.com/) 7.3.1 від Fonticons, за ліцензією [CC BY 4.0](https://creativecommons.org/licenses/by/4.0/): 238 малюнків разом, що зберігаються в цьому репозиторії й віддаються з цього вузла, як і все інше. 36 з них — не зображення ідеї, а власні знаки самих технологій: PostgreSQL, Linux, Docker, Go, Swift, Rust та інші, що називають те, на чому роботу справді збудовано. Знак ставимо там, де це підтверджує запис, і звичайне зображення там, де ні: робота з базами даних іде також на MS SQL і BigQuery, тож вона лишає малюнок бази даних, а не логотип одного постачальника, а робота, збудована геть від чогось, ніколи не носить знака цього чогось. Торговельний знак позначає свого власника, тож точний позичений знак кращий за перемальований під наш набір, а там, де знака немає, ми беремо звичайне зображення, а не вигадуємо власне. Сама айдентика — наша від початку до кінця: знак, шестірня, талісман, портрет і фотографії. Згадка стоїть на цій сторінці, а не у файлах, бо збірка мініфікує її HTML і вилучає коментар, у якому кожна піктограма несе своє посилання на авторство. На цьому сайті виконується один скрипт: наш власний, близько кілобайта, на сторінках, де є список, — роботи, теми, послуги, кейси та мапа сайту, — де він фільтрує цей список, поки ви друкуєте. Він ні з ким не спілкується й нічого не запам'ятовує. Не встановлюється жодного cookie. Нічого не запитується із сервера іншої компанії — ні аналітики, ні шрифтів, ні вбудованого відео, ні банера згоди, бо погоджуватися нема на що. Відкрийте мережеву панель браузера й порахуйте хости: він один. ## Як створюються сторінки - **[Hugo](https://gohugo.io/)** — генератор статичних сайтів, написаний на Go. Шаблони, таксономії, усі мови та стрічки — його робота. - **Markdown і шаблони Go** для написаних вручну сторінок та макетів. - **[SQLite](https://sqlite.org/)** — портфоліо пишеться не тут. Воно живе у багатомовній базі резюме й експортується в цей сайт скриптом на Python, тож факт пишеться один раз і з'являється там, де йому належить. - **[Python](https://www.python.org/)** — для того експортера й для генерації набору іконок за допомогою **[ImageMagick](https://imagemagick.org/)** з одного малюнка знака. ## Як це підтверджується Хостованого сервісу збірки немає: ворота якості працюють на тій самій машині, де пишеться сайт, і кожне зауваження там — помилка, а не попередження. - **[vnu](https://validator.github.io/validator/)** перевіряє HTML, **[Stylelint](https://stylelint.io/)** — CSS. - **[axe-core](https://github.com/dequelabs/axe-core)** перевіряє 32 репрезентативні сторінки — по одній на кожен шаблон, у кожній мові — за [WCAG 2.2](/uk/glossary/#wcag) рівнів A та AA, в обох колірних темах, і він стоїть у воротах, а не поруч із ними. Сайт збирає 831 сторінку; машина знаходить близько третини того, що вимагає WCAG, і саме тому запис нижче ведеться за кожним критерієм, а не як позначка «пройдено». - **[Puppeteer](https://pptr.dev/)** керує headless Chromium для перевірок, яких валідатор зробити не може: виміряний контраст, порядок фокуса, розмір цілі, довжина рядка, вихід за межі вікна, розбиття на сторінки під час друку та піксель у піксель візуальна регресія через **[pixelmatch](https://github.com/mapbox/pixelmatch)**. Вони запускаються на вимогу, а не на кожен коміт — вони тривають близько двадцяти хвилин — тож ворота тримають швидку половину, а повільну запускає людина. Він також робить те зображення, яке інші сайти показують, коли посиланням звідси діляться, тож та картка — власні стилі та шрифт цієї сторінки, а не їхній малюнок. - **[Lighthouse](https://developer.chrome.com/docs/lighthouse/)** тримає бюджети продуктивності; **[lychee](https://lychee.cli.rs/)** перевіряє, що кожне посилання досі веде куди слід. - **[Prettier](https://prettier.io/)**, **[markdownlint](https://github.com/DavidAnson/markdownlint)**, **[ESLint](https://eslint.org/)**, **[Ruff](https://docs.astral.sh/ruff/)**, **[basedpyright](https://docs.basedpyright.com/)**, **[yamllint](https://www.yamllint.com/)**, **[ShellCheck](https://www.shellcheck.net/)** та **[codespell](https://github.com/codespell-project/codespell)** тримають вихідний код чесним; **[gitleaks](https://gitleaks.io/)** стежить, щоб жоден секрет ніколи не потрапив у коміт. - **[Task](https://taskfile.dev/)** запускає це все — по одній назві на кожну задачу, а **[pre-commit](https://pre-commit.com/)** запускає файлову половину знову на кожному коміті, тож про гейт не треба пам'ятати. ## Де це працює Усе це робить одна маленька машина: одноядерний сервер **[DigitalOcean](https://www.digitalocean.com/)** з 512 МБ пам'яті та диском на 10 ГБ, що стоїть у **Торонто, Канада**, і відповідає на **165.227.39.206**. Цю адресу DNS і так видає кожному, хто запитає, тож надрукована тут вона радше заощаджує вам один запит, ніж повідомляє щось нове. Що машина записує, поки відповідає, — на [сторінці конфіденційності](/uk/privacy/). - **[Debian](https://www.debian.org/)** — операційна система. - **[Caddy](https://caddyserver.com/)** відповідає на кожен вебзапит і сам оновлює HTTPS-сертифікат від **[Let's Encrypt](https://letsencrypt.org/)**. - **[Agate](https://github.com/mbrubeck/agate)**, **[Gophernicus](https://github.com/gophernicus/gophernicus)** та **[Tor](https://www.torproject.org/)** відповідають на три інші: цей сайт також є капсулою Gemini за адресою `gemini://engineer.company`, Gopher-норою за `gopher://engineer.company` та onion-сервісом за `http://engineer2ezpeji52ipphljcflzyhetvy5r6tnqubtq45nzlxxv6rsqd.onion/`. Усі чотири читають ту саму теку з файлами, тож одне розгортання оновлює їх усі, і жоден не може розійтися з іншими. Onion-сервіс — єдиний вхід, який ми могли додати, не відкриваючи порту: tor дзвонить назовні до точок входу, тож відкриті порти машини лишаються рівно такими, якими були. А вебверсія й так надсилає заголовок `Onion-Location`, тож Tor Browser пропонує його сам. Адреса починається з `engineer`, бо ми витратили процесорні години, щоб зробити її читабельною, — це зручність, а не доказ. Той самий префікс доступний кожному, хто витратить ті самі години, тож звіряйте всю адресу, а не її початок. - **[Ansible](https://www.ansible.com/)** описує цей сервер як код, щоб його можна було зібрати заново, а не пам'ятати напам'ять. - **[Soft Serve](https://github.com/charmbracelet/soft-serve)** — git-сервер за Git Hub на [git.engineer.company](https://git.engineer.company/). Власний код цього сайту лежить там. - **[restic](https://restic.net/)** забирає резервні копії з машини. - **[Cloudflare](https://www.cloudflare.com/)** відповідає за DNS — і лише за DNS. Сайт свідомо не проксується: відкритість для нас цінніша за той захист, а проксі поставило б ще одну компанію між вами й нами. - Пошта — **[Apple iCloud](https://www.icloud.com/)**, і тому адреса зі сторінки контактів веде до поштової скриньки, а не до маркетингової платформи. ## Де він відповідає ще Усе вище описує один сайт, і він живе на engineer.company. Ту саму роботу обслуговують ще й окремі адреси — по одній на кожен фах: той, хто потрапляє на одну з них, бачить спершу цей фах, а далі власні сторінки компанії без змін, і кожна з них називає оригіналом копію на engineer.company. - **[data.engineer.company](https://data.engineer.company/)** — бази даних і конвеєри, що їх наповнюють. - **[platform.engineer.company](https://platform.engineer.company/)** — хмарна інфраструктура та механіка її розгортання. - **[software.engineer.company](https://software.engineer.company/)** — програмне забезпечення, зроблене так, щоб його можна було супроводжувати, а не лише здати. - **[advisory.engineer.company](https://advisory.engineer.company/)** — консультування, архітектура та технічне лідерство. - **[brand.engineer.company](https://brand.engineer.company/)** — бренд і маркетинг. - **[support.engineer.company](https://support.engineer.company/)** — машини, мережі та підтримка, на яких тримається офіс. - **[ditte.engineer.company](https://ditte.engineer.company/)** — власні сторінки засновниці, які також відповідають на [daryna.engineer.company](https://daryna.engineer.company/). А **[git.engineer.company](https://git.engineer.company/)** — це парадні двері git-сервера, названого вище: репозиторії приватні й доступні через SSH, тож та сторінка — усе, що показано вебу. Цей сайт доступний повністю й **[українською](/uk/)** — це сторінки, які ви читаєте зараз: кожна з них проіндексована та названа в картах сайту поряд зі своїми данськими й англійськими близнюками. Стрічка у верхній смузі її не пропонує, тож англійський і данський читач потрапляє сюди за посиланням на своїй копії цієї сторінки. ## Стандарти, яких він дотримується - **[WCAG 2.2](https://www.w3.org/TR/WCAG22/) рівень AA**, який охороняється перевірками, а не просто проголошується — з одним критерієм, названим як виняток, а не згладженим. Підписи, що з'являються під вказівником або у фокусі, не можна закрити клавішею, бо для цього потрібен скрипт, а цей сайт виконує лише один. 1.4.13 виконано, окрім цієї половини, і про це написано тут, а не залишено комусь на відкриття. - Структуровані дані **[schema.org](https://schema.org/)**, що розмічають лише те, що правдиве й видиме на сторінці. - **[Web App Manifest](https://www.w3.org/TR/appmanifest/)**, щоб сайт можна було [встановити як застосунок](/uk/install/). - **[RSS](/uk/index.xml)**, **[Atom](/uk/atom.xml)** та **[JSON Feed](/uk/feed.json)** — усі три з повним текстом. Дві XML-стрічки, а не одна, бо деякі читачки беруть лише одну з двох, і неможливо передбачити, яку саме. - **[RFC 9309](https://www.rfc-editor.org/rfc/rfc9309)** [`robots.txt`](/robots.txt), який дозволяє все — і пошуковим краулерам, і AI-системам однаково, бо написане тут існує, щоб його читали; він же називає [карту сайту](/sitemap.xml), за якою йдуть і ті, й інші. Є й [читабельний покажчик](/uk/sitemap/) тих самих сторінок — для тих, хто радше перегляне його, ніж розбиратиме. - **[RFC 9116](https://www.rfc-editor.org/rfc/rfc9116)** [`security.txt`](/.well-known/security.txt), а також [`humans.txt`](/humans.txt), [`llms.txt`](/llms.txt), [`agents.txt`](/agents.txt) та [`ai.txt`](/ai.txt) для машин, які приходять із запитаннями, — і [`ads.txt`](/ads.txt), який не уповноважує нікого, бо тут немає реклами на продаж. - **[Gemini](https://geminiprotocol.net/docs/specification.gmi)**, **[RFC 1436](https://www.rfc-editor.org/rfc/rfc1436) Gopher** та **[onion-сервіси Tor](https://community.torproject.org/onion-services/)**: ті самі сторінки, які віддаються всіма трьома протоколами за адресами `gemini://engineer.company`, `gopher://engineer.company` і `http://engineer2ezpeji52ipphljcflzyhetvy5r6tnqubtq45nzlxxv6rsqd.onion/`, з тієї самої теки файлів, що й ця сторінка, — одне розгортання оновлює всі чотири. Gemini і Gopher потребують кожен свого клієнта, а не браузера; onion-сервіс потребує клієнта Tor, і звичайний такий клієнт — це Tor Browser. Gopher не має рівня шифрування взагалі, тому передає відкритим текстом те, яку сторінку ви читали; Gemini це шифрує, але мережа, з якої ви читаєте, все одно бачить, яку адресу ви запросили. Через onion-сервіс вона не бачить ні першого, ні другого — з чотирьох так лише там. Сама адреса і є відкритим ключем сервісу, тож з'єднання автентифіковане й зашифроване ще до того, як прозвучить бодай слово HTTP: `http://` тут доречний, а не недбалий, і сертифікат лише підтверджував би ім'я, яке адреса вже доводить арифметикою. ## Перевірте самі Усе вище — це твердження, а попередній розділ називає інструменти, які ми самі запускаємо на власній машині, — тобто ми самі перевіряємо свою роботу. Нижче ті самі питання ставлять ті, хто про нас ніколи не чув. Кожне посилання запускає живу перевірку цієї сторінки; жодне з них не вірить нам на слово, і жоден із цих сервісів не наш. - **[Валідатор розмітки W3C](https://validator.w3.org/nu/?doc=https%3A%2F%2Fengineer.company%2Fuk%2F)** розбирає HTML цієї сторінки за живим стандартом. Це той самий рушій, що й `vnu` вище, але запущений W3C, а не нами. - **[CSS-валідатор W3C](https://jigsaw.w3.org/css-validator/validator?uri=https%3A%2F%2Fengineer.company%2Fuk%2F&profile=css3svg&lang=uk)** читає таблицю стилів, у яку вбрана ця сторінка. Очікуйте, що він покаже помилки, і прочитайте їх, перш ніж повірити: у серпні 2026 року він перевіряє за профілем, який зупиняється перед `system-ui`, `@property`, `clamp()` у `font-size` та анімаціями, керованими прокруткою, — усі чотири вже є в браузерах і всі чотири тут використано. Кожне його зауваження стосується можливості, новішої за сам валідатор, і саме тому справжнім суддею таблиці стилів у нас є [Stylelint](https://stylelint.io/). - **[Валідатор стрічок W3C](https://validator.w3.org/feed/check.cgi?url=https%3A%2F%2Fengineer.company%2Fuk%2Fatom.xml)** перевіряє стрічку Atom, а [той самий сервіс](https://validator.w3.org/feed/check.cgi?url=https%3A%2F%2Fengineer.company%2Fuk%2Findex.xml) — стрічку RSS. Він попереджає, що більшість записів мають однакову дату зміни, і це попередження слушне: дати беруться з історії git, і більшість цих сторінок справді були написані в тих самих кількох комітах. Ми радше покажемо попередження, ніж вигадаємо дату. - **[Валідатор JSON Feed](https://validator.jsonfeed.org/?url=https%3A%2F%2Fengineer.company%2Fuk%2Ffeed.json)** перевіряє третю стрічку, якої сервіс W3C не охоплює — він старший за цей формат. - **[PWABuilder](https://www.pwabuilder.com/reportcard?site=https%3A%2F%2Fengineer.company%2Fuk%2F)** читає маніфест і решту того, що робить сайт [встановлюваним](/uk/install/), — з машин Microsoft, а не з наших. - **[Перевірка інтернаціоналізації W3C](https://validator.w3.org/i18n-checker/check?uri=https%3A%2F%2Fengineer.company%2Fuk%2F)** читає оголошення мови й кодування, завдяки яким кожна мовна версія сайту читається правильно. - **[Schema Markup Validator](https://validator.schema.org/#url=https%3A%2F%2Fengineer.company%2Fuk%2F)** читає структуровані дані, а **[Rich Results Test від Google](https://search.google.com/test/rich-results?url=https%3A%2F%2Fengineer.company%2Fuk%2F)** показує, що з ними робить пошукова система. - **[PageSpeed Insights](https://pagespeed.web.dev/analysis?url=https%3A%2F%2Fengineer.company%2Fuk%2F)** запускає Lighthouse з машин Google, а не з наших — швидкодія, доступність, найкращі практики та SEO. - **[HTTP Observatory від Mozilla](https://developer.mozilla.org/en-US/observatory/analyze?host=engineer.company)** оцінює заголовки безпеки, а **[Qualys SSL Labs](https://www.ssllabs.com/ssltest/analyze.html?d=engineer.company)** — налаштування HTTPS під ними. - **[Security Headers](https://securityheaders.com/?q=https%3A%2F%2Fengineer.company%2F&followRedirects=on)** — друга думка про перше з них, від цілком інших людей. Чого жоден із них перевірити не може — це твердження про доступність, і ми радше скажемо це самі, ніж дозволимо зеленій позначці натякнути на протилежне. **Жоден автоматичний інструмент не знаходить більше ніж близько третини порушень WCAG** — решта це судження про те, чи описує заголовок свій розділ і чи каже alt-текст те, що потрібно, а машина таких суджень не ухвалює. Перевірки вище — це підлога, а не доказ. Якщо ви користуєтеся тут екранним читачем і щось читається неправильно, [напишіть нам](/uk/contact/) — це той звіт, якого ми самі створити не можемо. ## Дякуємо Кожен проєкт вище підтримують люди, які не були зобов'язані ділитися нічим із цього. Якщо ви теж будуєте на цьому стеку, саме там ваші гроші та ваші звіти про помилки принесуть найбільше користі. А якщо цей стек читається як ваш підхід до інженерії, [візьміть наш у роботу](/uk/contact/) *(ми збираємо такий самий для клієнтів)*.