Роботи · Стоматологія, Львів
Сайт стоматології, де ціну й лікаря видно до дзвінка
Чернетка для замовника. Сайт зроблений під реальну клініку, зданий на погодження й поки не запущений на її домені. Показую як є — разом із тим, що в ньому лишилось виправити.
Клініка на Кондукторській у Львові: дев'ять лікарів, власні роботи, прайс. Усе це зазвичай ховають за «уточнюйте по телефону», а тут воно відкрите просто на сторінці. Сайт зроблений із нуля. Після здачі я прогнав його власними перевірками, знайшов шість дефектів і виправив кожен: сторінка схудла з 6,5 МБ до 391 КБ.
Заміри
Зняті з тієї самої сторінки до і після виправлень: браузер, мобільний екран 390 px, ті самі перевірки. Рядки без пари — там, де порівнювати нема з чим.
- PageSpeed, швидкодія (мобільний)
- 93 зі 100
- 97 зі 100
- PageSpeed, доступність
- 93 зі 100
- 100 зі 100
- Вага сторінки
- 6 487 КБ
- 391 КБ
- Швидкість наповнення екрана
- 4,1 с
- 1,5 с
- Горизонтальний зсув, 320–1536 px
- до 87 px
- 0 px
- Мікророзмітка
- немає
- Dentist і ще 22 вузли
- Тегів header / footer
- 2 і 2
- 1 і 1
- Файлів шрифтів на завантаження
- 19
- 10
- PageSpeed, SEO та практики
- 100 і 100
- Зсув макета під час завантаження
- 0
- Провали контрасту тексту
- 0
Що ця сторінка мала вирішити
-
«Уточнюйте ціну по телефону»
Головна причина, чому людина не дзвонить у стоматологію: незрозуміло, скільки це коштуватиме. Прайс на сторінці відкритий повністю.
-
Незрозуміло, хто саме лікуватиме
У клініці дев'ять лікарів із різними спеціалізаціями. На сайті кожен підписаний іменем, фото й напрямом ще до запису: пацієнт обирає конкретного лікаря сам, а не йде навмання на прийом до незнайомої людини.
-
Стокові усмішки замість власних робіт
Замість купованих фото на сторінці власні реставрації, гігієна і зняття нальоту, зроблені саме в цій клініці, тобто те, що людина реально побачить у кріслі.
Рішення й чому саме такі
-
Перший екран каже, що саме відкрито
«Весь план до першого кроку», і одразу під заголовком перелік: хто лікуватиме, скільки коштує, як виглядає результат. Сторінка одразу виконує те, що обіцяє заголовок.
-
Складена площина замість фотофону
Графіка побудована на згинах паперу й металевих гранях і тримає холодний клінічний тон без жодної стокової фотографії.
-
Моноширинний шрифт як мова точності
Підписи, номери й технічні позначки набрані моноширинним. Це читається як медична картка, а не як рекламний буклет.
-
Відео не вантажиться, поки його не попросили
Відеовідгук важить 5,9 МБ, і з preload="metadata" браузер тягнув його цілком ще до того, як людина натисне «грати». Один змінений атрибут зняв із першого відкриття сторінки 6 МБ зайвого трафіку: пацієнт на мобільному не платить за відео, яке навіть не збирався дивитися, і не чекає зайву секунду завантаження.
-
Розмітка описує клініку, а не сторінку
Dentist з адресою, координатами й графіком, дев'ять лікарів окремими вузлами, п'ять напрямів із цінами. Рейтинг береться з одного місця в коді, тому цифра в розмітці не може розійтися з цифрою на екрані.
-
Підмножина шрифту під українську
У наборі cyrillic-ext немає жодної української літери: і, ї, є, ґ живуть у cyrillic. Прибравши зайве й невживані накреслення, я скоротив завантаження шрифтів удвічі, тож текст зʼявляється на екрані швидше, поки відвідувач ще не встиг закрити вкладку.
Як це виглядає цілком
Прокрутіть усередині рамки. Це знімок усієї сторінки, знятий у браузері — відкрити сайт.
Замовника я знаю особисто, і сайт робився, щоб показати підхід у ділі: усе, що конкуренти зазвичай ховають за дзвінком, тут одразу видно на сторінці.
Другу половину роботи видно в таблиці замірів. Уже після здачі я прогнав власну сторінку тими самими перевірками, якими перевіряю чужі сайти, і вони знайшли шість речей: сторінка тягнула шість мегабайтів відео до першого кліку, не мала жодної мікророзмітки, тримала по два теги header і footer, з’їжджала вбік на вузьких екранах, ховала півтора десятка занадто дрібних цілей для пальця й вантажила набір шрифту без українських літер.
Усі шість виправлені. На комп’ютері сторінка тепер має 100 зі 100 у всіх чотирьох перевірках PageSpeed, на телефоні: 97, 100, 100, 100. Те, що лишилось невирішеним, перелічене нижче окремо.
Що в цій роботі ще не зроблено
- Сам файл відео як і раніше важить 5,9 МБ, просто більше не вантажиться без запиту. Хто натисне «грати» на мобільному інтернеті, заплатить трафіком за нього повністю. Файл ще треба перестиснути.
- Окремий файл стилів нижньої панелі затримує показ на 451 мс, і саме через нього найбільший елемент з'являється за 2,6 секунди.
- У кнопки запуску відео підпис для читалки з екрана не містить видимого тексту кнопки. Керування голосом на неї не спрацює.
- Сайт досі не стоїть на домені клініки: це чернетка, віддана на погодження.
Сайт зробив Остап Йонка
Львів · сам, від структури до запуску
Зробити такий розбір вашого сайту
Надішліть посилання — покажу заміри чинного сайту й що з ними не так. Безкоштовно, без зобов'язань.