место в рейтинге
  • 397112
  • 11141
  • 407
Нравится блог?
Подписывайтесь!

Человеческая верстка постов

Данная запись, возможно, покажется нужной как и старичкам, так и новичкам на Юви.

Бывает, что посты просто нереально читать из за хреновой верстки или из-за того, что блогер хочет всем и каждому показать, как он владеет HTML и CSS.

Здесь вы узнаете:

- Как сделать так, чтобы фотки были в тексте, а не под или над ним;

- Как красиво вставить цитату или маленький блок текста в запись;

- Как НЕ надо верстать посты;

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

Заголовки и подзаголовки

Периодически я натыкаюсь  на посты, которые озаглавлены Вот такими вот, блеать заголовками.

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

Хотя есть разные варианты:

1)

<strong>

<span style="text-decoration: underline;">

Заголовок

</span>

</strong>

Заголовок

2)

<p style="text-align: center;">

<span style="text-align: center; padding: 0 50px 0 50px; background: #dcdcdc; color: #000;">

<strong>

Заголовок

</strong>

</span>

</p>

Заголовок

3)

<span style="font-size: 30px; line-height: 1;">

Заголовок

</span>

<hr />

Заголовок

 
 

Шрифт

Применяемый Agora Sans (Название шрифта) вполне себе читабелен. И не надо выебываться, меняя шрифт на что-нибудь типа Times New Roman. C недавнего времени я ненавижу шрифты с засечками.

Вполне себе нормально и читабельно будет текст делить на абзацы через каждые пять-десять строк. Помните, что абзац - это одна мысль. И что, абзац состоящий из тонны текста абсолютно, категорически нечитаем. Это жопа, а не текст получается.

Я практически смирился с тем, что местные обитатели любят применять огромное количество знаков препинания по поводу и без. Типичный представитель - я. Люблю, знаете ли, смайлики ставить после каждого предложения. Не знаю, мания ли, привычка ли))))) Но, бля, ставить по 3-10 восклицательных или вопросительных знаков после предложения - это та еще неистребимая хрень. Следите за пальцами, что ли.

Расположение картинок

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

Теперь знаю.

Странно, но это не работает, если текст заключен в цитату. И это печально.

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

Вот код для вставки:

<img style="padding: 10px;" src="http://im8.asset.yvimg.kz/userimages/robin_hood/324/Z420bZJN6J7Px2i5uF8dAK91uaw2hl-origin.jpg" alt="" width="200" align="left" />

Разумеется, что вместо "http://im8.asset.yvimg.kz/userimages/robin_hood/324/Z420bZJN6J7Px2i5uF8dAK91uaw2hl-origin.jpg" нужно вставить адрес вашей картинки.

А вместо align="left" можно поставить align="right" и рисунок будет справа от текста.

Цитаты в тексте

Цитата

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

Вот эти фундаментальные расхождения в мировоззрении и являются причинами орко-эльфийской вражды.

Сергей Ветров

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

К сожалению, div'ами здесь верстать не получается. И к сожалению приходится прибегать к помощи моих любимых таблиц.

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

Правильно говорят, что повторение мать учения.

Или можно тупо вставить какой-нибудь небольшой анекдот в тему повествования.

В общем, пространство для фантазии есть.

Вот код:

<table width="200" align="left">
<tbody>
<tr>
<td style="padding: 5px; font-size: 12px; line-height: 1.2;"><strong>Цитата</strong>

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

Вот эти фундаментальные расхождения в мировоззрении и являются причинами орко-эльфийской вражды.

<em>Сергей Ветров</em></td>
</tr>
</tbody>
</table>

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

Логика проста: Чем ебанутее сверстан пост, тем меньше в следующий раз будут к вам заходить люди. Меньше людей - ЧСВ падает. А там и до ожирения недалеко))

Шутка, конечно, но задумайтесь.

Спасибо, что прочли. Чмоке

18 октября 2011, 22:11
1022

Загрузка...

Комментарии

