ФЭНДОМ


Собираетесь изменить дизайн своей вики с помощью CSS? Эта справочная статья поможет вам разобраться в некоторых вопросах и изменить внешний вид вики без проблем.

Советы

Конструктор тем

Самым простым и наиболее эффективным способом изменения внешнего вида вики является Конструктор тем. Он позволяет без лишних затрат времени и знаний CSS изменить дизайн, в том числе поменять логотип, фон или цветовую схему вики. Ознакомьтесь со справочной статьёй Конструктора!

Theme designer - theme tab

Подбирайте цвета с умом

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

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

Создание цветовой схемы для темы не является лёгким процессом. Чтобы избежать ошибок, просто придерживайтесь следующих правил:

  • Старайтесь создать хороший контраст между текстом и фоном. Хорошим примером является тёмный цвет текста на светлом фоне.
  • Фоновое изображение — это круто, но не в том случае, если из-за него вы не можете прочитать текст. Обратите внимание, что Конструктор тем позволяет изменить прозрачность фона статей, что позволяет отобразить фон. Не переусердствуйте.
  • Не уменьшайте размер объектов! Особенно это касается области с текстом.

Используйте простой стиль

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

Стоит также учесть, что ФЭНДОМ имеет динамическую ширину страницы — то, что отображается на вашем разрешении экрана, может отображаться иначе при меньшем или большем разрешении. Хорошим примером является ширина блоков. Использование точных значений чаще всего приводит к зазорам и пустым пространствам между блоками и содержимым страницы, в то время как процентные значения позволяют этого избежать.

Читабельный код

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

Не забывайте использовать комментарии в коде. Это поможет быстро разобраться с кодом и понять, за что он отвечает. Добавить комментарий достаточно просто — вставьте ваш текст между /* и */. В качестве примера:

/* Это комментарий */

См. также

Материалы сообщества доступны в соответствии с условиями лицензии CC-BY-SA , если не указано иное.