Archive for the ‘Lists’ Category

My Fav 5 Simple WordPress Tricks

wp-logoIf are you proficient with Php, HTML, and CSS the possibilities of what you can achieve with WordPress are unlimited. Even if you aren’t a coding or web development guru, there are still many simple things that you can do to improve your WordPress site. There are a countless number of plugins that do just about everything, but there are many times where all you need to do is copy and paste a simple line of code to tweak your site. Here are five of my favorite simple WordPress tricks to change the look, feel and function of your WordPress template.

(more…)

Little Tips to Improve Your Website – Part One

Over the next while, I will be compiling a list of little tips that can improve the appearance, visibility, and function of your website. Here are the first five:

Favicons - Now-a-days, mosts sites use favicons:

Favicons (or favorite icons) are a good way to “brand” your site. Especially with tabbed browsing and bookmark toolbars, they help to visually distinguish your site from others. A favicon is nothing more than a 16×16 pixel .ico file. You can make your own using your favorite graphic editing software or you can use one of the many free online favicon generators.

Tutorials to check out:
How To Create a Favicon (using Gimp) from publisheraid.com
How To Create A Favicon In Photoshop from photoshopsupport.com

Online favicon Generators:
Favicon.cc - www.favicon.cc
FavIcon Generator from dynamicdrive.com - http://tools.dynamicdrive.com/favicon/
Favicon generator from degraeve.com - http://www.degraeve.com/favicon/

CSS Navigation Lists - In my opinion, site navigation should be written in HTML as a list – its just good structure. The use of lists make it possible for visitors to navigate your site if they are using a text-only browser or if their browser don’t support CSS. Plus, well-structured HTML is essential for web crawlers to index your site accurately. In this example from blendetta.com, you will see how the navigation structure stays intact with or without CSS support:

Example: CSS Navigation List

Since most of your visitors aren’t using text-only, non-CSS supporting browsers, you can make a big difference to your sites appearance by styling your navigation lists! As stated in my 10 Awesome Free Resources… article, “Listamatic is the place to go if you are looking for tutorials on CSS based navigation lists”. For a good example of how to make a list like the one seen on blendetta.com, check out Listamatic’s Bulleted Rollover List tutorial.

Get Rid of the Music - Let me restate that: don’t have music on your page that automatically plays when the page is loaded. A lot of people find it to be annoying. You don’t want people to leave your site over something silly like a music player.

Use PNG Images Whenever Possible - Let’s say that your web page has a blue background. You used JPEG images, also with blue backgrounds for your design. What happens when you decide to revise your page and change the background color? Yup. You’d have to change the background color of all of your images. Hopefully you still have the layered PSD file stored somewhere on your computer or you’d have to start over.

If you keep in mind that you may want to make some simple changes to your site one day (ie – change the background!), you should probably save your images as PNGs with transparent backgrounds. Displayed on different CSS styled background colors, here is a PNG of a cat that I drew in Photoshop many years ago:

All I had to do was change the background color of the page from #FF9900 to #990099 - I never had to edit the image. Whatever you do, don’t open that JPEG with the blue background in Photoshop and simply select and delete the background color - it leaves all of those ugly extra colored pixels behind!!

Don’t Junk it Up - It looks nice when a page has a minimal amount of buttons, banners and link images as long as they are well organized. I see way too many blogs with hundreds of link images, “latest visitor” type widgets, and other items that slow down and clutter the page. The content of the site should always be the main focus. All of the items that link to other pages should definitely be a secondary concern. Other things to avoid: adding too many colors, lots of scrolling text and excessive amounts animated anything. You don’t want your page to end up looking like HavenWorks.com!

Part two of the list will be coming soon! And as always - comments are welcomed.

10 Awesome Free Resources For Designers & Developers

10 Free Awesome Resources for Designers and DevelopersColor Schemerwww.colorschemer.com
This site has a gallery of 3,600+ color schemes. If you buy their ColorSchemer Studio software ($49.99) you have the ability to download .cs scheme files or make and share schemes of your own. They also offer a couple of pretty nifty free apps. Personally, I just like perusing the gallery for ideas when I need help finding the right color to compliment what I’m working on.

Listamatic - http://css.maxdesign.com.au/listamatic
This is the place to go if you are looking for tutorials on CSS based navigation lists. They offer great examples and code for everything from simple link lists to flashy, colorful, drop-down site navigation.

Browser Shotswww.browsershots.org
Browser Shots in a free online service that makes screen shots of your web design in different browsers. You can select what browsers, what version of browser, what OS, whether or not Javascript, Java, or Flash is enabled, screen size, and color depth for the screen shots you request. This is excellent for designers who don’t necessarily want to install dozens of browsers on their computer.

Media-Convert - http://media-convert.com
From the Media-Convert homepage: “Media-Convert is 100% free. No software is needed, and you don’t have to register. You only need your favorite Internet browser. Your files are ready 7/7 days 24/24 hours.” This site allows you to covert tons of audio files, video, presentation, document, spreadsheet, etc. files into other formats. You simply upload your file, let them convert it into the format that you request, and then download it. It’s a “must bookmark” site for anyone with a computer!

World Wide Web Consortiumwww.w3.org
No matter if you are brand new to design or you are an old pro, you should definitely have the W3C site in your bookmarks. If you want your page to be accessible to the masses, web standards are very important. This is the site to learn all about them and to see if your site is compliant. The two pages I most frequent are the HTML Validator and the CSS Validator. I’ve heard before that some designers “worry too much” about whether or not their sites are compliant. Personally, I find much satisfaction when I see “Result: Passed” after checking my designs!

W3 Schools www.w3schools.com
W3 Schools is another site that I feel designers of all experience levels can benefit from. It is the largest developer site on the web. You can find tons of tutorials and help. So if you want to learn HTML or if you need help inserting rows into SQL tables, this place has you covered.

XML Sitemap Generator xml-sitemaps.org
If you want all of the major search engines to crawl your site, you need an XML sitemap. With the free sitemap generator, making your sitemap is as easy as typing in your websites’ URL.

Creative Commons www.creativecommons.org
From Wikipedia: “Creative Commons (CC) is a non-profit organization devoted to expanding the range of creative works available for others to build upon legally and to share. The organization has released several copyright licenses known as Creative Commons licenses. These licenses allow creators to easily communicate which rights they reserve, and which rights they waive for the benefit of other creators.” In summary, licensing through Creative Commons allows you to share your creative content with the rest of the world while protecting your rights.

Google Webmaster Central www.google.com/webmasters
Just like it reads at the top of the page, Webmaster Central is “…your one-stop shop for webmaster resources that will help you with your crawling and indexing questions, introduce you to offerings that can enhance and increase traffic to your site, and connect you with your visitors.” You can do everything from enhance your page with Gadgets to find statistics about your site using Webmaster Tools.

Google Appswww.google.com/a
The main reason I love Google Apps is for the email service. If you own your own domain and would like free “@yourdomain.com” email addresses, Google Apps is the way to go. Apps offers you up to 100 address with up to 25 GB of storage. It’s Gmail that uses your domain name, which is really nice – it allows you and anyone else who you give an “@yourdomain.com” address to check their mail via Email Application (POP3) or on the web. Some other useful Apps are Google Docs, Calendar, and Talk.

If you know of any other awesome free resources please leave a comment and share with us!