You are here: Home > Demo > Manual > Code Editing Overview

Code Editing Overview

As designers and developers ourselves we always want to adjust any tools we download. That's why we've gone the extra mile to try and make Scooch source code as easy as possible to edit and re-use. You'll find detailed comments in the XHTML files, the CSS style sheets and the PHP files.

Scooch Data Objects

Scooch data objects combine XHTML, CSS and PHP. Meaningful XHTML (with Microformats where appropriate) describes the data with semantic markup and a unique identifier. PHP populates the object with data and triggers different behaviour and markup as needed. CSS specificity manipulates the XHTML and adds the design layer to style the object.

For example, the Scooch homepage is a series of unique objects that can be inserted in to other .PHP files easily; making the design layer not only easy to edit but making the data easy to re-use in other pages.

Semantic Information Design Ethics (SIDE) are fundamental to how we work. Objects that have integral and relative value as data are a key part of that.

Naming Conventions within Scooch Objects

Wherever possible each data object is enclosed in a div with a unique logical id value that is mirrored in the PHP function name. All id and class attribute values are verbose in that they are descriptive to help you find your way around the application. We made a conscious choice to use descriptive values rather than optimised, but potentially impenetrable values.

A cautionary note: Some object identifiers and class attribute values are used programmatically by either Javascript or PHP so we recommend you do not edit them or, if you do, edit with extreme care.

Accessibility Notes

Scooch output has been manually checked against both the WCAG (priority 2 plus conformance) and the ATAG. We have deliberately constructed the data objects, along with the document flow, with accessibility as a priority. Although we have been as diligent as we are able to the latest best practice, if you have a personal access need that is not met, please contact us with specific details so we can make adjustments.

XHTML Notes

All Scooch output is valid XHTML 1.0 Strict, served as text/html. Every object on the page has been scrutinised and the markup for each has been carefully chosen for its semantic value in describing the data it wraps prior to being styled. Document flow is deliberate with content first and navigation last for accessibility and optimisation for aggregators and search engines.

CSS Notes

Specificity has been used where possible to select child elements within an object for styling. The CSS is deliberately not optimised and all element selectors are separate so you can see exactly what properties are operating on the markup in a given object at a glance. Again it was a conscious choice between verbose CSS that's easy to edit or optimised CSS that potentially isn't.

Another conscious choice was to use a single style sheet for all styling apart from the rounded object corners. The CSS is error free with one exception: Rather than using a heap of extraneous markup and background images to achieve that simple effect without errors, -moz-border-radius property has been used in a separate style sheet and imported in to css/scooch_objects.css.

Next: Homepage editing and template editing. Have fun!

Top