What's is Quirks Mode?. How does it solve certain problems? What problems does it at the same time raise?

Quirks mode is a way that a browser can interpret CSS. Older browsers have their own “quirks” and to make sure that website pages rendered correctly web designers would have to write CSS with browser specific quirks.
So in the old days different browsers had different CSS.
Browsers were faced with a problem when the W3C published it’s web standards knowing that web designers would write CSS to conform to that standard and browsers would have to render the standard because of all those legacy pages with their quirky CSS code.

To solve this browsers have 2 to modes for rendering pages, a quirks mode for old pages with old quirky CSS, and a strict mode for the web standard version.

The browser would decide on which way to render a page depending on the type or lack of Document Type (doctype).

This is called doctype switching

No doctype triggers quirks mode.

Most doctypes including new or unknown ones trigger strict mode except for some older doctypes that might, depending on the browser trigger quirks mode.

The most common problems for designers are:-

1. Box model bug that occurs when IE is put into quirks mode.
Instead of content width meaning just that as per the W3C standard box model width includes content, padding and border

2. Margin auto is not supported in most browsers quirks mode so a centrally aligned website may move to the left.

3. Images can have extra paddng at the bottom

For a full list of quirks mode problems and which problem affects which browser go to www.quirksmode.com

Explain the advantages and disadvantages of both fixed and fluid web page layouts from a design perspective.

Fixed width is:-
A fixed width is one where the main wrapper is set to a specific immovable width that remains the same no matter the users browser window size or screen resolution.

Fluid width is;-
A fluid or liquid layout is created by not specifying a wrapper width at all or doing so by using percentages as the units of width. So a 100% width will use all of the width of the browser window.

Fixed width

Pros
The overall design can be controlled and be just like the way the designer intended.
It is easier to design for content that is fixed width such as videos, adverts, and images.

The overall design can be controlled and be just like the way the designer intended.
It is easier to design for content that is fixed width such as videos, adverts, and images.

Cons
Small resolution screens end up with a horizontal scroll bar.
If you accommodate small screens and use a narrow width then larger screens will see a lot of white space.

To get round some of the cons most designers will centre the layout (using margin 0 auto) and using either 760px width for 800pixel wide or 960px for 1024 pixel width screens.
Also to include different style sheets for different media types such as mobiles and at the other extreme projectors.

Fluid
Advantages in certain situations
can be constrained with max width, min width property, does not include padding borders or margin,
Max height and min height does not include padding, borders, or margin
By using a mixture of width, height, overflow, and max, min we can take control of both fixed width, fluid and fixed/fluid layouts

Pros
Fluid can be more user friendly because it adjusts to the users set up.
If designed well can eliminate horizontal scroll bars that appear on small screen sizes.
Also with wider screens more or all of the content will appear on the screen above the fold and so there may be no need for vertical scrolling at all.

Cons
The designer has less control over what the user sees
Elements that usually have a fixed width such as images, video may have to be set at multiple widths to accommodate different screen sizes.
Lack of content on large screen sizes may create a lot of white space and long unreadable paragraph lines.

To get over this a web designer can use the max width min width properties, and so the layout within it’s and max and min width fills the browser space available but beyond these limits it behaves just like a fixed layout.

Only one slight drawback in that earlier versions of IE don’t support it.
But as time goes by this is less of a problem.

In conclusion the design decision will come down to a balance between the users needs, the site owners requirements and what sort of content is to be included.

What is RSS? How is it used, and why is it an important aspect of Web Design?

RSS or Really Simple Syndication (and sometimes called Rich Site Summary) is part of the Web 2.0 movement that gained momentum from 2004 onwards.

RSS is a family of formats use to publish frequently updated works such as blogs, news, audio and video in a standard format. The content of the RSS document is marked up in XML that can be read by software called an RSS reader. RSS Readers can be on a computer or other devices such as mobile phones.

The Users can subscribe by clicking on the RSS logo on, their favourite websites and could be news, blogs or any sort of multimedia site and receive updates or aggregate those updates into one place.

For the author it is good because they get their story or article repeated many times over or syndicated so they reach far more than they would normally.

