SlideShare ist ein Scribd-Unternehmen logo
1 von 35
Demystifying the Web
The Loft Group We do everything you could ever need from a creative agency, and we do it very well indeed.
Me… Technical Team Leader @ The Loft Group BSc. Internet Computing Web Design Web Development Search Engine Optimisation Project Management
What I will show you today Basic Terminology What you need to start a website The Website Design & Development Processes Understanding your audience Managing your own website Launching your website Also brushing lightly on: Search Engine Optimisation Blogging Social Media
Basic Terminology Domain Name : the address where your website will be located, eg.  www.theloftgroup.com.au Hosting : a space on the internet where your address points to. This ‘web space’ allows end users to access your website and also provides you with email accounts.
Basic Terminology continued Server :  like the waiter who delivers your meal at a restaurant, the data needs to be served to your computer when you visit a website. Your ‘web space’ is located on a hosting server.   Browser :  the program you use to visit websites. Eg. Internet Explorer, Firefox, Safari, Chrome, Opera.
Basic Terminology continued Browser :
Basic Terminology continued HTML :  the code that holds a website together and renders all imagery and information in your browser. Hyper-text Markup Language.   Image :  Like your digital camera, website graphics are contained in individual files .
Basic Terminology continued Image continued : .jpeg/.jpg = Joint Picture Experts Group – compression groups similar colours .gif = Graphics Interchange Format – stores individual colours and transparency .png = Portable Network Graphics – in a nutshell PNG combines .jpg and .gif technologies
Basic Terminology continued Search Engine :  The tool you use to locate information on the internet, eg. Google, Bing, Yahoo!   www : The World-wide Web
How these components interact
What Do I Need to Start a Website? Web Designer Web Developer – Loft do both Corporate Identity – colours & logo  Content!!! Textual information, images, etc.
What Do I Need to Start a Website? Rough content layout (sitemap / menu) Special requirements / features eCommerce functionality (selling products  online) Photo Galleries Content Management System Etc.
What Do I Need to Start a Website? Rough Sitemap
The Website Design Process 1. Set your goals : Explain what you want to achieve – “I want my website to generate revenue!” 2.  Set your Objectives : Explain your objectives – “I want to break into the jewellery industry and sell more jewels.”
The Website Design Process 3. Research your Target Audience : Get an idea of what your visitors want to see. Research your competitors. 4.  Look and Feel : Explain the persona you want to convey – Contemporary / Unique / Chic / Modern / Sophisticated? Highlight examples you like, but  don’t  rip-off an existing design!
The Website Design Process 5. Identity : Explain how you want your corporate identity to be used. 6.  Scenarios : Explain which elements are most important to your target audience’s experience.
The Website Design Process 6.  Scenario Example:
The Website Design Process ,[object Object],[object Object],[object Object]
The Website Design Process These guidelines will better aid you with materialising your ideas and help you speak the same language as your web designer. Design Proofs will be more accurate.
The Website Development Process Development revolves around: Usability Accessibility And Compliance
The Website Development Process Usability revolves around consistency Navigation must be the same throughout website Links must be represented in the same fashion eg. underlined Text based sitemap should a user need quick access to info Logo must link back to homepage Text Colour / contrast / font used – black on white = strongest User Feedback mechanisms – contact form Test the site on real people!
The Website Development Process Accessibility revolves around catering for vision and hearing impaired users Images, animations and embedded audio must have textual equivalents Explain importance to your developer. Some find the topic does not relate to them, but imagine being deaf and captions failing during your favourite television programme.
The Website Development Process Compliance revolves around combining Usability and Accessibility The details are a little technical, however; Search Engines favour compliant code Compliant code makes it easier for the vision impaired to use your website
Understanding Your Audience Provide the right content! Perform demographical research, adjust content. Poll existing or prospective clientele -> insight! Example: old user -> text content instead of multimedia Conservative audience = formal copy Liberal / Young audience = less formal copy Cater for the majority eg. Skateboarders -> Punk Rock
Godlike Privileges - CMS What is a CMS? Content Management System Not scary! Loft creates solutions based on your pre-existing knowledge. Feel empowered! It’s easy and convenient to perform regular updates!
Godlike Privileges - CMS CMS Loft Example A basic CMS Interface. For those familiar with  MS Word, editing your  website is an absolute  breeze!
Godlike Privileges - CMS CMS Loft Example Artwork layer is separated from the content layer so that the shaded area is only controlled by the CMS. There’s no way you can impact your website artwork
Search Engine Optimisation What is SEO? Making your website more visible to search engines Work with the search engines, don’t try to trick them! Search Engines only leak enough info to help SEOers
What is a blog? Why should I blog? Abbr. -> web log = blog! Online journal, a record of thoughts / business announcements Search engines love fresh content. New content -> recrawl -> higher rankings.
What is Social Media? Social Media = Twitter, Facebook, Linked In Linked from your website, and vice versa Social Media is powerful because it engages people in your brand.  Better understand your target audience and promote your business.
Launching your website Review all content and functionality prior to launch. Your developer will provide you with a demonstration link before your site goes live. Promote your website: Search Engines Links on related websites Sponsored listings Competitions via Social Media – free service/product to winner Get creative, suggest some ideas to your developer!
The Loft Group Corporate Identity and Brand Management Website Design and Development Application Development Graphic Design Print Management Photography
Notable Projects The Lost Battlefield  http:// www.thelostbattlefield.com.au One Man Epic  http:// www.onemanepic.com Horizon Power Intranet (Western Power)
Thank you Disclaimer:  The content and design layouts discussed in this presentation are not to be used by third parties.

