+
+
Alpha Channel Headers
If you export the text and the background as separate files, the text of the PNG version can have transparency around it. The "Week 7" made by John Baumer above is the same on both the standard and + pages. PNG pixels have the same Red-Green-Blue values (RGB) as JPGs, plus one additional value for the opacity of the pixel. The text above is 100% opaque, but the white glow and shadow are less than that.
Better Header Technique
Instead of uploading a single image and placing it at the top, you can change the background of the header to one image and then place a PNG with transparency on top of it. You can change the background to try out different combos very easily that way. It also lets the header go all the way to the edges.
The example headers below demonstrate some features that can make them look exceptional. Yours don't all need to have such radically different styles - just have fun developing your portfolio's "personality".
Drop Shadows
Opacity must be lower than 50% or they can be too dark and affect legibility
Shadow Softness
Size and Spread need to be balanced so the edges are soft so it's not just a second copy of the text.
Outlined Contrast
If you have light text, make a dark outline. Dark text, something bright around it is essential
Transparency
PNG's are arguably the best format because they include an "Alpha Channel"
Shadow Softness
Alpha means Transparency, an opacity value that goes with the Red Green Blue (RGB) hue values
Space to "Breathe"
Keep text away from the edge - it's very easy to cut off part of a shadow or a glow, like left of the V above!
A white glow around dark text (or black around light text) helps ensure legibility even more than the strokes and inner glows used above. Even though you can't see it very well on a transparent or white background, it gives you the maximum amount of flexibility if/when you change the background to other colors or images. Have a test layer or two in Photoshop that you can switch on underneath your text so you know what it will really look like - the checkerboard pattern that represents transparency is not a very good backdrop. Shadows that are barely visible suddenly look very dark and solid when there's a background behind them.