For the web designer has to consider that as new articles are published the size of the area allocated to the RSS feed can grow or shrink and this can interfere with the look of the page. Common ways to solve this problem are:-

1.To fix the height of the space (DIV) with some white space at the bottom of the feed allowing for the content variations.

2.Fix the height of the space (DIV) and have an automatic height scroll appear if the content is too large.

3. Have a completely liquid layout and accept that the layout will change as the size of the feed content will change.


Another consideration is page load speed. It is best to have the RSS feed low down HTML code so other easy and fast loading simple text and other visual elements can be loaded, and viewed by the user if the feed content is slow to load.
Nothing is more frustrating than waiting for a page to load.

For the web designer it would be good to have some fast loading plain content at the top of the page that will keep the user busy until the RSS feed(s) have loaded.

Top 10 Reasons to Use Social Media for Business

Research published by analyst firm Access Markets International Partners shows that almost 70 percent of small and medium businesses actively use social media sites such as Twitter, Facebook and LinkedIn to promote their companies. But simply posting what your CEO had for lunch isn't going to do much to help move your business forward. Smart companies are tactically using social media tools to increase their exposure to potential customers.

I've compiled ten of the most compelling reasons that you should consider using social media tools to promote your business.

1- Brand Recognition: Using social media allows your company to reach the highest number of potential customers possible. Getting your name out there is incredibly important - studies have suggested that customers need to hear a company's name at least seven times before they will gain the trust and respect needed to become a customer.

2- Brand Monitoring: Having a social media presence allows you to better understand what current and potential customers are saying about your product or services. Through active social media monitoring, you have the opportunity to address negative comments and correct false or inaccurate information about your brand.

3- Be Forward-Thinking: Your target audience is becoming savvier when it comes to the using social media sites in their daily lives. If you want to appear relevant and in-step with the latest advances in technology, your potential customers will want to see you on these sites as well.

4- Find New Customers Through Friends: You shouldn't neglect your personal social media accounts as potential avenues to promote the activities of your business. Posting regular updates relating to your business and activities can remind your friends of what your company does and either to use your services or refer one of their friends.

5- Find New Customers Through a Company Profile: Your company profile is a great opportunity for you to post regular updates on your activities, but also about important news and trends in your industry. This will catch the attention of new customers interested in your industry and increase your reputation as an expert in the field. It's critical to post regularly if you want to increase your followers or fans and convert them to potential leads.

6- Generate Site Traffic: By updating regularly on sites such as Twitter, Facebook and LinkedIn with posts that link back to your site, you can create additional traffic to your site. Social media bookmarking tools like Digg, Stumbleupon and Slashdot can also generate additional traffic to your site if you create frequent articles and blog posts.

7- Links for SEO: Many social media bookmarking sites use NOFOLLOW tags that limit the outbound link value of posts made on their sites. There are still many leading social media sites that allow DOFOLLOW tags including Slashdot, Digg, Furl, Mixx and FriendFeed. However, you can see benefits from posting to social media bookmarking sites that use NOFOLLOW tags if people read your posts and link back to your Website.

8- Increased Search Engine Rankings: Social media profiles frequently rank highly with major search engines. Using brand names and keywords in your profiles can help you to generate traffic for your social media sites and company homepage.

9- Integrated Social Media Results in Search Engines: Search engines like Google and Microsoft Bing are increasingly interested in indexing and ranking posts and other information from social media sites. Videos from popular Internet sites like YouTube can also be optimized for indexing by the major search engines.

10- Niche Marketing: Social media allows you to reach very specific subsets of individuals based on their personal preferences and interests. You can create social media strategies based on reaching individual interests or even create unique social media profiles to target these audiences.

How to treat clients badly - fourteen ways

There are a great number of ways to manage website projects, but regardless of your management style, there are behaviours that you should learn to avoid as much as possible. Steering clear of these pitfalls will not only allow you to get through projects on time and on budget, but will leave a very good impression on your clients, and win you more work in the future.

Let Interruptions Dictate Your Schedule

Too often we allow ourselves to be distracted from what we need to be focusing on right now. Mostly it’s unnecessary to jump on every new email immediately; issues can usually wait until we’re done with the current task.

