After creating a chalkboard image out of a photo, we have decided to create business cards. We want to follow through with the same theme. In Photoshop, we open a new document. Because of the bleed necessary for printing, we have to add 0.1” to each side of the document to ensure proper printing. A regular business card is 3.5” x 2”. So we make the new document 3.7” x 2.2”. That should be plenty for great printing. read more

This is the first of two tutorials. We are creating a business card for a teacher who will become a tutor on the side. We want to give her a unique business card, and figure the best way to accomplish this is to make her a chalkboard style front. ...
read more

OK. Now that we have exported our PSD to CSS/XHTML, we can open our HTML file in your personal favorite code editor. I prefer Dreamweaver, however, you can even edit in TextEdit in Mac OSX. Once you open it up, you can see a few things. First, notice the code: <type="text/css"> This is your Cascading Style Sheet link, or CSS. This defines your stylesheet. Because of the way Photoshop exports the CSS file, it is included into the HTML file rather than creating a separate .css file within your folder. Below this code, you will begin to see #Table_01, which in this case is the start of your divisions within the web site. For this particular web site, in the first part of the stylesheet ...
read more

This will be the first of a series involving the building of a web site in Photoshop and exporting it to XHTML/CSS. This is very basic, and as I'm blogging about this, I'm learning more about it too.

As a designer, this method of building the framework of the web site allows for each fixes and good looking, well-designed pages. There are many ways to build a web site, and this is just one of them. And there are a few tutorials on the web that discuss building web sites this way, such as Elegant Templates.

First, we will be working i ...
read more