• Под какие разрешения рисовать адаптивный дизайн?

    paulradzkov
    @paulradzkov
    Дизайнер, верстальщик, начальник отдела UI
    При рисовании любого дизайна встает техническая задача — уместить элементы сайта в указанную ширину. Уместить в заданную ширину тяжелее, чем растянуть до заданной ширины. Растянуть легко на этапе верстки. Поэтому нужно ориентироваться на минимальную ширину в классе.

    1. Мобильные телефоны — 320px. Ориентируемся на viewport айфона, т.к. он самый маленький. У современных андроидов вьюпорт больше, поэтому их игнорируем (растянется на верстке).

    2. Планшеты — 768px. Опять-таки ориентируемся на айпад в портретной ориентации , т.к. у андроид планшетов вьюпорты обычно имеют размер от 800×1200 или совпадают с айпадом. Планшеты с вьюпортом 600×1024px устарели. К тому же ничего страшного, если в вертикальной ориентации сайт на таком планшете будет выглядеть как на мобильнике, а в горизонтальной ориентации — как на десктопе.

    3. Десктоп и планшеты в ландшафтной ориентации — 1000px. Почему 1000, а не 1024: первое, в настольных браузерах полоса прокрутки съедает (обычно) 18px ширины; второе, от 1000px верстальщику удобнее расчитывать размеры в процентах, а до 1024 все равно растянется при верстке.

    В принципе, этого достаточно, чтобы верстальщик справился.

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

    В каком порядке рисовать? Смотря как поставлено тех.задание. Чаще всего в задании описан полный функционал для настольной версии. Тогда проще нарисовать дизайн под 1000px и перекомпоновать под 768 и 320, выбросив или упростив по пути менее значимые элементы сайта. Т.е. двигаться от сложного к простому.

    Верстать при этом удобнее от меньшего экрана к большему (от простого к сложному). При mobile first верстальщику приходится дописывать новые стили для бóльших экранов поверх базовой версии в 320px вместо того, чтобы обнулять написанные для настольных браузеров стили. В результате для мобильника css весит меньше и парсится быстрее.
    Ответ написан
    Комментировать
  • Как исправить ошибку Unsafe attempt to load URL при подключении SVG?

    Evanre
    @Evanre
    Front-end developer
    Для обращения к svg через xlink:href нужен HTTP, локально не работает. Если только не встраивать svg инлайново. Другими словами, вам нужен сервер.
    Ответ написан
    Комментировать
  • Английский. Где учить в интернете?

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

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

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

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

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

    осилите преподавателя-носителя языка хоть по скайпу - это будет идеально, но это должен быть именно преподаватель, который умеет преподавать english as a second language - ESL

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

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

    не слушайте никого, кто будет говорить, что вам сначала нужно выучить грамматику
    сначала надо освоить разговорный английский, хоть на уровне 5-летнего ребенка, а потом вы сами сможете понимать, что и как вам учить
    Ответ написан
    1 комментарий