As a project manager, you’ll most likely be in charge of multiple projects and employees at the same time. It’s important to have a system that allows you to have a lot on your plate and still be on top of things. This could include creating a priority list when you check your email/voicemail messages, or when you’re available for meetings. The key here is to make sure you get done what needs to be done.

Don’t Communicate Clearly with Your Clients

The way you communicate through email and voicemail will be reflected in how clients perceive you. This can include both the clarity and conciseness of your writing, as well as spelling and grammar. Often I’ll re-read an email three to five times before I send it out, just to make sure I catch any remaining glitches.

Keep in mind that clients typically respond better to shorter emails and voicemails. Write short, focused messages that communicate key information and action points. Sometimes you need a long email to clearly explain an involved concept or process, but as a general rule make a consistent effort to trim the fat.

When I have a choice between a phone call and an email, I usually stick to emails, as they provide a communication trail that I can access later on. This is especially valuable when dealing with clients who are busy and forget to read the email, because you can go back and resend it at a later time if necessary.

Keep Your Clients Guessing

Nobody likes to feel out of the loop. The more time you spend in making it clear to your clients what your team is working on, the more they’ll appreciate your work.

All this usually takes is an email letting them know what you achieved today or in the last few days, and what your team is going to work on next. I also find this is a great opportunity to remind the client of anything you’re still waiting to receive from them (content or images, for example), and the timeframe within which you need to receive it in order to avoid holding up your process.

If You’re Not Going to Meet a Deadline, Don’t Tell the Client

As I outlined in the previous point, this scenario can be prevented by doing a good job of keeping the client in the loop. If you do find you’re going to be unable to meet a deadline, make it very clear to the client why this is happening.

Say that you originally thought that integrating a new API was going to take two hours, and it ended up taking eight hours. The client should be made aware of this as soon as it happens. You could word it like this: “We originally thought integrating X was going to take 2 hours, but we had issues making their examples work and it ended up taking much longer than we anticipated. I do apologize for the delay, but we’ll do our best in making up the lost time.”

The client should be made aware of any delays that will affect a deadline well before that deadline. If you end up telling the client this on the day of the deadline, then you’ve spent too little time planning and communicating to the customer what your team is doing or of any delays you’ve encountered.

Always Underestimate the Resources Needed for a Project

The scenario: Client A wants a website “just like Facebook,” but is only willing to pay $5,000 for it. We think we can cut a few corners to make this happen, and so we agree to do it for $5,000 to keep the client happy. What happens is that the project takes much more time than we’d originally thought it would, and either our company ends up wearing the cost of the extra time spent on the project, or we displease the client when they receive a finished product at odds with what they expected.

This can be prevented by doing a good job in estimating the time and cost of each element in a project, and being honest about the scenario when speaking with the client. If your client thinks you can build a site like Facebook for $5,000, perhaps you could be doing a better job helping them understand how much time goes into various elements of site design and development.

Another option is to present them with a realistic estimate of what can be done with their proposed budget, and possibly come up with a plan that includes a series of development phases. This way, they can kick-start their project with the budget they have, and then expand on it later when more funds are available.

If a Client is Being Rude, Respond in Kind

it’s always in the best interest of your company to be professional. If a client is growing agitated over the phone, it’s advisable to say something like: “I’m sorry to hear that this is happening. My team will look into it immediately and get back to you.” Having a shouting match with your client will usually end badly, and could potentially land you in trouble with your boss. Knowing when you’re becoming too worked up takes a level of maturity and professionalism. By realising your error at the time, you can make amends to turn the situation around and please the customer

Never Admit to Making a Mistake

Most clients won’t be upset with you if you make a mistake, as long as you’re honest about it and take steps to avoid the same problem happening again. They understand that you’re human and will make mistakes. The key is to avoid making the same mistakes over and over again; otherwise, your apologies will be hollow.

Usually, just explaining to the client in an email what happened is enough to satisfy them. Making sure to fix the issue immediately will give you bonus points in the eyes of your client, because that communicates that you care about what you do.

