Blogging Basics: Blog Design Part 3

Building Your Design

Everything I know I learned from (free) online tutorials. Want to know how to do something specific? Google it. That's how I eventually found this website, which has lots of great tutorials (as well as a list of blog designers, if you're feeling like you don't want to tackle this beast on your own). There are a lot of people out there who actually know what they're doing and they're willing to share their knowledge with the world. As opposed to me who has no clue but is pretending to be an expert anyway.

For research purposes I have been spending some time with Pixlr and have been super impressed. For my example design I'm going to use Photoshop but you can do just about everything I'm doing in Pixlr instead (which is freeeee). If you're wanting to do your own design and don't have Photoshop, I recommend you hop on over and start familiarizing yourself with Pixlr and its capabilities.

Also, it has come to my attention that stuff I consider basic common knowledge is perhaps not that basic and not very common. I'll be writing my tutorials accordingly (and likely including a lot of outside links to people who have already explained things better than I can. Explanatory links will be marked with *). If you know some HTML and stuff then some of it will probably be old news to you.

File Types

I originally put this bit in an upcoming post but that post got super long so I'm moving it here-

I mostly work with 3 different file types:

• .psd - layered* Photoshop file. Pixlr has an equivalent (.pxd). I probably won't be talking much about these but if you're creating elements for your design, make sure you save two versions. A .psd (or .pxd) that has all the layers (which makes for easy editing later if you need to make adjustments) and a .jpeg or .png for uploading.
• .jpeg - basic image file
• .png - file with transparency capabilities

 I want to very quickly address .jpeg vs .png files. If you have a non-rectangular shape and save it as a .jpeg file then it will automatically square itself off and give itself a white background. A .png file will have a transparent background. These arrows are the same, but I saved one as a .jpeg and one as a .png then put them on a patterned background.

I'll be working with both types. Also, just FYI, I've noticed that Blogger supports .png files on the design side but NOT in blog posts themselves.


Step by Step

As soon as OTI wraps up (more about that tomorrow!) I'm going to take you through a blog design, step by step. I held a kind of impromptu giveaway on my Facebook page a couple weeks ago and randomly selected a winner to get a free blog design that I could use as an example. It's shaping up to be a pretty awesome design so I hope you'll come check out the process!