Slide 1

Slide 1 text

10 COST EFFECTIVE WEB DEVELOPMENT TECHNIQUES

Slide 2

Slide 2 text

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

Slide 3

Slide 3 text

SOMEWHERE OUT THERE LIES A WORLD OF LIMITLESS BUDGETS

Slide 4

Slide 4 text

WHEN BUDGETS ARE TIGHT EVERYONE WORKS HARDER

Slide 5

Slide 5 text

F A S T E R CHEAPER BETTER STRONGER WITH FEWER RESOURCES AVAILABLE

Slide 6

Slide 6 text

S O M E T E C H N I Q U E S A R E TECHNICAL BUT MANY ARE ABOUT WORKFLOW

Slide 7

Slide 7 text

I’M DREW MCLELLAN E D G E O F M Y S E AT. C O M ~ @ D R E W M I HELP PEOPLE BUILD THINGS ON THE WEB

Slide 8

Slide 8 text

HERE’S THE TIPS PRESENTED IN NO PARTICULAR ORDER

Slide 9

Slide 9 text

1 WRITE A COMPREHENSIVE SPECIFICATION FOR YOUR PROJECT

Slide 10

Slide 10 text

& A GOOD SPEC DOES TWO THINGS LIMITS S C O P E E N A B L E S EFFICIENCY

Slide 11

Slide 11 text

T H E E A S I E S T P L A C E TO CONTROL COSTS - IS IN - THE SPEC

Slide 12

Slide 12 text

DESCRIBE HOW THE SITE WORKS FROM THE USER’S PERSPECTIVE NOT HOW IT’S IMPLEMENTED

Slide 13

Slide 13 text

C H A N G E S A R E C H E A P T O M A K E O N PAPER

Slide 14

Slide 14 text

ENABLES EFFICIENCY! DEVELOPMENT - CAN BE - PLANNED U P F R O N T

Slide 15

Slide 15 text

- NO - ALARMS - NO - SURPRISES

Slide 16

Slide 16 text

2 EVALUATE POSSIBLE EXISTING SOLUTIONS

Slide 17

Slide 17 text

DON’T REINVENT THE WHEEL

Slide 18

Slide 18 text

EVALUATE AGAINST YO U R ( N OW S O L I D ) SPECIFICATION

Slide 19

Slide 19 text

CONSIDER COMPROMISES: WHERE DOES COST MATTER MORE THAN FEATURES?

Slide 20

Slide 20 text

USE EXISTING CODE AND BUILD 10% ON TOP - NOT - 100% FROM NOTHING

Slide 21

Slide 21 text

3 CONSIDER THE COST OF YOUR DESIGN CHOICES

Slide 22

Slide 22 text

No content

Slide 23

Slide 23 text

No content

Slide 24

Slide 24 text

No content

Slide 25

Slide 25 text

No content

Slide 26

Slide 26 text

T O U G H BUT NOT IMPOS S I B L E

Slide 27

Slide 27 text

I T J U S T TA K E S TIME

Slide 28

Slide 28 text

No content

Slide 29

Slide 29 text

No content

Slide 30

Slide 30 text

No content

Slide 31

Slide 31 text

C O N S I D E R T H E DEVELOPMENT IMPLICATIONS O F E V E RY S I N G L E DESIGN CHOICE

Slide 32

Slide 32 text

4 MAKE SURE YOUR DESIGN COVERS ALL STATES THE USER ENCOUNTERS

Slide 33

Slide 33 text

GOING BACK & FORTH CO S T S T I M E

Slide 34

Slide 34 text

& - CONSIDER - LOGGED IN LOGGED OUT

Slide 35

Slide 35 text

& - CONSIDER - EMPTY STATES TOO MUCH DATA

Slide 36

Slide 36 text

& - CONSIDER - WITH JAVASCRIPT WITHOUT

Slide 37

Slide 37 text

& - CONSIDER - ERRORS MESSAGES

Slide 38

Slide 38 text

