Совет 1: Как сделать полупрозрачный фон

Изображения с полупрозрачным фоном изящно смотрятся на любом сайте за счет того, что кажутся будто бы выполненными из матового стекла. Такие картинки, частями просвечивающие фоновый рисунок веб-страниц, могут использоваться для навигации на сайте, а также как элементы логотипа или блоков ресурса. Наполовину прозрачный фон у любого изображения вы можете легко и быстро сделать в программе «Фотошоп».
Как сделать полупрозрачный фон
Вам понадобится
  • - программа «Фотошоп»
  • - изображение, у которого необходимо сделать полупрозрачный фон.
  • - знать, как создавать новый слой
  • - уметь пользоваться инструментом «Заливка», чертить фигуры в фотошопе
Инструкция
1
Щелкните дважды по названию слоя с картинкой и в появившемся поле напишите любое новое название этого слоя. Это нужно для свободного перемещения этого слоя и получения прозрачного фона при удалении частей рисунка. Если у изображения уже есть непрозрачный однородный фон, то выделите его инструментом «Волшебная палочка». Для этого выберите этот инструмент на панели инструментов и щелкните мышкой по цвету фона, после чего выделятся все пиксели указанного вами цвета (по которому был произведен щелчок мыши) в пределах замкнутой области. Удалите выделенное, нажав клавишу Delete.
выделение фона инструментом «Волшебная палочка»
2
Если фон изображения неоднороден, то выделите саму картинку инструментом «Прямолинейное лассо» или «Перо». В случае выделения изображения инструментом «Перо» выложите нужный контур и при необходимости отредактируйте его инструметом «Перо+». При редактировании этим инструментом вы можете добавлять опорные точки щелчком мыши на линии созданного контура и, передвигая точки, менять его изгиб. Затем, не убирая курсор с контура, нажмите правую клавишу мыши и выберите «Образовать выделенную область». Растушевку установите на значение в 0 пикселей и поставьте галочку у параметра «Сглаживание». В результате этих действий контур будет преобразован в выделение. Удалите выделенное, нажав клавишу Delete.
Выделение самой картинки инструментом «Прямолинейное лассо»
3
Создайте новый слой и расположите его ниже слоя с картинкой. Наведя курсор на него, нажмите на левую клавишу мыши и, не отпуская кнопку, переместите курсор ниже слоя с изображением. Таким способом вы перетащите новый слой ниже слоя с картинкой. Ниже самого изображения создайте пока что непрозрачный фон нужного цвета и нужной фигуры.
создание нового фона на нижнем слое
4
В окне «Слои» при выделенном нижнем слое установите нужный процент его непрозрачности, перемещая рычажок в поле «Непрозрачность» и наблюдая за изменением прозрачности фона на картинке. Чем меньше будет значение непрозрачности, тем прозрачнее будет фон; чем больше - тем непрозрачнее.
регулировка непрозрачности слоя с <strong>фоном</strong>
5
Сохраните изображение с помощью команды «Файл-Сохранить как» в формате PNG, так как только этот формат способен передавать прозрачность и полупрозрачность картинки.
Ваши деньги должны работать на вас!
вклад на выгодных условиях
Стабильный доход и уверенность в завтрашнем дне - это то, что вы получите, сделав вклад на самых выгодных для себя условиях.
Возможность вернуть до 260 000 рублей
Если вы решили взять ипотеку
Каждый россиянин имеет право вернуть часть уплаченных налогов за покупку жилья.
Карта с большими бонусами
Дебетовая карта
Возвращается до 10% от стоимости покупок. Выгодна при крупных тратах.
Настроить автоплатежи просто
настройка автоплатежей за пару минут
В мобильном приложении Сбербанка все ваши платежи будут происходить в срок и без вашего участия.
Источники:
  • Просто о создании сайтов и баннеров

Совет 2: Как сделать картинку фоном для сайта

