Website  Analysis  

 

 

Introduction  

Website design has increased its importance over the years; as technology is growing so is the importance of having good, usable web design. The use of a website is to either sell, convey, inform or persuade a reader. The placement, usability and type of features that are used are to make sure the reader or viewer understands what the website is trying to say. The SPCA Auckland website efficiently utilizes typeface, colour and images, this essay will talk about how each of these features are used effectively for the purpose of browsing the website. Typeface    

Typeface  in  website  design  can  include  font,  size  and  boldness  (Wysocki,  2004).  These  elements  are  all  used  for  a  specific  reason.  The  font  majority  of  website  designers  tend  to  use  is  a  Sans  Serif  font  due  to  computers  having  less  resolution  that  printed  documents  making  it  less  strain  on  the  eyes  to  see  (Kole,  2013).    The  SPCA  website  has  used  a  sans  serif  font,  Arial.  By  using  serif  fonts  SPCA  makes  their  website  user  friendly  as  sans  serif  fonts  are  much  easier  to  read  on  a  screen  then  a  serif  font  and  will  encourage  the  reader  to  read  more  as  their  eye  won’t  be  strained.      In  the  website  there  is  a  good  flow  and  contrast  between  the  headings  and  body  text.  They  use  Arial  for  the  body  text  which  and  use  Arial  Rounded  MT  bold  for  the  headings.  The  way  they  have  sized  their  typeface  is  by  making  the  more  important  heading  a  larger  size,  this  making  it  clearer  to  the  reader  (Warnick,  2006).  So  when  the  reader  wants  to  read  the  body  text  he  clearly  knows  what  it  is  about.  The  example  beside  shows  exactly  how  the  website  gets  the  important  message  across  in  the  larger  font  size.  The  text  on  the  interactive  buttons  have  been  bolded  to  draw  the  user’s  attention.    Colour

 

Colour  plays  a  big  part  in  web  design.  Each  colour  gives  off  a  different  feeling  or  emotion,  these  feelings  can  vary  as  different  people  have  different  preference.  Some  people’s  preferences  may  change  due  to  an  influence  of  culture  or  maturity.  There  are  six  colours  on  the  SPCA  website.  There  are  three  neutral  colours;  black,  white  and  grey.  While  the  Vibrant  colours  consist  of  two  warm  colours  and  one  cool  colour.  Since  there’s  variety  in  colour,  people  may  consider  it  visually  appealing  (Cannon,  2012).  Neutral  colours  tended  to  be  used  as  the  background,  just  like  the  SPCA  Website.  Black  is  commonly  known  for  being  a  stronger  colour  out  of  the  neutrals,  which  makes  this  colour  perfect  for  use  of  text.  Black  can  be  associated  with  things  like  power,  elegance  and  formality  (Chapman,  2010).  For  this  website  the  use  of  black  isn’t  overwhelming,  they  only  use  it  for  text  and  I  feel  like  there  wasn’t  an  overwhelming  amount  of  text.    White  is  the  main  colour  for  the  background.  White  is  used  to  show  cleanliness,  many  web  designers  favorite  the  use  of  a  lot  of  white  space,  they  believe  it  allows  your  eyes  to  focus  on  what  the  website  is  trying  to  get  across.  They  surround  important  ideas  with  white  space  so  that  your  eye  is  drawn  to  what  they  are  saying  rather  than  the  background.  White  is  associated  with  the  health  care  industry,  especially  with  doctors,  nurses  and  dentist  (Chapman,  2010).  Since  this  site  is  about  taking  care  of  animals,  and  animal  wellbeing,  the  use  of  this  colour  and  the  amount  of  it,  is  done  well.  The  last  neutral  colour  which  is  grey  is  rarely  used  in  this  site.  But  a  lot  of  web  designs  

contains  a  light  grey  as  it  can  be  a  replacement  for  white.  The  way  they  have  used  grey  is  to  add  another  layer  to  the  website.  The  vibrant  colours  used  were  orange,  maroon  and  blue.  Orange  is  a  warm  and  energetic  colour.    The  representation  of  orange  is  from  autumn  which  is  a  changing  in  season,  this  means  the  colour  orange  that  stands  for  change  and  movement  (Chapman,  2010).  The  use  of  this  colour  is  done  extremely  well  as  they  have  drawn  attention  on  the  word  “ADOBT”.  Adopting  a  pet  has  become  a  recent  change  over  the  years  as  people  are  getting  animals  that  all  already  grown  or  bread  from  possible  unstable  environments.  Maroon/magenta  is  a  warm  colour  because  the  base  colour  hues  are  reds  which  makes  this  warm.  A  colour  like  this  tends  to  represent  or  reflect  “passion,  happiness,  enthusiasm  and  energy.”  (Chapman,  2010)This  fits  perfectly  with  the  idea  of  donating  as  you’re  giving  something  towards  the  company.  Donating  takes  passion  and  it  takes  someone  out  of  the  ordinary  to  do  it.  The  last  colour  and  the  primary  colour  on  this  page  is  blue.  Blue  is  a  cool  tone  colour,  it  brings  a  calm  and  relaxing  appearance.  The  English  language  describes  blue  as  another  word  for  sadness  (Chapman,  2010).  The  SPCA  is  a  serious  cause  as  they  are  the  Society  for  the  Prevention  of  Cruelty  to  Animals.  Cruelty  towards  animals  has  been  an  increasing  problem  that  brings  a  sense  of  heart  break  for  some  when  they  hear  about  what  happens  to  animals.  This  colour  fits  perfectly  as  it  gives  of  the  right  emotion  and  feeling  when  you  look  at  the  site.

