Photoshop CS6 for Web Designers

Learn basic elements and and coolest tricks on Photoshop CS6 to become a kickass Web Designer
4.3 (8 ratings)
Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
1,016 students enrolled
Instructed by Yoda Learning Design / Web Design
25% off
Take This Course
  • Lectures 41
  • Length 2 hours
  • Skill Level Beginner Level
  • Languages English
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works


Find online courses made by experts from around the world.


Take your courses with you and learn anywhere, anytime.


Learn and practice real-world skills and achieve your goals.

About This Course

Published 1/2015 English

Course Description

Why take the course and how much time it takes to complete?

Adobe Photoshop was developed 24 years ago and is still predominant among millions of Users. It is used for optimizing and editing images. It has got various features like Slicing, Marquee, Lasso, etc. One of the most useful tool for graphic designers, website designers. It finds its place wherever there is use of an image as it can enhance, edit and merge images and lot more which you can learn in this course.

The duration of the course is 2 hrs and 5 hrs of lab-work from our mini challenges.

In this course you will learn:

  • Photoshop Basics: Style panels and how to use them. Managing different layers. Layers are the backbone of your image, they help you work on individual parts of the image without affecting the rest of the image. Then there is Lorem Ipsum which acts as a filler text for visual presentation. More features like vector, Trim.
  • Color & Creating New Document: How to use color in your documents, web designs, mobile documents and email newsletters. The Hex Color system and making new colors by changing the proportion of RGB.
  • Guide, Grids and Rulers: Create documents and make use of Grids which helps bring symmetry to your documents and easily help place different layers and images at appropriate places. Ruler tool which helps you calculate the distance between two points.
  • Layer Style: In this section you will learn how to add buttons to your document. And to make your text in the document look better by adding shadows and textures.
  • Our Simple Website: In this section you will learn about creating master elements which remain static throughout your document. Placing your logo which is the brand of your website. Then creating a navigation bar for your website, creating contact us page, buttons and more. One of the most important tool for a designer, Slice Tool which helps cut the images before exporting.
  • Save For Web & Sprite: You must have come across dialog boxes on websites. In this section we will show you to design the dialog box in detail. Moving to Sprite, the favorite among many users. Sprites are used to create 2D images which acts as standalone artwork in comics, video games, raster graphic. Sprites accelerates the page loading speed when created in CSS of the webpage. Thus the amount of data required by the browser to load the website reduces.

You will come across challenges in between, where you can practice what you have learned. There are video solutions for the challenges for you to watch if you get stuck.

This is a fast-paced lean program of 2 hrs. with tricks meant. Watch the preview video to get a flavor the program's uniqueness and relevance.

What are the requirements?

  • Basic knowledge of Photoshop (recommended but not necessary)
  • Basic concepts for Web Design

What am I going to get from this course?

  • Design Simple Websites
  • Create email newsletters
  • Create Web Layouts
  • Using Layer styles
  • Improve speed using tricks and tips

Who is the target audience?

  • Web Developers
  • Mobile App Developers
  • UI/UX Enthusiast

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.


Section 1: Photoshop Basics

This feature allows you to select elements based on the layer or group. This tool is very useful if there are multiple layers in Photoshop, you do not have to remember each layer.


This feature allows you to save any style that you have applied to the text and replicate the same effect to some other text.


In this tutorial, you will learn about layers and Interface of layers.


While creating a layout of any website, we may use Lorem ipsum as dummy text to fill the website with content.


There are two kinds of styles which can be applied to text: Text Point and Paragraph Text. In this tutorial, you will learn to apply these effects to text.


Fonts do not appear similar in every device. We need to use a font that will appear same in all the devices. This tutorial offers you time saving tricks to make your font scalable across all devices.


Here you will learn the trim feature which enables you to delete transparent pixels in documents.


This tutorial explains vector images and its importance in Web Designing.

Section 2: COLOR & Creating New Document

This Tutorial illustrates multiple ways of applying colours in Photoshop.


Color vary in looks in different devices. This tutorial will help you make your colours scalable across devices.


You will learn how to create a new document for desktop. And the recommended size for such documents.


How to create a new document for mobile devices and the size recommended for these documents.


This tutorial is about how to create a new document for email newsletter and the size recommended for these documents.


This tutorial explains how to use Hex Colours.


Swatches is one of the most important elements in designing any website. In this video you will learn how to create swatches and its application.

Section 3: Guide, Grids and Rulers

Rulers help you position images and other elements precisely.


Grid is the perfect alignment tool for a graphic design. You will learn how to use it and which resources are needed to use it effectively.


This extension allows us to quickly create Guides in our projects.

Section 4: Layer Style

Create buttons and layer style (to make the designs more attractive).


Drop shadow is one the most popular layer styles and is used to enhance the appearance of an element.


This layer style allows any shape or element to have a metallic texture by using layer style named gradient overlay.

Mini Challenge 1
Mini Challenge 1 - Walkthrough
Section 5: Our Simple Website

You will learn how to create a mock-up of website.


You will learn how to create basic mockup with the help of shapes tools such as rectangle tool.


You will create master elements in Photoshop that allows you to create element which remains constant throughout our website.


You will learn how to place a logo in your website


You will learn how to create a navigation bar in the website.


You will learn how to put text in your website and how to use different paragraph styles.


Create image placeholder similar to the tutorial section in the homepage of the website


Learn how to create store pages in your website.


Learn how to create buttons for your website and how to nudge their position.


Learn how to create contact page for your website.


Learn how to use slice tool (one of the most used tool by web site designers). It allows you to cut images before exporting images them from Photoshop.

Section 6: Save for Web & Sprite

You will learn the application of save for web dialog box.


You will learn the application of save for web dialog box.


You will learn what is sprite and how it is used and the benefits of using sprites in website design.


You will learn what is sprite and how it is used and the benefits of using sprites in website design.


You will learn what is sprite and how it is used and the benefits of using sprites in website design.

Mini Challenge 2
Mini Challenge 2 - Walkthrough

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

Yoda Learning, Become 4X Faster | Join 32000+ Udemy Students

Yoda Learning is a team of 12+ industry professionals focused on developing “Project-based"learning solutions, which enable the learners explore real world situations and thus, make the learning process engaging and practical. Our Courses on Technology includes everything including Web Development, Mobile App Development, Data Analytics and Design.

The collective work-experience of 80+ yrs. spans across multiple industries like Manufacturing, IT, Sales, Finance, Marketing, Operations, HR and functional domains such as Office suites, Mobile applications, Digital Marketing, Database Technologies, Networking).

Ready to start learning?
Take This Course