<?xml version="1.0" encoding="utf-8"?> 
<rss version="2.0">

<channel>

<title>Переверстал, заметки с тегом: Минсктранс</title>
<link>https://pereverstal.by/tags/minsktrans/</link>
<description></description>
<generator>E2 (v3254; Aegea)</generator>

<item>
<title>Где купить талон?</title>
<guid isPermaLink="false">102</guid>
<link>https://pereverstal.by/all/gde-kupit-talon/</link>
<comments>https://pereverstal.by/all/gde-kupit-talon/</comments>
<description>&lt;p&gt;Сегодня мы будем переверстывать вот эту схему&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/IMG_20191123_151235_1.jpg" width="2560" height="1920" alt="" /&gt;
&lt;/div&gt;
&lt;h2&gt;Да, к ней есть вопросы.&lt;/h2&gt;
&lt;ol start="1"&gt;
&lt;li&gt;Какую пользу она несет?&lt;/li&gt;
&lt;li&gt;О чем рассказывает и кому?&lt;/li&gt;
&lt;li&gt;Как быстро тут можно все понять?&lt;/li&gt;
&lt;li&gt;Почему она такая агрессивная?&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;Любая схема, любой макет, должны нести в себе какую-то пользу.&lt;br /&gt;
Кроме полезной информации, желательно еще экономить время и усилия,&lt;br /&gt;
которые тратятся на считывание.&lt;/p&gt;
&lt;p&gt;Это, когда дизайн хороший. Пока же этот макет даже минимально не выполняет эти функции.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/Screenshot_3_1.jpg" width="2560" height="366" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Так себе начало разговора. Т. е. стою я на остановке, никого не трогаю,&lt;br /&gt;
поворачиваю голову и — ааа! уже обязан!&lt;/p&gt;
&lt;p&gt;Если таким образом автор хотел замотивировать платить за проезд,&lt;br /&gt;
то мысленно будет послан нахуй. Никто не любит, законы и правила,&lt;br /&gt;
которые принуждают, угрожают и запугивают.&lt;/p&gt;
&lt;p&gt;Нет пассажиров, не желающих платить за проезд. Они взрослые,&lt;br /&gt;
ответственные люди. Поэтому не надо их пугать и заставлять это сделать.&lt;/p&gt;
&lt;p&gt;— Пассажир обязан!&lt;br /&gt;
— Нахуй иди!&lt;/p&gt;
&lt;p&gt;Если пассажир безбилетник — это в том числе потому, Минсктранс,&lt;br /&gt;
что ему, среди всего прочего, не донесли в удобной и понятной форме как и где заплатить.&lt;br /&gt;
Не создали условия, а попытались сначала напугать, а потом запутать.&lt;/p&gt;
&lt;h2&gt;Почему синий и зеленый? Какую функцию несут эти цвета?&lt;/h2&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/color.jpg" width="2560" height="912" alt="" /&gt;
&lt;/div&gt;
&lt;h2&gt;Куда ведет этот QR?&lt;/h2&gt;
&lt;p&gt;Почему нужно лезть за телефоном, чтобы потом понять что эта ссылка для меня бесполезна?&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/QR.jpg" width="2560" height="373" alt="" /&gt;
&lt;/div&gt;
&lt;pre class="e2-text-code"&gt;&lt;code class="язык"&gt;
&lt;p&gt;&lt;/p&gt;
&lt;/code&gt;
&lt;/pre&gt;
&lt;p&gt;Начну переверстывать и для начала определю структуру макета.&lt;/p&gt;
&lt;h2&gt;Она такая&lt;/h2&gt;
&lt;ol start="1"&gt;
&lt;li&gt;Заголовок, раскрывающий смысл.&lt;/li&gt;
&lt;li&gt;Классификация точек продаж, в зависимости от типа билета, который&lt;br /&gt;
там продается. Никому не нужно РУП «Белпочта», но всем нужен&lt;br /&gt;
билет на одну поездку.&lt;/li&gt;
&lt;li&gt;Краткая информация о видах проездных и билетах.&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;Отвечая на вопрос «Для кого эта схема», можно прийти к выводу, что скорее&lt;br /&gt;
всего для иногородних и туристов. Поэтому краткая информация о том, как выглядят&lt;br /&gt;
билеты и БСК не повредит.&lt;/p&gt;
&lt;h2&gt;Начинаю искать нужную мне компоновку макета&lt;/h2&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/Minsktrans_punkty_prodaj-proezd.jpg" width="2362" height="1535" alt="" /&gt;
&lt;/div&gt;
&lt;h2&gt;Кручу, верчу, двигаю объекты туда-сюда (листайте карусель)&lt;/h2&gt;
&lt;div class="e2-text-picture"&gt;
&lt;div class="fotorama" data-width="2362" data-ratio="1.5387622149837"&gt;
&lt;img src="https://pereverstal.by/pictures/Minsktrans_punkty_prodaj-proezd2.jpg" width="2362" height="1535" alt="" /&gt;
&lt;img src="https://pereverstal.by/pictures/Minsktrans_punkty_prodaj-proezd3.jpg" width="2362" height="1535" alt="" /&gt;
&lt;img src="https://pereverstal.by/pictures/Minsktrans_punkty_prodaj-proezd4.jpg" width="2362" height="1535" alt="" /&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2&gt;Наконец нахожу нужный вариант&lt;/h2&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/Minsktrans_punkty_prodaj-proezd5.jpg" width="2362" height="1535" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Потом откладываю макет в холодное и темное место и на время про него забываю.&lt;/p&gt;
&lt;p&gt;Затем открываю и понимаю, что структура все же неверная.&lt;br /&gt;
Если я ищу место, где можно купить талон на один проезд, то разумно будет&lt;br /&gt;
все эти места продаж объединить под одним заголовком.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/Minsktrans_-_5_wrong-3.jpg" width="2362" height="1535" alt="" /&gt;
&lt;/div&gt;
&lt;h2&gt;Вот так будет лучше&lt;/h2&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/Minsktrans_punkty_prodaj-proezd6.jpg" width="2362" height="1535" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Заголовок, правда, сочиняла нейросеть.&lt;/p&gt;
&lt;h2&gt;Меняю заголовок на человеческий.&lt;/h2&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/Minsktrans_punkty_prodaj-proezd7.jpg" width="2362" height="1535" alt="" /&gt;
&lt;/div&gt;
&lt;h2&gt;Причесываю макет&lt;/h2&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/Minsktrans_punkty_prodaj-proezd8.jpg" width="2362" height="1535" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/in_situ.jpg" width="2560" height="1707" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Зашибись.&lt;/p&gt;
</description>
<pubDate>Sat, 28 Dec 2019 19:03:58 +0300</pubDate>
</item>

<item>
<title>Пассажир обязан</title>
<guid isPermaLink="false">101</guid>
<link>https://pereverstal.by/all/passazhir-obyazan/</link>
<comments>https://pereverstal.by/all/passazhir-obyazan/</comments>
<description>&lt;p&gt;Пассажир обязан заебаться, изучая эту схему&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/IMG_20191123_151235.jpg" width="2560" height="1920" alt="" /&gt;
&lt;/div&gt;
</description>
<pubDate>Sun, 15 Dec 2019 20:30:05 +0300</pubDate>
</item>