If you’re giving your client access to an area that you’re still working on, or that you know has bugs, you should clearly communicate to them that it’s a staging area, and that your team is still ironing out the bugs. If there are major bugs, it’s a good idea to let the client know about them specifically, so that they won’t have a panic attack when they come across them.

Shift Blame to Someone on Your Team

If you’re a project manager, you’re responsible for your team. If a team member makes a mistake and you fail to catch it before the client, it’s ultimately your fault. Your instinct to shift blame might come from trying to protect the client’s image of you personally, but more frequently it will have the opposite effect. Trying to shift responsibility for mistakes just makes it look like you’re not paying attention to your team’s work.

You should, however, still talk to the team member about their mistake. But think about it from the client’s perspective: they just need to know that you’re in control of your team. The occasional slipup won’t hurt the client’s perception of you in any significant way. But pay very close attention to the mistakes your team members make, and ensure they’re learning from them.

Furthermore, each and every person on your team needs to earn your trust, so that you feel comfortable taking full responsibility for their work in your dealings with clients.

Don’t Double-check Your Team’s Work

We’re all human, and on occasion we’ll make mistakes. But part of being a project manager, as I’ve already outlined, is taking responsibility for the team’s work. And that means ensuring that as well as being bug-free, the site also works the way the client expects it to work.

Project managers need to connect the dots in ways that their team may miss. Does the gallery do everything the client wants it to do? What exactly is listed for this area in the agreement? Is the site compatible with the major browsers? Running through a simple checklist like this will not only make sure that the project meets the specifications of the agreement, but allows us to improve on the work that our team produces, which ultimately reflects on us.

Spend Very Little Time Writing Emails

A quickly written emailto which little attention was paid can be easy to misinterpret.

You want to ensure that you’re clear and concise in your emails. If you need the client to send you anything, make sure to outline everything you need in a numbered list. The same goes for any questions you have. This makes it easy for them to respond via email, because they can reference each of your inquiries by number. Never put a bunch of questions or requests in a paragraph, as they’ll frequently be missed.

If you need to receive an item before you can continue work on part of the project, make this very clear in your communication with the client. In fact, I suggest bringing this up multiple times. If these factors will affect a deadline, make that clear to the client. For example, you could word it as follows: “Please keep in mind that if we’re still going to make the 2/10/2010 launch, we’ll need to receive the content for the website by 2/2/2010.”

I always aim to sound gracious when writing to a customer via email. It might take a little bit more time to achieve the right tone, so that you’re sure it won’t be misread, but avoiding misunderstandings with your clients is well worth the effort.

Don’t Get to Know Your Team

If you’re managing a team, it’s your responsibility to understand the strengths and weaknesses of the team, as a whole and of each member. Managing a project shouldn’t be like a game like Russian roulette, where you’re never sure what your team is going to produce. As project managers, we need to do put ourselves in a position to succeed. Below are a few questions that may help you:

• What does this team member’s code look like?

• Will they be able to complete their part of the project on time?

• How reliable have they been in the past?

• If they fall behind, what is my backup plan?

• Does it make sense to have this team member work on a project that is this complicated?

• Have they worked on other projects with a similar level of responsibility?

• Will it be more work for me to have them work on this?

Assume Your Team is on Schedule

A project that was on time last week could suddenly find itself well behind schedule, because an element that you thought was done properly turns out to have been botched, or because a team member misunderstood what needed to be done.

Set up firm deadlines for your team, but give them some cushion for any unexpected items that arise. Make sure that your team members clearly communicate with you if they’re unable to meet a deadline, and train them to do this long before the deadline arrives. Make it very clear that you’re okay with them asking you questions on a project, and that you would rather have them ask more questions than to assume.

With a big project, this becomes even more important, because being behind in one area could affect the whole project. Make sure you’re doing a solid job on what should be prioritized. If half your team has to wait on one team member to achieve what they need to do, that item should be on top of your priority list so that no time is lost.

Don’t Create a System to Remind You to Contact Clients

