Титульна (чи на Фандому Головна) сторінка – це місце, яке читачі та користувачі бачать першим, коли заходять на вікі. Перші враження дуже важливі, тому витратьте свій час, щоб зробити Головну сторінку привабливою. У цій статті Вам пропонується покрокова інструкція з коментарями про те, як створити «обличчя» Вашої Вікі з нуля.
Загальні правила[]
Незважаючи на те, що Заголовна сторінка може виглядати по-різному, є загальні принципи, дотримуючись яких, Ви не помилитеся при наповненні Заголовної сторінки:
- Читабельність — потрібно дотримувати баланс між кількістю тексту і кількістю зображень. Не поміщайте надлишок тексту на Головну сторінку, так як ця сторінка не є просто ще однією статтею вашої вікі.
- Опис — обов'язково розкажіть, про що ваша вікі, щоб користувач відразу чітко і ясно уявляв собі, куди він потрапив.
- Дружній тон — продемонструйте, що тут завжди раді новим читачам та користувачам.
Навігація — дуже важливий елемент Головної сторінки. Його можна зробити з допомогою посилань, зображень, слайдера. Але якщо Ви проігноруєте цей елемент, користувачі просто «зависнуть» на Головній сторінці і не підуть всередину вікі.
- Оновлення — Головна сторінка не повинна бути статичною. Оновлюйте її періодично, щоб користувачі бачили, що вікі активна і готова порадувати читачів новим контентом.
Ви можете наочно побачити, як ці правила працюють для Головної сторінки Вікі Співтовариства.
Тут Ви бачите дружнє привітання, якісне опис вікі, мінімальна кількість тексту, кілька навігаційних блоків (по википроектам, по новинам, за довідковими статтями), які ведуть на найважливіші розділи вікі, елементи, які регулярно оновлюються (список блогів, вікі-місяці, активні вікі, теми на форумі). У підсумку отримуємо якісну та інформативну Головну сторінку, на яку приємно заходити.
Заголовна сторінка крок за кроком[]
Крок 1: Колонки[]
Як правило, код Головної сторінки досить складний, тому при редагуванні Головної сторінки Вам краще відразу перейти в режим Вихідного коду. Це дозволить Вам бачити і додавати на сторінку теги, які допоможуть відформатувати сторінку, змінити дизайн елементів та ін.
Якщо Ваша Вікі була створена нещодавно, вона володіє стандартною Головною сторінкою, на якій Вас вже чекають підказки.
В першу чергу, це теги колонок для Головної сторінки. З їх допомогою можна легко і просто надати Головній сторінці стрункий вигляд, не виміряючи вручну ширину окремих розділів. Теги колонок створюють на Головній сторінці дві колонки: ліва має динамічний розмір і змінює свою ширину в залежності від дозволу екрану користувача (мінімальний розмір колонки — 700рх), права має стандартну ширину 300рх. Весь вміст колонок Вам потрібно розмістити між тегами, як зазначено нижче. Пам'ятайте, що ці теги зазначаються один раз. Не потрібно багато разів повторювати їх на сторінці.
<mainpage-leftcolumn-start /> Содержимое левой колонки <mainpage-endcolumn /> <mainpage-rightcolumn-start /> Содержимое правой колонки <mainpage-endcolumn />
Крок 2: Оформлення тексту тегами[]
Якщо Ви хоча б раз заглядали в код Заголовних сторінок топових вікі-проєктів, Ви напевно могли бачити теги span й div, а також br.
Тег div використовується частіше інших, він дозволяє розбивати текстовий вміст на блоки.
Тег br застосовується для створення переносу рядка. На перший погляд використовувана конструкція виглядає досить складно, розглянемо її на прикладі невеликого привітального повідомлення для вікі.
- Код
<div style="border:4px solid #FFA500; background:#FF0000; text-align:center; font-size:150%; color:#FFFFFF">'''Ласкаво просимо на <br />Тест Вікі!'''</div>
- Що на сторінці дасть
Тест Вікі!
- Тут
- div — головний тег, чий стиль зачеплений зовнішній вигляд вмісту.
Зверніть увагу, на його парність:
(за косою рискою) — в кінці рядка.
- border — малює рамку (в даному випадку ширина лінії рамки становить 4 пікселя)
- solid — параметр вказує, що рамка буде суцільною лінією; після вказаний колір рамки (Докладніше див. Довідка:Колір)
- background — відповідає за фоновий колір (в даному випадку червоний)
- text-align — відповідає за форматування тексту (в даному випадку по центру)
- font-size — визначає розмір шрифту (у даному разі 150%, тобто на 50% більше, ніж стандартний шрифт сторінки)
- color — вказує колір тексту (в даному випадку білий)
- br — переміщує слова «Тест Вікі!» на другий рядок
Аналогічний код можна використовувати для створення заголовків розділів, що ми розглянемо далі.
Пошукова оптимізація[]
Не всі адміністратори знають, що Головна сторінка є головною «їжею» для пошукових ботів. Саме Заголовна сторінка отримує пріоритет в результатах пошуку в Google та інших пошукових системах. Тому дуже важливо розміщувати на Головній сторінці ключові слова і ключові посилання. Це можуть бути назви та імена по темі вікі, посилання на сторінки персонажів, сезони серіалу, відеоігри та ін. Пам'ятайте, що індексація сторінки починається зверху — розміщуйте там найбільш важливі слова. Намагайтеся не додавати дві і більше однакових посилань, так як це зменшує рейтинг посилання.
Як приклад Титульної сторінки, яка добре оптимізована для пошукових ботів, зверніть увагу на Mass Effect Wiki. Навігаційне меню цієї вікі, яке слід відразу після привітання, намагається охопити всі можливі запити користувачів по темі вікі, а тільки потім слідують новинні блоги з менш важливою інформацією для пошукових ботів.
Крок 3: Навігація[]
Найбільш простий спосіб створити розділ навігації — це використовувати таблиці та списки. Це дозволить Вам швидко і ефективно розповісти читачам про вміст Вашої Вікі. Наприклад,
- Код
<div style="border:4px solid #FFA500; background:#FF0000; text-align:center; font-size:150%; color:#FFFFFF"> '''Зміст вікі''' </div>
{| style="width: 100%"
|
*[[Відеоігри]]
**[[Гра 1]]
**[[Гра 2]]
**[[Гра 3]]
|
*[[Персонажі]]
**[[Персонаж 1]]
**[[Персонаж 2]]
**[[Персонаж 3]]
|
*[[Зброя]]
**[[Зброя 1]]
**[[Зброя 2]]
**[[Зброя 3]]
|}
- Маємо
|
|
|
Другий спосіб — це комбінація з тексту і зображень. Цей прийом дозволить Вам урізноманітнити Головну сторінку, додавши на неї візуальну складову. Простим способом здійснити це є використання галереї. Наприклад,
- Код
<div style="border:4px solid #FFA500; background:#FF0000; text-align:center; font-size:150%; color:#FFFFFF">"'Навігація"'</div> <gallery orientation="landscape" widths="150" position="center" spacing="small" navigation="true"> TES Obvilion.jpg|link=Гри|[[Ігри]] TES Skyrim.jpg|link=Противники|[[Противники]] TES online.jpg|link=Персонажі|[[Персонажі]] </gallery>
- Маємо
Оновлюваний контент[]
Інтерактивні та автоматично оновлювані розділи — це простий спосіб додати на Головну сторінку свіжої інформації без необхідності оновлювати сторінку вручну. Для цього можна використовувати:
- Списки блогів
- Опитування
- Галерею зі свіжими зображеннями
- А також таймер зворотного відліку, випадкові цитати і випадкове відео, віджети свіжих редагувань і нових статей, вікно чату і список тем форуму.
Про теги та коди, які додають на сторінку ці елементи, Ви можете прочитати у відповідних довідкових сторінках.
Крок 4: Права колонка[]
В правій колонці Головної сторінки можна помістити другорядні елементи, які менш важливі для Головної сторінки. У нашому прикладі там розмістяться список блогів та опитування. Подивіться, як теги для них виглядають у Вихідному коді, і не забувайте про заголовки.
- Код
<div style="border:4px solid #FFA500; background:#FF0000; text-align:center; font-size:150%; color:#FFFFFF"> '''Блоги''' </div> <bloglist count=2 timestamp=true order=date> <category>Новини</category> </bloglist> <div style="border:4px solid #FFA500; background:#FF0000; text-align:center; font-size:150%; color:#FFFFFF"> '''Опитування''' </div> <poll> Тестове опитування Тест 1 Тест 2 </poll>
Додаткові елементи[]
Inputbox[]
За допомогою цього тега можна вказати новачкам спосіб швидкого створення нової статті. Це дуже допомагає на перших етапах розвитку вікі, коли список необхідних сторінок майже порожній і червоних посилань на сторінках вікі не так багато. Краще помістити цей елемент в праву колонку.
Відео[]
Відео Бібліотека Фандому надає всім вікі-проєктам якісне та ліцензійне відео. Ви також можете завантажити відео з YouTube. Присутність відеоролика на Головній сторінці — це ще один інтерактивний елемент, який може привернути увагу до Вікі. Краще розміщувати відео в лівій колонці, щоб можна було подивитись відео у хорошій якості, а не вдивлятися в дрібні деталі, якщо розмістити відеоролик у вузькій правій колонці.
Соціальні елементи[]
Обмін посиланнями з іншими вікі-проєктами і групами в соціальних мережах — відмінний спосіб залучити нових читачів та користувачів або показати місця, де ще активні користувачи Вікі. На Головній сторінці можна виділити спеціальний розділ для цього, помістивши туди віджети соціальних мереж і посилання на дружні вікі.
Найпростішим способом співпраці є міжмовні посилання, які пов'язують між собою вікі на різних мовах. Чому вони знаходяться внизу сторінки? Тому що, як вже говорилося вище, пріоритетом у пошукових ботів повинна бути Ваша Вікі, а не інші, нехай дружні, вікі-проєкти та групи в соціальних мережах.
Ще[]
Хорошим тоном вважається розміщення на Головній сторінці посилань на політику та правила Вікі, щоб користувачі могли з ними відразу ознайомитись посилань на довідкові статті, посилання на список адміністраторів або на сторінку обговорення бюрократа вікі, посилання на сторінку свіжих редагувань.
Щоб наочно продемонструвати працю користувачів вікі, можна вивести на Головну сторінку уривок з хорошої статті з посиланням на її повну версію або створити розділ з цікавими фактами або цитатами по темі Вікі. Якщо зробити це якісно, то такий елемент може привернути увагу і з боку фанатів теми, які раніше обходили вікі стороною.
Не забувайте про новини по темі Вашої Вікі. Вони допоможуть проєкту домогтися кращих результатів у пошукових системах, інформувати користувачів про нові події, за якими можна створити статті, спонукають користувачів частіше заходити до Вас, щоб дізнатися що-небудь нове. Новини можна оформити у вигляді короткої записи, новинного блогу, окремого великого розділу на вікі або за допомогою віджета соціальної мережі (наприклад, Твіттер).