<item>
<title>Большая переверстка Минсктранса, часть 4-2. Раздел «Расписание»</title>
<guid isPermaLink="false">80</guid>
<link>https://pereverstal.by/all/bolshaya-pereverstka-minsktransa-chast-4-2-razdel-raspisanie/</link>
<comments>https://pereverstal.by/all/bolshaya-pereverstka-minsktransa-chast-4-2-razdel-raspisanie/</comments>
<description>&lt;p&gt;Всем привет! Сегодня я переверстаю разделы пригородных, международных&lt;br /&gt;
и экскурсионных маршрутов.&lt;/p&gt;
&lt;p&gt;Ага, вот эти:&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/210838_800.jpg" width="507" height="467" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Начну я с конца, т. е. с экскурсионного расписания, т. к. это самый маленький&lt;br /&gt;
раздел и для разогрева он подходит как нельзя лучше. Кстати, держитесь&lt;br /&gt;
за свои кресла, у нас впереди около 50 картинок. Психанул я на этот раз.&lt;/p&gt;
&lt;p&gt;В разделе «Расписание экскурсионных автобусов» находится две таблички&lt;br /&gt;
с расписанием двух экскурсионных маршрутов, которые ходят по маршрутам&lt;br /&gt;
автобусов №1 и №100. Ссори за такое количество слова «маршрут».&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/198871_800.jpg" width="800" height="339" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/196805_800.jpg" width="800" height="504" alt="" /&gt;
&lt;/div&gt;
&lt;h2&gt;Итак, вот что у меня получилось.&lt;/h2&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/199059_800.jpg" width="800" height="673" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Прошу обратить внимание на изменения, которые произошли с таблицей.&lt;br /&gt;
К примеру ячейка «Трансляция экскурсии» переименована в «Язык экскурсии»,&lt;br /&gt;
благодаря чему в нижних ячейках можно писать просто название языка, т. е.&lt;br /&gt;
«белорусский», а не «на белорусском языке». Текста стало меньше, но смысл остался&lt;br /&gt;
ясен. Ммм...., дизаайн.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/198573_800.jpg" width="800" height="339" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/198349_800.jpg" width="800" height="671" alt="" /&gt;
&lt;/div&gt;
&lt;h2&gt;И еще одно сокращение: «Более подробную информацию...» я удалил вообще&lt;/h2&gt;
&lt;p&gt;потому что теперь можно просто нажать на название маршрута,&lt;br /&gt;
чтобы узнать его расписание.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/211162_800.jpg" width="800" height="212" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;А чуть выше можно еще и карту маршрута посмотреть&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/211464_800.jpg" width="659" height="228" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Номера телефонов, по которым можно уточнить расписание разместились&lt;br /&gt;
в левой колонке.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/197849_800.jpg" width="281" height="514" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Раздел вообще-то пустоватый — сюда бы еще инфу по ценам, скидкам, немножко&lt;br /&gt;
фоток того, что можно увидеть из окна, ну или там фоток гидов. Минсктранс, ау?!&lt;br /&gt;
Ладно, едем дальше.&lt;/p&gt;
&lt;h2&gt;Займемся пригородным и междугородним расписанием.&lt;/h2&gt;
&lt;p&gt;Вот как он сейчас выглядит на сайте&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/211736_800.jpg" width="800" height="435" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Если нажать на выпадающий список, то ооочень медленно появляется огроменное&lt;br /&gt;
число различных населенных пунктов РБ.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/199975_800.jpg" width="800" height="421" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Выбираю город Борисов. Сразу же получаю длинный список из всех рейсов,&lt;br /&gt;
которые существуют в данном направлении.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/200272_800.jpg" width="800" height="502" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Жму на рейс 17:55 — получаю список остановок, времени прибытия и отбытия с них&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/200681_800.jpg" width="800" height="316" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Дам шанс этой таблице — узнать во сколько едет твой автобус и едет&lt;br /&gt;
ли он сегодня можно. Но все же она абсолютно не дружелюбна, криво сверстана&lt;br /&gt;
и вообще ворует время пользователя, заставляя его копаться в ненужной инфе.&lt;br /&gt;
Ну вот нахера мне знать регулярность машрута в 8:27, если мне нужно ехать прямо&lt;br /&gt;
сейчас, а время на часах 17:43?&lt;/p&gt;
&lt;h2&gt;В моем мире форма поиска будет выглядеть вот так.&lt;/h2&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/200881_800.jpg" width="800" height="745" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Давайте разберемся что тут к чему. Вот область поиска. Можно выбрать дату&lt;br /&gt;
поездки, чтобы сразу получить список только тех рейсов, которые тебе доступны.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/201220_800.jpg" width="800" height="235" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;К примеру, при выборе кнопки «Сегодня» (да знаю, дата устарела, но я же&lt;br /&gt;
не за один день все делаю), система дает тебе инфу о ближайшем рейсе.&lt;br /&gt;
Названия станций отправления и прибытия подчеркнуты, а это значит, что&lt;br /&gt;
кликнув по ним, можно перейти в разделы с информацией о них.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/201569_800.jpg" width="800" height="235" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;И обо всех последующих рейсах, которые ходят в этот день.&lt;br /&gt;
Начиная с текущего времени. Как видите, в списке нет рейсов до 17:55,&lt;br /&gt;
ибо фарш время невозможно повернуть назад.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/201814_800.jpg" width="800" height="533" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;С функционалом разобрались немного, теперь у нас на очереди&lt;br /&gt;
вот эта куча сопроводительного текста, которую разгребать&lt;br /&gt;
не захочется ни одному пользователю, зашедшему на сайт.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/211736_800.jpg" width="800" height="435" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Все что можно сократить и выкинуть я без стыда и стеснения сокращаю&lt;br /&gt;
и выкидываю. Все что осталось, по традиции идет в левую колонку.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/202075_800.jpg" width="380" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;h2&gt;Давайте еще раз взглянем на то, что получилось&lt;/h2&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/212003_800.jpg" width="800" height="745" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Ну красота-же!&lt;/p&gt;
&lt;h2&gt;Итак мы добались до гвоздя сегодняшнего номера! Раздел международных&lt;/h2&gt;
&lt;p&gt;маршрутов. Попрошу здесь немного больше вашего внимания.&lt;br /&gt;
Сейчас будет интересно.&lt;/p&gt;
&lt;p&gt;Вот что видит пользователь, когда заходит в этот раздел.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/202497_800.jpg" width="800" height="539" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Две формы поиска! Две, сука, формы поиска! Почему две? Зачеем?&lt;br /&gt;
Какую выбрать? Аааа!&lt;/p&gt;
&lt;p&gt;Немного покопавшись, я выяснил, что нижняя форма дает возможность&lt;br /&gt;
выбрать маршруты только филиала «Автобусный парк №2», причем&lt;br /&gt;
направления не только международные, но и по Беларуси, хотя для этого есть раздел&lt;br /&gt;
междугородних перевозок.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/203003_800.jpg" width="800" height="494" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Попробуем. Хочу я попасть, к примеру, в Белосток. В среду.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/203451_800.jpg" width="800" height="336" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;«Иди в жопу, дорогой товарищ, в среду мы в Белосток не поедем» , —&lt;br /&gt;
выдает мне форма.&lt;/p&gt;
&lt;p&gt;Когда же вы поедете в Белосток? Хороший вопрос. Чтобы на него ответить,&lt;br /&gt;
нужно в списке «Выберите дату поездки», перебрать все дни недели, чтобы&lt;br /&gt;
найти тот, в который филиал «Автобусный парк №2» соизволит отвезти вас в Белосток.&lt;/p&gt;
&lt;p&gt;О, нашел! Пятница!&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/203885_800.jpg" width="800" height="372" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Если кликнуть по названию маршрута (догадайся еще, что по нему&lt;br /&gt;
можно кликать), то можно получить список остановок по маршруту следования.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/203543_800.jpg" width="800" height="645" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Уф, немного разобрались с нижней частью. А в верхней-то что?&lt;br /&gt;
А в верхней оказался список именно международных маршрутов,&lt;br /&gt;
которые обслуживают различные перевозчики. В том числе и филиал&lt;br /&gt;
«Автобусный парк №2». Ну, бля..&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/204191_800.jpg" width="645" height="313" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Очень хочется попасть в Белосток.&lt;/p&gt;
&lt;p&gt;Пробуем.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/205047_800.jpg" width="643" height="436" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Опа! Что я вижу! Три рейса! А где узнать подробности? А нужно всего-лишь..&lt;br /&gt;
скачать вордовский файл! Ладно, путь тернист, но у меня получится.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/205254_800.jpg" width="643" height="350" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Скачал два файла, открыл и замер от восторга.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;div class="fotorama" data-width="718" data-ratio="0.8975"&gt;
&lt;img src="https://pereverstal.by/pictures/205393_800.jpg" width="718" height="800" alt="" /&gt;
&lt;img src="https://pereverstal.by/pictures/212459_800.jpg" width="796" height="493" alt="" /&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/205830_800.jpg" width="595" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Нет большего счастья для дизайнера, чем сложная задача.  А тут как раз такой&lt;br /&gt;
случай. Всю инфу из эти документов, нужно переварить, понять и придумать&lt;br /&gt;
как подать ее в удобной и красивой форме на сайте.&lt;/p&gt;
&lt;p&gt;Веселье начинается!&lt;/p&gt;
&lt;p&gt;Я отойду от своей традиции показывать сразу все что у меня получилось&lt;br /&gt;
и пойду от обратного. Смотрим в начале на форму ввода даты поездки,&lt;br /&gt;
пунктов отправления и прибытия.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/213389_800.jpg" width="800" height="267" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Выбираем дату 2 июня. Получаем наши три рейса.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/206752_800.jpg" width="800" height="521" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Попробуем прямой маршрут от филиала «Автобусный парк №2».&lt;br /&gt;
Покажу мой вариант с сеточкой.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/207256_800.jpg" width="768" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;А вот без сеточки&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/213523_800.jpg" width="760" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Добавляю отдельной строкой время отправления и время прибытия.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/208489_800.jpg" width="800" height="416" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;В правой колонке у нас будет ссылка на перевозчика, инфа и скидках,&lt;br /&gt;
тарифах и прочем.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/208121_800.jpg" width="643" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Вот раздел скидок из вордовского документа.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/212649_800.jpg" width="784" height="195" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;А вот он на сайте&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/208891_800.jpg" width="800" height="627" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Кстати на главной странице международных перевозок висит вот такая красная&lt;br /&gt;
рамка, в которой инфа про скидку в 50% для клиентов филиала «Автобусный парк №2»&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/206198_800.jpg" width="800" height="130" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;У меня на сайте она располагается как раз под таблицей с тарифами,&lt;br /&gt;
а не в разделе «Скидки», потому что это же такое уникальное, горячее&lt;br /&gt;
и вкусное предложение от номер второго, что оно должно быть перед глазами.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/208230_800.jpg" width="720" height="514" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Идем дальше. Правила возврат билетов и провоз багажа в вордовском файле.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/212459_800.jpg" width="796" height="493" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;На сайте&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/209475_800.jpg" width="800" height="679" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/209273_800.jpg" width="800" height="438" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Я добавил еще один раздел бронирование билетов, который в текстовом&lt;br /&gt;
документе даже не был удостоен подзаголовка.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/212824_800.jpg" width="779" height="146" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/208955_800.jpg" width="800" height="481" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;У нас на главной еще остались в гордом одиночестве две строчки,&lt;br /&gt;
которым нужно найти свое место.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/213049_800.jpg" width="800" height="156" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Первая разместилась аккурат над формой ввода инфы.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/206586_800.jpg" width="800" height="267" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;А вторая логично переместилась в левую колонку.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/207013_800.jpg" width="316" height="728" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Давайте взглянем еще раз&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/213523_800.jpg" width="760" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;О да, детка.&lt;/p&gt;
&lt;p&gt;А что если выбрать не прямой маршрут? Например Минск—Варшава?&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/209902_800.jpg" width="798" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;В общем-то все то же, за исключением того, что у другого перевозчика&lt;br /&gt;
какая-то инфа (например расстояние в км) пропала, а какая-то добавилась&lt;br /&gt;
(адреса станций).&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/210173_800.jpg" width="800" height="795" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Теперь табличные данные об остановочных пунктах у разных перевозчиках&lt;br /&gt;
разные, что конечно же не есть хорошо.&lt;/p&gt;
&lt;p&gt;В правой колонке поместилась вся дополнительная инфа от перевозчика,&lt;br /&gt;
даже отдельных разделов создавать не пришлось.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/210272_800.jpg" width="543" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;h2&gt;И напоследок, обращаюсь к коллегам-дизайнерам. Коллеги-дизайнеры!&lt;/h2&gt;
&lt;p&gt;Если вы еще не в курсе на какой хрен в фотошопе есть окно Layer Comps,&lt;br /&gt;
то не тормозите и узнайте! Не пожалеете.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/210457_800.jpg" width="264" height="264" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Спасибо всем за внимание! До новых встреч.&lt;/p&gt;
&lt;p&gt;P.S. Подготовив этот пост, понял, что забыл сделать кнопку «Купить билет»&lt;br /&gt;
рядом с выбранным рейсом. Ну что тут скажешь. Промахнулся Акела.&lt;/p&gt;
</description>
<pubDate>Sat, 24 Nov 2018 18:30:48 +0300</pubDate>
</item>

