“Brooklyn” Website

What makes a good website design? Is it visually appealing? Does it look organized? Is it easy to read?

brooklyn.psd has all the words and images needed for the main page of a website. You will organize and design these elements.


Do you want a background color or pattern? If the words are going to be black, make sure you choose a light color for your background. If the words will be white, make sure you have a dark-colored background. If you have a pattern, make sure it’s subtle. You don’t want it to be difficult to read your website.


Design the logo that says “Brooklyn” and decide where and how you will place the “buttons.” You could put buttons running the width of the page across the top, just below the logo, or to the side of the logo. Or you could place the buttons running vertically down the left side of the page. Make buttons readable, but make sure they stand out from the text on the page. Don’t make the buttons too large.


Web pages that use alignment are easier on the eyes, easier to read, and look cleaner and more professional. Mr. Machtay will remind you how to set rulers and guidelines. For a good start, plan a webpage with multiple columns.

Make sure you leave “gutters” between the columns. You don’t want one column touching the next, so you need to leave 10-20 points (pixels) space between columns.


Click inside a textbox and then choose Command-A to select everything inside the textbox (even the words that are hidden). Change the typeface. You can either choose Helvetica, Trebuchet, Times New Roman, or Verdana. No larger than 12 points.


Resize the pictures. Make sure you hold down shift and grab the images by the corners to resize. Make sure you’re respecting the width of the columns.


This design is the model for the page you will construct in HTML/CSS.