Learn it fast with expert-taught software and skills training at lynda.com. Start your free trial

By Greg Chow | Saturday, April 14, 2012

Quick Tip: Setting up a Photoshop document for a web site mockup

The first step in creating a web site mockup in Photoshop

Click image for a larger view.

Designing for the web is a bit different than designing for print, so it’s important that you set up your Photoshop document correctly before you begin designing your web mockup.

First, in Photoshop, go to File > New. This opens up the New Document dialog box, where you can choose everything you need. Start with the Preset pull-down and choose Web. From there, you can choose the size of your document. If you want your site to appeal to the largest possible audience, don’t choose dimensions that are too wide or too narrow. A good starting place is 960 pixels wide and 690 pixels high. You can always adjust as you go, but this is a good starting size.

Leave the Color Mode set to RGB Color and 8 bit. Background Contents refers to the background color for your document. Leave it set to White. Click OK.

To help in your design layout, turn on your rulers by going to View > Rulers (or keyboard shortcut Ctrl+R in Windows, Cmd+R on a Mac). Since you’re in a web document, the rulers should display in pixels. Right-click on your ruler and select Pixels.

You can also select View > Show > Grid if you want a grid to help you with your design layout, and you can drag out some guides to assist you in the placement of your design. To create a guide, click and drag from a ruler into your document. Turn on the Info panel (Window > Info) to give you the precise location of your guide. You can reposition your guide at any time with the Move tool, and if you want to remove a guide, simply drag it off the art board.

Now that you’ve set the dimensions, color space, and resolution for your working file, you can easily move ahead with the creation of your web-design mockup.

If you’re interested in more tips for converting Photoshop files into Dreamweaver projects, check out Designing Web Sites from Photoshop to Dreamweaver.

Interested in more? • All lynda.com Photoshop courses

Suggested courses to watch next:Designing Web Sites from Photoshop to DreamweaverWeb Site Strategy and PlanningCreating a First Web Site with Dreamweaver CS5Photoshop CS5 Essential Training

By Greg Chow | Wednesday, February 1, 2012

Lynda Weinman talks to Big Think about building a business

On a recent trip to New York City, lynda.com co-founder Lynda Weinman stopped by the studios of Big Think, an online forum where top experts explore the ideas and core skills defining the 21st century. Lynda spoke about the start of lynda.com, her business-building philosophy, and the value of sustainability over market share.

Lynda’s interview joins Big Think archives that include interviews with Peter Rojas, co-founder of Engadget, Paola Antonelli, MoMA curator for architecture and design, and Emmy-award winning documentary filmmaker Ken Burns, to name just a few.

Check out the features, “Better Than Free: How to Make a Pay Wall Pay,” and “You Don’t Need an MBA to Invent a New Business Model” at bigthink.com, and a few behind-the-scenes photos from the shoot below.

By Greg Chow | Thursday, October 27, 2011

Lynda Weinman chats with founder of Khan Academy

Khan Academy founder Salman Khan was recently in Santa Barbara to speak at the UCSB Arts & Lectures program, and before his public lecture, he spoke with lynda.com co-founder Lynda Weinman about his thoughts on teachers, Khan Academy’s impact on education, and his future plans. Read the full interview at the Santa Barbara Independent.

By Greg Chow | Friday, October 7, 2011

Lynda Weinman interviews TOMS Shoes founder Blake Mycoskie

lynda.com co-founder Lynda Weinman recently interviewed TOMS Shoes founder Blake Mycoskie, who spoke in Santa Barbara in October as part of  Innovation Matters, a new series in the UCSB Arts & Lectures program. Read the full interview at the Santa Barbara Independent.

By Greg Chow | Friday, September 30, 2011

The making of Times Square: LIVE! with Bert Monroy

Don’t miss this opportunity to see Bert Monroy—lynda.com author, teacher, and a preeminent pioneer of digital art—at a live one-day seminar about the making of his spectacular digital painting masterpiece, Times Square. Bert will be demonstrating the tools and techniques used to make the 5-by-25-foot digital illustration of New York’s Times Square. The 6.5-gigabyte image was built pixel by pixel, using more than 750,000 Photoshop layers, over more than four years.

Locations and dates Los Angeles, October 21 New York, November 3 Chicago, November 17

Special savings for lynda.com members Use priority code TMOTSLYN and save $10 off the seminar fee when you register.

Go to Bert’s web site to learn more information and to register for these events.

Watch Lynda’s interview with Bert about the event:

Learn more about Times Square and Bert Monroy on lynda.com:

•  Bert Monroy: The Making of Times Square, The People•  Bert Monroy: The Making of Times Square, The Techniques•  Bert Monroy: The Making of Times Square, The Tools•  Bert Monroy, Digital Painter and Illustrator

Bring your friends! Bert does not travel much or often, and he’s a great teacher and inspirational speaker.

REGISTER by September 30 and save a total of $60 with this discount plus Early Bird pricing!

By Greg Chow | Thursday, July 21, 2011

Photography at lynda.com profiled at The Online Photographer

Mike Johnson talks about his personal experience with lynda.com, and his feelings on our growing collection of photography courses that focus on techniques rather than software. Read the full story at The Online Photographer.

By Greg Chow | Thursday, July 21, 2011

From the unemployment line to self-employed

Andy Brown posts an inspirational story of self-reinvention after being laid off from his job as an IT manager. We first saw this story via Twitter, where Andy wrote “From the unemployment line to self employed thanks to hard work and @lyndadotcom.” So naturally, we had to check it out. And while we’re pleased to get the mention, it truly is an inspiring story of reinvention. Get the whole story from Andy’s post, ‘Reinventing Yourself.’

By Greg Chow | Thursday, May 26, 2011

Live with Lynda webinar on Thursday, May 26

The next installment of the Live with Lynda webinar series takes place today at noon, PDT. Presented in collaboration with the New Media Consortium, this edition will feature lynda.com co-founder Lynda Weinman interviewing journalism teacher Esther Wojcicki. Wojcicki, along with several of her students, will be discussing her innovative methods for teaching journalism at Palo Alto High School.

Topics to be covered include (from the nmc.org web site):

  • Motivation to teach
  • Her unique program at Palo Alto High School
  • The value of project-based teaching
  • Relinquishment of power and control by teachers
  • Creating a relationship of trust with students
  • The difficulties of teaching in a bureaucratic system – overcoming the odds

For more info on Wojcikci (who apparently goes by ‘the WOJ’) and the webinar, check out the Connect@NMC/Live with Lynda page.

Live with Lynda webinarThe Adaptive Classroom: A Conversation with Esther WojcickiThursday, May 26 2011 12:00 pm PDT

Access the webinar in the NMC Connect Adobe Seminar Room

Get the latest news

  •   New course releases
  •   Pro tips and tricks
  •   News and updates
New releases submit clicked

You can change your email preferences at any time. We will never sell your email. More info

Featured articles

A lynda.com membership includes:

Unlimited access to our subscription library courses
Certificates of completion
New courses added every week (almost every day!)
Course history to track your progress
Downloadable practice files
Playlists and bookmarks to organize your learning
Start your free trial

Thanks for signing up.

We’ll send you a confirmation email shortly.

Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

Keep up with news, tips, and latest courses with emails from lynda.com.

Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

submit Lightbox submit clicked
Terms and conditions of use

We've updated our terms and conditions (now called terms of service).Go
Review and accept our updated terms of service.