EatonGolden Design and Development Survival Kit

By Mike McClure
December 2011

It will come as no surprise that there is often a language barrier when communicating the technical aspects of web development to non-technical people. We see it happen all the time – when developers launch into complicated acronym-filled explanations, the marketing folks glaze over and shut down.

This communication breakdown is somewhat inevitable given our interdisciplinary approach to project development. Everybody on the team has a specialized skill set, complete with its own jargon. Since open and clear communication is such an important part of successful projects, we thought it might be helpful to try and bridge the communication gap by putting together a glossary of technical terms.

The following is a list of terms and (sometimes tongue-in-cheek) definitions you may encounter while working with us:

16BUGS DoneDone
After trying everything from Google Docs to Bugzilla to hollering veiled threats across the office, we have selected 16bugs DoneDone as our main issue tracking software. The beauty of 16bugs DoneDone is as much about what it does NOT do as what it does; so many bug tracking tools force QA (Quality Assurance) teams to fill in unnecessary fields and require comments. QA is time consuming enough as it is – nobody wants “high maintenance” software!  We like 16bugs DoneDone because it works like we do: quickly, efficiently, and with direct communication. 

ACCORDION
A Weird Al Yankovich-approved technique in which an element in a group is clicked, and additional content animates out from beneath. If you want multiple elements to be open at one time, see: Drawer

ALPHA
An initial prototype used to show early design and code implementation. It's at this stage that clients get to see their site come to life – it’s our first step after approved designs. It’s a great time to ask questions, and spend some time exploring the functionality. Critical to note: make sure you’re using the alpha-approved browser, because we don’t support all browsers in this phase.

BASECAMP
A web-based project collaboration tool. Messages, comments, files, schedules, milestones…it’s all here. We even have a solar shower.

BETA
A full “first draft” of the site, including all features – and also several bugs. It’s far from perfect, but it is an efficient way to show refined design, code implementation, content, images, and functionality. Like its fish counterpart, never have betas too close to one another.

CACHE
A web browser’s local storage files. Requires “clearing” or deleting to enable newer content to display. Also the #1 excuse of web developers who forgot to make that last change.

CMS
Stands for “Content Management System.” In theory, it’s an environment in which a website’s content can be created and maintained by non-technical users. In reality, sometimes a CMS is harder to use than a lighter underwater – and that’s where we come in. Not only do we offer light CMS solutions that are custom-built to your needs, we have partners who provide large-scale CMS tools that non-developers enjoy using! (Contact us for information about having content management tools that you can actually use.)

CSS
Stands for “Cascading Style Sheets.” It’s an external file that allows colors, fonts, and the size of elements to be stored in a file apart from the code.

CSS3
The latest specification of CSS, which allows for advanced techniques such as font embedding, animation, gradients etc. Requires the very latest web browsers to render properly.

DNS
Stands for “Domain Name System.” The authoritative source for computers, networks, and devices to map to friendly names such as “EatonGolden.com.”

DNS PROPAGATION
When a change to a domain name is made, it can take between 24-48 hours for that change to appear in all browsers worldwide. Did you know? If you visit the domain before the DNS has been changed, it will actually take longer for your machine to show the new site.

DRAWER
A technique in which an element in a group is clicked and additional content animates out from beneath it. Several elements in a group can be opened at the same time. Would you prefer only one thing to be visible at a time? See: Accordion

FLASH
Is not dying, please stop saying that. However, it is true that God kills a kitten every time a restaurant uses a Flash-only site and you can’t find directions or hours from your mobile phone.

GUIDED TOUR
A movie with screen captures that are animated with voice-over and simulated cursor movement. Megaphone optional.

HD VIDEO
Video that has dimensions of at least 1280x720 and completely drains the bandwidth of your web connection while it plays. But individual pixels and pores are visible in HD. So, TOTALLY WORTH IT.

HTML5
The latest version of HTML (Hypertext Markup Language), which is the base coding language of the web. It allows for embedded video and audio without a plug-in, support for animation, and a lean syntax which aids page load time. Requires the very latest web browsers to render properly. This does not include…

IE6
A virus that’s been active since 2001. Safe and easy removal can be found at getfirefox.com and google.com/chrome. Web Developers believe its impact on web development budgets helped cause the recent recession.

LOREM IPSUM
Specific placeholder text used in early page layouts that begins “Lorem ipsum dolor sit amet…” It’s a designer or developer’s way of telling clients, “we know that words will go here but the writing process isn’t complete yet and we don’t want you to be distracted by imperfect content so please just focus on the design right now.” Used in graphic design for decades, this text is formally referred to as “Greek text,” despite the fact that it is actually Latin, and sometimes confused for “Spanish” by the non-initiated. In recent years, lorem ipsum has lost both popularity and respect as other variations of auto-generators have gained popularity and respect. See: hipster ipsum, gangsta ipsum and Samuel L. Ipsum (NSFW unless you work someplace cool like EatonGolden.)

PRODUCTION MANUAL
A group of documents that define the technical development of a project. The production manuals we create (and use) typically include a site map, style guide, IA template matrix, content inventory, content deck, and specifications for interface elements and interactions.

PROTOTYPE, HIGH FIDELITY
Eerily similar to the live site it is simulating in its look, feel, and functionality. If it is really, really good – sometimes it is turned into a real boy, errr website. Did you know sometimes pages in prototypes can rank higher in Google than the real site?

PROTOTYPE, LOW FIDELITY
NOT eerily similar to the site that it is simulating. Instead, a roughed-in approximation of the site that is a useful tool for early user testing and proof-of-concept. Think: instant mashed potatoes. Looks good enough on the plate, but doesn’t fool anyone once you taste it.

RESPONSIVE DESIGN
A technique which permits page layouts and elements to adapt in real time to optimally display on any device. In other words, SUPER COOL.

STATIC WEBSITE
A non-database-driven website that can be used without a web connection. Warning: touching with a bare finger in dry, cold weather can cause a spark.

TEMPLATE
A single HTML page that can be used to create many. If we do our job right (and we always do), the sites we design for a CMS implementation use between 4-6 HTML templates to satisfy the required page layouts.

WIREFRAME
A black-and-white schematic of the intended features and functionality of a given page, similar to an architect’s blueprint. Sometimes mistaken for an actual design if there are newbies in the review meeting. (No, we would never make you a black-and-white site with square boxes, unless you’re a Swiss Design annual.)

Are there some terms you would like demystified? Contact us. We’ll be happy to add them to the list.