Прокачай свою статью | Фишки и советы хорошего оформления

⛨ ⛨ ⛨ ЗДАРОВА ⛨ ⛨ ⛨
Сегодня оформляем статью, применяя разные фишки​

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬​

⮚ В последнее время, я все чаще и чаще сижу и экспериментирую с различным оформлением для написания текстовых статей на Lolz. Сегодня я бы хотел поделиться разными фишками, что я смог найти и даже применить. Такие фишки и советы могут очень прокачать вашу статью в визуальном оформлении!


ꐚ 1. Правильно используйте цвет текста

⮚ Не стоит делать полностью цветной текст, тем более, если это не заголовок. Куда лучше будет выделить ключевые слова понравившемся цветом. Таким образом будет куда приятнее читать текст, у которого есть контраст, а не тот, что выглядит как новогодняя елка, старайтесь не сбивать цветным текстом концентрацию читателя.

⮚ Также следите за читаемостью: так как основная тема форума темная, то не нужно ставить даже в заголовках темные оттенки цветов на ваш текст.

⮚ Ниже будут представлены примеры, как делать не стоит:

Пример 1

Сплошной цветной текст будет рассеивать концентрацию читателя.

Пример 2

Заголовок темного цвета почти не читаем.

ꐚ 2. Используйте спойлеры, для размещения больших изображений

⮚ Часто вижу темы, где просто каскадом идут изображения и небольшие подписи к ним, это вообще не правильно. Не стоит забывать, что есть и пользователи, которые посещают форум с мобильных устройств, где картинка без спойлера будет на весь экран, из-за которой необходимую информацию разобрать будет сложно.

⮚ Но допустим, если ваше изображение небольшое, а его разместить необходимо, например просто для пояснения, то можете оставить его без спойлера, например так:

*Допустим тут будет гайд как открыть правила форума, для этого нужно открыть раздел "Другое"*​

⮚ Такое расположение изображения не будет мешать просмотру основного контента, а также будет нормально отображаться на мобильной версии браузера.


ꐚ 3. Соблюдайте отступы

⮚ Чтобы текст выглядел равномерным и красивым, не стоит лепить его близко друг к другу. Придумайте для себя комфортные, небольшие правила по оформлению текста и просто придерживайтесь им, например:

• 
  
  • После каждого заголовка до обычного текста отступ в 2 энтера
  • После каждого спойлера отступ в 1 энтер
  • Перед каждым заголовком отступ в 2 энтера

⮚ Такие простые правила помогут вашему тексту выглядеть стройнее. Ниже пример как делать не стоит:

Пример

ꐚ 4. Используйте косметические символы

⮚ На примере тех, что использую я, это могут быть: стрелочки, точки, символы для заголовков, разделители и так далее. Человеку на подсознательном уровне проще ориентироваться в какой либо информации, если она организована. Сразу понятно, где начнется следующая строка и на какой строке читатель остановился.

⮚ Для этого попробуйте использовать символы юникода, но не только те, что вы найдете в интернете, а также через встроенную программку "Character Map" . Она есть по умолчанию в Windows. Многие полезные символы всегда будут в ней, а некоторые прикольные значки, которые поддерживаются форумом я представлю ниже.

Значки и глифы

☰ ☱ ☲ ☳ ☴ ☵ ☶ ☷

★ ☆ ☇ ☈ ☉ ☊ ☋ ☌ ☍ ☏ ☡ ☤ ☥ ☧ ☨ ☩ ☫ ☬ ☭ ⛟⛠ ⛡⛢⛣ ⛬ ⚢ ⚣ ⚤ ⚥ ⚦ ⚧ ⚨ ⚩ ✀ ✁ ✃ ✄ ⛐ ⛒ ⛕⛖ ⛗ ⛘ ⛙ ⛚ ⛛ ⛜ ⛝ ⛞ ◱ ◲ ◳ ◴ ◵ ◶ ◷ ◸ ◹ ◺

⚬ ⚭ ⚮ ⚯ ⚲ ⚳ ⚴ ⚵ ⚶ ⚷ ⚸ ⚹ ⚺ ⚻ ⚼

➀➁➂➃➄➅➆➇➈➉ ➊➋➌➍➎➏➐➑➒➓

✕ ✗ ✘ ✙ ✚ ✛ ✜ ✞ ✟ ✠ ✢ ✣ ✤ ✥ ✦ ✧ ✩ ✪ ✫ ✬ ✭ ✮ ✯ ✰ ✱✲✵✶✷✸✹✺✻✼✽✾✿❀❁❂❃❅❆❈❉❊❋⛨⛉⛋ ⛌☖ ☗ ☙ ⁝⁝⁝