<item>
<title>Большая переверстка Минсктранса, часть 4-1. Раздел «Расписание»</title>
<guid isPermaLink="false">79</guid>
<link>https://pereverstal.by/all/bolshaya-pereverstka-minsktransa-chast-4-1-razdel-raspisanie/</link>
<comments>https://pereverstal.by/all/bolshaya-pereverstka-minsktransa-chast-4-1-razdel-raspisanie/</comments>
<description>&lt;p&gt;Привет всем! Сегодня мы займемся разделом «Расписание»&lt;/p&gt;
&lt;p&gt;Вот как он выглядит в меню старого сайта. Как видите кроме четырех видов маршрутов&lt;br /&gt;
(городских, междугородних, международных и экскурсионных) тут еще какие-то правила,&lt;br /&gt;
порядки и национальный аэропорт «Минск».&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/179491_800.jpg" width="562" height="423" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Главная проблема этого меню в том, что, к примеру, из подраздела «Городские маршруты»&lt;br /&gt;
прямиком в «Международные маршруты»  не попадешь одним кликом, как минимум нужно&lt;br /&gt;
делать два:&lt;/p&gt;
&lt;p&gt;1) кнопка браузера «Назад»,&lt;br /&gt;
2) выбор раздела «Международные маршруты»&lt;/p&gt;
&lt;p&gt;Итак, сегодня я решу эту проблему, а также 2 миллиона проблем подраздела «Городские маршруты».&lt;br /&gt;
Три оставшихся подраздела я оставлю для следующего поста, чтобы вас не утомлять.&lt;/p&gt;
&lt;p&gt;Перейдя по ссылке «Городские маршруты» мы видим следующее.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/177024_800.jpg" width="800" height="613" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Давайте по-порядку:&lt;/p&gt;
&lt;p&gt;1) Вкладка «Минск» (кто и зачем ее так назвал?), в которой три ссылочки «Автобусы»,&lt;br /&gt;
«Троллейбусы» и «Трамваи». Нажал на ссылку — получил длиннющий список всех номеров&lt;br /&gt;
и соответствующие им названия маршрутов.&lt;/p&gt;
&lt;p&gt;Слева, рядом с каждым названияем ячейки с днями недели, по которым маршрут&lt;br /&gt;
работает. В общем списке эти ячейки образуют нехилый столбец, занимающий&lt;br /&gt;
дохера места.&lt;br /&gt;
Непорядок!&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/177192_800.jpg" width="536" height="60" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Маленький столбец из кнопок «i» тоже напрягает. А че там под этой кнопкой? А вот че:&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/177662_800.jpg" width="321" height="111" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Ну нафиг!&lt;/p&gt;
&lt;p&gt;2) Вкладка «Поиск остановки». Поиск остановки по названию, а также маршрутов,&lt;br /&gt;
которые через нее проходят. 3) Вкладка «Поиск маршрута» — поиск маршрута,&lt;br /&gt;
чего непонятного-то?&lt;/p&gt;
&lt;p&gt;Ну что ж, займемся вкладкой «Минск». Нажимаем на первый автобусный маршрут №1.&lt;br /&gt;
Смотрим.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/178134_800.jpg" width="800" height="449" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Слева все остановки маршрута в одном направлении и все остановки в обратном.&lt;br /&gt;
Жмешь на любую строку и узнаешь в правом окне во сколько минут в течение&lt;br /&gt;
конкретного часа автобус №1 придет на нажатую остановку. Вроде все понятно, так?&lt;br /&gt;
Но уже видно, что направления «туда-обратно» можно выполнить&lt;br /&gt;
в виде сегментированных кнопок — нажал на нужную, получил список.&lt;br /&gt;
А не нажал, то и не увидел.&lt;/p&gt;
&lt;p&gt;До кучи — линеейчки, плашечки и столбик iiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii&lt;br /&gt;
(у меня в строку получилось :)&lt;/p&gt;
&lt;p&gt;Дальше сверху и снизу замечаю дополнительную информацию. Сверху — срочная&lt;br /&gt;
и оперативная, т. е. иногда в этом месте пусто, а внизу постоянная инфа, которую&lt;br /&gt;
недурно было бы набрать по-человечески и поместить на видное место, а не как сейчас&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;div class="fotorama" data-width="679" data-ratio="4.4966887417219"&gt;
&lt;img src="https://pereverstal.by/pictures/179179_800.jpg" width="679" height="151" alt="" /&gt;
&lt;img src="https://pereverstal.by/pictures/178846_800.jpg" width="800" height="105" alt="" /&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;Да и еще. В левом верхнем углу чекбокс — нажал узнал, какие номера проходят, через&lt;br /&gt;
выбранную остановку. Это гуд, что можно эту инфу включать выключать — так меньше шума.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/178558_800.jpg" width="470" height="87" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/178266_800.jpg" width="800" height="475" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Буду показывать проделанную работу задом наперед. Потому что так удобнее.&lt;br /&gt;
И да, к черту интригу. Пойдем от общего к частному.&lt;/p&gt;
&lt;p&gt;Вуа-ля.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/182669_800.jpg" width="800" height="754" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Подберемся поближе&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/181629_800.jpg" width="800" height="529" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Слева у нас 4 четыре главных подраздела. Теперь переход между ними займет&lt;br /&gt;
ровно один клик. Также инфа для тех кто нашел ошибку в расписании&lt;br /&gt;
и про отклонения от графика. Все набрано как подобает в приличном обществе и жестко&lt;br /&gt;
зафиксировано на видном месте.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/180471_800.jpg" width="312" height="751" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Переход между видами транспорта теперь у нас в виде кнопок.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/180780_800.jpg" width="430" height="119" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Список маршрутов набран в две колонки — теперь правая часть экрана не пустует и можно&lt;br /&gt;
по-меньше скролить вниз. Никаких ячеек с рабочими и нерабочими днями недели,&lt;br /&gt;
никаких столбцов из кнопок «i». Нужная вся эта инфа? Нажми на нужный маршрут и смотри!&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/181383_800.jpg" width="789" height="680" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Строка поиска. На случай если, нужно быстро найти номер. Сюда же перешли две вкладки&lt;br /&gt;
«Поиск остановки» и «Поиск маршрута». Теперь это не вкладки, а ссылки и все они находятся&lt;br /&gt;
рядом со строкой поиска, образуя очевидную группу поиска.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/182134_800.jpg" width="800" height="206" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Итак, жмякаем на автобусный маршрут №1 «ДС-Веснянка — Вокзал».&lt;br /&gt;
Смотрим для начала на общую картину.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/183474_800.jpg" width="800" height="752" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Подходим ближе, не стесняемся. Опа, дни недели тут — можно сразу узнать когда выходной,&lt;br /&gt;
а когда нет. Ссори за неровную верстку чисел — время экономил. Пороть меня за такое,&lt;br /&gt;
так некому же.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/183121_800.jpg" width="800" height="664" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Разные направления в разных сегментированных кнопках, как я и говорил выше. Два в одном —&lt;br /&gt;
это ж какая экономия экрана! Самые наблюдательные заметили ссылочку на карту маршрута.&lt;br /&gt;
Тут ей самое место, а не в выпадающем окне по-нажатию кнопки «i».&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/183695_800.jpg" width="800" height="238" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Маленькое и полезное нововведение:&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/193140_600.jpg" width="333" height="114" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Прежде чем идти дальше, подытожим что мы успели сделать&lt;/p&gt;
&lt;p&gt;1) Переход между разделами маршрутов теперь в один клик.&lt;/p&gt;
&lt;p&gt;2) Список маршрутов в разделе городского транспорта теперь в две колонки.&lt;/p&gt;
&lt;p&gt;3) Убрали мусор в виде дней недели и кнопок «i».&lt;/p&gt;
&lt;p&gt;4) Сократили место под список остановок в два раза, благодаря сегментированным кнопкам.&lt;/p&gt;
&lt;p&gt;5) Дополнительная, срочная и оперативная инфа набрана по-человечески и находится&lt;br /&gt;
прямо перед глазами.&lt;/p&gt;
&lt;p&gt;6) Ну там.., все стало чище, приятнее и понятнее.&lt;/p&gt;
&lt;p&gt;Едем дальше, уважаемые пассажиры. Займемся поиском остановки. Для начала обозначим&lt;br /&gt;
проблемы теперешнего варианта.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/185252_800.jpg" width="800" height="328" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Меленько. Там же четыре числа всего, можно и крупнее!&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/185631_800.jpg" width="615" height="102" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Непонятно (например как вводить время отправления —&lt;br /&gt;
разделять пробелом? точкой? двоеточием? или неважно?).&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/185560_800.jpg" width="658" height="139" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Шумно. Зачем вываливать все время сразу?&lt;br /&gt;
Экономить пространство будем? А?&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/185863_800.jpg" width="617" height="381" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Мы тут медленно подбирамеся к поиску местоположения и маршрутов на карте.&lt;br /&gt;
Нужны иконочки. Я решил, что иконка начала пути — это «А», иконка конца пути —&lt;br /&gt;
это «Б». Ну как в школе, понимаете? «Из пункта А в пункт Б...»&lt;/p&gt;
&lt;p&gt;Открываю иллюстратор и малюю. Готово!&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/187035_800.jpg" width="800" height="621" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Смотрим раздел поиска остановки, который у меня получился. Вот как он выглядит,&lt;br /&gt;
когда ничего не ясно.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/187987_800.jpg" width="800" height="438" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;А вот я решил найти остановку Тимирязева.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/187457_800.jpg" width="800" height="716" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Блииже!&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/187755_800.jpg" width="800" height="546" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Теперь сразу видно какой транспорт на ней останавливается (все номера кликабельны и ведут&lt;br /&gt;
в раздел с расписанием маршрута). Также можно найти остановочку на карте (нажав на пин).&lt;br /&gt;
А можно обозначить ее на карте как начало или конец пути (иконки «А» и «Б»).&lt;br /&gt;
Немного терпения, раздел «Поиск маршрута» впереди.&lt;/p&gt;
&lt;p&gt;В правой колонке вверху самое важное — ближайшие маршруты. А для тех, кто планирует&lt;br /&gt;
поездку, можно ввести время и узнать во сколько придет нужный ему тралик на нужную&lt;br /&gt;
ему остановку (в данном случае Тимирязева.) Теперь не надо тупить, глядя на все расписание&lt;br /&gt;
сразу — только то, что вам нужно. Не засирайте мозги, короче.&lt;/p&gt;
&lt;p&gt;ААА! Мы близки к завершению! Последняя вкладка «Поиск маршрута».&lt;br /&gt;
Смотрим на проблемы.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/190077_900.jpg" width="900" height="436" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Берт охренел.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/193518_600.jpg" width="476" height="355" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Не, шучу. Все не так плохо. Разобраться можно. Но долго, некрасиво, тяжело...&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/188432_800.jpg" width="621" height="271" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/188695_800.jpg" width="578" height="304" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/189072_800.jpg" width="800" height="284" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Начну с рисования секундомера. Мы же тут маршрут прокладывать собираемся.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/192822_600.jpg" width="600" height="530" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Та-даам.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/189449_800.jpg" width="567" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Теперь разбираемся, что все это значит. Значит у нас две опции — узнать прямой рейс&lt;br /&gt;
и рейс с пересадками.&lt;/p&gt;
&lt;p&gt;Прямой рейс по традиции показывает нам ближайшее и заданное время.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/190317_800.jpg" width="800" height="747" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Немного деталек.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/190926_800.jpg" width="800" height="213" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Все номера конечно же кликабельны и ведут в окно расписания движения.&lt;br /&gt;
Также можно посмотреть маршрут на карте.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/191006_800.jpg" width="800" height="445" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Кстати, вот первый вариант, но я его отклонил, потому что номера маршрутов мелковаты,&lt;br /&gt;
а мне хотелось, чтобы они были видны сразу.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/191745_800.jpg" width="768" height="377" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/191684_800.jpg" width="800" height="321" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Теперь рейс с пересадками. Вместо таблицы с повторами, ясная и четкая прямая,&lt;br /&gt;
с указанием времени прибытия ближайшего транспорта и времени окончания&lt;br /&gt;
движения по маршруту.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/192142_800.jpg" width="800" height="700" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Ну и конечно же ссылочка на карту.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/192257_800.jpg" width="800" height="278" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Готово! В следующем посте я покажу как я переделал&lt;br /&gt;
разделы международных, междугородних и экскурсионных маршрутов.&lt;/p&gt;
&lt;p&gt;До новых встреч!&lt;/p&gt;
</description>
<pubDate>Sat, 24 Nov 2018 18:30:40 +0300</pubDate>
</item>

