Выравнивание текста по ширине

Здравствуйте. В связи с тем, что в обновленной версии WordPress исчезла такая функция, как  выравнивание текста по ширине, многие бросились искать другие способы выравнивания. Потому что привыкли, потому что эстетический вид придает, потому что считается, что конверсию статьи повышает. Но, как оказалось, не все йогурты одинаково полезны. 🙂 Есть способы, которые могут навредить сайту. И так ли уж важно так располагать текст? Чем это хорошо, и чем плохо? Давайте попробуем разобраться.

выравнивание текста по ширине

 

 

Общие требования к тексту

Для печатных текстов требования существуют давно, причем они разные для художественного текста, делового письма, официальных документов. Для текстов в электронном виде тоже есть правила. Например, текстовый редактор Word задает такие параметры, как шрифт, размер, интервал и др. Стандарт: Times New Roman; 12; 1,5. Там же принято выравнивать текст по ширине (и слева, и справа), что придает ему аккуратность, строгость и красивый внешний вид. Можно ли на страницы Web-сайтов взять и перенести эти стандарты?

 

Тексты Web-сайтов

Когда эта функция начинает применяться к разметке сайта, то приносит с собой недостатки. Для оформления текста на сайте тоже существуют свои требования, направленные на то, чтобы текст стал удобным для чтения. Вот только некоторые:

  • размер шрифта 12-14 кегль
  • в заголовке размер 18-29
  • в заголовке не ставится точка
  • ширина строки 55-75
  • абзац состоит из 5-7 строк
  • использование тегов
  • оптимальный размер текста 2000-3000 знаков

Можно придерживаться этих требований, а можно и не придерживаться, страшного ничего нет. Я, например, абзацы делаю и больше 5-7 строк, и объем текста обычно гораздо больше. На норму в 3 тысячи знаков натыкалась не раз, а вы видели, какие статьи выводятся в топ?. От 10 тысяч без пробелов и выше. Так что все относительно.

 

Как сделать выравнивание текста по ширине

Раньше выравнивали просто. Выделяли весь текст, нажимали на значок  и все. Значка выравнивания текста по ширине в визуальном редакторе теперь не стало. Вот так он выглядит на сегодняшний день.

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

  1. С помощью горячих клавиш Shift+Alt+J
  2. С помощью редактора записей в закладке «Текст»
  3. Через каскадную таблицу стилей (CSS), редактированием файла (style.css)
  4. С помощью плагинов CKEditor for WordPress и Tiny MCE Advaced

Есть и другие, но в них разобраться сложнее. Лучшим будет способ, когда текст будет равняться автоматически, через редактирование кода. Это третий вариант. Плагины лишние нагружают сайт, комбинация клавиш годится только для одного текста.

Сама испробовала способы 1, 2 и 3. Первый самый простой, второй не помог, после третьего сайт лег. Думаю, потому что второй и третий способы использовала одновременно. Во второй раз получилось. Про плагины ничего не знаю, кроме их названия. Информация не проверена, просто нашла в интернете.

 

Как текст выравнивается

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

Для всех текстов автоматически идет выравнивание по левому краю. Когда мы делаем выравнивание дополнительно справа, то текст становится равным и слева, и справа. Выглядит красиво. Но за счет чего это достигается? Правильно думаете: за счет увеличения пробелов между словами. То есть пробелы становятся не одинаковыми, а как бы рваными: где больше, а где меньше. Выравняв по краям, сделали текст уродливым внутри.

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

выравнивание по ширине большие пробелы

Кроме того, если выравнивать текст с помощью клавиш, то, как написал ПЧ в комментарии к предыдущей статье, получается «мешанина в исходном коде страницы». Поскольку сама в этом не разбираюсь, то просто процитировала.

 

Так надо или нет равнять текст по ширине?

Если уж вам нравится таким образом отформатированный текст, то в css стилях  задавайте выравнивание сразу для всех абзацев в статье.

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

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

И еще на разных устройствах текст выглядит по-разному. Даже если он ровный справа, то на телефоне, когда адаптируешь к мобильному устройству, эта ровность и стройность пропадает. И выглядит он по-другому. Так стоило ли стараться?

Так что выбирать вам. Либо справа и слева аккуратные края, либо аккуратный и экологичный текст.

 

 

 

 

 

Спасибо, что делитесь статьей в социальных сетях!

