Найти в Дзене
WEB дизайн

WEB дизайн

Конспекты, полезные ссылки для веб дизайна
подборка · 12 материалов
5 месяцев назад
Модульная сетка в веб-дизайне:
Модульная сетка — это система расположения объектов в пространстве на основе строк и столбцов определенного размера. Модульная сетка — это «скелет» дизайна, который помогает расположить элементы сайта гармонично и логично. Она избавляет от хаоса, упрощает верстку и делает макет визуально приятным для пользователя. Давайте разберем пример, который вы выбрали, и поймем, почему он работает. Вы делите 1170 px на повторяющиеся блоки: 70 px (колонка) / 15 px (гуттер) / 15 px / 70 px / 15 px / 15 px и так далее...
7 месяцев назад
Оптимизация мультимедийных файлов Для оптимизации мультимедийных файлов можно предпринять следующие шаги: Для изображений: Настроить размеры. Для некоторых изображений (например, логотипов или баннеров) может потребоваться определённо заданный платформой размер. Для фотографий можно использовать разные размеры в зависимости от того, в каком разделе и с какой целью они будут использоваться. Уменьшить размер файлов. Большие файлы могут замедлять загрузку страницы. Для этого можно использовать программы Photoshop или GIMP. Оптимизировать качество. Качество изображения влияет на его размер. Если не нужно высокое качество для определённых задач, то можно снизить качество изображения, чтобы оно весило меньше. Для видео: Использовать форматы с небольшим разрешением. Это позволит уменьшить размер файла и ускорить загрузку страниц сайта. Сжать видео без потери качества. Это также поможет уменьшить размер файла. Оптимизировать звук. Звук в видео напрямую влияет на размер файла. Можно уменьшить громкость или заменить звуки в видео на аудиодорожку, так размер видео тоже станет меньше.  Для оптимизации мультимедийных файлов можно использовать специальные программы, например, AVS Video Editor, Freemake Video Converter, Movavi Конвертер Видео
7 месяцев назад
Какая ширина сайта наиболее оптимальна при создании макета в Photoshop?
💡 Оптимальная ширина: 1440 px или 1920 px Но! Контентная часть (рабочая область) чаще всего 1200 px. ✅ Большинство экранов – Full HD (1920×1080 px), но ширина 1200 px удобнее для адаптации. ✅ Контент должен быть читабельным на ноутбуках (1366 px ширина экрана). ✅ Если делать макет шире 1200 px, пользователям с маленькими экранами будет неудобно. 👉 Вывод: Делаем макет 1440 px или 1920 px, но основную информацию размещаем в 1200 px по центру. Все) дальше можно не читать! Оптимальная...
7 месяцев назад
Алгоритм экспорта трасированного изображения из Illustrator в Photoshop
Вот пошаговый алгоритм трассировки растровой надписи в Adobe Illustrator и экспорта результата в Adobe Photoshop, обработанного через Объект → Трассировка изображения. 2. Настройте параметры трассировки в панели "Трассировка изображения" (Окно → Трассировка изображения). Нажмите "Разобрать" (Expand) в верхней панели, чтобы преобразовать трассировку в векторные контуры. Дальше можно действовать двумя способами: Выберите объект с помощью черной стрелки (Selection Tool, V)...
8 месяцев назад
Как сделать растровую картинку векторной онлайн? Сделать растровую картинку векторной можно с помощью онлайн-сервисов. Вот несколько удобных инструментов: 1. Онлайн-конвертеры 🔹 vectorizer.io – автоматически превращает растровое изображение в векторное. 🔹 vectorizer.com – поддерживает форматы SVG, EPS, PDF. 🔹 autotracer.org – конвертирует PNG и JPG в SVG, EPS, PDF, DXF. 🔹 Vector Magic – один из лучших сервисов, но требует регистрации. 2. Онлайн-редакторы 🔹 Adobe Express (бывший Adobe Illustrator Online) – позволяет трассировать изображения. 🔹 Inkscape (онлайн-версия) – бесплатный редактор с инструментами векторизации. Как сделать? Загрузите изображение (JPG, PNG, BMP). Выберите параметры трассировки (авто или ручная настройка). Сохраните результат в формате SVG, EPS или PDF.
8 месяцев назад
Типографика: основы, правила и примеры
Типографика — это искусство и наука оформления текста. Она включает выбор шрифтов, их сочетание, компоновку на странице, регулировку интервалов между буквами, словами и строками. 9. Иерархия (Hierarchy) – использование размеров, жирности и цветов для акцента в тексте. 10. Грид (Grid) – система направляющих для организации текста на странице. Существует пять основных классификаций шрифтов: Особенности: Примеры: Использование: Особенности: Примеры: Использование: Особенности: Примеры: Использование:...