<item>
<title>Большая переверстка Минсктранса, часть 3. Главная страница</title>
<guid isPermaLink="false">78</guid>
<link>https://pereverstal.by/all/bolshaya-pereverstka-minsktransa-chast-3-glavnaya-stranica/</link>
<comments>https://pereverstal.by/all/bolshaya-pereverstka-minsktransa-chast-3-glavnaya-stranica/</comments>
<description>&lt;p&gt;Привет всем кто дождался! Сегодня я покажу вам новую главную страницу&lt;br /&gt;
Минсктранса и расскажу о том, как я ее переверстывал.&lt;/p&gt;
&lt;p&gt;Если забыли, вот так выглядит сайт Минсктранса сейчас.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/157181_800.jpg" width="800" height="570" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Обозначим фронт работ.&lt;/p&gt;
&lt;p&gt;Начнем с меню и вообще со структуры сайта. Выкинем все лишнее. Например&lt;br /&gt;
«Нормативные документы» и «Административные процедуры...» нафиг&lt;br /&gt;
не упали рядовым посетителям сайта. Если не верите, то пройдите по этим ссылкам&lt;br /&gt;
и убедитесь сами.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/157363_800.jpg" width="763" height="368" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Филиалы можно смело перенести в раздел «О предприятии»&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/157598_800.jpg" width="751" height="466" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Для рекламы заведем отдельный раздел в главном меню (реклама — святое.)&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/175114_800.jpg" width="571" height="187" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Электронные сообщения сбросим в Контакты.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/157979_800.jpg" width="351" height="78" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Контакты сбросим в подвал.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/157945_800.jpg" width="266" height="83" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Почистим еще немного, удалим всякий ненужный хлам вроде&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/175576_800.jpg" width="529" height="144" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Конкурс художественно самодеятельности... Ну ладно, давайте будем честны —&lt;br /&gt;
кому это нафиг сдалось?&lt;/p&gt;
&lt;p&gt;После основательной чистки и реструктуризации у меня получилась вот такая карта сайта.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/164457_800.jpg" width="565" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;С меню и структурой сайта разобрался. Едем дальше.&lt;/p&gt;
&lt;p&gt;Сейчас смачное место занимает главная новость и ссылка на раздел с информацией&lt;br /&gt;
о работе пассажирского транcпорта в связи с дорожной обстановкой — вроде все верно,&lt;br /&gt;
но даже такая полезная инфа может занимать меньше места и при этом оставаться заметной.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/158855_800.jpg" width="800" height="186" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/159167_800.jpg" width="779" height="192" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Взглянем налево. Как я уже говорил — мед, говно и немного гвоздей. Без тазика для рвотных&lt;br /&gt;
масс и не взглянешь.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/160060_800.jpg" width="329" height="558" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/160281_800.jpg" width="344" height="788" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/160675_800.jpg" width="336" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Также сайту не хватает блоков с новостями, которые мы привыкли черпать&lt;br /&gt;
откуда угодно, только не с сайта Минсктранса. Да, Минсктранс, нужно будет&lt;br /&gt;
расширить штат и создать отдел новостей.&lt;/p&gt;
&lt;p&gt;И напоследок переделаю подвал. Весь этот цветастый, криво сшитый ковер, надо&lt;br /&gt;
сжечь и вместо него положить удобный, красивый палас. Туговато у меня сегодня&lt;br /&gt;
с метафорами.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/173082_800.jpg" width="800" height="271" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Ну что ж, время сучить рукава. Беру в руки карандаш и начинаю делать эскизы&lt;br /&gt;
сайта на бумаге.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/160926_800.jpg" width="800" height="533" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/161153_800.jpg" width="800" height="533" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/161488_800.jpg" width="800" height="533" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Много, много эскизов&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/161610_800.jpg" width="800" height="533" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Сетку я решил оставить старую, т. е. 12 колоночную. Вот какой макет у меня получился&lt;br /&gt;
первоначально.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/162113_800.jpg" width="505" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/162334_800.jpg" width="412" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Первый подход к снаряду. Раздел с расписанием стал чище и понятнее. Две трети сетки справа&lt;br /&gt;
получил блок новостей, который состоит из главной новости и трех дополнительных. Информация&lt;br /&gt;
о работе пассажирского транспорта в связи с дорожной обстановкой стала как раз под главной&lt;br /&gt;
новостью, рядом с ней встал блок с оперативной информацией (который я назвал просто «Срочно»)&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/165172_800.jpg" width="771" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Ниже у нас разместился блок с тарифами, в котором отдельными ссылками&lt;br /&gt;
встали калькулятор сравнения стоимостей и пункты продажи проездных билетов.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/165707_800.jpg" width="800" height="622" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Взглянув на следующий день на макет свежим взглядом, я вынес вердикт — говно.&lt;br /&gt;
Все нужно переделать. Расписание не красивое и тяжелое, новостей мало, тарифы&lt;br /&gt;
на главной нафиг не упали — что цены каждый день меняются?&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/165919_800.jpg" width="446" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Начинаю переверстывать свою переверстку. В первую очередь шапку.&lt;br /&gt;
Добавляю логотип. Корректирую пункты меню. Добавляю номер справочной службы —&lt;br /&gt;
уверен пригодится многим и не раз. Там ему самое место.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/167200_800.jpg" width="800" height="188" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Берусь за расписание. В «Городские маршруты» добавляю инфу из раздела «Тарифы»,&lt;br /&gt;
а именно «Пункты продажи проездных документов» и «Калькулятор сравнения стоимости...».&lt;br /&gt;
Сюда же становится и USSD-запрос (хотя непонятно кому он нужен, но вдруг).&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/168442_800.jpg" width="231" height="465" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;К международным маршрутам сразу пришпандориваю ссылку на сайт www.ticketbus.by&lt;br /&gt;
(ох, как же руки чешутся взяться за него поскорее)&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/168551_800.jpg" width="202" height="450" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Бонусом внизу блока с расписанием ставлю вот эти две ссылки&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/168708_800.jpg" width="221" height="222" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Теперь возьмемся за центральный бок новостей. Придумываю раздел «События»,&lt;br /&gt;
увеличиваю количество новостей. Сверху главная новость (за фотку спасибо&lt;br /&gt;
сайту www.citydog.by), ниже дополнительные.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/169068_800.jpg" width="462" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Под ним всякие новости-анонсы.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/176441_800.jpg" width="679" height="437" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Верхний правый край по праву занимает блок с оперативными новостями.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/170324_800.jpg" width="556" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;На это место также можно ставить короткое и важное послание, которое периодически&lt;br /&gt;
всплывает на сайте Минсктранса в самом центре страницы. Блок оперативной информации&lt;br /&gt;
при этом чуть съезжает вниз.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/171247_800.jpg" width="365" height="433" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Ниже оперативной инфы идет информация о работе пассажирского транспорта в связи&lt;br /&gt;
с дорожной обстановкой&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/171325_800.jpg" width="269" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Придумываю заголовки, выравниваю по сетке, ставлю картинки.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/176022_800.jpg" width="643" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Немного поразмыслив, добавляю еще один новостной блок «Как у них?», в котором будут&lt;br /&gt;
публиковаться новости зарубежного транспорта (от дизайна проездных билетов&lt;br /&gt;
и схем до интересных историй)&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/175785_800.jpg" width="800" height="216" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Уф, осталось немного, всего лишь прибрать в подвале.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/173082_800.jpg" width="800" height="271" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Убираю цвет, выравниваю все по сеточке. Красота же.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/174232_800.jpg" width="800" height="189" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Вот что у меня получилось в итоге.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/296669_original.jpg" width="1282" height="2560" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Спасибо за то, что уделили время! Призываю вас репостить, лайкать, обсуждать,&lt;br /&gt;
критиковать, предлагать, хвалить.&lt;/p&gt;
&lt;p&gt;Напоминаю, что это не все. Работа только начата — впереди переверстка внутренних страниц.&lt;br /&gt;
Следите за новостями!&lt;/p&gt;
</description>
<pubDate>Sat, 24 Nov 2018 18:30:34 +0300</pubDate>
</item>

