15 Essential Checks Before Live Your Website

Your website is designed, the CMS works, content has been added and the client is happy. It’s time to take the website live. Or is it? When launching a website, you can often forget a number of things in your eagerness to make it live, so it’s useful to have a checklist to look through as you make your final touches and before you announce your website to the world.

This article reviews some important and necessary checks that web-sites should be checked against before the official launch — little details are often forgotten or ignored, but – if done in time – may sum up to an overall greater user experience and avoid unnecessary costs after the official site release.

Favicon

A favicon brands the tab or window in which your website is open in the user’s browser. It is also saved with the bookmark so that users can easily identify pages from your website. Some browsers pick up the favicon if you save it in your root directory as favicon.ico, but to be sure it’s picked up all the time, include the following in your head.

view plaincopy to clipboardprint?

1. <link rel=“icon” type=“image/x-icon” href=“/favicon.ico” />

<link rel="icon" type="image/x-icon" href="/favicon.ico" />

And if you have an iPhone favicon:

view plaincopy to clipboardprint?

1. <link rel=“apple-touch-icon” href=“/favicon.png” />

<link rel="apple-touch-icon" href="/favicon.png" />

Titles And Meta Data

Your page title is the most important element for SEO and is also important so that users know what’s on the page. Make sure it changes on every page and relates to that page’s content.

view plaincopy to clipboardprint?

1. <title>10 Things To Consider When Choosing The Perfect CMS | How-To | Smashing Magazine</title>

<title>10 Things To Consider When Choosing The Perfect CMS | How-To | Smashing Magazine</title>

Meta description and keyword tags aren’t as important for SEO (at least for the major search engines anyway), but it’s still a good idea to include them. Change the description on each page to make it relate to that page’s content, because this is often what Google displays in its search result description.

view plaincopy to clipboardprint?

1. <meta name=“description” content=“By Paul Boag Choosing a content management system can be tricky. Without a clearly defined set of requirements, you will be seduced by fancy functionality that you will never use. What then should you look” />

<meta name="description" content="By Paul Boag Choosing a content management system can be tricky. Without a clearly defined set of requirements, you will be seduced by fancy functionality that you will never use. What then should you look" />

Cross-Browser Checks

Just when you think your design looks great, pixel perfect, you check it in IE and see that everything is broken. It’s important that your website works across browsers. It doesn’t have to be pixel perfect, but everything should work, and the user shouldn’t see any problems. The most popular browsers to check are Internet Explorer 6, 7 and 8, Firefox 3, Safari 3, Chrome, Opera and the iPhone.

• Cross-Browser Checks: Services and Test Suites
• 7 fresh and simple ways to test cross-browser compatibility

Proofread

Read everything. Even if you’ve already read it, read it again. Get someone else to read it. There’s always something you’ll pick up on and have to change. See if you can reduce the amount of text by keeping it specific. Break up large text blocks into shorter paragraphs. Add clear headings throughout, and use lists so that users can scan easily. Don’t forget about dynamic text too, such as alert boxes.

• Writing for the web

Read more++++++

Piwik, open source web analytics

Piwik , open source (GPL licensed) web analytics software program. It provides you with detailed real time reports on your website visitors: the search engines and keywords they used, the language they speak, your popular pages… and so much more.

Piwik aims to be an open source alternative to Google Analytics.

Piwik is a PHP MySQL software program that you download and install on your own webserver. At the end of the five minute installation process you will be given a JavaScript tag. Simply copy and paste this tag on websites you wish to track (or use an existing plugin to do it automatically for you).

What makes Piwik unique from the competition:

1. Piwik’s features are built inside plugins: you can add new features and remove the ones you don’t need. If you are a developer, you can easily build your own web analytics plugins!
2. you own your data: because Piwik is installed on your server, the data is stored in your own database and you can get all the statistics using open APIs (publishing the data in many formats: xml, json, php, csv)
3. the user interface is fully customizable: you can drag and drop the widgets you want to display and create a report especially tailored to you!
4. Real time web analytics reports: in Piwik, by default reports are generated in real time. For high traffic websites, you can choose the frequency for reports to be processed

More info+++

Learn JQuery now!

1. jQuery tutorials
2. jQuery docs
3. Learning jQuery
4. jQuery for Designers
5. Learn jQuery Now
6. jQuery for absolute beginners video series
7. jQuery How-To

5+ Steps to Speed up your Website

Here are some innocent tips and tricks to get your website to load faster behind the scenes. Most of them are either simply good practice or tools to help you out along the way. If you have any more ways to speed up your site leave a comment at the bottom of the page.

1. Valid Code

Valid code means that browser doesn’t have to make, create and merge your code to make it work. A page with the correct DOCTYPE and structure will render quicker within the browser, it also helps with browser compatibility.

XHTML and HTML Validator – http://validator.w3.org/

CSS Validator – http://jigsaw.w3.org/css-validator/

2. Reduce the HTTP Requests

As well as the time it takes to download a file off the server it also takes time to request the file, so the less actual requests you make the faster it will be. A brilliant example of this is CSS sprites which combine multiple images into one and use the CSS background property to only show the portion of the image you require.

A Guide to Reducing HTTP Requests – http://www.dailyblogtips.com/speed-up-your-site-reduce-the-http-requests/

CSS Sprites Tutorial – http://css-tricks.com/css-sprites/

CSS Sprite Generator – http://spritegen.website-performance.org/

Read more>>

Creating a Facebook-like Registration Form with jQuery

Facebook is a showcase of great UI design. And as it has become a major part of our lives, it has also raised the bar for web development, pushing developers to meet higher expectations.

