banner art splash page link
landing page link

go back


Custom Website Development Common Practice



This is a 1st draft and needs polishing

Here are some important things to know that will make the development process easier, faster and better and save billable hours.

There are many free, inexpensive (and some expensive) cookie-cutter sites out there tailored for folks who want to create a website fast and cheap with Content Management Systems (CMS) that provide website creation and updating without much technical knowledge. They have their place, and their pros and cons. They have gotten much better in the past few years with well designed templates and specialist developed and maintained plugins for special features like shopping carts, mailing lists, fancy graphic effects, forums, and many more. The price is you have to learn their user interface, which is geared down for non-technical users and thus very limited, and different for each vendor so what you learn for, say WordPress, doesn't carry over to Joomla.There are other limitations and business practices that I won't put up with.

I am a custom developer with years of experience using the base level website design tools, like HTML, CSS, PHP, MySql, JavaScript, Apache directives, and more. I can do things not possible or requiring those same base level skills, if they are even accommodated. Instead of a catalog of cookie-cutter templates for clients to choose from I have a large bag of tricks for items common to most sites, and more that I spent hundreds of hours developing for other clients, mostly on a volunteer or half-price basis, for special services, like robust full-featured relational databases, election polling and opinion surveys, image archives and more that I can repurpose for a new client and only bill for customizing large blocks of already tried and tested code. I can put up a skeleton site with a dummy banner, footer, trouble report link and roughed in layout design in a few hours, ready to start building page designs, menues, content, and custom features requested by the client.

In a nutshell, if you want to look your best and can afford a custom tailor you won't buy an off-the-rack suit.

My Process

A web page cannot be designed like a print page, especially in these days when there are more small screens than large surfing the net. Designing a web page is like herding cats. It's fluid, will look different on different machines, different browsers and different monitor calibrations. Web page objects, like text, which usually rewraps as the the window width changes, images, which can change size, menues, which can get cropped or switched from horizontal to vertical, and panels containing other objects, which can fly all over the place, are tradeoff challenges, especially for responsive (to screen size) design. The best we can do is try to make the best of a large screen, and stay adequate on small screens. It is possible to detect browser screen size and create custom designs for different sizes, but can be costly, complex, and time consuming.

It is very important to realize and accept that the initial skeleton design is going to be very far from attractive and viable. It's just an empty shell, ready to start filling and refining in close and constructive collaboration with the client. If you're looking for a quick finished site without having to spend serious time working things out with me, I'm not your man.

I generally start by getting to know my client, preferably with a single highly available and constructive liason person with solid understanding of the client's vision, mission and values which will principally guide the development.

At first I like to present, on a non-public staging site, some ideas just to get a reading on what kinds of things appeal, or don't. These are not always ideas I particularly like, just ways to get reactions that begin to shape the design.

As our rapport evolves and I get more of a handle on what kinds of appearance and substance need to be merged into a unified theme for the site I will reach the point where I want to present a more complete wholistic draft with some key elements like the banner, main menu, home page layout, and the important elements and priorities.

Until then, time consuming meticulous positioning and layout tweaks are mostly a useless waste of billable hours.

Only when we have co-developed a promising wholistic draft, or sometimes a choice of alternative drafts, is it time to start refining and polishing the landing page (usually the Home page) and filling out the rest of the site pages.

Some Common Practices and Creative Ideas to Consider

There are 2 kinds of visitors, first time (FT) and returning (RT).

The 10 Second Rule

First, for most websites, the well known "10 Second Rule" is of vital importance. It is nicely discussed here, so I will only summarize: the Home page has only 10 seconds before a first time visitor decides to leave, or stay.

I use a "Landing page" before my Home page on this website to let the visitor quickly know this site is creative, interesting, and aesthetically presented, with the aim of invoking a curious and receptive mind set, and a bit of a challenge in figuring out how to proceed to the site. There is also the "Quote of the Moment" which presents a random qoute from a large archive of very good quotes every time you reload the page. This will keep some visitors, FT or RT, clicking away to see what comes next, which doesn't hurt the search engine ranking where page hits probably count.

Back to the 10 Second Rule, as discovered in Neuro-linguistic Programming (NLP) most of us have a preponderant communication/understanding/motivating style relating to "...our subjective conscious experience...in terms of the traditional senses of vision, audition, tactition, olfaction and gustation." and will often fail to communicate with someone or some presentation with a different style. Of course we all use all styles, just in different proportions.

Sadly, the sense of humor has been omitted, and is essential in any project worth doing. A good joke or zinger lowers blood pressure, uplifts mood, and opens up receptivity to whatever comes next.

