10 COST EFFECTIVE WEB DEVELOPMENT TECHNIQUES

OR: HOW CAN I MAKE THE BEST USE OF LIMITED DESIGN AND DEVELOPMENT BUDGETS IN THESE INCREASINGLY CHALLENGING ECONOMIC TIMES?

I’M DREW MCLELLAN EDGEOFMYSEAT.COM ~ @DREWM I HELP PEOPLE BUILD THINGS ON THE WEB

SOMEWHERE OUT THERE LIES A WORLD OF

LIMITLESS

BUDGETS

WHEN BUDGETS ARE TIGHT EVERYONE

WORKS

HARDER

FA S T E R CHEAPER BETTER STRONGER WITH FEWER RESOURCES AVAILABLE

SOME TECHNIQUES ARE TECHNICAL BUT MANY ARE ABOUT WORKFLOW

HERE’S THE TIPS PRESENTED IN NO PARTICULAR ORDER

1 WRITE A COMPREHENSIVE SPECIFICATION FOR YOUR PROJECT

A GOOD SPEC DOES TWO THINGS LIMITS SCOPE

ENABLES EFFICIENCY

&

THE EASIEST PLACE TO CONTROL COS T S

  • IS IN - THE SPEC

DESCRIBE HOW THE SITE WORKS

FROM THE USER’S PERSPECTIVE NOT HOW IT’S IMPLEMENTED

CHANGES ARE CHEAP TO M A K E ON PA P E R

ENABLES EFFICIENCY! DEVELOPMENT

  • CAN BE - PLANNED UP FRONT

  • NO - ALARMS
  • NO - SURPRISES

2 EVALUATE POSSIBLE EXISTING SOLUTIONS

DON’T REINVENT

THE WHEEL

EVALUATE AGAINST

YOUR (NOW SOLID) SPECIFICATION

CONSIDER COMPROMISES: WHERE DOES COST MATTER

MORE

THAN FEATURES?

USE EXISTING CODE AND BUILD 1 0% ON TOP

  • NOT -

1 0 0%

FROM NOTHING

3 CONSIDER THE COST OF YOUR DESIGN CHOICES

TO U G H BUT NOT IMPOS SIBLE

IT JUST TAKES TIME

CONSIDER THE DEVELOPMENT

IMPLICATIONS OF EVERY SINGLE DESIGN CHOICE

4 MAKE SURE YOUR DESIGN COVERS ALL STATES THE USER ENCOUNTERS

GOING

BACK & FORTH

COSTS TIME

  • CONSIDER - LOGGED IN LOGGED OUT

&

  • CONSIDER - EMPTY STATES TO O M U C H DATA

&

  • CONSIDER - WITH JAVASCRIPT WITHOUT

&

  • CONSIDER - ERRORS MESSAGES

&

MAKE SURE EVERYTHING IN THE SPEC IS

DESIGNED

5 DESIGN FOR REUSABILITY

BUILD A TOOLKIT OF REUSABLE COMPONENTS

DESIGN TO A GRID

EVERY UNIQUE ELEMENT IS A SOURCE OF COST

  • A FEW - VERSATILE TEMPLATES IS BETTER THAN DOZENS

6 REMEMBER: BROADBAND IS NOT A SILVER BULLET

DESIGNING FOR BROADBAND PUTS

EXTRA LOAD ON YOUR SERVERS

  • BANDWIDTH IS - EXPENSIVE CONSIDER YOUR

RUNNING COSTS

JUST BECAUSE IT’S DIGITAL DOESN’T MEAN IT’S

FREE

7 PREPARE YOUR DESIGN FILES READY TO SEND ACROSS TO YOUR DEVELOPER

MAKE IT EASY FOR YOUR DEVELOPER

  • TO - GET IT RIGHT

MISTAKES

  • & - ADJUSTMENTS ARE EXPENSIVE

GOING BACK AND FORTH COSTS TIME

NAME AND GROUP

  • YOUR LAYERS -

PROVIDE FLAT VERSIONS OF EACH STATE FOR REFERENCE

HAND OVER A COLOUR GUIDE

EXPLAIN YOUR GRID

  • DEVELOPERS WILL LOVE YOU -

8 BUILD YOUR SITE FOR CHEAP MAINTENANCE

ONCE A SITE IS BUILT IT HAS TO BE MAINTAINED

CONTENT CHANGES STRUCTURE CHANGES USEAGE CHANGES

DESIGN & BUILD FOR FLEXIBILITY

  • AVOID - LABOUR-INTENSIVE TECHNIQUES SUCH AS TEXT AS IMAGES

DON’T DESIGN

EACH SECTION

  • IN A - DIFFERENT COLOUR

CONSIDER HOW EACH ELEMENT RESPONDS TO CHANGE AND THE TIME IT WILL TAKE TO ADAPT IT

9 BUILD YOUR SITE FOR LOW COST QUALITY ASSURANCE (THAT’S TESTING!)

EVERY ELEMENT OF A SITE NEEDS TO BE TESTED

  • MULTIPLE - BROWSERS
  • MULTIPLE -

PLATFORMS

LOGGED IN

  • OR - LOGGED OUT

JAVASCRIPT ON OR OFF

FLASH

INSTALLED OR NOT

THERE ARE TWO OUTCOMES: TESTING GETS EXPENSIVE

  • OR - QUALITY SUFFERS

CONSIDER THE TESTING OVERHEAD OF EVERYTHING YOU ADD

10 BUILD ON THE SHOULDERS OF GIANTS USE EXISTING APIS OUTSOURCE AS MUCH AS POSSIBLE

THE WEB IS A COLLECTION OF SMALL PIECES LOOSELY JOINED

BE A SMALL PIECE

AMAZON S3 FEEDBURNER YOUTUBE / VIMEO FLICKR GOOGLE MAPS YAHOO! SEARCH

APIS

THE BEST WAY TO SAVE MONEY LET SOMEONE ELSE SPEND THEIRS

THANK YOU ANY QUESTIONS?

SLIDES ALLINTHEHEAD.COM/PRESENTATIONS FOLLOW ME: @DREWM