Scribd
Upload
23 views4 pages

Chapter 1: Introduction To Web Design: "Whatever You Do in Photoshop Becomes An Art"

This document provides an introduction and overview of the basic steps for web design using Adobe Photoshop: 1) The first step is designing the webpage layout visually in Photoshop. 2) Next, the Photoshop file is converted into HTML and CSS using a program like Dreamweaver. 3) Finally, the files are uploaded to a server to publish the website. The document then focuses on designing webpage layouts in Photoshop, explaining how to set up a new document and the typical sections of a website layout like headers, flash content, and sidebars.

Uploaded by

adoberx
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
23 views4 pages

Chapter 1: Introduction To Web Design: "Whatever You Do in Photoshop Becomes An Art"

This document provides an introduction and overview of the basic steps for web design using Adobe Photoshop: 1) The first step is designing the webpage layout visually in Photoshop. 2) Next, the Photoshop file is converted into HTML and CSS using a program like Dreamweaver. 3) Finally, the files are uploaded to a server to publish the website. The document then focuses on designing webpage layouts in Photoshop, explaining how to set up a new document and the typical sections of a website layout like headers, flash content, and sidebars.

Uploaded by

adoberx
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 4

Chapter 1: Introduction to Web Design

Introduction:
What is Web design, is it an Art or a series of Scripts. Generally the workflow is as follows,

Step1: Designing the webpage layout in Adobe Photoshop


Step2: Converting the layout into a HTML/CSS using Dreamweaver
Ster3: Uploading the files on to the Server

Designing in Photoshop:
For those who are just stepping into Photoshop, you just have to understand that you don’t have
to be an artist to make a professional design in Photoshop. It’s like
“Whatever you do in Photoshop becomes an Art”

Now in this tutorial section we will be dealing about designing a webpage in Photoshop.

Launching the Application, Creating a New Document and Understanding the different types of
layouts for a webpage.

As you launch Photoshop, this will be the start screen and as the first step we are setting up a
new document by [CTRL + N] or by going to the file new

Now you might notice a dialogue box popping out as shown below
Here you should find the following options, I wish you to pay attention to these options as they
are important

Name: you can just enter a name for the document

Preset: Adobe has certain dimension sets assigned to it to access it you need to change from
Custom but generally I prefer that to be as Custom

Width: The width with which you are going to design your webpage, It is highly preferred to be
as 955 pixels as it matches resolutions of many monitors

Height: This can be preferred to be 800 pixels

Resolution: If your document is for the web you need to have the Graphics Optimized and the
best practice is to have a resolution of 72 pixels/inch. And if your document is for printing
purposes you need to have its Resolution to be a min of 320 pixels/inch

Color Mode: Let this be as default


Background Contents: Let this be as default which is a white Background

Now, just give Enter/Ok to open a new document.


And this will be your new document, the white area will be the stage where we make our design.

So we have created our New document, Let us now analyze how a website layout should be

Header

Flash

Content

Footer

Sidebar
Sections of a web layout and many others have been discussed, with this you must be clear
idea about the layout structure. Now let us proceed with its Creation.

You might also like