Web Design References

Web Design Glossary

A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z

S

Samples Per Inch (SPI)
Samples Per Inch indicates the number of data points per inch that a scanner captures (i.e. input). As opposed to Dots Per Inch, Pixels Per Inch, or Lines Per Inch - all of which refer to output. Although most scanner manufacturers refer to Dots Per Inch, they really should refer to Samples Per Inch. Scanners use Charged Couple Devices ( CCDs) to capture information, and they do this by taking a fixed number of samples per inch. The thing to watch out for in scanners is optical resolution vs interpolated resolution. If a flatbed scanner is making claims of higher than 600 DPI, you can be pretty sure that they're referring to interpolation. Interpolation increases the resolution by software. The highest resolution a scanner can capture without interpolation is the optical resolution..
Sans Serif
Sans serif is a a style of typeface without the short lines stemming from the upper and lower ends of a letter that are present in serif typefaces. Sans-serif fonts are usually the best fonts to use for ease of on-screen reading. Verdana was actually created specifically for this purpose.
Saturation
Saturation describes the purity or intensity of a color. Pink and red differ in saturation with the red being the more saturated.
Scalable Vector Graphics (SVG)
A language for vector graphics coded in XML . XML documents can have these graphics placed directly into the document, with many advantages. SVG produces graphics that are smaller, transmit more quickly, are scalable without loss of resolution, can have searchable text labels, and allow links to part of an image. It is being developed by the W3C.
Scanning
In usability, scanning is the process of skimming text and picking out keywords, sentences and paragraphs while skipping over other parts of a web page. People tend to scan web pages rather than read them word by word. Use headlines, bullets, lists and frequent paragraph breaks for items you wish to highlight. These elements will grab a user's attention during a quick scan.
Screen Snapshots
Snapshots are a method where the user takes screen snapshots at different times during the execution of a task or series of tasks. Like most user testing, you provide the user with the site and have him or her perform various user tasks with on it. In addition, you provide the user with a snapshot program and instructions for when and how to take the screen snapshots. This technique is best used in the early to middle stages of development, when you have some working site to be evaluated but are not to the point of requiring full testing. Snapshots are most often used in conjunction with other remote inquiry methods, such as journaled sessions or self-reporting logs.
Screen Magnifier
A software program that magnifies a portion of the screen, so that it can be more easily viewed. Screen magnifiers are used primarily by individuals with low vision.
Screen Reader
A software program that reads the contents of the screen aloud to a user. Screen readers are used primarily by individuals who are blind.
Scope
Scope conformance claims (in WCAG 2.0) can limit acessibile content to some parts or sections of a web site. A site can state that only certain sections are compliant. In other words, all of the other sections are non-compliant. For more information visit About Baselines and WCAG 2.0.
Scope Creep
Scope creep is the expansion of a project beyond its original objectives. It is a term used when clients who don't realize the ramifications, make individual changes and teeny modifications to projects, which can lead to budgetary increases and time delays.
Section 508
An amendment to the Workforce Rehabilitation Act of 1973. The law applies to all Web sites operated by government agencies. It requires web pages to comply with accessibility standards. Under the new law, Web sites are required to structure their design, content and underlying technologies to be accessible to people with disabilities. For more information see 508.
Selector
In CSS, selectors are the parts of a rule that select the elements to be styled with the associated declaration block. They are constructs that identify the elements within your markup that will receive the properties and values you assign. Selectors can apply to a named HTML element, such as <h3> or <p>, an HTML element with a named attribute value, particularly a class or id value. A simple selector is one which matches an element name only.
Semantics
In document markup, semantics relates to meaning. XHTML documents as well as CSS classes and ids should be meaningful. For (X)HTML to be as rich and flexible as possible, use appropriate semantic XHTML tags whenever possible. For example, the <strong> tag has a defined meaning (that the content within is important). Browsers (visual, text, small-screen, speech) use this in different ways as appropriate. The use of markup like <strong>Important text</strong> is a good XHTML semantic tag. It is better than <span class="important">Important text</span> which is more people semantic. In HTML-semantics, browsers (not just people and specially-written software) can understand the distinction, as it is defined in the HTML specification. People-semantics holds meaning for people, and for programs that are designed with knowledge of a specific page, but is meaningless as far as the XHTML specification is concerned. However, when using CSS if an appropriate XHTML tag does not exist, use semantic class or id attributes that have meaning of the element's contents. In fact, adding additional information via CSS class and id is important for writing good CSS. Thoughtfully, semantically named classes, ids, etc. can help set up an (X)HTML document for future transformations and possible storage of data in XML format that can be transformed otherwise in a variety of ways. Examples of names that are not semantic are YellowBar, Blue14pxArial, Box, LeftColumn. BlueArialBlack is meaningless except in the context of whoever maintains the stylesheet and then it would be high maintenance because if you wanted to change that style, content would need to be changed not just the stylesheet. CSS names that are not semantic are of limited value and very error-prone. Use CSS naming schemes that describe content and not appearance, because then the appearance can change without the content changing. Examples of semantic names for classes are RecipeTitle, RecipeIngredient, RecipeInstructions or Author, ISBN, Description, Title, Summary, or NavColumn. They have a level of abstraction. You can use the label over and over and only have to maintain the one external definition. The linkage between a markup container and a stylesheet with a class or id name, can express the semantic nature of the markup's contents, giving the markup document more power, without fouling it with presentational information specific to one context.
Self-Reporting Logs
Self-reporting logs are paper-and-pencil journals in which users are requested to log their actions and observations while interacting with a product. Like journaled sessions, this technique allows you to perform user evaluation at a distance.
Serif
Serif is a typeface, in which each character has small strokes at the ends of the lines that form it. Serifs are found in typestyles such as Times Roman, Palatino, Garamond, and Baskerville. Serif fonts work best on paper because the serifs on the letters help tie all the letters in a word together and create the recognizable word entities (as opposed to a group of individual letters) that we use when we are reading. Sans-serif fonts don't have this legibility aid. So why then don't we use serif fonts on-screen? The answer lies in resolution. Pages will be printed, at the barest minimum of 150 dpi, and more likely 300 dpi on a laser printer. Screens on the other hand are struggling to get to 96 dpi, and the most you can rely on is 72 dpi. This simply isn't enough to recreate the subtlety of serif fonts with any accuracy. Instead, the approximation it gives is somewhat messy and more difficult to read. The advantage of the serif is far outweighed by its disadvantage in this context.
Skip Navigation
A method that allows users to skip repetitive navigation links. This aids people who use screen readers or other types of assistive technologies so they do not have to wait for the assistive technology to work through and announce each of the standard navigational links before getting to the intended content. For more information see Skip Links.
Spacer Images
Also called spacer gifs. These are small transparent images placed on a page, usually in a table used for layout. They help to place text and images on the page for a visual effect.
Specificity
At its essence, specificity is the mechanism by which the rest of CSS works. It is used to determine which selectors are more specific than others, and ultimately which rules will apply to a given element. This basically has to do with the number of elements and attributes in a rule's selector. The procedure involves counting three items.
Standards
See Web Standards.
Standards Inspection
Standards inspections ensure compliance with industry standards. In such inspections, a usability professional with extensive knowledge of the standard analyzes the elements of the product for their use of the industry standard (compliance with University Standards, W3C specifications, etc).
Standards Mode
A recent DOCTYPE that includes a full URI (a complete web address) tells these browsers to render your page in standards-compliant mode, treating your (X)HTML, CSS , and DOM as you expect them to be treated.
Standard Generalized Markup Language (SGML)
SGML is a standard for how to specify a document markup language. It is a meta language because it is used to define markup languages. SGML is not in itself a document language, but a description of how to specify one. It is is based on the idea that documents have structural and other semantic elements that can be described without reference to how such elements should be displayed. The actual display of such a document may vary, depending on the output medium and style preferences.
Statement (Rule)
In CSS, a statement or sometimes called a rule consists of a selector, property and value. The term applies to whatever form the selector takes and however many declaration pairs are present. A style sheet is comprised of statements. A statement has two parts, a selector, and a declaration. The selector specifies which parts of an HTML document are affected by the statement, then the declaration specifies how these selected elements should be rendered.
Storyboard
A Storyboard is a sequence of sketches showing major actions or outlining a process, such as the steps of interacting with a computer or website. They are commonly used in television and advertising. They are akin to paper Prototyping. They are useful for presentations and for checking that the steps of a process make sense once the details are sketched.
Structure
HTML and XHTML are structural markup languages, designed for modeling the structure of information, not its appearance. Structural markup is used to set out the logical structure of a page. The use of structural markup is strongly recommended. Structure is the information components within an HTML document. For instance: headings, lists and paragraphs. Headings should reflect the logical structure of the document (like an outline). H2 elements should follow H1 elements, H3 elements should follow H2 elements, etc. It isn't good practice to skip over levels (e.g., H1 directly to H3). Using heading levels appropriately will ensure documents are more accessible. It's important to use HTML for the purpose for which it was designed - structuring content. HTML is a structural markup language, designed for modeling the structure of information, not its appearance. Technologies like XHTML and CSS (web standards) and appropriate document structure are not the same thing: you can have one without the other, but the real goal is achieve both. As Eric A Meyer has said, "Document structure is like the support beams for a building. The final layout and appearance of the building will depend very heavily on the shape those support beams create. If you ignore that, and assemble the beams with no thought toward the final product (not following the blueprints, as it were), the best you can hope for is an inefficient, almost unusable building. In the worst case, the building will utterly collapse as soon as you try to add anything useful to the structure." 1
Style Attribute
The style attribute sets inline style for a single occurrence of an element. The browser uses the style properties to render the contents of just this one instance of the element.
Style Element
The style element sets style information for an entire document. It goes in the head section.
Survey
Surveys are ad hoc interviews with users, where a set list of questions is asked and the users' responses recorded. Surveys differ from questionnaires in that they are interactive interviews, although not structured like contextual inquiries nor formally scheduled and organized like focus group.
Synchronized Multimedia Integration Language (SMIL)
A markup language by the W3C that allows Web developers to separate the content of multimedia into distinct files and transmission streams such as, text, images, audio, and video. They can then be sent to the users' computer separately, and then reassembled and displayed as intended. For more information visit SMIL.