Web Design

270 views
208 views

Published on

Published in: Technology, Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
270
On SlideShare
0
From Embeds
0
Number of Embeds
46
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Web Design

  1. 1. Web  Design   Year  10  Multimedia  
  2. 2. Web  Sites  Ê  A  website  (or  web  site)  is  a  collection  of  related  web  pages,  images,   videos  or  other  digital  assets  that  are  addressed  with  a  common   domain  name.  Ê  Within  the  website,  each  screen  of  information  is  called  a  page.  Pages   may  contain  text,  graphic  images,  sound  and  video.    Ê  A  main  feature  are  the  "links"  embedded  within  a  page  that  can  be   clicked.  These  transfer  viewers  to  other  pages.    
  3. 3. Web  Sites  (continued)  Ê  A  normal  information  brochure  would  normally  open  at  the  front  or  the   back  and  browse  forwards  or  backwards  a  page  at  a  time.  With  a   website,  the  user  decides  the  order  they  want  to  see  the  pages  in  by   clicking  the  links  that  interest  them.    Ê  This  interactivity  generates  a  sense  of  ownership  and  participation  in   the  user,  binding  them  to  the  information  much  more  tightly  than  a   traditional  brochure.  
  4. 4. Web  Sites  (continued)  Ê  A  web  site  is  a  collection  of  folders  and  files.  The  files  can  be   documents,  graphics,  multimedia  and  hypertext  markup   language  (html).  Ê  Three  pieces  of  software  are  mainly  used  when  building  web   sites.   Ê  An  HTML  editor,  e.g.  Dreamweaver,  for  creating  and  editing.     Ê  An  image  editor,  e.g.  Photoshop,  for  creating  and  editing  graphics.   Ê  A  browser,  e.g.  Internet  Explorer  or  Firefox  for  viewing.    Ê  Hypertext  Markup  Language  (HTML)   Web  sites  are  built  using  Hypertext  Markup  Language  (HTML).   This  code  is  the  language  of  the  Internet.  All  HTML  code  is   created  in  the  background.  
  5. 5. HTML  (Hypertext  Markup  Language)  Ê  Web  sites  are  built  using  Hypertext  Markup  Language  (HTML).  This   code  is  the  language  of  the  Internet  for  creating  web  pages  and  other   information  that  can  be  displayed  in  a  web  browser.  Ê  The  purpose  of  a  web  browser  is  to  read  HTML  documents  and   compose  them  into  visible  or  audible  web  pages.    Ê  HTML  is  written  in  the  form  of  HTML  elements  consisting  of  tags   enclosed  in  angle  brackets  (like  <html>),  within  the  web  page  content.  Ê  HTML  tags  most  commonly  come  in  pairs  like  <h1>  and  </h1>,   although  some  tags,  known  as  empty  elements,  are  unpaired,  for   example  <img>.  The  first  tag  in  a  pair  is  the  start  tag,  the  second  tag  is   the  end  tag  (they  are  also  called  opening  tags  and  closing  tags).  In   between  these  tags  web  designers  can  add  text,  tags,  comments  and   other  types  of  text-­‐based  content.    
  6. 6. Common  HTML  Tags   <a>   Defines  a  hyperlink   <b>  or  <strong>   Defines  bold  text   <body>   Defines  the  documents  body   <br>   Defines  a  single  line  break   <em>   Defines  emphasized  text  (italics)   <h1  >  to  <h6>   Defines  HTML  headings   <head>   Defines  information  about  the  document   <img>   Defines  an  image   <p>   Defines  a  paragraph   <table>   Defines  a  table   <td>   Defines  a  cell  in  a  table   <title>   Defines  a  title  for  the  document   <tr>   Defines  a  row  in  a  table  
  7. 7. CSS  (Cascading  Style  Sheets)  Ê  CSS  stands  for  Cascading  Style  Sheets  Ê  Styles  define  how  to  display  HTML  elements.  Ê  External  Style  Sheets  can  save  a  lot  of  work.  Styles  are  normally  saved   in  external  .css  files.  External  style  sheets  enable  you  to  change  the   appearance  and  layout  of  all  the  pages  in  a  Web  site,  just  by  editing  one   single  file!  
  8. 8. Good  vs.  Bad  Web  Design  In  this  day  and  age,  we’re  all  so  used  to  using  the  internet  that  a  website  needs  to  do  more  than  just  look  pretty.    Websites  need  to  be:    Ê  Usable  Ê  Functional  Ê  Appealing    Ê  Meet  audience  expectations  Unfortunately  not  all  web  designers  get  it  right.  Surprisingly  even  some  of  the  most  high-­‐profile  websites  aren’t  able  to  fulfil  these  core  aims.    
  9. 9. Good  Web  Design  The  key  purpose  of  any  site  is  to  provide  information.  Good  websites  should  provide  information  in  an  efficient  and  easy-­‐to-­‐find  manner.  Users  should  have  everything  they  need  at  their  fingertips  without  needing  to  hunt  around  for  too  long.    Effective  navigation  is  vital.  A  core  part  of  the  design  process  should  be  deciding  what  users  will  expect  to  find  and  delivering  it  in  a  clean  and  organised  way.  A  good  website  needs  to  be  engaging  with  just  the  right  balance  of  visual  appeal  and  operational  efficiency.    
  10. 10. Bad  Web  Design  Bad  websites  tend  to  prioritise  style  over  substance  with  high-­‐flying  animations  often  being  seen.  Although  you  might  be  left  with  great  visuals,  you’ll  have  very  slow  speeds  and  users  will  often  find  it  difficult  to  access  the  required  information.    Bad  websites  haven’t  thought  about  navigation  and  often  won’t  think  about  the  end  user  either  Bad  websites  use  sophisticated  technologies  that  won’t  work  well  on  older  machines  or  even  smartphones,  meaning  users  won’t  get  the  experience  they  need.  Users  should  not  have  to  look  through  page  after  page  of  information  and  not  be  able  to  find  what  they  are  looking  for.  Poor  web  design  can  be  inconvenient  and  annoying  and  visitors  may  deciding  to  look  elsewhere.  
  11. 11. Web  Designers  Web  designers  design,  create,  produce  and  maintain  web  pages.  They  generally  work  on  the  layout  and  visual  appearance  of  websites  and  online  marketing  material.  Web  designers  focus  on:  Ê  the  visual  appeal  of  a  web  site’s  design  Ê  the  colour  palette  Ê  imagery  Ê  font  selection  Ê  content  layout  Ê  use  of  interactive  content  such  as  flash  Ê  how  all  of  these  elements  combine  to  produce  an  effective  and   attractive  website.  
  12. 12. Web  Designers  (continued)  Web  designers  also  perform  the  following  tasks:  Ê  talk  with  clients,  and  discuss  ideas  to  get  a  clear  understanding  of  their   requirements  Ê  develop  custom  programs  to  extend  the  functionality  of  websites  Ê  talk  with  writers,  designers,  system  administrators  and  other  IT  staff  to   make  sure  the  website  will  fulfil  its  purpose  Ê  maintain  or  update  the  website  once  it  is  completed  by  adding  new   content,  illustrations  or  features  Ê  coordinate  other  people,  such  as  designers  and  writers,  to  help   maintain  the  website.  

×