VirtualMV/Multimedia/Design/Web/Content

The following web design tips are based on those identified by Buchanan(2007).


 * Who is it for?
 * Who is your target audience?
 * What level of computing experience and computer hardware do they have?
 * What content do you have, and how best can you sectionalise it so as not to over-load any one area of your site?
 * If you're building a site for a client, what are their expectations and requirements? (this phase can take days, even weeks to finalise)
 * Say something
 * Content is king
 * Users can navigate around quickly
 * Build your designs to help navigation. Avoid huge graphics.
 * Minimise page size (including graphics)
 * HTML or WYSIWYG?
 * Learn HTML
 * HTML tools
 * Invest in good HTML editor
 * Design first
 * Spend some time designing your site navigation on paper both how it works and what it looks like.
 * Should be clear, concise, easy to use and carefully planned
 * Get the map out
 * Provide a site map … but … design so you don’t need one.
 * Good navigation answers..
 * Where am I?
 * Where was I?
 * Where can I go?
 * Consider adding a search engine
 * Three clicks, you're out
 * Screening your audience (Responsive design)
 * The most popular PC screen resolution in use today is 1024 x 768. With browser toolbars and other OS clutter on-screen, the designer needs to take this into account when developing sites.
 * Mobile Web browsing is becoming important so your site needs to take this into account if you expect users to view your site on a mobile device.
 * What's your name?
 * keep your naming conventions consistent. Lower-case/Camel-case file names, no spaces
 * Manage your fonts
 * Use CSS
 * If you need special fonts use images but don't forget the alt/title tags
 * Don't embed fonts
 * Attaining balance
 * Try and keep a balance between the amount of text and the number of images on a page. Any more than two screens worth of text is probably too much, and you should consider breaking your page into smaller chunks. No scrollbars in both directions.
 * Use CSS
 * Watch your use of multi-coloured backgrounds.
 * Not-so-greatest hits (your eyes only)
 * Avoid Hit or page counters (If you have a database driven web site you can collect them there or if a public access consider Google Analytics.
 * Avoid frames
 * Use images smartly
 * specify a width and height (allows page to render before images loaded)
 * Reduce image colour and depth and compress
 * Use alt and title tags for images
 * Create thumbails for large images
 * reuse images where possible and check that the same images on different pages point to the same actual file. (e.g. logos) as they are cached.
 * Size does matter
 * Hosting is cheap, data transfer costs
 * Keep file sizes small
 * No more that 10-20 second downloads
 * Visitors you lose
 * 7% if under 7 seconds
 * 30% between 8-12
 * 70% if over 12
 * Not everyone has broadband!!
 * Reduce the number of files,
 * Optimise the file sizes
 * Compress HTML
 * Reduce sound quality
 * Use optimising software (especially if you have pasted from products such as MS-Word, or Internet pages)
 * Keep things simple
 * Saviour of the universe?
 * Use Flash judiciously
 * Use common plug-ins (Quicktime, flash)
 * Use Sound sensibly
 * Flash or HTML5, but remember may not play in client browser, use sparingly.
 * Don’t just use a new effect (it shows)
 * Test, test, test ..
 * Check your work thoroughly (Spelling/grammar)
 * Browser speeds
 * External links on your site – they do date
 * Check no absolute links - always use relative links for your own site E.g. Instead of http://virtualmv.com/webdesign/gooddesign.html use webdesign/gooddesign.html
 * Be consistent with your file names (and therefore links) and avoid special characters and spaces
 * Good v’s evil
 * Check different browsers (IE, Firefox, Safari, Chrome)
 * Don’t expect a page to look the same in every browser
 * Not all Browsers render the CSS the same
 * Don’t expect a perfect solution
 * Design for the one you expect the users to use (and your favourite hopefully), then modify to meet different browsers. Consider responsive design
 * Get others to test your site
 * Analyse this
 * Use an HTML validation tool (http://www.webpageanalyzer.com)
 * Promote the site
 * Use Social Media
 * Use linking from other sites
 * Don't steal
 * use graphics you have created yourself, obtained from a royalty-free source or purchased the rights to. Borrowing or doctoring an image from another site still amounts to theft.
 * Backup
 * Keep copies of your web site. Backup the database if using a CMS. Check the backup works!!
 * No end in site
 * No Web site is ever finished. Its always under construction so don’t point out the obvious!

You may like to think of a web site as something like the Burj Khalifa, Dubai. It will always need work on it!!!

Burj Khalifa, Dubai : (approx US$1.5billion) Exterior completed in 2009, and officially opened Jan 2010, it is the tallest man-made structure in the world and the tallest building by a long shot with a height of 828m. The skyscrapers below the Burj Khalifa used to look tall. Note: previously the tallest building on earth, excluding an antenna, was Taiwan's Taipei 101 at 509m.