If you’re managing many different projects, and you have a long list of clients that you’ve worked with in the past, it’s easy to lose track of who’s waiting on an email from you. You need some kind of system that allows you to know who you need to contact. This could be as simple as having a folder or label in your email system for emails that require a response. That way, when you want to play catch-up, it’s very easy to determine who’s still to be contacted.

It looks extremely bad if you constantly forget to respond to client emails, or if you’re slow in getting back to people. Even if you’re busy, you need to let your clients know when you expect to be able to deal with their query. I have found this method to be very effective, and it gives me some extra time to prioritize and figure out what I need to jump onto next.

Come into Meetings Ill-prepared

Even if it’s difficult to be 100% prepared for everything in a meeting, you should never go into a meeting unsure of what you’re going to say when they ask you about specifics on the project. If you’re asked for a detail you’re unsure of, let them know that you will look into it and get back to them later. Don’t make promises that are impossible for you to keep, or that you’re unsure about, even if they push you for answers. This includes deadlines and timeframes.

In whatever you’re talking about, be confident. You’re the expert in your field, not the client. But just make sure you’re very deliberate in what comes out of your mouth. The main objective of the meeting should be to convince the client that you’re in control, and that they made a good choice in going with you. Even if you’re behind, or if something went wrong, how you word it can determine the success or failure of the meeting.

I have found thatin most meetings that happen during the course of a project, the client is mainly looking for reassurance. Do not give them any reason to doubt that it’s all under control, and you’ll have a happy client who loves to work with you!

We all make mistakes, and the area of managing web projects is far from immune to human error. But if we’re deliberate in learning from our mistakes, and learn how to improve on what we’ve done in the past, we can keep our clients, bosses, and team members happy, and lead our projects to success.

How do you know if your web designer has done a good job?

Or how do you know if your mechanic has done a good job on your car?

You get a second opinion.

One place to get a second opinion is with the World Wide Web Consortium's (W3C) Markup Validation Service.
This will check for errors in your website's code.

Go to W3C validation Service

Just like your car, your website can look fine, but how much trouble are you storing for yourself if it's not done right?
And did you really get value for money if what was done was full of errors?

I have blogged about standards and accessibility before but alot of people are really interested in how well their website code is read by search engines such as google.

I was asked to code a re-design of the home page for social networking site All Join On.com but before I could start work I actually ended up spending a day correcting the errors made previously by professional web designers.

It makes it far easier for me now to code the re-design knowing that the existing design works properly. If there is an error in any of the new code that I add I can find it quickly rather than it being buried amongst 200 other errors.

More details of this work is on my website.

SEO explained

The importance of Google
As the number one search engine in the world, Google is a harmony of both simplicity and intricacy that appeals to casual web users with its easy-to-use interface, yet also leaves web developers in marvel over its algorithmic mastery.
From prominent e-commerce sites, to the newest online startups, the benefit or detriment
of online businesses rests in the amount of search engine traffic received from Google.
The key to online survival is achieving high rankings, but even the best web developers lack Search Engine Optimization (SEO) knowledge and experience.

Thus, I'd like to take a moment to provide you with an overview of SEO, and briefly show how I can make it work to your benefit.

What is SEO?

By definition, Search Engine Optimization is the process of improving the volume and quality of traffic to a website from search engines via search results for certain keywords.
Typically, the earlier a site is listed in search results, or the higher it "ranks", the more searchers will visit the site. SEO can also target different kinds of searches, including an image search, local search, and industry-specific vertical search engines.


How does it work?

SEO employs a variety of techniques, mostly geared towards determining how search algorithms work and the type of searches being conducted. Site attributes like coding, content, and structure all play a role in impacting SEO.


How can it benefit me?

SEO is not merely a supplement to a website. Rather, it is a rapidly growing web standard that has taken form to direct traffic in the online marketplace.


What does SEO involve?

The first concept one needs to understand is that Google is capable of closely monitoring the SEO activity of millions of websites, and the framework and rules set forth by Google can both help and hurt a site.
Put simply, Google is remarkably intelligent, and as a result there are no shortcuts in content-based, non-pay-per-click SEO. There are no quick and underhanded ways to instantly make a site leap to the first listing on the front page of a search overnight. There are no loopholes or exceptions, and even if by chance you’ve found one and take advantage of it, it’s only a matter of time before Google finds out and your site may be blacklisted.