43 комментария

  1. Как-то выравнивал, но мне не понравилось, текст становится похожим на научный, строгий доклад))
    P.s. «с ЭТИМ мириться не стали»
    опечаточка).

  2. а если в стиле или в html прописать выравнивание по ширине ? вот здесь есть атрибуты для выравнивания http://htmlbook.ru/samhtml/tekst/vyravnivanie-teksta. А вообще не обращал на это внимание, недавно, третий месяц пользуюсь движком вордпресс. Кстати могу подсказать как убрать лишние ссылки с темы wordpress.org или другие , обращайтесь. Я как-то убрал, нашел в файлах и удалил.

    • Видела эту статью.
      Вордпресс очень удобен и прост.
      Я знаю, как найти лишние ссылки и как удалить. Но надо проверить. Потому что если ссылка закодирована, то сайт перестает работать без нее. Иногда достаточно взамен поставить свою внутреннюю ссылку, а иногда не срабатывает. Тут надо быть очень осторожным.

  3. Спасибо! Всё чётко, понятно изложено. Конечно, аккуратный и экологичный текст лучше. Надо, видимо, перестроиться и перестать выравнивать (а где-то у кого-то в комментариях на сайте я, наоборот, видела замечание о том, что отвлекает неровность и «рваность» текста справа)

    • Просто справа неровность больше заметна внешне. Но глаз готов к переходу и при ровном, и при неровном окончании строки. А если неровности внутри текста, то почти перед каждым словом приходится ему перестраиваться. Нагрузка увеличивается.
      Особо критического ничего нет. Можно привычным способом оформлять. Плюсы-минусы знаете. Выбираете между явным и не явным неудобством.

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

    • Думаю, Вы не станете этим определять свою ценность и ценность своих статей? Безупречность относительна. Не тратьте на это больше времени, чем она того заслуживает.

  5. Татьяна, я написала новую статью и не выровняла. Оцените, пожалуйста:)

    • Знаете, на содержание это никак не повлияло. 🙂
      Я там не стала писать. Чтобы все способы описать и ничего не упустить, можно было воспользоваться интеллект-картой Е. Вергуса, она в свободном доступе. Там уже ничего не упущено. А так все понятно разъяснили.

      • Спасибо за тактичность! Сама писала о том, что знаю. Конечно, у Вергуса лучше:), можно было воспользоваться. Учту на будущее.

        • Ценен именно свой опыт. И Вы это показали. Но обзор в общем должен быть полноценным. Я так думаю.
          Не обязательно Евгения схемой было пользоваться. Я имела в виду, что картину надо давать полную, и показывать, что вот тут Вы уже что-то делали, и вот так получилось, а этого еще не делали.
          Ведь некоторые могут подумать, что на этом все и заканчивается и других способов нет.

  6. Татьяна, оказывается не у одного меня возникал такой вопрос, куда делась кнопка для выравнивания по ширине. Сначала думал, что это особенности шаблона. Оказывается ее убрали.

  7. Ага, все-таки не зря ее убрали, эту кнопочку! Я-то сперва расстроилась — привыкла выравнивать, чтобы текст красиво смотрелся. Подспудно была такая мысль, что неспроста это, оказывается, действительно так.

  8. А я с этим вообще не заморачиваюсь. Поставил хорошую тему, и забыл про разные ситуации с текстом. А вообще, когда расширял прошлую тему, то вносил правки в код.

  9. Татьяна, спасибо Вам! Очень интересная статья, я много пишу, но к сожалению, не знаю многих правил и не как не могу освоить все премудрости текстовых редакторов! В то свободное время что выпадает, с удовольствием читаю ваши статьи, мне нравится Ваш стиль и самое главное, полезность Вашего материала!

    • Андрей, спасибо. Я в редакторе только книги оформляю. Статьи пишу прямо в админке блога.
      Мне у Вас шаблон нравится. Прямо такой в стиле минимализма. Только не поняла, баннеры специально к левому боку прижимаете?
      Шаблон, видимо, не русскоязычный был. Мне нравятся именно такие: просторные, светлые.

  10. Хорошо, что есть такие функции. Я пишу статьи сначала в ворде, потому что если писать прямо в админке блога вордпресс столько копий сохранит, что потом нужно будет удалять все редакции.

    • Просто, Ольга, у меня сайт молодой, поэтому я пока на это не обращаю внимания. Там полно места. И иногда могут понадобиться старые редакции.
      Хотя есть вот такое мнение:
      «Разработчик WordPress Mike Little в комментарии на сайте WPBeginner ответил, «Запросы WordPress к базе данных не получают редакции, поэтому количество редакций не влияет на скорость выполнения запросов. Единственный раз когда редакции загружаются на страницу, это при редактирования отдельного поста. И это не влияет на скорость загрузки страниц вашего сайта. »

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

  11. Была огорчена, когда не увидела в Вордпрессе такой функции, как выравнивание текста. Дело в том, что это не позволяет вставлять коды микроразметки. Немного подумала и нашла выход, правда, редактирую не весь пост, а только те абзацы, в которых вставляю код.

  12. Татьяна здравствуйте! Я выравнивание текста у себя на сайте ни делал, думаю это дело привычки. Главное, чтобы статья была полезной и хотелось её дочитать до конца. Ваша статья мня заинтересовала.
    Удачи Вам и успехов!

    • Борис, я бы тоже, может, и не выравнивала, да нас так учили. Поэтому до недавнего времени этим занималась. А когда не стало такого тега, возник вопрос. Начала изучать, в итоге пришла к решению, что можно было и не выравнивать. Такова история вопроса.

  13. andi:

    Здравствуйте!
    Очень грамотный совет. Выравнивание относится к оформлению, и поэтому должно осуществляться исключительно посредством CSS. Для каждого абзаца пихать атрибут style со значением text-align:center — дикость.
    Со своей стороны скажу, что визуальным форматированием при написании статей не пользуюсь вообще. Текст/код подготавливаю в notepad 2, оттуда уже копирую в форму и загружаю необходимые изображения. Но это, повторюсь, не в визуальном редакторе.

    • Спасибо. Я вот тоже подумываю начать писать в Notepad, ведь для других целей им пользуюсь.
      Как я понимаю, копии в визуальном редакторе сохраняются только тогда, когда используешь кнопку «обновить». При написании же статьи много раз нажимаю кнопку «сохранить». Эта операция не приводит к появлению дублей, но, возможно, лучше этого не делать.
      Хотя знаю, что некоторые пишут именно в редакторе. Интересно бы узнать мнение тех, кто точно знает, есть ли от этого вред.

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

    • Вот хорошо, что Вы это сразу заметили. А я не знала. С телефона смотришь — текст ровный, адаптируешь — не ровный. И стоило ли стараться? Да и сами, наверное, осваивали. А нас в школе так научили.

  15. А почему Вы решили, что выравнивания по ширине не стало? Только что посмотрел у себя, в редакторе TinyMCE Advanced оно как было, так и осталось. А вообще я этим никогда не пользуюсь. В CSS задал для абзаца нужные параметры и забыл…

    • Александр, с версии 4.7 этот значок пропал, а плагин TinyMCE Advanced я не ставила. Понятно, раз у Вас он стоит, то там ничего и не исчезнет. У меня нет острой необходимости. И я не Эндрю Оз. 🙂
      Может, он и нужен, но обхожусь вполне.

  16. Я никогда по ширине текст не правила. Как есть в редакторе, так и оставляю и мне кажется, что это не принципиально, главное, чтобы сам текст был интересен и его читали до конца.

    • Конечно, Таисия, так и есть. Речь шла о тех людях, которые привыкли так делать и после исчезновения кнопки оказались в замешательстве, стали искать альтернативу. Привычки не быстро искореняются, даже если понимаешь, что это не очень хорошая привычка.

  17. Мне лично выравнивание текста с двух сторон не нравится. Такой текст уж слишком кажеся машинным, а когда слева, то хоть в чем-то видно, что человек писавший руки прложил.

  18. А мне нравится когда текст ровный, словно под линейку 🙂

  19. Спасибо большое, только у вас нашёл как решить данную проблему. Сам начинающий блогер, и после того как выложил статью, не знал как её выравнить!

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

  20. Я всегда выравниваю по ширине, привык просто. И мне кажется, так аккуратнее и красивее смотрится. Делаю все в TinyMCE Advanced, потому что это удобно и быстро. Для меня style в каждом абзаце как-то и незаметен в плане скорости загрузки. А плагин форматирования TinyMCE всегда будет добавлять теги. Но как без него обойтись? Каждую страницу не отформатируешь через css. А иногда приходится уникализировать оформление, что-то выделять. Как Вы считаете, Татьяна, лишний код на странице вредит продвижению?

Добавить комментарий для Кристина Отменить ответ

Ваш e-mail не будет опубликован. Обязательные поля помечены *