CSS Tip: Create effective headline typography
WEB TYPOGRAPHY is effectively the creation of good-looking text combinations using the fonts and style currently available.
To create an effective typography style, the first step is to look at what text needs styling. A typical example is a blog post that consists of a title, time and date and a tagline or intro. The first step is to establish which header tag will be attached to the title and tagline/intro.
For simplicity, h1 is going to be attached to the title, h2 to the tagline line and a class will be created for the time and date. In Dreamweaver, create a new file and add a title, time and date and introduction. Now select the title and head to Properties and select Heading 1 from the Format menu.
If Dreamweaver selects all text go to Code view and copy and paste the closing tag, </h1>, into the appropriate position. Now apply Heading 2 to the tagline text, copy and paste tags as before if necessary. Now go to Text>CSS Styles>New, choose the Tag Selector Type, h1 from the Tag list, Define in (New Style Sheet) and name the style sheet. In the CSS Rule definition window select the desired font, ie Georgia, font Color and Weight and Style if desired. Now apply the same principles to the tagline and create a class via Text>CSS Styles>New>Class to complete.
thats all? am i missing something? wheres the rest of the article?
what does Dreamweaver have to do with CSS? Should you not have done this as a pure CSS article?
Hi Jason. It’s not an article just a quick tip
This “quick tip” has probably been covered in a proper beginners tutorial and is kind of pointless. I was hoping for some more advanced tips/techniques to do with typography, not how to make some text “Header 1″.
Selecting only a primary font can lead to the browser displaying undescinable characters if the partivcular font is not installed on the end users system. I would recommend selecting 3 fonts with a standard basic (such as Arial) as the 3rd in the font-family tag of the css class. Good as a beginners tip :¬)
What's your opinion?