ꐶ ꐷ ꏿ ꐀ ꐁ ꐂ ꐃ ꐄ ꐅ ꐆ ꐇ ꐈ ꐉ ꐊ ꐋ ꐌ ꐍ ꐎ ꐏ ꐐ ꐐ ꐑ ꐒ ꐓ ꐔ ꐕ ꐖ ꐗ ꐗ ꐘ ꐙ ꐚ ꐚꐛ ꐜ ꐝꐞ ꐟ ꐟ ꐠ ꐡ ꐢ ꐣ ꐣ ꐤ ꐥ ꐦ ꐧ ꐨ ꐩ ꐩ ꐪ ꐫ ꐬ ꐭ ꐮ ꐯ ꐰ ꐱ ꐱ ꐲ ꐳ ꐴ ꐵ ꐶ ꐷ ꐸ ꐸ ꐹ ꐺ ꐻ ꐽ ꐽ ꐾ ꐿ ꑀ ꑁ ꑂ ꑃ ꑄ ꑄ ꑅ ꑆ ꑇꑈ ꑉ ꑉ ꑊ ꑋ ꑌ ꑍ ꑎ ꑏ ꑏ ꑐ ꑑ ꑒ ꑒ ꑓ ꑔ ꑕ ꑖ ꑗ ꑘ

ᗅ ᗆ ᗇ ᗈ ᗉ ᗊ ᗋ ᗌ ᗍ ᗎ ᗏ ᗐ ᗑ ᗒ ᗓ ᗔ ᗕ ᗖ ᗗ ᗘ ᗙ ᗚ ᗛ ᗛ ⏴⏵⏶⏷

⑴ ⑵ ⑶ ⑷ ⑸ ⑹ ⑺ ⑻ ⑼ ⑽ ⑾ ⑿ ⒀ ⒁ ⒂ ⒃ ⒄ ⒅ ⒆ ⒇ ⡆

⤀ ⤁ ⤂ ⤃ ⤄ ⤅ ⤆ ⤇ ⤈ ⤉ ⤊ ⤋ ⤌ ⤍ ⤎ ⤏ ⤐ ⤑ ⤒ ⤓ ⤔ ⤕ ⤖ ⤗ ⤘ ⤙ ⤚ ⤛ ⤜ ⤝ ⤞ ⤟ ⤠ ⤡ ⤢ ⤢ ⤣ ⤤ ⤥ ⤦ ⤦ ⤧ ⤨ ⤩ ⤪ ⤫ ⤬ ⤭ ⤮ ⤯ ⤰ ⤱ ⤲ ⤳ ⤶ ⤷ ⤸ ⤹ ⤺ ⤻ ⤼ ⤽ ⤾ ⤿ ⥀ ⥁ ⥂ ⥃ ⥄ ⥅ ⥆ ⥇ ⥈ ⥉ ⥊ ⥋ ⥌ ⥍ ⥎ ⥏ ⥐ ⥑ ⥒ ⥓ ⥔ ⥕ ⥖ ⥗ ⥘ ⥙ ⥚ ⥛ ⥛ ⥜ ⥝ ⥞ ⥟ ⥠ ⥡ ⥢ ⥣ ⥤ ⥥ ⥦ ⥧ ⥨ ⥩ ⥪ ⥫ ⥬ ⥭ ⥮ ⥯ ⥰ ⥱ ⥲ ⥳ ⥴ ⥵ ⥶ ⥷ ⥸ ⥹ ⥺ ⥻ ⥼ ⥽ ⥾ ⥿ ⦀ ⦁ ⦂ ⦙ ⦚ ⦛ ⦜ ⦝ ⦞ ⦟ ⦠ ⦡ ⦢ ⦣ ⦤ ⦥ ⦦ ⦧ ⦨ ⦩ ⦪ ⦫ ⦬ ⦭ ⦮ ⦯ ⦰ ⦱ ⦲ ⦲

⦃ ⦄ ⦅ ⦆ ⦇ ⦈ ⦉ ⦊ ⦋ ⦌ ⦍ ⦐ ⦑ ⦒ ⦓ ⦔ ⦕ ⦖ ⦗ ⦘

䷀ ䷁ ䷂ ䷃ ䷄ ䷅ ䷆ ䷇ ䷈ ䷉ ䷊ ䷋ ䷌ ䷍ ䷎ ䷏ ䷐ ䷑ ䷒ ䷓ ䷔ ䷕ ䷖ ䷗ ䷘ ䷙ ䷚ ䷛ ䷜ ䷝ ䷞ ䷟ ䷠ ䷡ ䷢ ䷣ ䷤ ䷥ ䷦ ䷧ ䷨ ䷩ ䷪ ䷫ ䷬ ䷬ ䷭ ䷮ ䷯ ䷰ ䷱ ䷲ ䷳ ䷴ ䷵ ䷶ ䷷ ䷸ ䷹ ䷺ ䷻ ䷼ ䷽ ䷾ ䷾ ䷿

