Posted in Browser, Coding, CSS, Development, Featured, Firefox, HTML 5, php, Plugins, Web Content, Web Design

Like this post? Share It :
  • Print
  • email
  • PDF
  • Google Bookmarks
  • Facebook
  • Twitter
  • MySpace
  • Yahoo! Buzz
  • del.icio.us
  • Digg
  • LinkedIn
  • StumbleUpon
  • Tumblr
  • Reddit
  • Technorati
  • Design Float
  • RSS

5 Minute Website Upgrades: How To & Resources

5 Minute Website Upgrades: How To & Resources
Hey there its 2011! (yeah I’m a bit slow) But it’s time to spruce up your website . What updating your website one of your new years resolutions? Who has the time for that? Good, I don’t either. But my site is looking just a bit stale. So I’ve decided to refine some of the details. I thought I would share some of my upgrades with you. Each of these web site upgrades takes around 5 minutes. So go grab a cup of coffee and give your website some TLC for the new year.

 

Get rid of unused CSS selectors

I just found this AWESOME Firefox extension called Dust me. Its a cool little duster to your bottom right bar in the browser. Click the duster and it animates and then magically shows you which css selectors are not being used on your page. Removing unused selectors might make your site load a bit faster as well as making your code easier to read, edit and maintain. Go download Dust Me and freshen up your css!

Link: http://www.sitepoint.com/dustmeselectors

Bring on the HTML5! New form input types

Did you know that HTML5 has a vast array of new form inputs? I know they can seem overwhelming and some of them have yet to get alot of browser support, but you can use some without hurting those poor old souls who use crappy browsers.

One of the things I’ve geeked out about on The Pagebreak Podcast is the email input type. So the simple upgrade is instead of using < input type="text"/> use < input type="email"/>. That was easy!

Good browsers will recognize the email type and the bad browsers just ignore it and default to the text type.

Link: http://diveintohtml5.org/forms.html

Contact info & Microformats in your footer

Add micro formats to contact info, events. This involves a class name or two, and allows people to add contacts to address book, outlook etc – ical etc.

Link: http://html5doctor.com/microformats/

The Dreaded IE6

As all web designers and developers would probably like to say: F**k IE6!!! Ok… so now thats out of my system why not just say *screw ie6* and give them a basic stylesheet. I recently read Hardboiled Web Design by Andy Clarke. He mentions the basis of a website being the content, so ie6 retains that content and gets minimal styling. Why not just give IE6 users Andy’s IE6 stylesheet!

Link: http://stuffandnonsense.co.uk/content/demo/2009/05/21/ie6.0.3.css

Typography facelift

Use @font face for headlines and/or spruce up your fontstacks. If they have the good fonts they show up. If not no big deal! Font squirrel has a font-face generator as well as a large selection of free fonts for web use. Alternatively there is a lovely and relatively affordable companion site called Font Spring that has a good variety of @font-faceable fonts for sale.

Link: http://www.fontsquirrel.com/ & http://www.fontspring.com/

Use HTML 5 elements

Welcome to the future! It’s in your browser. It’s time to start using HTML5 elements. Not only are they freaking cool… they make your ‘div soup’ I mean… code easier to read! New elements like

Like this post? Share It :
  • Print
  • email
  • PDF
  • Google Bookmarks
  • Facebook
  • Twitter
  • MySpace
  • Yahoo! Buzz
  • del.icio.us
  • Digg
  • LinkedIn
  • StumbleUpon
  • Tumblr
  • Reddit
  • Technorati
  • Design Float
  • RSS

Related posts:

  1. 10+ Free HTML5-CSS3 Website Templates
  2. Best web design resources of August 2011
  3. 50 Must-Read Resources For Incredible Web Design

Comments are closed.