NLP has been "...widely discredited among scientists...as a pseudoscience limited to anecdotes and personal testimony...not informed by scientific understanding of neuroscience and linguistics" I agree some of the claims look pretty bogus, but am one of the anecdoters who walked barefoot across a 12 foot bed of glowing coals at an NLP presentation. I know the physics of glowing coals with a coating of ash with very low heat conductance probably kept me, and a few dozen others, from getting fried, but I WAS inspired to try it, empowered by the experience and convinced by personal experiences trying to communicate with mismatched styles, which is the point here. I also got a cool "Fear into Power" T-shirt.

As for the sensory style connection, my experience tells me it is probably valid, and of interest in regard to the 10 second rule. Internet tele-tactile products are already available, smell-o-vision is in the works, and recipe sites abound. These are not of much interest to me, so far, but vision, audition (verbal), and kinesthetic (feeling associated with tactition) styles directly bear on website design. Kinesthetic is the hardest to grasp in relation to a visual and auditory medium, but I relate it to what feelings are invoked when a predominantly kinesthetic FV views/reads/hears what we present.

Here is what I'm getting at: The more quickly scannable items and the more styles addressed on the Home page the better the chance of capturing the interest of more FV's.

This means no long blocks of time consuming text, just short, image and color rich (for the visual visitors), carefully composed (for the verbals and including some drama for the kinesthetics) blurbs of likely items of interest with "More..." links to fuller treatments. All of this of course informed by the site's overall unifying theme.

In keeping with the above, I have a standard Home page design ready to go with as many rows of 3 panels as are needed. The last row will always balance whether it has 1, 2, or three panels. ! would go in the middle, 2 would leave the center space empty. This way panels can easily come and go as the site evolves.

It also means not caging every panel in a box (AKA border), which is just useless, fragmenting clutter that slows the eye down. This frees the use of borders, with, optionally, colored backgrounds, for highlighting the few highest priority items where we want a little dwell time. If everything is boxed, then nothing is more important.

Now the first overall page impact is welcoming, open, airy, free, uncluttered, artistic, well conceived, seriously crafted and inviting for the eye to wander and wonder and to keep scrolling.

Networking strategies and resources should be an essential priority of any site aimed at building a support community.

Visual (and Verbal) Language

Appearance is important, but substance is decisive, and should guide visual appearance, not vice-versa.

Empty space (NOT pure white, which causes sleep and health problems) needs to balance out the layout with some visual relief.

Wide blocks of text are harder to read. 80 characters is about max, but this changes with rewraps, so we have to cater to the widest expected wrap.

Long blocks of text are intimidating. Chunk them down into shorter chunks, and eliminate uncessary words.

Illegible text is stupid. The grey on white fad is insulting to aging eyes, as is tiny text (but at least that can be zoomed in if the vistor knows how).

ALL CAPS IS SHOUTING.

Bold face is useful to highlight key words inline so they can easily be found.

Juxtapositions are important, and highly creative opportinities.

Visual clutter is like using more words than necessary. Every element should have a purpose.

Conveying 3D depth is very attractive. Simple textures, like faint pastel canvas, behind text can work, but not everyone likes this (I do). Tasteful textures surrounding text areas can also be used, especially with tie-ins to content and the site's unifying theme.

Tasteful flourishes of color can save an otherwise dull monochromatic page, again even better if they relate to content, but mood uplifting either way.

First person voice items, especially by the site creators, can turn an impersonal site presented by strangers you've never met into one created by folks who are not afraid for you to get to know them a bit and why they are doing this. This builds trust and good word of mouth. Likewise for first person contributed items. This is why social networking and blog sites are so popular.

Imperatives have their limited place in peacefully establishing righteous sentiments, but not in hard sell "gimme" attacks, like multiple Donate buttons, and should be used sparingly.

Popups and unrequested music or other sounds are a crime against visitor respect.

Main menues are now days simple, unobtrusive, and should provide, first of all, convenience for FT's and RT's. Without overriding reason the menus items should be familiar, require no explanation, and simplify getting at commonly needed information. They should not, without good reaseon, be lengthened by unusual or long item names to signify importance rather than convenience. If it's important, give it a blurb panel and link in the body of the page. A fairly standard lineup I like for donation supported sites is:

I like "Opportunities" better than the 2 word imperative, "Get Involved." It's much more inviting, and there IS a Donate button for convenience.

"go back" and the search box can be part of the menu, or not, but I think "go back" belongs in the menu.

Tidbits

Comments and Suggestions Welcome



net symbol