Weitere ähnliche Inhalte

Was ist angesagt?

Principle of a good web design
Principle of a good web designPrinciple of a good web design
Principle of a good web designSantosh V
 
FYBSC IT Web Programming Unit II Html Page Layout & Navigation
FYBSC IT Web Programming Unit II Html Page Layout & NavigationFYBSC IT Web Programming Unit II Html Page Layout & Navigation
FYBSC IT Web Programming Unit II Html Page Layout & NavigationArti Parab Academics
 
Basic SEO Structural Issues
Basic SEO Structural IssuesBasic SEO Structural Issues
Basic SEO Structural IssuesR2integrated
 
16 Sure-Fire Tips to Optimizing On-Page SEO
16 Sure-Fire Tips to Optimizing On-Page SEO16 Sure-Fire Tips to Optimizing On-Page SEO
16 Sure-Fire Tips to Optimizing On-Page SEOAmy Westebbe
 
Web Design by Client Perspective
 Web Design by Client Perspective Web Design by Client Perspective
Web Design by Client Perspectiveeginni
 
Wordpress SEO
Wordpress SEOWordpress SEO
Wordpress SEOBeFound
 
Web design brief template
Web design brief templateWeb design brief template
Web design brief templateUğur Çelenk
 
SEO Seminar Indianapolis
SEO Seminar IndianapolisSEO Seminar Indianapolis
SEO Seminar IndianapolisCirrus ABS
 
Growing Your Business With A Website: WIBO
Growing Your Business With A Website: WIBOGrowing Your Business With A Website: WIBO
Growing Your Business With A Website: WIBOMardy Sitzer
 
The Art of Web Design, 101
The Art of Web Design, 101The Art of Web Design, 101
The Art of Web Design, 101kellyhousholder
 
From zero to hero - based on a true inbound marketing story
From zero to hero - based on a true inbound marketing storyFrom zero to hero - based on a true inbound marketing story
From zero to hero - based on a true inbound marketing storyJason Acidre
 
Editorial SEO Strategy
Editorial SEO StrategyEditorial SEO Strategy
Editorial SEO StrategyRob Flaherty
 
Website Creation
Website CreationWebsite Creation
Website CreationIgnited Way
 
