In traditional software development, it's best practice to gray out options that are not available in the current working context. For example, the menu below from Microsoft Word that has most table options disabled (because a table is not currently selected in the document):
The reason this is considered best practice is that graying out inactive options keeps the list of items in the menu constant rather than ever-changing. This is important for frequently-accessed, globally-available options.
Another example comes from Evernote, which lets you capture and tag notes, storing them in different "notebooks." When I'm viewing a specific notebook, only those tags contained in the notebook are enabled; the remainder are grayed out:
A related design issue occurs on the web when items have differing information available for them. The example below from Epicurious (click to see full-sized) shows there are five types of information available for Caramel Pecan Cookies: recipe, photo, reviews, video, and my notes:
But in a different recipe, there are only three options available (recipe, reviews, and my notes):
When presented with a similar design problem, I've had clients ask me if it wouldn't make more sense to keep the tabs the same but gray out the ones that are not available for the current item. In this situation, I say no. The tabs here are serving more as page-level navigation, which is typically tailored to the specific page content. There is nothing that the user could do on the page that would "enable" the grayed-out tabs - they are never applicable to the item being viewed. In addition, by only presenting the applicable tabs you do a better job of highlight what information is available.