This however has a good side – it challenges web developers and designers to better themselves and constantly improve their work.

In this tutorial, we are going to learn from the best, and create a facebook-like sign up form. So go ahead to start learning!

Read more+++

Some Useful Jquery Applications for your Web

• jQuery File Tree Demo – abeautifulsite.net
• FastFind Menu Script – (http://labs.activespotlight.net/jQuery/menu_demo.html)
• Creating accessible charts using canvas and jQuery – filamentgroup.com
• Building a better web forms: Context highlighting using jQuery – jankoatwarpspeed.com
• Color Picker – jQuery plugin – eyecon.ro
• jquery Hover Sub Tag Cloud – noupe.com
• Photo Slider Tutorial – (http://opiefoto.com/articles/photoslider)
• jQuery lightBox Plugging – leandrovieira.com
• Fancy Box – Simple and fancy jQuery plugin – fancy.klade.lv
• jQuery Plugin – Page Peel – smple.com
• PHP & jQuery image upload and crop – webmotionuk.co.uk
• Spacegallery – jQuery plugin – eyecon.ro
• wSlide – jQuery Plugin – webinventif.fr
• Accordion Content script (v1.6) – dynamicdrive.com
• jQuery auto-tabbing and filter plugin – lousyllama.com
• jQuery plugin: Autocomplete – bassistance.de
• NyroModal :: jQuery Plugin – nyromodal.nyrodev.com
• imgAreaSelect – odyniec.net
• jWYSIWYG – WYSIWYG jQuery Plugin – projects.bundleweb.com.ar
• Gradient jQuery plugin – davidwees.com
• jQuery.ScrollTo – flesler.blogspot.com
• jQuery.Preload – flesler.blogspot.com
• jQuery.ScrollShow – demos.flesler.com
• jQuery Lightbox Plugin (balupton edition) – balupton.com
• JQZOOM updated to Evolution – mind-projects.it
• jRails – jQuery on Rails – ennerchi.com
• jQuery Helper for Komodo Media CSS Star Rater (Redux) – m3nt0r.de
• jquery.biggerlink – ollicle.com
• haccordion, a simple horizontal accordion plugin for jQuery – letmehaveblog.blogspot.com
• LavaLamp for jQuery lovers! – gmarwaha.com
• jQuery Image Strip – blog.joshuaeichorn.com
• jQuery Thumbs – joanpiedra.com
• jQuery.flickrGallery – ptflickrgallery.sourceforge.net
• jQuery idTabs – sunsean.com
• jQuery UI Datepicker Project – marcgrabanski.com
• jQuery Flickr – projectatomic.com
• Simple jQuery form validation – willjessup.com
• Farbtastic: jQuery color picker plug-in – acko.net
• What is jCarousel Lite? – gmarwaha.com
• Effect Delay Trick – learningjquery.com
• Interface Imagebox demo – intelliance.fr
• Updated JQuery Nested Tab Set with Demo – blog.cutterscrossing.com
• jCarousel Riding carousels with jQuery – sorgalla.com
• AutoScroll for jQuery – jdsharp.us
• jqUploader Demonstration – pixeline.be
• InnerFade with JQuery – medienfreunde.com
• jQuery Portlets – sonspring.com

Some Helpfull Tools to find broken links in your website

When you are working on many pages lets say 100 to 1000 pages, some times we do mistakes that we forgot to give links for the respective URL’s – it turns to a Broken Link (nothing but a 404 error). It will become a nightmare for the webmaster to get hold of these broken links from those 100 pages. To get rid of these types of head-aches, we have online web tools as well as desktop tools which tells us about where these broken links exists in a page or number of pages. You can easily find out and rectify these types of errors.

Below listed are most widely used tools by most of web masters, and I would like to recommend these tools since this going to help us a lot in finding out these errors very easily:

1. W3C Link Checker (Web Tool)

This is a web tool launched by W3C, this Link Checker looks for issues in links, anchors and referenced objects in a Web page, or recursively on a whole Web site. Link checker is part of the W3C’s validators and Quality Web tools – W3C Link Checker

2. Web Link Validator (Desktop Tool)

This Web Link Validator checks for Site Integrity, Syntax Validation, Automatic Reporting and it runs on any system that is with Windows 98/Me/NT/2000/XP/2003/Vista – Web Link Validator

3. Xenu’s Link Sleuth (Desktop Tool)

It check websites for broken links and links verification is also done on “normal” links, images, frames, plug-ins, backgrounds, local image maps, style sheets, scripts and java applets. It has got many more additional features, if you want to know more about the features, please to click here for the same.

4. Dead-Links.com – Free Broken Link Checker (Web Tool)

Put in your website or weblog home page URL in the input box and a little spider will read the html code and check for the broken links – Dead-Links.com – Free Broken Link Checker

5. LinkChecker 0.6.3 by Kevin Freitas (Browser Add-on)

LinkChecker 0.6.3 is a very good firefox add-on, it check the validity of links of any webpage – LinkChecker 0.6.3

6. LinkTiger (Web Tool)

LinkTiger has got very good features like there is no software installation, just register and find out whether your site has got any broken links, it even scans CSS, PDF, Flash, & MS Office files – LinkTiger

7. Link Checker Pro (Desktop Tool)

Link Checker Pro is the leading solution for website analysis and the detection of broken and other problem links. Link Checker Pro combines powerful features and an easy to use interface and is robust enough to deal with corporate websites containing 100,000 links or more.

Link Checker Pro

Hope the above listed tools may help you in finding out broken link in your site.