<item>
<title>Большая переверстка Минсктранса, часть 2. Редизайн логотипа</title>
<guid isPermaLink="false">77</guid>
<link>https://pereverstal.by/all/bolshaya-pereverstka-minsktransa-chast-2-redizayn-logotipa/</link>
<comments>https://pereverstal.by/all/bolshaya-pereverstka-minsktransa-chast-2-redizayn-logotipa/</comments>
<description>&lt;p&gt;Ок, привет снова. День прошел быстро и незаметно, а у меня готов новый пост.&lt;br /&gt;
Сегодня я переделал лого Минсктранса.&lt;/p&gt;
&lt;p&gt;Буду с вами честен потратил я на это дело немного времени. Когда дойдут руки до переделки&lt;br /&gt;
всего фирменного стиля Минсктранса, логотипу я уделю достаточно времени. А пока, как я&lt;br /&gt;
считаю получился неплохой вариант, который можно будет поставить в шапку будущего сайта.&lt;/p&gt;
&lt;p&gt;Напоминаю, вот так выглядит старый вариант:&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/152022_800.jpg" width="524" height="136" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Беру карандаш и начинаю придумывать эскизы.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/152464_800.jpg" width="800" height="600" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/152263_800.jpg" width="800" height="600" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Включаю Иллюстратор, начинаю отрисовывать понравившиеся, при этом придумывая&lt;br /&gt;
новые уже в программе.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/152586_800.jpg" width="800" height="563" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Получились вот такие знаки&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/153277_800.jpg" width="800" height="495" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Можно примерить, например на проездных&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/156720_800.jpg" width="611" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/153771_800.jpg" width="480" height="277" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/154039_800.jpg" width="480" height="277" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Гы, а почему бы и не черный? VIP-проездной? Не, ну, а чо? Дает право на место возле окна,&lt;br /&gt;
к примеру. Или провоз рояля. В троллейбусе. Придумайте еще VIP-услуг! :)&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/155048_800.jpg" width="480" height="277" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Ок, едем дальше. Кроме знака обязательно должна быть текстовая часть, причем отделимая,&lt;br /&gt;
когда лого нужно будет размещать на узких форматах, к примеру козырька киоска или на банере.&lt;/p&gt;
&lt;p&gt;Я убежден, что это должен быть современный гротеск. Никаких засечек, никакой&lt;br /&gt;
стилизации, никакого выпендрежа. Просто, технологично, утилитарно.&lt;/p&gt;
&lt;p&gt;Веду поиск&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/155235_800.jpg" width="800" height="321" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Отбираю понравившиеся варианты&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/155725_800.jpg" width="800" height="142" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Вот что у меня в итоге получилось.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/156143_800.jpg" width="800" height="565" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;В следующем посте, я буду полностью переделывать главную страницу сайта www.minsktrans.by&lt;/p&gt;
&lt;p&gt;Следите за новостями, до скорых!&lt;/p&gt;
</description>
<pubDate>Sat, 24 Nov 2018 18:30:26 +0300</pubDate>
</item>

