CSS

Public Categories: 
  • CSS

I've received several questions about css backgrounds in the last week or so. I've answered them as they've come in, but I thought a post on the subject was in order. Rather than reinvent the wheel, here's some CSS background resources that are already available.

Public Categories: 
  • CSS

A must read for anyone learning CSS, or anyone who wants to know it better. 70 Expert Ideas For Better CSS Coding | Smashing Magazine. The Organization section is particularly good I thought.

Public Categories: 
  • CSS

Master Stylesheet: The Most Useful CSS Technique. I don't know about the most useful, but definitely in the top few. Few things are more frustrating than working your way through a CSS problem, only to find out the real problem was that you didn't clear some obscure CSS default styling.

Public Categories: 
  • CSS
  • Graphic Design
  • HTML
  • Web Design

456 Berea Street has a nice post on Guidelines for creating better markup today. I the classitis suggestion the best.

Avoid classitis. Does every element you want to style with CSS have a class attribute? They almost certainly do not need to. Use descendant selectors instead.

Public Categories: 
  • CSS

Cascading style sheets (CSS) can be simple, complex, convoluted beyond belief. While CSS is the backbone of modern web design, it's not fully understood by a lot of people using it. I constantly see CSS with significantly more code than is necessary. More isn't always better. I've always thought it was better to just clearly define what you want and be done with it. Consider this CSS:

Public Categories: 
  • CSS

Mikhail Tuknov has written a great article on CSS called How to Use CSS for Search Engine Optimization. His main points are:

  • Cascading Style Sheets Benefits and Search Engine Optimization (SEO)
  • Web Site Accessibility
  • Increases Download Speed of Your Website
  • Cross Browser Compatibility

Go read the whole article for the details. It's quite detailed.

Public Categories: 
  • CSS
  • JavaScript

I got the chance to use the Photo Shuffler I posted about a few weeks ago. It's even better than it appears. Very simple and straight forward. The instructions are commented into the code that you insert into your page. The only trouble I had was getting the existing CSS to quit interfering with the shuffling images. The site I used it on has a subtle border effect on all photos built into the CSS. When the photos shuffle, the photo with it's outline fades out revealing the next photo behind.

Public Categories: 
  • CSS
  • JavaScript

A little bit of CSS brilliance for your day. Using CSS and JavaScript Carl Camera has put together the CSS Photo Shuffler. In the Linked Photo version, it even allows each photo in the shuffle to have a unique link.

Update: I had the opportunity to use this in a project.

Public Categories: 
  • CSS

Do you have a CSS outline or background color that won't seem to go away? The solution may not be undefining something, but defining it negatively. A website that I maintain has a default image style with a double outline effect. This effect is achieved by giving every image in the content section a white background that is made visible by 2 pixels of padding and a thin black outline. The CSS looks like this.

img { margin: 0; padding: 2px; border: 1px solid #000000; background-color: #FFFFFF; }

Public Categories: 
  • CSS
  • HTML
  • WordPress
  • Web Design
  • Web Browser

How often do you visit a website and find that it isn't functioning properly? Lack of functionality is a very common problem that I see. A site needs to function reliably and consistently, regardless of the platform and browser choices of the viewer. Too many designers seem willing to sacrifice functionality in exchange for one web gimmick or another. Building a website is more than just slapping the pieces together and praying. Test, test test, and then do it again. Here is a short list of things that need to be checked. It is by no means complete.

Subscribe to Thoughts on Design: Categories: CSS