Generate Leads and Sales with a Sales Funnel
Generate Leads and Sales with a Sales FunnelGenerate Leads and Sales with a Sales Funnel
Generate Leads and Sales with a Sales FunnelJoomlaDay Australia
 
A Guide to Web Design- Business.com
A Guide to Web Design- Business.comA Guide to Web Design- Business.com
A Guide to Web Design- Business.comBusiness.com
 

Was ist angesagt? (20)

Principle of a good web design
Principle of a good web designPrinciple of a good web design
Principle of a good web design
 
Web design
Web designWeb design
Web design
 
FYBSC IT Web Programming Unit II Html Page Layout & Navigation
FYBSC IT Web Programming Unit II Html Page Layout & NavigationFYBSC IT Web Programming Unit II Html Page Layout & Navigation
FYBSC IT Web Programming Unit II Html Page Layout & Navigation
 
Web designing
Web designingWeb designing
Web designing
 
Intro to Web Marketing - sites, SEO and social media
Intro to Web Marketing - sites, SEO and social mediaIntro to Web Marketing - sites, SEO and social media
Intro to Web Marketing - sites, SEO and social media
 
Basic SEO Structural Issues
Basic SEO Structural IssuesBasic SEO Structural Issues
Basic SEO Structural Issues
 
16 Sure-Fire Tips to Optimizing On-Page SEO
16 Sure-Fire Tips to Optimizing On-Page SEO16 Sure-Fire Tips to Optimizing On-Page SEO
16 Sure-Fire Tips to Optimizing On-Page SEO
 
Web Design by Client Perspective
 Web Design by Client Perspective Web Design by Client Perspective
Web Design by Client Perspective
 
Wordpress SEO
Wordpress SEOWordpress SEO
Wordpress SEO
 
Accessibility, SEO and Joomla
Accessibility, SEO and Joomla Accessibility, SEO and Joomla
Accessibility, SEO and Joomla
 
Web design brief template
Web design brief templateWeb design brief template
Web design brief template
 
SEO Seminar Indianapolis
SEO Seminar IndianapolisSEO Seminar Indianapolis
SEO Seminar Indianapolis
 
Growing Your Business With A Website: WIBO
Growing Your Business With A Website: WIBOGrowing Your Business With A Website: WIBO
Growing Your Business With A Website: WIBO
 
The Art of Web Design, 101
The Art of Web Design, 101The Art of Web Design, 101
The Art of Web Design, 101
 
From zero to hero - based on a true inbound marketing story
From zero to hero - based on a true inbound marketing storyFrom zero to hero - based on a true inbound marketing story
From zero to hero - based on a true inbound marketing story
 
Editorial SEO Strategy
Editorial SEO StrategyEditorial SEO Strategy
Editorial SEO Strategy
 
Website Creation
Website CreationWebsite Creation
Website Creation
 
On page seo ppt
On page seo ppt On page seo ppt
On page seo ppt
 
Generate Leads and Sales with a Sales Funnel
Generate Leads and Sales with a Sales FunnelGenerate Leads and Sales with a Sales Funnel
Generate Leads and Sales with a Sales Funnel
 
A Guide to Web Design- Business.com
A Guide to Web Design- Business.comA Guide to Web Design- Business.com
A Guide to Web Design- Business.com
 

Ähnlich wie Demystifying The Web

[DevDay 2017] Using analytics, focusing on SEO and unability - Keys to develo...
[DevDay 2017] Using analytics, focusing on SEO and unability - Keys to develo...[DevDay 2017] Using analytics, focusing on SEO and unability - Keys to develo...
[DevDay 2017] Using analytics, focusing on SEO and unability - Keys to develo...DevDay.org
 
Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.
Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.
Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.Brody Dorland
 
Building Blocks of Web Presence
Building Blocks of Web PresenceBuilding Blocks of Web Presence
Building Blocks of Web Presencemimsin
 
