Demystifying The Web
Download as PPT, PDF•1 like•267 views
The document outlines the services provided by The Loft Group, focusing on web design and development. It explains basic terminology related to websites, the processes involved in creating a website, understanding the audience, and effective content management through a CMS. Additionally, it touches upon search engine optimization, blogging, and the importance of social media in promoting a brand.
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.
- 7. Basic Terminology continued Browser :
- 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
- 11. How these components interact
- 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. The Website Design Process Present your Sitemap : Articulate structure. These steps help your web designer to enhance the visibility of areas you wish to emphasise and helps to arrange visual elements.
- 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.