SiM
0
0
Зачетно, то,что надо,а то я плохо не умею пользовать этой хтмл,а это наверно научит, твой пост хорошо.)))))
Да там все легко.
Бери и пользуйся))
SiM
0
0
дык, ща твой пост у мя в кладке, время будет почитаю и...буду пользоватся)))))
izzya
0
0
напишите ещё про то как заполнять качественным содержанием
Абсурдопедия :-)
izzya
0
0
то-то я смотрю здешние посты такие знакомые
А тут уже от травы зависит))
У тебя ведь есть интересное содержание.
Если б ты не прятал бы весь текст под катом, вашпе было бы замечательно))
для меня очень тяжело по НТМЛ. не секу.:(
ХТМЛ простой, а вот CSS, который тут местами, он посложнее.
спасибо! постараюсь освоить. но в некоторых вопросах я ужасный чайник и непроходимая тупица. стыдно. :(
Да там просто, Ди.
Если что обращайся - подсоблю
О, за цитаты в тексте спасибо.
Уау.. круто.. у меня тоже мания ставить многоточие ну ни каак не могу с ним справиться.. =) Много чего полезного прочитала и узналаа... Спасибо =)
Бывает))
Пожалуйста
спасибо. я и половины не знал из того что тут написано... буду пробовать...
Эти моноблоки жуть как не люблю. Текст постоянно теряется. Такое, даже с интересным названием, кидаю в топку...
Вот-вот.
С абзацами реально легче читать
limass
0
0
во класс.. пойду повыебываюсь перед киргизскими блогерами ))
limass
0
0
вот скажи что за фигня со вставкой видео с ютуба? html код видео с ютуба после вставки на юви меняется на квадратик с высотой и шириной в 100 на 100px, приходится переключатся и менять размер уже вручную. Не для киргизов прошу, для себя) Пользуюсь chrome)
Ты знаешь, как-то давно не вставлял видео.
Щас попробовал и нормально. Тоже chrome.
Я не знаю, почему именно у тебя так.
Попробуй обновить до версии stable - возможно ты юзаешь бету
в моцилле та же..х) код с ютуба все ровно, 390 на 640px. Магические свойства вставки видео аудио на юви.. изменяют на 100 - 100px меняя местами height and width..
Спасибо за тесты) бум пробовать че нить как нить)
Для тех, кому ваще лень, есть вот такая херота - htmlka.com
Спасибо, кэп! :-))) Шутка, хороший пост!
Пасаны должны заценить))
Наконец-то смогу нормально вставлять картинки. А то они столько места жрут и текст разрывают. Спасибо, мистер Робин.
отличный, полезный пост!
Akiro
0
0
говорил же я, что тот кто напишет пост как верстать получит реальную благодарность!
ВОТ ОНА РЕАЛЬНАЯ БЛАГОДАРНОСТЬ. =)
от меня.
в избранное.
Я наоборот, думал, что будет много комментов вида: "спасибо, кэп".
Очень приятно, спасибо))
Akiro
0
0
много каментов "спасибо кэп" это в моем последнем посте. =)
а это реально полезная штука. =)
Все для пользователей)
Mult
0
0
теперь все посты будут отшаманенными :)
В избранное!
юзай на здоровье)
я, в общем, в избранное как всегда добавила.
ну и, как обычно, зимой под НГ прочту.
и, может быть, ДАЖЕ буду следовать советам.
а ПОКА - МУЧАЙТЕСЬ И СТРАДАЙТЕ НЕСЧАСТНЫЕ ОТ МОЕЙ ХРЕНОВОЙ ВЕРСТКИ)))
лайк! керек ақпарат! Спасибо
спасибо,Робин..что нибудь из этого думаю применю)
а теперь попробуйте в ювижене выложить образец кода даже без семантической подсветки) попробовали? и не надо)))
В смысле?
Просто код в посте?
с пробелами нужной длины
Как всегда рада твоим поучалкам. Робин, ты няка! ^__^
няка... почти как кака))

Нет проблем, бро, юзай))
блин, когда читаю любую Вашу публикацию - улыбка не сходит с лица))) спасибо за юмор и полезные советы)
Гыгыг))
Приятно, пасиба)
Оо возьму на заметку!
А то я как-то не очень в редакторе шарю=)
Ой, забыла поцеловать в ответ.
Целую жарко.
Ежели сильно растаешь, дай знать-остужу.=)

Оставьте свой комментарий

Спасибо за открытие блога в Yvision.kz! Чтобы убедиться в отсутствии спама, все комментарии новых пользователей проходят премодерацию. Соблюдение правил нашей блог-платформы ускорит ваш переход в категорию надежных пользователей, не нуждающихся в премодерации. Обязательно прочтите наши правила по указанной ссылке: Правила