<item>
<title>Большая переверстка Минсктранса, часть 1</title>
<guid isPermaLink="false">76</guid>
<link>https://pereverstal.by/all/bolshaya-pereverstka-minsktransa-chast-1-2/</link>
<comments>https://pereverstal.by/all/bolshaya-pereverstka-minsktransa-chast-1-2/</comments>
<description>&lt;p&gt;Категорически приветствую всех! Этим постом я открываю мой новый проект&lt;br /&gt;
по переверстке-редизайну сайта Минсктранса! На данный момент главный&lt;br /&gt;
сетевой ресурс огромного и важнейшего государственного предприятия&lt;br /&gt;
выглядит вот так.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/148361_800.jpg" width="800" height="631" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Сайт чудовищен и непонятен. На него не хочется заходить, по нему не хочется бродить,&lt;br /&gt;
а если и вынужден, то придется столкнуться с массой мусора, кривой версткой, запутанным&lt;br /&gt;
меню и грязным, неопрятным видом.&lt;/p&gt;
&lt;p&gt;Задайте себе вопрос — где вы узнаете о событиях связанных с работой Минктранса?&lt;br /&gt;
Изменение стоимости тарифов? Новая форма контролеров? Новости о конфликтах&lt;br /&gt;
между пассажирами и работниками? Интервью, фотоотчеты, короткие заметки,&lt;br /&gt;
народные новости?Где все это? Правильно — на ресурсах типа tut.by или onliner.by.&lt;br /&gt;
И все это при наличии у Минсктранса своего сайта, треть которого отведена под&lt;br /&gt;
уродливые рекламные баннеры.&lt;/p&gt;
&lt;p&gt;Всей душой люблю минский общественный транспорт, желаю ему процветать&lt;br /&gt;
и развиваться, становиться комфорным, быстрым и чистым. Я мечтаю о том,&lt;br /&gt;
чтобы стоимость владения автомобилем в городе стала непомерно высокой,&lt;br /&gt;
а наши дворы превратились бы из автостоянки в места для отдыха. В места для людей,&lt;br /&gt;
а не для их металлических корыт. А вопрос перемещения по городу отпадет сам собой,&lt;br /&gt;
ввиду сильно развитой транспортной сети.&lt;/p&gt;
&lt;p&gt;Но оставим мечты в стороне и возьмемся за дело. Прежде чем лечить пациента,&lt;br /&gt;
давайте разберемся, чем он болен. А если конкретнее — что с существуюшим&lt;br /&gt;
сайтом Минсктранса не так?&lt;/p&gt;
&lt;p&gt;Поехали.&lt;br /&gt;
Самое главное — это запутанная и перегруженная структура сайта, большое&lt;br /&gt;
количество ненужной информации, неправильные приоритеты в ее подаче.&lt;br /&gt;
Складывается такое ощущение, что сама компания не знает для чего ей сайт.&lt;br /&gt;
Теперь давайте пройдемся по деталям.&lt;/p&gt;
&lt;p&gt;1) Перегруженная шапка сайта и кривой, уродливый, старый как динозавр логотип.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/148537_800.jpg" width="527" height="145" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Логотип Минсктранса — отдельная тема, ведь он есть не только на сайте, но и на киосках,&lt;br /&gt;
транспорте, печатной рекламе. Больше всего меня в нем раздражает шрифт, имитирующий&lt;br /&gt;
древнерусский устав.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/151660_800.jpg" width="336" height="414" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Уважаемые минчане! Как вы относитесь к тому, что одним и тем же шрифтом&lt;br /&gt;
набрано название предприятия, которое управляет транспортной системой&lt;br /&gt;
нашего города и штендер неизвестного никому ломбарда?&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/151390_800.jpg" width="600" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;2) Главный акцент на сайте — информация о перспективе использования&lt;br /&gt;
терминалов для продажи билетов и поиск потенциальных поставщиков.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/148801_800.jpg" width="773" height="425" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Благая задумка, но не лучше ли отдать эту задачу маркетологам или каким-нибудь&lt;br /&gt;
другим специалистам, а не заставлять каждого посетителя читать эту ненужную&lt;br /&gt;
ему инфу? Что, каждый второй — поставщик терминалов для продажи билетов?&lt;/p&gt;
&lt;p&gt;3) Левая колонка. Спасибо большое, что оставили на главной ссылки на разделы&lt;br /&gt;
с расписанием транспорта. Но разношерстная графика и кривая верстка&lt;br /&gt;
заставляют меня рыдать.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;div class="fotorama" data-width="218" data-ratio="0.57217847769029"&gt;
&lt;img src="https://pereverstal.by/pictures/148997_800.jpg" width="218" height="381" alt="" /&gt;
&lt;img src="https://pereverstal.by/pictures/149249_800.jpg" width="246" height="530" alt="" /&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;4) Правая колонка, практически полностью отдана рекламным баннерам&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;div class="fotorama" data-width="276" data-ratio="0.49462365591398"&gt;
&lt;img src="https://pereverstal.by/pictures/149538_800.jpg" width="276" height="558" alt="" /&gt;
&lt;img src="https://pereverstal.by/pictures/149886_800.jpg" width="272" height="682" alt="" /&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;Не, ну, а чо? Судя, по прайсу, рекламный банер в сутки стоит 4 BYN! Охренеть! Солидные бабки!&lt;/p&gt;
&lt;p&gt;Минсктранс, вы обслуживаете каждый день тысячи пассажиров, им нужна актуальная&lt;br /&gt;
информация о вашей работе, а не реклама санатория «Волма»!&lt;/p&gt;
&lt;p&gt;И кто, б...., вас так учил верстать?!&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;div class="fotorama" data-width="280" data-ratio="0.74270557029178"&gt;
&lt;img src="https://pereverstal.by/pictures/150377_800.jpg" width="280" height="377" alt="" /&gt;
&lt;img src="https://pereverstal.by/pictures/150069_800.jpg" width="259" height="476" alt="" /&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;h2&gt;5)&lt;/h2&gt;
&lt;p&gt;Побродив по сайту, можно обнаружить массу «приятных» мелочей.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;div class="fotorama" data-width="563" data-ratio="0.70375"&gt;
&lt;img src="https://pereverstal.by/pictures/150975_800.jpg" width="563" height="800" alt="" /&gt;
&lt;img src="https://pereverstal.by/pictures/150609_800.jpg" width="565" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/151280_800.jpg" width="773" height="491" alt="" /&gt;
&lt;/div&gt;
&lt;h2&gt;Итак, каков список задач для решения?&lt;/h2&gt;
&lt;p&gt;1) Полностью переработать структуру сайта — выкинуть&lt;br /&gt;
все лишнее, сгруппировать все общее, выделить главное.&lt;/p&gt;
&lt;p&gt;2) Переверстать все оставшиеся страницы, сделать&lt;br /&gt;
понятную, удобную и красивую верстку.&lt;br /&gt;
Избавиться от некачественной графики и фото.&lt;/p&gt;
&lt;p&gt;3) Переделать полностью главную страницу, разместив&lt;br /&gt;
на ней только ту информацию, которая реально необходима&lt;br /&gt;
и полезна каждый день, а именно:&lt;br /&gt;
1) Расписание транспорта&lt;br /&gt;
2) Актуальные новости Минсктранса.&lt;br /&gt;
3) Информация о тарифах и стоимости проездных билетов.&lt;/p&gt;
&lt;p&gt;4) Облегчить шапку сайта.&lt;/p&gt;
&lt;p&gt;5) Сделать редизайн логотипа — создать новый, модный,&lt;br /&gt;
молодежный, актуальный.&lt;/p&gt;
&lt;h2&gt;Что я хочу получить в итоге?&lt;/h2&gt;
&lt;p&gt;Новый, функциональный, удобный сайт, который привлечет&lt;br /&gt;
основную целевую аудиторию Минсктранса —  т. е. практически всех жителей Минска.&lt;/p&gt;
&lt;p&gt;Да и мне плевать на безразличие Минсктранса, отсутствие бюджета&lt;br /&gt;
и космические бури.&lt;/p&gt;
&lt;p&gt;Я призываю всех вас, мои уважаемые читатели, помочь мне — активно комментировать,&lt;br /&gt;
критиковать, советовать, репостить (или хотя бы лайкать), вовлекать в обсуждение своих друзей,&lt;br /&gt;
знакомых, родственников.&lt;/p&gt;
&lt;p&gt;Короче, не будьте безразличны. Если быть откровенным до конца, то дело ведь&lt;br /&gt;
не конкретно в самом сайте, проект «Переверстал» занимается в первую очередь&lt;br /&gt;
привлечением внимания  общественности к актуальным и порой не заметным&lt;br /&gt;
на первый взгляд проблемам окружающей нас визуальной среды.&lt;/p&gt;
&lt;p&gt;Первый шажок сделан, проблемы обозначены. Завтра будет пост о том,&lt;br /&gt;
как я переделывал логотип Минсктранса. Следите за новостями!&lt;/p&gt;
</description>
<pubDate>Sat, 24 Nov 2018 18:29:03 +0300</pubDate>
</item>

