St. Petersburg Web Design Blog

Posts Tagged ‘CSS’

Three reasons to use selectors as little as possible.

There are lots of articles on how to use selectors to apply styles to a web page.  If you’ve dabbled with this or viewed someone elses code who did this you know it can be quite complicated.   Most of thsoe tutorials and articles  missed a main point – WHY uses selectors at all?

Here’s why you shouldn’t:

1 – Breaks the rules – Selectors are based on the id attribute, each of which is supposed to be unique and not repeated. This kinda defeats the purpose of using CSS if your style unique elements regularly.
2- It messes up your programmer. He needs to use those id and name attributes for other things. He’s expensive. don’t waste his time.
3- It’s already hard enough for others to read your CSS without finding yet another place to set the style rules for elements. Don’t be a player hater and make it even harder for someone to find where you’ve applied a style, or part of the styles to an element.

The short answer – Nothing, yet.

HTML 5 features just don't live up to the hype...

In the short term there is no reason at all for most small to medium web design clients to use the newest  features of the latest version of HTML.  I know this is going to probably rile up some web designers out there so let’s explore the issue a little further.  For some it can be very useful, we’ll get into the those few instances further down.

What is HTML?

HTML stands for “Hypertext Markup Language”  it’s the code that tells a web browser how and where to display what on a web page.  Other programming languages can do this too, but it most cases they are taking variables and logic and outputting HTML to the web browser.  HTML is usually combined with CSS (Cascading Style Sheets) for control the formatting of the HTML elements on a page.  Before CSS was invented HTML was used for the formatting, it still can format the  elements on a page and in some cases, still is.  To keep this conversation simple enough for clients to understand we will speak as little as possible about CSS and the formatting of HTML elements in this article.

Continue reading “HTML 5 – What does it do for the Client?” »

I was working on a project at home today and wanted to set the first letter of the FAQ paragraphs (The “Q” and the “A”) be larger than the rest of the letters. I knew I use CSS to do this quickly and easily, but had forgotten how. It may be a surprise to some of those I’ve taught, but I am not, in fact, able to remember every single tag in every single language there ever was or is currently, pretty close to all of them, but not quite 100%.

I realized tat my CSS reference book was out on loan. Hmmm, I tried looking it up in Dreamweavers reference section, but it wasn’t there. So I turned to the to internet. I was shocked at how complicated some people think this is. Some people use a span tag and then pseudo classes of the span tag. Some people were even using JavaScript! This is how is done, the quick and easy and proper way:
.YourClassNameHere p {font-size: 12pt}
p:first-letter {color:#ff0000;font-size:xx-large}

Feel free to substitute “xx-large” with whatever value is appropriate.
This will . . . well I hope at this point it’s obvious what this code will do.