Web Basics for Business
- 1. An Introduction to Websites and How They Work
- 2. Class Topics A note about web browsers Types of websites Getting started The design process Good design practices Online resources
- 3. A Note About Web Browsers IE declining Source: http://en.wikipedia.org/wiki/Usage_share_of_web_browsers
- 4. Find Your Version Number
- 5. Types of Websites: Flash Built in Adobe® Flash Used for splash pages, special effects, etc. Used by restaurants, music, movies, games, video players, and more Not supported by iPhones and iPads Many effects can be achieved with HTML5
- 6. Types of Websites: HTML4/5 HTML is a markup language used to design and layout web pages HTML+CSS+PHP+jQuery+mySQL+etc. HTML5 extends HTML4 Improves accessibility Cleaner code Support for web applications IE9+, Firefox 3.6+, Chrome 5+, Safari 4+
- 7. Types of Websites: Wordpress Originally built as a blogging platform Can be used for regular websites Plugins give a range of functionality Great for SEO “Self-hosted” on your web server Look for “1-Click Installation”
- 9. Getting Started – Domain Names and Hosting Your domain is the URL for your site: ie. www.georgiannapinto.com ~$10 per year, must be renewed! Purchase separate or with hosting Your host is where your website’s files are stored online Domain transfers, monthly billing, Google/Facebook credits, WP, etc.
- 10. The Design Process Design Consultation Structure Phase Content Phase Launch SEO and Marketing
- 11. Preparing for Your Design Consultation Examples of sites you like Examples of sites you don’t like Template sites: www.templatemonster.com www.themeforest.com
- 12. Wireframing and Mock-Ups Consider design elements separately Color, composition, scale, images, etc. Do you want horizontal or vertical navigation? Do you want a jQuery slider or flash area in your header? Are there a sidebar or highlight area with graphic buttons for visitors to click on for navigation?
- 14. Working with a Web Designer/Developer Make sure you know your designer’s abilities beforehand Graphic designers vs. Front-end programmers vs. DBAs vs. Copywriters vs. Marketers, etc. You can split up the project Have them show you examples and explain their role
- 15. “The Death Spiral of ‘Minor’ Changes” Photo: The Oatmeal
- 16. Get Organized – The Sitemap A list (and description) of every page of your site; scope of work Ex: 1. Home – will provide intro text 2. About Us – need bios 3. Contact Us – form, map, address, phone 4. Services – will have photos, text 5. Media – pdfs of articles, links
- 17. Structuring A Web Design Quote Setup and programming (10-15 hours x hourly rate) Content formatting per page (1-2 hours each x number of pages) Testing and QA (included) Extras SEO Social Media
- 18. Good Design Practices Reduce load time www.webwait.com Cross browser testing W3C validation www.validator.w3.org Elements to avoid! Splash pages, blinking text, audio, etc.
- 19. Online Resources Wix $4.95/month to connect domain $8.25/month to remove branding, free domain Central.ly Free to set up 1&1 MyWebsite Business $9.99/month, free domain
- 20. Recap About web browsers Types of websites Getting started The design process Good design practices Online resources
- 21. Questions?
- 22. Next Week, Part 2 Connecting to your web server Intro to HTML and CSS Tools to help you enhance your site Interactive: Bring your questions!