Свежие ресурсы для веб-дизайнеров и разработчиков (ноябрь 2013 г.)

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

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

Вперед к инструментам!
PSD Validator
Я нашел много дизайнеров, которые оставляют свои слои Photoshop жестоко неорганизованными. Они не называют слои и группируют их должным образом. Если вы используете Photoshop для веб-дизайна, организованная работа позволит разработчикам безболезненно преобразовывать их в коды. PSD Validator позволяет проверить, следите ли вы Фотошоп Этикет при структурировании файлов Photoshop.
Daturi
Мы можем прикрепить изображения в CSS, используя свойство background, и указать URL, который указывает на изображение. В некоторых случаях лучше встроить изображение в CSS, что можно сделать путем преобразования изображения в код Base64. Датури позволяет вам сделать это быстро. Просто перетащите изображение на веб-сайт и нажмите кнопку «Преобразовать в код Base64».
Нажатие клавиши
Вы когда-нибудь хотели добавить сочетания клавиш или сочетания клавиш на свой сайт? Возьмите Facebook в качестве примера; ударил L, чтобы понравиться или нет? для поиска, 1, чтобы перейти на домашнюю страницу. Если вы хотите реализовать похожую идею на своем сайте, вы можете использовать Нажатие клавишибиблиотека JavaScript для захвата ввода с клавиатуры.
GhostLab
Сегодня создание веб-сайтов может быть реальной проблемой, поскольку существует слишком много устройств с различными размерами и требованиями, чтобы удовлетворить их. Испытывать его на как можно большем количестве устройств — настоящая боль. Ghostlab — это приложение для Mac, которое вы можете использовать для синхронной проверки своего веб-сайта на нескольких мобильных устройствах, телефонах или планшетах. Когда вы прокручиваете, нажимаете или перезагружаете страницу, она отражается и на других подключенных устройствах.
RulersGuide
RulerGuides — это библиотека JavaScript для построения линейки на веб-сайте и добавления к ней рекомендаций. Это похоже на Photoshop, где мы можем создавать ориентиры, щелкая линейку и перетаскивая ее в любое место на холсте. Он также предоставляет несколько горячих клавиш для переключения линейки и сохранения или очистки направляющих. Проверьте демонстрация для внутреннего взгляда.
Переименование группового уровня
В соответствии с Фотошоп Этикет, у вас должно быть имя для каждого слоя в ваших PSD. Безымянные слои могут свести дизайнера с ума. Но необходимость переименовывать слои слоев также является утомительной работой. Поэтому, если вы часто этим занимаетесь, вы можете использовать этот скрипт Photoshop, который позволяет именовать слои PSD в группе.
GenerateWP
GenerateWP — это веб-инструмент для создания API WordPress с последним стандартом. С помощью этого инструмента мы можем создать 17 API, включая таксономию, тип публикации, статус публикации, шорткод и боковую панель.