{ "version": "https:\/\/jsonfeed.org\/version\/1", "title": "Переверстал, заметки с тегом: реестр дезсредств", "home_page_url": "https:\/\/pereverstal.by\/tags\/reestr-dezsredstv\/", "feed_url": "https:\/\/pereverstal.by\/tags\/reestr-dezsredstv\/json\/", "icon": "https:\/\/pereverstal.by\/user\/userpic@2x.jpg", "author": { "name": "Автор блога", "url": "https:\/\/pereverstal.by\/", "avatar": "https:\/\/pereverstal.by\/user\/userpic@2x.jpg" }, "items": [ { "id": "20", "url": "https:\/\/pereverstal.by\/all\/reestr-dezredstv\/", "title": "Реестр дезредств", "content_html": "

Привет! Сегодня я покажу вам демонстрацию того, как решается задача по верстке макета.<\/p>\n

Итак сама задача:<\/h2>\n

Сверстать рекламный модуль в специализированный журнал. Размер формата 135x102,
\nпечать в две краски. Из графики использовать только логотип (объемный крест).<\/p>\n

Получаю рекламный текст. Тут сразу нужно отметить, что первая проблема
\nс которой я столкнулся — это то, что копирайтер заранее не соотнес размеры модуля
\nи объем написанного им текста, т. е. я получил огромное количество слов, которое весьма
\nсложно впихнуть в нужный формат и при этом сохранить читабельность.<\/p>\n

\n\"\"\n<\/div>\n

Работаю с текстом. Упрощаю фразы, выкидываю лишнее, сохраняя смысл.
\nК примеру из фразы: «Наши контакты: Сайт: http:\/\/dezr.ru,<\/a> Электронная почта:info@dezr.ru,
\nТелефон: 8 (499) 264-04-76» удаляю «Наши контакты», «Сайт», «http:\/\/» и т. п.<\/p>\n

Далее приступаю к верстке.<\/h2>\n

Тематика сообщения — скучна до ужаса, наверное даже для специалистов.
\nПоэтому главная задача, которую необходимо решить — это разбить текст
\nна максимальное кол-во различных по смысловой нагрузке кусочков, которые
\nкомпозиционно будут расположены, так, что будут восприниматься в нужном
\nпо смыслу порядке и с максимальной легкостью для читателя.<\/p>\n

Наверное, любой говно-дизайнер сделал бы что-то типа такого (см. картинку, перечеркнутую
\nкрасной линией). Выключка по центру, длинные строки, нерациональное использование
\nформата, прописные буквы в заголовке и т. д.<\/p>\n

\n\"\"\n<\/div>\n

Но мы пойдем другим путем.<\/p>\n

Мой первый вариант построен на 4-х колоночной сетке, акцент сделан на логотипе.
\nВроде ничего, но как-то скучновато.<\/p>\n

\n
\n\"\"\n\"\"\n<\/div>\n<\/div>\n

Второй вариант выглядит немного необычно, но поставленную выше задачу
\nвыполняет превосходно.<\/p>\n

\n
\n\"\"\n\"\"\n<\/div>\n<\/div>\n

Тут я использовал сетку из трех колонок. Информация подается слева направо,
\nт. е. в соответствии с привычным направлением чтения.<\/p>\n

Порядок подачи инфы такой:
\n1) Озвучивание проблемы;
\n2) Название продукта и что он дает;
\n3) Контактная информация;
\n4) Дополнительная информация о продукте.<\/p>\n

Задача решена, можно пойти попить пивка.<\/p>\n

До скорых встреч!<\/p>\n", "date_published": "2018-11-24T18:15:09+03:00", "date_modified": "2018-11-24T18:18:51+03:00", "image": "https:\/\/pereverstal.by\/pictures\/69959_600.jpg", "_date_published_rfc2822": "Sat, 24 Nov 2018 18:15:09 +0300", "_rss_guid_is_permalink": "false", "_rss_guid": "20", "_e2_data": { "is_favourite": false, "links_required": [ "system\/library\/fotorama\/fotorama.css", "system\/library\/fotorama\/fotorama.js", "system\/library\/fotorama\/fotorama.css", "system\/library\/fotorama\/fotorama.js" ], "og_images": [ "https:\/\/pereverstal.by\/pictures\/69959_600.jpg", "https:\/\/pereverstal.by\/pictures\/70376_600.jpg", "https:\/\/pereverstal.by\/pictures\/70505_600.jpg", "https:\/\/pereverstal.by\/pictures\/70877_600.jpg", "https:\/\/pereverstal.by\/pictures\/71133_600.jpg", "https:\/\/pereverstal.by\/pictures\/71295_600.jpg" ] } } ], "_e2_version": 3254, "_e2_ua_string": "E2 (v3254; Aegea)" }