⮚ Выше ⥛ это символы из шрифта ARISTOTLE, вы также можете выбрать любой другой, например Arial, в котором также не мало различных глифов. К сожалению я не смог найти прям полностью все глифы списком в интернете, поэтому то, что представлено выше, проще всего найти в том же Character map.

Character map

⮚ Ну а тут я покажу несколько интересных примеров, как можно применить некоторые глифы.

Пример 1

⥛ Список 1
⥛ Список 2
⥛ Список 3
⥛ Список 4

Пример 2

⁝⁝⁝ ПОДЗАГОЛОВОК

Пример 3

✀ Вырезаем картинку, как показано на видео

Пример 4

Первый текст
☇ Переход ко второму тексту

Пример 5

⦅ Заголовок ⦆

Пример 6

⤥ Заголовок подраздела

Пример 7

⛞⛞⛞ ЗАГОЛОВОК ⛞⛞⛞

ꐚ 5. Как сделать большой⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱⸱пробел?

⮚ Если вставить несколько пробелов, то увы, у вас ничего не получится, так как они автоматически преобразуются в один пробел. Для этого попробуйте использовать, к примеру, этот символ "⸱⸱⸱⸱⸱⸱⸱⸱⸱". Размечаете, сколько нужно вам места и присваиваете ему цвет по кодировке HEX #272727 — это стандартный фон форума, таким образом элемент просто будет с ним сливаться, создавая пространство.

Делаем мега пробел

ꐚ 6. Делаем градиенты прямо в редакторе

⮚ Для этого нам нужно достаточно длинное слово или фраза. Я выбрал "Этот замечательный мир!". Теперь выбираем каждую букву и меняем значения ее цвета. Буду делать это через схему RGB. Смотрим ниже видео:

Гайд

⮚ Как только вы дошли до значения 255, выше поставить будет нельзя, меняйте следующее значение в меньшую сторону. Как только приловчитесь, это действие будете выполнять намного быстрее, а выглядит это потрясающе!

⮚ В примере я использовал шаг 20 в изменении значений, чем меньше шаг (например 5), тем плавнее градиент, но и текст нужен длиннее. Длинный шаг (например 20) подойдет для одного слова или короткой фразы. Ниже примеры разных значений гладкости градиента:

Пример

⮚ Также можно сделать это автоматически, с использованием скрипта. Заходим на этот сайт и настраиваем текст. Как только все сделали, просто скопируйте текст в редактор и готово!

(большая благодарность @Afton72 и @наркотик за идею и реализацию)

Градиент

ꐚ 7. Используйте тестовый раздел
⤥ https://zelenka.guru/forums/test-forum/

⮚ Перед публикацией своей статьи/треда советую посетить тестовый раздел, где можно выложить свою работу, перед основной публикацией. Можете выкладывать там любые проверки, которые хотите, а затем уже публиковать в другой нужный вам раздел.

⮚ В этом же разделе удобно находить разные баги, связанные с текстовом редактором, к примеру.


ꐚ 8. Не переборщите с оформлением

⮚ Не стоить лепить на каждом шагу косметические символы, выделять каждое слово в тексте или ставить сплошной курсив на весь текст. Старайтесь сделать его эффективным для читателя, а не "супер-красивым" накидав все подряд.

⮚ Разделяйте текст на подразделы, комбинируйте строки и применяйте немного креатива, таким образом вашу статью будет интересно читать, параллельно кайфуя от оформления. Также не забывайте про мобильную версию форума, в которой ваша статья может выглядеть иначе.

⮚ Также, пока я собирал разную информацию для статьи, нашел интересный сайт FSymbols (не реклама) Он преобразует напечатанный текст в ASCII арт, который может быть полезен при оформлении. Пример ASCII арта вставлю в самом конце статьи под спойлер.


ꐚ 9. Еще несколько фич

⮚ Недавно я случайно нашел раздел на форуме про BB-коды (https://zelenka.guru/help/bb-codes), так вот тут есть прикольные вещи, например как:

Отступы, с помощью [INDENT][/INDENT]

Без отступов

⮚ (Сейчас отступы после повторного редактирования работают криво) Да, весьма похоже на пункт 5, но оказывается это можно было сделать куда проще :0 Также особо мне понравилось то, что можно всунуть свой шрифт:

Шрифты, с помощью [FONT=][/FONT]

Это шрифт Montserrat
Это шрифт Times New Roman
Это шрифт Ubuntu
Это шрифт Raleway
Это шрифт Porsche
Это шрифт PT Mono

⮚ Также, там есть и другие стандартные фишки форума, тут я обозначил те, которые я не знал)

✠ ✠ ✠ СПАСИБО ЗА ПРОЧТЕНИЕ ✠ ✠ ✠
Надеюсь эта статья будет для вас полезной!
​

​

Теги

как офорлять стать, статьи, статьи лолз, как оформить, оформление статьи, правильно оформляем статью

Оформление by Maxyao