SEO Basics

There are a number of SEO-specific techniques that web developers can put to use in order
to gain better search rankings.

Copy is King:
Unique and original content that is optimized and enhanced for SEO purposes is one of the most reliable and surefire ways to ensure that search engine robots will notice your site.
Factors such as structure of language, choice of copy, and even presentation are all taken into consideration. Thankfully, these qualities can be tweaked for your benefit while also making your site more generally appealing to users in the process.

Code Optimization:
Google visits millions of sites when conducting its indexing process, and as such can overlook sites that take longer to load due with condensed and sloppy coding, or overused style properties that make navigation a clunky affair.
Standard HTML has a reputation for being dense and heavy, so a website’s code needs to be as light as possible since long loading times for the user translates to long loading times for Google.
Fortunately, new standards in web design can clean up the clutter. In particular, choosing Cascading Style Sheets (CSS) to design your website keeps the code light by keeping all of the style properties in one place, allowing for less code repetition, and also making it easier to add new content.

Content Optimization:
Dead are the days when SEO was simply about loading up code with META tags. Now every facet of a site from title tags and images, to copy placement and text formatting have an
impact on not just SEO, but also how you wish your site to be presented to both Google and web users. Cascading Style Sheets have quickly become the cutting edge standard for both an SEO-friendly design, as well as faster production of visually stunning web pages.
Additionally, because all of the graphical aspects of design are controlled by one central style sheet, the code volume is dramatically reduced, allowing for more efficient pages.
In today’s World Wide Web, most of the pages you see owe at least part of their appearance
to CSS, including this one, while on the horizon are even greater programming and designing tools that will put out more amazing results than CSS.

Keyword Optimization
A large portion of optimizing your content involves choosing the right keywords for your site. Keywords are essentially any words or phrases that user may search for that would draw them to their site. However, while finding out keywords may seem as simple as picking a few relatable terms, one also has to take into consideration competition and search volume.
From a contextual standpoint, it may make sense to use certain keywords for your website,
but just how high is the search volume for those keywords? Also, a keyword may have a high search volume, but the advertiser competition may be so great that your relatively smaller website may not be able to compete with bigger sites.
At any rate, once the appropriate keywords are chosen, web pages need around 300 words of
quality content, enriched with your keywords. Never include a keyword in the copy that isn't mentioned in the Keywords META tag, and never include a keyword in your META tag
that isn't included in your copy. Also try to include keywords in your title tags without
making it look overly blatant.


External SEO
Your ranking may increase in Yahoo and MSN with the techniques already outlined, but for
Google, you will need links on your site, and as many of them as you possibly can. This is called external SEO, and it can make a huge difference for your online presence.
One way to do it is to write articles and arrange for them to be posted on other websites
with a link back to you. Blogging is another example of how you can garner attention, both from the search engines and from potential customers.
This leads us to the toughest part of the Google SEO process -- back links. Back links are
websites that link directly to your website. The general principal is the more back links you have, the higher your pages will be ranked, as the consensus is your page is more
important if so many links are pointing to it.
Submitting your site to dmoz.org, Yahoo! and other directories can increase the number of sites linking back to yours; however, one issue is that setting up back links takes time. Emailing 5-10 websites each and every day to request back-links or partnership links is recommended, but also remember that the sites contacted should be relevant but not competitive.

Do It Right
There’s no room for slackers and cheats when it comes to Google. There is no easy way out,
and no foolproof method for getting to the top ranking instantly.
Though many sites may try resorting to shady tactics such as “black hat SEO,”
“spamdexing,” or keyword and link stuffing, these can actually harm search engine results,
and Google may remove them from their indexes altogether. The bottom line is that Google
wants quality websites where the appropriate amount of work has been devoted to SEO.
Give Google its fair due of credit for being an intelligent, well-crafted search engine tool and it will reward you with a higher ranking. There are rules and guidelines that
have been set forth for achieving strong results, some of which can be bent, but ultimately sites looking for more traffic want to adhere to these mandates.

Full SEO explanation.