Start your Web Design Career with Adobe Photoshop
4.2 (6 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.
237 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Start your Web Design Career with Adobe Photoshop to your Wishlist.

Add to Wishlist

Start your Web Design Career with Adobe Photoshop

Use the best tools and techniques of Adobe Photoshop CS6 to design for the web
4.2 (6 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.
237 students enrolled
Created by Ishan Ahamed
Last updated 8/2013
English
Current price: $10 Original price: $20 Discount: 50% off
1 day left at this price!
30-Day Money-Back Guarantee
Includes:
  • 5 hours on-demand video
  • 1 Article
  • 1 Supplemental Resource
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Understanding the basics of Adobe Photoshop - You will learn how to set-up preferences, menus, workspace and use important keyboard shortcuts to speed up your process and kick start designing
  • Basic Tools - You will be given an introduction to the basic tools such as the move tool, marqee tool, brush tool, pen tool and other tools
  • Structure of a Photoshop document - You will learn the Anatomy of a Photoshop document
  • Creating a new document - You will learn the best settings to use when creating a document specially for the web
  • Layout Options - You will learn the best techniques to use when laying out the graphical elements within a web page
  • Working with Layers
  • Typography
  • Importing Images
  • Organizing Content - You will learn how to organize your layers in order to make it easier to access
  • Saving for the Web - You will learn the best techniques to use when saving content for the web thus making sure it is in lower size and higher quality
  • Adding Flexibility to the coder/Programmer - You will learn the new Copy CSS feature of Adobe Photoshop CS6 version 3.1.2 that allows you to auto generate CSS codes and save time for the coder
  • By the end of the course you will have the right knowledge to create your own website design using the best tools and techniques of Adobe Photoshop CS6
View Curriculum
Requirements
  • You will just need a copy of Adobe Photoshop CS6 installed, no other prior requirements needed since the course starts all the way from the very basics
Description

This course takes you all the way from the very basics to having an incredibly confident handle in using the tools and techniques of Adobe Photoshop CS6 to design a simple but very attractive web page in less time.

The four key components of a great Website Design are:

  • Layout
  • Typography
  • Color Scheme
  • Design Elements

Adobe Photoshop is an application that allows you to do this effectively.

Rather than showing you each and every feature and making things complicated I will walk you through the best tools to use at the right time to achieve this goal.

Let's Get Started!

Who is the target audience?
  • Totally new to Adobe Photoshop or been using it for a while, this course is worthwhile taking to boost up your skills
Students Who Viewed This Course Also Viewed
Curriculum For This Course
Expand All 38 Lectures Collapse All 38 Lectures 05:00:02
+
The basics required to get started with Photoshop
19 Lectures 02:08:03
Download Work Files
00:02


In this lesson you will learn the importance of setting up preferences. I won't be going through all of them but a few important ones.
Preview 08:49

In this lesson you will learn how to set up menus and make your workflow easier.
Menu Settings
05:30

In this lesson you will learn how to set up your own keyboard shortcuts and how to save a copy of all existing shortcuts for print 
Keyboard Shortcuts
03:20

In this lesson you will learn how to customize your own workspace as a web designer making sure that you have only the required commands and tools displayed on screen
Customizing your Workspace
05:40

In this lesson you will learn how to switch between different screen modes:

  • Tab
  • Shift + tab - Fullscreen with tools bar
  • F

Screen Modes
03:16

In this lesson you will learn how a Photoshop document is put together and the importance of layers
Preview 03:10

The regular undo command short cut with other applications is ctrl + z but in Photoshop it is a little bit different:

  • Ctrl + Z - Undo Once
  • Ctrl + Alt + Z - Continuous Undo
  • Ctrl + Shift + Z - Continuous Redo 

Undo Command in Photoshop
03:17

In this lesson you will get an idea of the color picker and the swatches panel:

  • D -  to switch the foreground and background color to black and white
  • X - to switch between foreground and background color

Working with Color
08:50

In this lesson you will learn how to create your own pattern fills and use existing ones:

  • Shift + F5 - to access fill dialogue box

Working with Patterns
05:37

In this lesson you will learn how to use the best tools to create a proper web layout:

  • Ctrl + R - to access the ruler
  • Ctrl + H - to toggle between the guides
  • Ctrl + ' - to toggle between grids

Creating a document layout
12:25

In this lesson you will understand the difference between raster based graphics and vector based graphics and how to work with both.
Introduction to Vectors
10:23

In this lesson you will learn how to create your own vector shapes using the pen tool.
Pen Tool Part 01
07:28

Pen Tool Part 02
04:13

In this lesson you will learn how to use the gradient tool to fill with multiple colors.
Gradient Tool
12:05

In this lesson you will learn how to use the text tool effectively for Typography and the new feature character styles and paragraph styles.
Text Tool Part 01
16:30

Text Tool Part 02
07:34

In this lesson you will learn how to add different styles and effects to layers.
Layer Styles
08:19
+
Designing the actual web page
19 Lectures 02:50:57
In this lesson you will learn the best settings to apply when creating a new document for the web.

  • Ctrl + N - to create a new document

Preview 08:37

In this lesson you will learn how to import a texture background, modify it and place it as the background of the webpage.
Adding Background Texture
05:38

In this lesson you will learn how to create a content area to place the contents.
Creating the Content Area
06:43

In this lesson you will learn how to create a logo for Grand Sports.
Creating the Logo
10:17

Initiating the Gallery Section
16:55

In this lesson you will learn how to import different types of images externally.
Importing Images
06:39

In this lesson you will learn how to add layer masks to a layer to conceal and reveal parts an image.
Adding Layer Masks
05:52

In this lesson you will learn how to use the ruler and guides to create a proper web page layout for Grand Sports in order to place its contents.
Preview 05:27

In this lesson you will learn how to organize and group layers so that the layers panel does not look messy and things are under control:

  • Ctrl + G - to group layers

Organizing and Grouping Layers
07:09

In this lesson the gallery section will be completed by importing images and placing the text in order.
Completing the Gallery Section
21:09

In this lesson you will learn how to create an attractive navigation bar.
Navigation Bar Part 01
11:19

Navigation Bar Part 02
11:57

Navigation Bar Part 03
10:39

Creating a Signup Form
13:54

Footer
02:48

In this lesson you will learn how to use the best settings when saving for the web by using the slice tool. Important fact is that the contents should be in higher quality and lower size.
Saving for the Web
18:49

In this lesson you will learn how to update your current version of Adobe Photoshop CS6 to its latest and use the newest copy css feature to auto generate css codes for your design.
Copy CSS
06:13


Assesment - Design a webpage based on sample wire-frame
1 page

This quiz will give you an idea of how far you were able to grasp knowledge out of this course and what parts to look back in the course.

Test your Knowledge
20 questions
About the Instructor
Ishan Ahamed
4.8 Average rating
49 Reviews
6,670 Students
2 Courses
Professional IT Trainer

Hi, I am from Sri Lanka and I work as a full time IT Trainer in Dubai

I graduated with First Class Honours Degree in Computing from Buckinghamshire New University UK. I took up the post of IT Trainer in 2010 and have been training people from various different countries since then. I have a particular love for training and my main focus is to help trainees around the world to leverage their knowledge by applying the skills to a meaningful goal.

My primary focus of trainings are:

  • Microsoft Office 2007/2010/2013
  • Adobe Suite CS5/CS6
  • Web Development in HTML/CSS/PHP/AJAX/JavaScript/JQuery/MySQL

You Tube