Searching for clues in web pages and source code.

by WB Shaw and others

There are a few places you can stash information on the webpage. Keep in mind that recognizing hidden information exists is just as important as finding it.

Web Page

Text. Though this one seems obvious, careful analysis might reveal hidden messages in any block of text. Reading the text carefully for clues might not be enough since text can be hidden by making it the same color as the background. Or text might contain hidden or encoded messages created by placing the message into seemingly innocuous prose. Unless you think creatively, you might miss things that seem glaringly obvious like color or font changes, unconventional spacing or line
breaks, or even Odd capitalization. The easiest way to find these messages is by looking for awkward sentence structures and by searching for repeating elements that might form a clue when considered together.

For those jonesing for a puzzle, find the hidden word in the above paragraph. Extra credit given if you found it before I pointed out that it exists.

Non-text Elements. Every graphic, flash file, or media clip could contain hidden links, secret messages or encrypted data.Traditional methods include steganography, pallette manipulation, image maps, and creative graphic editing. Don't forget to check the background image. Information might also be included within the visible images themselves. For instance, Push Nevada had a link www.pushtimes.com in their trailer which is the first (presumably) in-game website.

Layout. Look at the webpage as a whole and see if any elements strike you as being out of place or misplaced. It's easy to miss the forest for the trees. Also, pay attention to how page elements are arranged. Does the arrangement seem natural or were pieces placed differently on a particular page. On a website with several similar pages, do any of the pages have common elements shuffled around or missing?

Links. Links don't have to be text and they don't have to be underlined or change color when your mouse cursor passes over them. The easiest way to find links is to view the source and look for HREF= . Of course, links hidden in flash files might be just a bit harder to find.

Another good way to find a hidden link is by using the tab key. You can press it to highlight all the clickable items on a page (from places you can type text to hyperlinks to press).

Sometimes text that is the same color as the background can be used for hidden messages. To find any invisible text, just do a Control A (select All) on a page. That will select all the text, even "hidden" text that's the same color as the background.

Here's an example from Second State:
http://www.brn4u.com/page13.html

Doing a select all, is the only way to read the text on this page. [editor's note: if accessibility features are enabled to override the background color of a web page, hidden text may appear as normal text and be overlooked as having special meaning.]

Source code

Inspect the source code for the page. Most browsers let you right click the page and then view the source. If the PM has disabled the right-click, go to Edit/View Source on the menu (IE). Look for comments with information and other textual clues.

Structure. While you are in the source code, look at the markup. Are their any patterns? Did the designer use any odd options in any markup tags? Remember that most browsers ignore stuff they don't understand. So the two following code snippets should look identical in most browsers until you investigate the source:

<font color="#ff00ff">Hello World!</font>
<font color="#ff00ff" clue="This aint blues clues!">Hello World!</font>

Frames. Right click in each frame to bring up the source code of that frame. Or put the curser in the frame and use the menu View>Source Code.

Periodically a site that has frames will contain one or more frames that won't allow the viewer to right-click the frame to find the source code or allow the menu function View>Source Code. In those cases, try putting the command view-source:http://(url) in the address line of the browser. Example: view-source:http://www.netsightsolutions.net

Comments. Comments are like notes a designer leaves to make what is happening in the code more clear to others, and are great places to look for game clues. The contents of a comment appear only in the source code. A comment in source code begins with <!-- and can be easily located by using the find menu in notepad.