Digital Marketing By krishna.pdf
Digital Marketing By krishna.pdfDigital Marketing By krishna.pdf
Digital Marketing By krishna.pdfrkraina4
 
November 2016 - ECN - You're Speaking Drupalese to Me
November 2016 - ECN - You're Speaking Drupalese to MeNovember 2016 - ECN - You're Speaking Drupalese to Me
November 2016 - ECN - You're Speaking Drupalese to MeEric Sembrat
 
Web Design Trends & Best Practices (by Blueliner Marketing CEO, Arman Rousta)
Web Design Trends & Best Practices (by Blueliner Marketing CEO, Arman Rousta)Web Design Trends & Best Practices (by Blueliner Marketing CEO, Arman Rousta)
Web Design Trends & Best Practices (by Blueliner Marketing CEO, Arman Rousta)Arman Rousta
 
Your Digital Brand: Building a Powerful Website
Your Digital Brand: Building a Powerful Website Your Digital Brand: Building a Powerful Website
Your Digital Brand: Building a Powerful Website Katharine Coles
 
Workshop evaluating your website-05-20-10
Workshop evaluating your website-05-20-10Workshop evaluating your website-05-20-10
Workshop evaluating your website-05-20-10NuRelm
 
Substance151 Best Web Practices
Substance151 Best Web PracticesSubstance151 Best Web Practices
Substance151 Best Web Practicessubstance151
 
Computer 10 Lesson 8: Building a Website
Computer 10 Lesson 8: Building a WebsiteComputer 10 Lesson 8: Building a Website
Computer 10 Lesson 8: Building a WebsiteMavein
 
How to Create a Business Website for Success.pdf
How to Create a Business Website for Success.pdfHow to Create a Business Website for Success.pdf
How to Create a Business Website for Success.pdfBaek Yongsun
 
Building SEO Friendly Websites
Building SEO Friendly WebsitesBuilding SEO Friendly Websites
Building SEO Friendly WebsitesGoLaunchMarketing
 
Building an Online Presence
Building an Online PresenceBuilding an Online Presence
Building an Online PresenceRenée Nesseth
 
Webinar "Using the Web to Maximize Your Regional Group's ...
Webinar "Using the Web to Maximize Your Regional Group's ...Webinar "Using the Web to Maximize Your Regional Group's ...
Webinar "Using the Web to Maximize Your Regional Group's ...webhostingguy
 
Web Page Designing- Empower Technology.pptx
Web Page Designing- Empower Technology.pptxWeb Page Designing- Empower Technology.pptx
Web Page Designing- Empower Technology.pptxacademicjfurio
 

Ähnlich wie Demystifying The Web (20)

[DevDay 2017] Using analytics, focusing on SEO and unability - Keys to develo...
[DevDay 2017] Using analytics, focusing on SEO and unability - Keys to develo...[DevDay 2017] Using analytics, focusing on SEO and unability - Keys to develo...
[DevDay 2017] Using analytics, focusing on SEO and unability - Keys to develo...
 
Seo.jpg
Seo.jpgSeo.jpg
Seo.jpg
 
Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.
Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.
Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.
 
Building Blocks of Web Presence
Building Blocks of Web PresenceBuilding Blocks of Web Presence
Building Blocks of Web Presence
 
Digital Marketing By krishna.pdf
Digital Marketing By krishna.pdfDigital Marketing By krishna.pdf
Digital Marketing By krishna.pdf
 
November 2016 - ECN - You're Speaking Drupalese to Me
November 2016 - ECN - You're Speaking Drupalese to MeNovember 2016 - ECN - You're Speaking Drupalese to Me
November 2016 - ECN - You're Speaking Drupalese to Me
 
Web Design Trends & Best Practices (by Blueliner Marketing CEO, Arman Rousta)
Web Design Trends & Best Practices (by Blueliner Marketing CEO, Arman Rousta)Web Design Trends & Best Practices (by Blueliner Marketing CEO, Arman Rousta)
Web Design Trends & Best Practices (by Blueliner Marketing CEO, Arman Rousta)
 
