Игорь

Как по мне, картинка настолько простая, что проще перерисовать самому - качество в конечном итоге будет намного лучше. Ну, или если пофиг, magic wand'ом выделить фон, удалить его и подчистить края, после этого делать фон и тень нужных цветов. Именно из-за краев может не получиться нормально заменить цвет Replace Colour'ом в Image->Adjustments - с краями надо будет работать отдельно. Ну, и стрелку надо будет вычесть из общего выделения, чтобы она цвет вместе с фоном не меняла.... в общем, проще или в векторе перерисовать, или шейпами в фотошопе.

Как вариант просто начать верстать "mobile first". Сначала одним столбцом делаешь стили для основных блоков. Потом начинаешь постепенно (по мере увеличения ширины экрана) позиционировать эти элементы. В зависимости от проекта можно либо сетки всякие использовать, либо обычными 'float' и 'position: absolute' делать layout (позиционирование). Брейкпоинты можно из того же Bootstrap взять. Мне кажется, тем людям, которые дали тебе задание, даже понравится, что ты всё сделал без лишних вопросов. А если им что-то не понравится в мобильной версии, то всегда можно сослаться на отсутствие PSD-макета или ТЗ по мобильной версии.

Вы можете попробовать поиграть со свойством text-rendering (понаписано про него много, скажем - https://css-tricks.com/almanac/properties/t/text-r... ), со свойством -webkit-font-smoothing (ну, понятно, в каком браузере), , только с ним надо верить в то, что у юзера "правильный" браузер.

Второй финт ушами - делать у текста почти отсутствующую тень через text-shadow (скажем, text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004) - видите размер тени?), в отдельных случаях это помогает.

Так что пишете что-то вроде

text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
text-rendering: optimizeLegibility !important;
-webkit-font-smoothing: antialiased !important;

и молитесь :)

А вообще, веб - это не pixel-prefect, а в первую очередь контент. Все красивости, где нужно, можно заменить на графику с красиво написанными заголовками, через трюки вида такого: https://css-tricks.com/the-image-replacement-museum/ , но, прошу вас, помните, что люди с мобильными устройствами предпочли бы получить контент чуть менее красивый, но более отображаемый на их устройствах.

Буду жесток...
Это как ни странно и то и другое...
Думаете у нас мало "профи" которые "способны решать задачи самостоятельно" ?
Уверяю их достаточно, так же как и бездарностей и новичков которые ничего не понимают и не умеют.
НО! Эти люди уже организовали свой бизнес или на пути к этому.
А работодатели хотят как всегда "профи" за "фикс". Что бы так сказать "бери больше - кидай дальше" за фикс.
Теперь понимаете откуда дефицит? Да да... Всё правильно, работодатели ищут "профи" которые не умеют руководить... Которые на каждое данное задание будут говорить "я буду рад выполнять этот проект для вас"...
Смешно да?
И вся эта ерунда которая происходит на собеседованиях это просто пси-садизм, что бы опустить человека и тот был бы согласен вкалывать за меньший фикс.
Думаете "профи" этого не понимают? Ещё как понимают. Поэтому и дефицит. Дефицит "профи-лохов".
Теперь о работодателях... Зачем вообще создаются предприятия? Что бы решать большие и сложные задачи с помощью малых ресурсов. Если менеджмент не способен организовать работу и осуществить некий проект с помощью специалистов начального уровня разделяя сложную задачу на простые, значит это плохой менеджмент и он будет искать "профи-лохов".