Перед многими владельцами сайтов возникает вопрос, как обновить сайт или привнести в него что-нибудь новое. Менять на сайте можно многое: шрифт, цветовую гамму, расположение информационных блоков, общий фон. В этой статье вы узнаете, как установить картинку в качестве фона для сайта.
Как сделать картинку фоном для сайта
Вам понадобится
  • Редактор html-кода
Инструкция
1
К изменению облика вашего ресурса можно пойти двумя путями. Первый - обратиться к специалисту (web-мастеру) и он за определенную плату внесет все необходимые изменения. Другой путь – сделать это самому. Для того, чтобы самостоятельно изменить внешний вид вашего сайта, вы должны изучить основы html–кода и воспользоваться одним из его редакторов.
2
Первое, на что следует обратить внимание перед тем, как установить картинку на сайт в качестве фона, это макет ширины сайта: фиксированный он или растягивающийся во весь экран. Если ширина фиксированная, то смело можете размещать картинку. Отображаться она будет у всех пользователей одинаково хорошо. Если сайт «резиновый», то изображение будет у каждого пользователя подгоняться под ширину экрана и может отображаться некорректно.
3
Итак, вы знаете ширину макета сайта. Подготовьте изображение для размещения. Загрузите его на сервер, где расположен ваш сайт. Картинка должна быть сохранена в одном из трёх форматов: jpeg, gif или png. Для корректного отображения фон должен быть по ширине таким же, как и ширина страницы.
4
Откройте в редакторе html-кода страницу, на которой вы хотите изменить фон. Найдите строку «background-image». Если такой строки нет, напишите её в поле тэга «body». Как на картинке.
В данном коде «url('images/bg.jpg')» - это путь к вашему фоновому изображению. Пропишите его. Сохраните изменения.
Как сделать <strong>картинку</strong> <em>фоном</em> для <b>сайта</b>
5
Откройте ваш сайт в одном из браузеров. Если путь к изображению указан правильно, вы увидите изменения.
Для редактирования html – страниц рекомендуется пользоваться программой Dreamweaver. Это мощный редактор, который позволит вам изменить многое на вашем сайте.
Обратите внимание
Для корректного отображения фон должен быть по ширине таким же, как и ширина страницы.
Полезный совет
Для редактирования сайта пользуйтесь программой Dreamweaver.
Источники:
  • как сделать сайт картинки в 2018

Совет 3: Как сделать картинку полупрозрачной

Фотошоп открывает перед пользователями широкие возможности в обработке фотографий и рисунков – вы можете создать на выбранном изображении любой визуальный эффект, и количество этих эффектов ограничивается только вашим воображением, а также умением работать в Фотошопе. Одним из выразительных и красивых эффектов является прозрачность изображения. Умение делать фон фотографии прозрачным, а также уменьшать общую прозрачность рисунка поможет вам в дальнейшем редактировании изображений.
Как сделать картинку полупрозрачной
Инструкция
1
Откройте Фотошоп и загрузите фотографию или рисунок – любое изображение, которое вы хотите поместить на прозрачный фон. Нажмите Ctrl+O, чтобы выделить изображение целиком, а затем скопируйте выделенную область.
2
Создайте новый файл – откройте в меню File опцию New, и в окошке настроек выберите опцию Transparent. Созданный файл будет полностью состоять из прозрачного фона. Находясь на данном файле, нажмите Ctrl+V, чтобы вставить скопированную на предыдущем файле выделенную область. Ваше изображение в качестве второго слоя файла закроет прозрачный фон.
3
Выберите на панели инструментов любой инструмент, которым можно выделить те или иные области – вызовите их горячими клавишами M или W. Масштабируйте рисунок для удобства и выделите те области, которые вы хотите сделать прозрачными.
4
После того, как выделение будет готово, замкните его и нажмите Delete. Лишние фрагменты изображения исчезнут, и вместо них вы увидите прозрачный фон.
5
В некоторых случаях вам может потребоваться полупрозрачный рисунок – например, полупрозрачный текст может стать необычным украшением коллажа или веб-сайта, а также полупрозрачный текст можно использовать в качестве водяного знака. Для того чтобы нанести на фото полупрозрачный текст, откройте нужное изображение, а затем выберите в меню текстовый инструмент (Т).
6
Выберите нужный размер, шрифт и цвет, а затем поверх фотографии напишите нужный текст. В палитре слоев появится отдельный текстовый слой. Регулятор в строке Opacity в панели слоев сдвиньте до 30-40%. Вы увидите, как надпись становится полупрозрачной.
7
Для того чтобы при размещении в интернете прозрачность сохранилась, и рисунок не отображался некорректно, сохраняйте такие изображения в формате png.
Видео по теме

