Typography with CSS in Dreamweaver: Part 2

Drop shadow effects:

A new property is added by using the 'text-shadow' and then the following four values are put in: an x offset, a y offset, the blur radius and the color.

The second half of the tutorial was a little bit over my head. The topics were: Using Advanced CSS Text Effects, Structuring CSS Text and Defining Lists with HTML and CSS. Seeing how to make the different text effects was interesting and informative but I think it would take some practice to get them right. In the Structuring CSS Text part, the narrator showed how to make a CSS3 multiple column layout. There was a lot of steps involved, but it was nice to see how it was done. Overall, I like these tutorials so far. I don't think I use would everything that they explain but I am enjoying learning more about CSS.

Typography with CSS in Dreamweaver: Part 1

When you make your text bold, it creates a <strong> tag, and when you make it italicized, it creates an <em> tag under the HTML properties. Under the CSS properties, you can change what these tags are supposed to look like.

After switching from HTML to CSS, you are now able to edit or create new rules for your text. 

I also learned a few different ways to change the color of text and how to make semi-transparent text.

Under properties, the man in the tutorial writes rgba(255,255,255

255 is the value for each of the color channels, followed by the alpha transparency level, which is between 0 and 1. The value .5 is used.

How make make drop caps (when the first letter of a paragraph is capitalized and the rest of the text flows around it).

First you need to create a new CSS rule. The narrator says to hit 'Less Specific' and then type in first letter to make the drop cap.

Creating a First Web Site with Dreamweaver CS5

I thought this tutorial would be a good refresher to get back into Dreamweaver. I re-discovered the Page Properties, which I always forget to use. This keep the different font types/colors consistent throughout the web page. The text can also be edited through the CSS Styles panel on the right side of Dreamweaver. Fonts can also be changed by adding a new rule under Rules in the CSS panel. Live view is helpful for seeing how your links will look. I also learned how to use and edit pre-made layouts. I learned how to make and edit a spry menu bar. Overall, the tutorial was a good refresher and I learned some tips and tricks for when I'm ready to start building my website.

Mental Wave Explosion

Tutorial here.

First I opened the road photo to use as my background. I used a layer mask to cut out the guy from another photo, and placed him in the road photo. I made a selection of the guy to create his shadow on a new layer. Then I used the ellipse tool and direction selection tool to create the mental wave shape. I used the clouds tool and used the selection of the ellipse from before to make the clouds only appear within that shape. Then I used the liquify tool to make the shape appear to be bulging. I repeated this step three times. I used the outer glow tool to give the shape its desired effects. I used the elliptical marquee tool to make the shadow underneath the shape and then used the zig-zag tool to create the ripples. Next, I added the truck and created a shadow the same way I made the shadow for the guy. Then I just made a ton of adjustments with the lighting and coloring to make it the way that I wanted.

Good and Evil

Tutorial here.

This tutorial splits a face in half to make a good side and an evil side. First, I used a single column marquee to make the line in the middle. Evil side: First I desaturated the left side and then used the brush tool to make the eye black. I used a concrete texture for the skin and used a layer mask and erased over the eyes and lips. Then I used to burn tool to hollow out the eyes and cheekbone area. The tutorial included a link to a brush set to make make-up smudges on the face. Good side: I used the spot healing brush and gaussian blur to make the skin look perfect. Then I used an elliptical marquee to select the eye and made it a bright blue color. Then I used a star brush and changed the settings to make them look random and put some over various parts of the face.

Chocolate Skull

Chocolate skull tutorial here. The point of this tutorial was to take a realistic skull and make it look like melting chocolate. It was pretty simple (only a few tools were used) but the detail was very important. I started by making the skull black and white and duplicating the layer and making it a chocolate brown color. Then I used the smudge tool to make 'drips' coming from the skull. This was pretty easy but I don't see how the person who made the tutorial made the little ball at the end of the drip to make it look really. Then I added some white for highlights and smudged those out too. Next, I found a cake background and dragged the skull over it. I used the clone stamp and smudge tool to make things blend together. The red background was not high enough, so I found a red fabric texture and added and used the clone stamp and smudge tool again to make it blend.

Flash Writing Effect

I have tried at least four other Flash tutorials before this one and I have been unsuccessful with all of them so I decided to start with something really simple. The tutorial can be found here. I began using a script front to write my name and I used the break apart tool twice to break apart each letter. Then I used the eraser tool and worked backwards from the end of the text, erasing a piece and then hitting F6 to create a frame, and repeating that until I reached the beginning of the text to make it look like my name is being written across the screen.

I can't figure out how to post flash things on here, so here is my Google page and I hope you can open and view it.