(The  Psychology  of  Color  and  Web  Design,  n.d.)  

Images    

The  use  of  effective  images  is  to  convey  a  message.  The  picture  should  be  relevant  to  the  topic  of  the  website,  and  help  the  viewer  get  a  better  understanding  of  what  is  trying  to  be  said.  The  way  the  website  is  laid  out  is  that  each  image  catches  your  eye.  From  the  time  the  website  opens  you  understand  what  it’s  about,  there  is  a  banner  that  has  constantly  changing  images  about  different  sub  topics  about  the  SPCA.  

Most  of  the  images  used  are  majority  close  ups.  A  close  up  shows  “intimate  distance”  from  you  and  the  subject  or  in  this  case  animal  (Parkes,  2009).  Close  ups  create  more  of  a  relationship  compared  to  other  angles.  Use  of  this  kind  shot  helps  back  up  what  they  are  trying  to  portray,  by  them  connecting  with  the  view  they  are  allowing  people  to  want  to  support  their  cause.  Another  aspect  that  creates  a  relation  is  where  the  animal  is  look  seems  like  such  a  simple  idea  but  by  acknowledging  the  viewer  they  are  demanding  their  attention  this  can  have  a  large  effect  on  people  (Parkes,  2009).  

 

Conclusion    The  SPCA  Auckland  website  uses  a  mixture  of  easy  to  read  type  face,  bold  and  neutral  colours,  and  relevant  pictures.  Each  of  these  deliver  a  clear  message  about  animal  cruelty.  The  aspects  add  to  how  captivating  the  website  is  and  also  adds  a  whimsical  layer  to  the  website.  The  appearance  is  clean,  tidy,  easy  to  read  and  friendly  for  a  variety  of  people  to  view.  This  design  and  layout  as  a  whole  made  a  compelling  and  professional  website.  

 

References    

Cannon,  T.  (2012,  09  12).  An  Introduction  to  Color  Theory  for  Web  Designers.  Retrieved  from  envatotuts+:  http://webdesign.tutsplus.com/articles/anintroduction-­‐to-­‐color-­‐theory-­‐for-­‐web-­‐designers-­‐-­‐webdesign-­‐1437  

Chapman,  C.  (2010,  01  28).  Color  Theory  for  Designers,  Part  1:  The  Meaning  of  Color.  Retrieved  from  Smashing  Magazine:  https://www.smashingmagazine.com/2010/01/color-­‐theory-­‐for-­‐designers-­‐part-­‐1-­‐the-­‐meaning-­‐of-­‐color/  

Kole,  S.  (2013,  03  15).  Serif  vs.  Sans:  the  final  battle.  Retrieved  from  Web  Designers  Depot  :  http://www.webdesignerdepot.com/2013/03/serif-­‐vs-­‐sans-­‐the-­‐final-­‐battle/    

Parkes,  R.  (2009,  09  13).  Visual  Literacy.  Retrieved  from  Slide  Share:  http://www.slideshare.net/rjp152/visual-­‐literacy-­‐1992223  

The  Psychology  of  Color  and  Web  Design.  (n.d.).  Retrieved  from  QuinnCom:  http://quinncom.net/the-­‐psychology-­‐of-­‐color-­‐and-­‐web-­‐design/  

Warnick,  B.  (2006).  Digital  Media;  Transformations  in  Human  Communication  (Rhetoric  On  the  Web  ed.).  (P.  Messaris,  &  L.  Humphreys  ,  Eds.)  New  York:  Peter  Lang  Publishing,  Inc.  

Wysocki,  A.  F.  (2004).  The  multiple  media  of  texts:  How  onscreen  and  paper  texts  Incorporate  words,  images  and  other  media.  (C.  Bazerman,  &  P.  Prior,  Eds.)  What  writing  does  and  how  it  does  it:  An  introduction  to  analyzing  texts  and  textual  practices,  123  -­‐163.