<item>
<title>Табличка на остановке</title>
<guid isPermaLink="false">32</guid>
<link>https://pereverstal.by/all/tablichka-na-ostanovke-2/</link>
<comments>https://pereverstal.by/all/tablichka-na-ostanovke-2/</comments>
<description>&lt;p&gt;Доброго вечера всем! Градус пофигизма просто зашкаливает&lt;br /&gt;
на этой табличке, сообщающей об изменении в маршруте движения автобусов.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/58613_800.jpg" width="800" height="449" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Такое чувство, что текст из ворда ляснули на макет путем копипаста,&lt;br /&gt;
даже не попытавшись хоть немного чего-нибудь подвигать.&lt;br /&gt;
Мелкий шрифт, выключка по центру, все эти бездушные «ул.», «просп.»,&lt;br /&gt;
«о.п.» Каша, безразличная, наплевательская, бюрократическая каша!&lt;br /&gt;
Да и еще. Обращение к пассажирам я убрал, во-первых в целях экономии&lt;br /&gt;
пространства, во-вторых.., да кому всралось вообще это обращение?&lt;br /&gt;
И так ясно для кого все это. Еще и уважаемые! «Вот вам, уважаемые пассажиры,&lt;br /&gt;
кусок текстового говна, копайтесь в нем!».&lt;/p&gt;
&lt;p&gt;Ок, как вы догадались, я переверстал сей экспонат.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/58785_800.jpg" width="800" height="383" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/59016_800.jpg" width="800" height="449" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;С уважением к буквам, строкам, набору и конечно пассажирам.&lt;br /&gt;
Желаю приятного просмотра.&lt;/p&gt;
</description>
<pubDate>Sat, 24 Nov 2018 18:10:00 +0300</pubDate>
</item>