Совет 4: Как сделать прозрачный логотип

При создании логотипа весьма желательно иметь возможность сделать его фон прозрачным - в этом случае он будет более органично вписываться в любое оформление, будь то страница веб-сайта, документ в формате Word, флэш- или видео-ролик и т.д. Кроме того полупрозрачный логотип можно накладывать в качестве ватермарки на изображения и фотографии. Наиболее распространенный инструмент для проведения такого рода графических работ - Adobe Photoshop.
Как сделать прозрачный логотип
Инструкция
1
Запустите графический редактор и загрузите или создайте с нуля сам логотип - эта часть работы целиком зависит от ваших художественных предпочтений и исходных данных (названия компании, клана или организации, символики, которую надо разместить на логотипе и т.д.).
2
Поместите все слои psd-документа в одну папку - в этом случае отпадет необходимость регулировать прозрачность каждого слоя персонально, а можно будет делать это для всей папки целиком. Для этого щелкните в правой нижней части панели слоев пиктограмму, при наведении мыши на которую всплывает надпись «Создать новую группу», а затем выделите слои и перетащите их в созданную папку. Если в документе существует и фоновый слой, то его перемещать не нужно - оставьте за пределами папки.
3
Выключите видимость фонового слоя щелчком по пиктограмме с изображением глаза у левого края строки, относящейся к этому слою. Собственно, редактирование на этом можно заканчивать, если сам логотип должен быть непрозрачным, а прозрачным должен быть только его фон - в этом случае пропустите следующий шаг.
4
Выделите созданную папку (щелкните по ней курсором мыши), если необходимо логотип сделать частично прозрачным. Затем раскройте выпадающий список рядом с надписью «Непрозрачность» и с помощью ползунка подберите наиболее подходящую степень прозрачности логотипа.
5
Обрежьте лишнее пространство вокруг логотипа - так будет проще использовать его в дальнейшем. Раскройте в меню графического редактора раздел «Изображение» и выберите команду «Тримминг». В окошке, которое в результате откроется, поставьте отметку в поле «прозрачных пикселов» и нажмите кнопку «OK». Редактор сам изменит размеры в соответствии с шириной и высотой вашего логотипа.
6
Сохраните созданный логотип в собственном формате Adobe Photoshop. Этот файл вам понадобится в том случае, если потребуется внести какие-либо изменения. Диалог сохранения открывается нажатием сочетания клавиш ctrl + s.
7
Создайте оптимизированный файл с логотипом, который можно будет помещать в нужные вам документы. Для этого нажмите сочетание клавиш alt + shift + ctrl + s и окно оптимизации изображения откроется. Оно предназначено для того, чтобы вы имели возможность выбрать наиболее подходящий графический формат, и подобрали для него такие настройки изображения, которые дают оптимальное соотношение качества и веса создаваемого файла. Второй сверху выпадающий список содержит возможные типы файлов - выберите в нем либо gif, либо png. Эти два формата поддерживают прозрачность, в отличие, например, от формата jpeg. Имейте в виду, что формат png не всегда правильно отображается браузерами Internet Explorer. Затем убедитесь, что в чекбоксе «Прозрачность» выставлена метка и нажмите кнопку «Сохранить».
8
Укажите место сохранения в вашем компьютере и название файла логотипа, а затем еще раз щелкните кнопку «Сохранить».
Поиск
Совет полезен?
Добавить комментарий к статье
Осталось символов: 500