MAKE SURE EVERYTHING IN THE SPEC IS DESIGNED

Slide 39

Slide 39 text

5 DESIGN FOR REUSABILITY

Slide 40

Slide 40 text

BUILD A TOOLKIT OF REUSABLE COMPONENTS

Slide 41

Slide 41 text

DESIGN TO A GRID

Slide 42

Slide 42 text

EVERY UNIQUE ELEMENT IS A SOURCE OF COST

Slide 43

Slide 43 text

- A FEW - VERSATILE TEMPLATES IS BETTER THAN DOZENS

Slide 44

Slide 44 text

No content

Slide 45

Slide 45 text

6 REMEMBER: BROADBAND IS NOT A SILVER BULLET

Slide 46

Slide 46 text

No content

Slide 47

Slide 47 text

DESIGNING FOR BROADBAND PUTS EXTRA LOAD ON YOUR SERVERS

Slide 48

Slide 48 text

- BANDWIDTH IS - EXPENSIVE C O N S I D E R Y O U R RUNNING COSTS

Slide 49

Slide 49 text

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

Slide 50

Slide 50 text

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

Slide 51

Slide 51 text

MAKE IT EASY FOR YOUR DEVELOPER - TO - GET IT RIGHT

Slide 52

Slide 52 text

MISTAKES - & - ADJUSTMENTS ARE EXPENSIVE

Slide 53

Slide 53 text

GOING BACK AND FORTH COSTS TIME

Slide 54

Slide 54 text

NAME AND GROUP - YOUR LAYERS -

Slide 55

Slide 55 text

PROVIDE FLAT VERSIONS OF EACH STATE FOR REFERENCE

Slide 56

Slide 56 text

HAND OVER A COLOUR GUIDE

Slide 57

Slide 57 text

EXPLAIN YOUR GRID - DEVELOPERS WILL LOVE YOU -

Slide 58

Slide 58 text

8 BUILD YOUR SITE FOR CHEAP MAINTENANCE

Slide 59

Slide 59 text

ONCE A SITE IS BUILT IT HAS TO BE MAINTAINED

Slide 60

Slide 60 text

C O N T E N T CHANGES S T RU C T U R E CHANGES U S E A G E CHANGES

Slide 61

Slide 61 text

DESIGN & BUILD FOR FLEXIBILITY

Slide 62

Slide 62 text

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

Slide 63

Slide 63 text

DON’T DESIGN EACH SECTION - IN A - DIFFERENT COLOUR

Slide 64

Slide 64 text

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

Slide 65

Slide 65 text

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

Slide 66

Slide 66 text

EVERY ELEMENT OF A SITE NEEDS TO BE TESTED

Slide 67

Slide 67 text

- MULTIPLE - BROWSERS - MULTIPLE - PLATFORMS

Slide 68

Slide 68 text

LOGGED IN - OR - LOGGED OUT

Slide 69

Slide 69 text

JAVASCRIPT ON OR OFF

Slide 70

Slide 70 text

FLASH INSTALLED OR NOT

Slide 71

Slide 71 text

THERE ARE TWO OUTCOMES: TESTING GETS EXPENSIVE - OR - QUALITY SUFFERS

Slide 72

Slide 72 text

CONSIDER THE TESTING OVERHEAD OF EVERYTHING YOU ADD

Slide 73

Slide 73 text

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

Slide 74

Slide 74 text

THE WEB IS A COLLECTION OF SMALL PIECES LOOSELY JOINED

Slide 75

Slide 75 text

BE A SMALL PIECE

Slide 76

Slide 76 text

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

Slide 77

Slide 77 text

APIS

Slide 78

Slide 78 text

THE BEST WAY TO SAVE MONEY LET SOMEONE ELSE SPEND THEIRS

Slide 79

Slide 79 text

THANK YOU ANY QUESTIONS?

Slide 80

Slide 80 text

SLIDES ALLINTHEHEAD.COM/PRESENTATIONS FOLLOW ME: @DREWM