Your Digital Brand: Building a Powerful Website
Your Digital Brand: Building a Powerful Website Your Digital Brand: Building a Powerful Website
Your Digital Brand: Building a Powerful Website
 
Digital Marketing
Digital MarketingDigital Marketing
Digital Marketing
 
Easy Web Design
Easy Web DesignEasy Web Design
Easy Web Design
 
Uktisw websites-distr
Uktisw websites-distrUktisw websites-distr
Uktisw websites-distr
 
Workshop evaluating your website-05-20-10
Workshop evaluating your website-05-20-10Workshop evaluating your website-05-20-10
Workshop evaluating your website-05-20-10
 
Substance151 Best Web Practices
Substance151 Best Web PracticesSubstance151 Best Web Practices
Substance151 Best Web Practices
 
Computer 10 Lesson 8: Building a Website
Computer 10 Lesson 8: Building a WebsiteComputer 10 Lesson 8: Building a Website
Computer 10 Lesson 8: Building a Website
 
How to Create a Business Website for Success.pdf
How to Create a Business Website for Success.pdfHow to Create a Business Website for Success.pdf
How to Create a Business Website for Success.pdf
 
Building SEO Friendly Websites
Building SEO Friendly WebsitesBuilding SEO Friendly Websites
Building SEO Friendly Websites
 
Building an Online Presence
Building an Online PresenceBuilding an Online Presence
Building an Online Presence
 
Webinar "Using the Web to Maximize Your Regional Group's ...
Webinar "Using the Web to Maximize Your Regional Group's ...Webinar "Using the Web to Maximize Your Regional Group's ...
Webinar "Using the Web to Maximize Your Regional Group's ...
 
Web Page Designing- Empower Technology.pptx
Web Page Designing- Empower Technology.pptxWeb Page Designing- Empower Technology.pptx
Web Page Designing- Empower Technology.pptx
 
Mkt460 Week3
Mkt460 Week3Mkt460 Week3
Mkt460 Week3
 