<item>
<title>Привет, Минсктранс!</title>
<guid isPermaLink="false">28</guid>
<link>https://pereverstal.by/all/privet-minsktrans/</link>
<comments>https://pereverstal.by/all/privet-minsktrans/</comments>
<description>&lt;p&gt;Привет, Минсктранс!&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/112822_800.jpg" width="449" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Что тут у нас? Как обычно? Желтая подложка, сине-фиолетовая рамка,&lt;br /&gt;
оранжевый фон, иудейские буковки в заголовке и конечно же толстый слой&lt;br /&gt;
шоколада нечитаемого текста, состоящего на 95% из воды?&lt;/p&gt;
&lt;p&gt;«Обращаем ваше внимание на соблюдение мер личной безопасности, находясь&lt;br /&gt;
на остановочных пунктах и при поездке в салонах общественного транпорта»&lt;/p&gt;
&lt;p&gt;«Не подбегать на остановочных пунктах для посадки с транспортное средство,&lt;br /&gt;
т. к. оказавшись вне зоны видимости водителя можете попасть в опасную ситуацию»&lt;/p&gt;
&lt;p&gt;«Чтобы не подвергать свою жизнь неоправданному риску,&lt;br /&gt;
выполняйте вышеуказанные рекомендации»&lt;/p&gt;
&lt;p&gt;АААА! Для кого этот текст? Для роботов? Кто эту нудятину читать будет?&lt;br /&gt;
Тосскааа жее!&lt;/p&gt;
&lt;p&gt;Нужно всего-то донести до пассажиров несколько простых правил безопасности,&lt;br /&gt;
без всяких этих ваших бюрократических, старопердуновских и длиннющих фраз.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;div class="fotorama" data-width="565" data-ratio="0.70625"&gt;
&lt;img src="https://pereverstal.by/pictures/114141_800.jpg" width="565" height="800" alt="" /&gt;
&lt;img src="https://pereverstal.by/pictures/114446_800.jpg" width="565" height="800" alt="" /&gt;
&lt;img src="https://pereverstal.by/pictures/114235_800.jpg" width="565" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;Вот и все, делов-то!&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/113689_800.jpg" width="690" height="518" alt="" /&gt;
&lt;/div&gt;
</description>
<pubDate>Sat, 24 Nov 2018 18:09:52 +0300</pubDate>
</item>

<item>
<title>Подделка проездных билетов</title>
<guid isPermaLink="false">31</guid>
<link>https://pereverstal.by/all/poddelka-proezdnyh-biletov/</link>
<comments>https://pereverstal.by/all/poddelka-proezdnyh-biletov/</comments>
<description>&lt;p&gt;Привет! «Минсктранс» не перестает радовать своими дизайнерскими выкидышами.&lt;br /&gt;
Думаю, что настало время усомнится в душевном здоровье их дизайнера.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/59994_800.jpg" width="449" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;p&gt;Хотя, надеюсь все же, что с сознанием дизайнера все в порядке, а причиной ужасного&lt;br /&gt;
макета послужило его смиренное желание угодить всем согласователям. А их, как водится,&lt;br /&gt;
было много (как же, все же эксперты!). Ну вот мы и имеем — желтенький нравится&lt;br /&gt;
маркетологу, рамочка директору, шрифтики бухгалтеру, скачущие кегли уборщице.&lt;/p&gt;
&lt;p&gt;Что больше всего бросается в глаза, так это терзания дизайнера на тему что же&lt;br /&gt;
сделать по-больше «подделка» или «штраф»? Уверен, что в других вариантах&lt;br /&gt;
макета «штраф» был больше чем «подделка», но охраннику понравился именно&lt;br /&gt;
этот вариант. И все довольны :)&lt;/p&gt;
&lt;p&gt;Позвольте и мне вставить свои пять копеек.&lt;/p&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/60407_800.jpg" width="565" height="800" alt="" /&gt;
&lt;/div&gt;
&lt;div class="e2-text-picture"&gt;
&lt;img src="https://pereverstal.by/pictures/60668_800.jpg" width="449" height="800" alt="" /&gt;
&lt;/div&gt;
</description>
<pubDate>Sat, 24 Nov 2018 18:09:40 +0300</pubDate>
</item>


</channel>
</rss>