Также можно нажать Ctrl+Enter

Популярные посты

Я был удивлён, что в Азербайджане есть Казахский район

Я был удивлён, что в Азербайджане есть Казахский район

Мне как казаху по национальности очень хотелось туда попасть. Оказалось, что климат там намного суровей и люди, говорят, суровые и воинственные. Казах – город на западе Азербайджана...
alidimash
18 янв. 2017 / 21:50
  • 27094
  • 18
10 лучших районов Алматы. Широкие улочки, частные дома, летом – красота!

10 лучших районов Алматы. Широкие улочки, частные дома, летом – красота!

Названия улиц: Садовый бульвар, Солнечный проезд. Красиво звучит не так ли? Прям, как в Москве... Уютные улочки и радующие глаз одноэтажные домики, тихо и свободно, нет динамики, движух и ажиотажа.
gelberdeuet
16 янв. 2017 / 14:45
  • 8069
  • 98
Многочасовые очереди, смерти в ЦОНах: почему вопросы об этом ставят парламентариев в тупик?

Многочасовые очереди, смерти в ЦОНах: почему вопросы об этом ставят парламентариев в тупик?

Ожидали ли депутаты Мажилиса всего этого? Как планировали этот процесс регистрации, и обсуждали ли его, прежде чем одним нажатием кнопки принять нормы с такими абсурдными временными рамками?
openqazaqstan
17 янв. 2017 / 14:32
  • 4868
  • 22
Астана глазами алматинских девушек. Как при таких погодных условиях можно выжить?

Астана глазами алматинских девушек. Как при таких погодных условиях можно выжить?

В спальных районах, и в высотных домах сквозь стены слышно завывание ветра. В особенности ночью. Такие звуки, я слышала, пожалуй, только по телевизору, в фильмах про метель.
Naomi_K
вчера / 12:36
Сильное ДТП произошло в Алматы на Тимирязева-Байзакова

Сильное ДТП произошло в Алматы на Тимирязева-Байзакова

NoComment (c) Официальный слоган EuroNews. Катастрофа на алматинской утренней трассе началась с того, что водители «Ниссана» и микровена ожидали сигнала светофора на запад по Тимирязева...
ibestreporter
17 янв. 2017 / 22:52
  • 3707
  • 5
Вейпинг безопасен? Эндрю Холл из США тоже так считал, пока что-то не пошло не так

Вейпинг безопасен? Эндрю Холл из США тоже так считал, пока что-то не пошло не так

Эндрю Холл из США считал, что вейпинг безопасен и усиленно убеждал в этом близких. Но как-то раз что-то пошло не так. Это результат взрыва хипстерского устройства - выбило 7 зубов + ожоги и раны...
Maxambet
17 янв. 2017 / 16:28
  • 3599
  • 47
Это поколение просрет страну. 20-летняя молодежь представляет из себя сказочных эльфов

Это поколение просрет страну. 20-летняя молодежь представляет из себя сказочных эльфов

Смотря в очередные пустые глаза вчерашнего студента, приходящего устраиваться на первую работу страшно становится. Потому что сравниваю с теми же китайскими студентами, которые готовы выгрызать себе мечту.
mbaitykov
18 янв. 2017 / 11:34
  • 3727
  • 99
Становится хуже, но как-то постепенно. Беднеем, но тоже как-то не разом

Становится хуже, но как-то постепенно. Беднеем, но тоже как-то не разом

Помню, когда я уезжал и Казахстана, тут было довольно прилично, даже не смотря на то, что жить было невыносимо. Но прилично так. Мусора было меньше. Дороги чистили, вони почти не было. Да и в остальном тоже норм.
shootnix
18 янв. 2017 / 12:49
  • 3190
  • 34
Любимый Тайланд. Правящий король называет Паттайю «черным пятном на репутации страны»

Любимый Тайланд. Правящий король называет Паттайю «черным пятном на репутации страны»

Тайланд мы впервые посетили в декабре 2012 года. Полученные эмоции настолько были яркими, что в конце 2015 года мы решили еще разок слетать в Тайланд. Вспоминая Тай, первое о чем я думаю - горячий...
zhainar_d
17 янв. 2017 / 11:11
  • 3014
  • 24