Demystifying The Web

  • 2. The Loft Group We do everything you could ever need from a creative agency, and we do it very well indeed.
  • 3. Me… Technical Team Leader @ The Loft Group BSc. Internet Computing Web Design Web Development Search Engine Optimisation Project Management
  • 4. What I will show you today Basic Terminology What you need to start a website The Website Design & Development Processes Understanding your audience Managing your own website Launching your website Also brushing lightly on: Search Engine Optimisation Blogging Social Media
  • 5. Basic Terminology Domain Name : the address where your website will be located, eg. www.theloftgroup.com.au Hosting : a space on the internet where your address points to. This ‘web space’ allows end users to access your website and also provides you with email accounts.
  • 6. Basic Terminology continued Server : like the waiter who delivers your meal at a restaurant, the data needs to be served to your computer when you visit a website. Your ‘web space’ is located on a hosting server. Browser : the program you use to visit websites. Eg. Internet Explorer, Firefox, Safari, Chrome, Opera.
  • 8. Basic Terminology continued HTML : the code that holds a website together and renders all imagery and information in your browser. Hyper-text Markup Language. Image : Like your digital camera, website graphics are contained in individual files .
  • 9. Basic Terminology continued Image continued : .jpeg/.jpg = Joint Picture Experts Group – compression groups similar colours .gif = Graphics Interchange Format – stores individual colours and transparency .png = Portable Network Graphics – in a nutshell PNG combines .jpg and .gif technologies
  • 10. Basic Terminology continued Search Engine : The tool you use to locate information on the internet, eg. Google, Bing, Yahoo! www : The World-wide Web
  • 12. What Do I Need to Start a Website? Web Designer Web Developer – Loft do both Corporate Identity – colours & logo Content!!! Textual information, images, etc.
  • 13. What Do I Need to Start a Website? Rough content layout (sitemap / menu) Special requirements / features eCommerce functionality (selling products online) Photo Galleries Content Management System Etc.
  • 14. What Do I Need to Start a Website? Rough Sitemap
  • 15. The Website Design Process 1. Set your goals : Explain what you want to achieve – “I want my website to generate revenue!” 2. Set your Objectives : Explain your objectives – “I want to break into the jewellery industry and sell more jewels.”
  • 16. The Website Design Process 3. Research your Target Audience : Get an idea of what your visitors want to see. Research your competitors. 4. Look and Feel : Explain the persona you want to convey – Contemporary / Unique / Chic / Modern / Sophisticated? Highlight examples you like, but don’t rip-off an existing design!
  • 17. The Website Design Process 5. Identity : Explain how you want your corporate identity to be used. 6. Scenarios : Explain which elements are most important to your target audience’s experience.
  • 18. The Website Design Process 6. Scenario Example:
  • 19.
  • 20. The Website Design Process These guidelines will better aid you with materialising your ideas and help you speak the same language as your web designer. Design Proofs will be more accurate.
  • 21. The Website Development Process Development revolves around: Usability Accessibility And Compliance
  • 22. The Website Development Process Usability revolves around consistency Navigation must be the same throughout website Links must be represented in the same fashion eg. underlined Text based sitemap should a user need quick access to info Logo must link back to homepage Text Colour / contrast / font used – black on white = strongest User Feedback mechanisms – contact form Test the site on real people!
  • 23. The Website Development Process Accessibility revolves around catering for vision and hearing impaired users Images, animations and embedded audio must have textual equivalents Explain importance to your developer. Some find the topic does not relate to them, but imagine being deaf and captions failing during your favourite television programme.
  • 24. The Website Development Process Compliance revolves around combining Usability and Accessibility The details are a little technical, however; Search Engines favour compliant code Compliant code makes it easier for the vision impaired to use your website
  • 25. Understanding Your Audience Provide the right content! Perform demographical research, adjust content. Poll existing or prospective clientele -> insight! Example: old user -> text content instead of multimedia Conservative audience = formal copy Liberal / Young audience = less formal copy Cater for the majority eg. Skateboarders -> Punk Rock
  • 26. Godlike Privileges - CMS What is a CMS? Content Management System Not scary! Loft creates solutions based on your pre-existing knowledge. Feel empowered! It’s easy and convenient to perform regular updates!
  • 27. Godlike Privileges - CMS CMS Loft Example A basic CMS Interface. For those familiar with MS Word, editing your website is an absolute breeze!
  • 28. Godlike Privileges - CMS CMS Loft Example Artwork layer is separated from the content layer so that the shaded area is only controlled by the CMS. There’s no way you can impact your website artwork
  • 29. Search Engine Optimisation What is SEO? Making your website more visible to search engines Work with the search engines, don’t try to trick them! Search Engines only leak enough info to help SEOers
  • 30. What is a blog? Why should I blog? Abbr. -> web log = blog! Online journal, a record of thoughts / business announcements Search engines love fresh content. New content -> recrawl -> higher rankings.
  • 31. What is Social Media? Social Media = Twitter, Facebook, Linked In Linked from your website, and vice versa Social Media is powerful because it engages people in your brand. Better understand your target audience and promote your business.
  • 32. Launching your website Review all content and functionality prior to launch. Your developer will provide you with a demonstration link before your site goes live. Promote your website: Search Engines Links on related websites Sponsored listings Competitions via Social Media – free service/product to winner Get creative, suggest some ideas to your developer!
  • 33. The Loft Group Corporate Identity and Brand Management Website Design and Development Application Development Graphic Design Print Management Photography
  • 34. Notable Projects The Lost Battlefield http:// www.thelostbattlefield.com.au One Man Epic http:// www.onemanepic.com Horizon Power Intranet (Western Power)
  • 35. Thank you Disclaimer: The content and design layouts discussed in this presentation are not to be used by third parties.