10 Web Development

Learning Outcomes Describe Necessary Web Skills, Functions, & Jobs Understand the System Development Life Cycle Describe the Activities in Conceptualization Analysis Design Production Compare Website Goals To Results Testing Launch Maintenance Evaluation

Development Options Make (Create In-house) Buy (Outsourcing) More Control Buy (Outsourcing) Lower Overall Cost Higher Quality Faster Implementation Less Staff Required

Project Job Roles Web Operations Manager Oversees Strategy & Operations Content Creation & Maintenance Develops Business Plan & Annual Budget Accountable for: Staff Product & Service Delivery Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary.

Project Job Roles Administration: Level 1 Performs Research Assists in Determining Practices for Admin & Ops Hardware & Connectivity Requirements Monitoring Technical Integrity Create Proposals Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 1 experience minimum 3+ years.

Project Job Roles Administration: Level 2 Connectivity Requirements Intranet, LAN, WAN 3rd Party Liaison Implement Security Measures Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 2 experience minimum 5+ years.

Project Job Roles Administration: Level 3 Develop & Administer Processes Infrastructure Firewall Site Monitoring Quality Assurance Reviews Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 3 experience considered senior.

Project Job Roles Content: Level 1 Updates Content Based on Standards Posts Documents to Site Review Site for Outdated Content Repurpose Brochures, Newsletters, White Papers Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 1 experience minimum 3+ years.

Project Job Roles Content: Level 2 Modify & Create Content Review Content for Accuracy & Quality Grammar & Consistency Provides Direction for Converting Text to Pages Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 2 experience minimum 5+ years.

Project Job Roles Content: Level 3 Support of Web Content Strategy Strategic & Creative Development Ensures Development & Implementation Standards Content Submission & Approval Procedures Oversees Content Changes Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 3 experience considered senior.

Project Job Roles Design: Level 1 Documents Project Plans Researches Competing Sites Design Elements Unique Features Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 1 experience minimum 3+ years.

Project Job Roles Design: Level 2 Creates Project Plans & Standards Direct Implementation of UI Approves Layout Builds Prototype & Verifies Usability Work w/ Developers Special Effects, Animation, Graphics Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 2 experience minimum 5+ years.

Project Job Roles Design: Level 3 Develop UI Organizational Structure, Navigation Labeling Conventions Search Systems Final Review of Graphics, Layout, Clarity Approves Layout & Verifies Usability Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 3 experience considered senior.

Project Job Roles Development: Level 1 Program Test, Debug HTML, CSS, JavaScript, XML, Java Formulates Site Scope for Web Apps Assists in Preparing Detailed Specs Test, Debug Analyze/Revise Logic & Documentation Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 1 experience minimum 3+ years.

Project Job Roles Development: Level 2 Devises Capabilities to Solve Complex Problems Prepares Detailed Specs Technical Resource Codes Complex Routines Oversees Testing, Debugging Guidance & Training for Less-Experienced Staff Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 2 experience minimum 5+ years.

Project Job Roles Development: Level 3 Defines Scope & Objectives for Web Apps Responsible for Technical Design and UI Leads Development of Specs & Project Plans Oversees Program Design, Coding, Testing, Docs Performs Quality Assurance Reviews Directs Team Members Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 3 experience considered senior.

Project Job Roles Marketing: Level 1 Monitors Site Activity Prepares Analysis for Management Review Marketing Research Support Coordinate with Print, Radio, & Television Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 1 experience minimum 3+ years.

Project Job Roles Marketing: Level 2 Input/Recommendations Channels, Strategic Partners Branding, Marketing, Hyperlinks Assists in Developing Marketing Plans Identify Revenue-Generating Opportunities Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 2 experience minimum 5+ years.

Project Job Roles Marketing: Level 3 Develop/Implement Web Promotion Strategy Develop Strategic Partner Relationships Significant Service/Product Marketing Experience Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 3 experience considered senior.

Project Job Roles Project Manager Plans, Schedules, & Controls Activities Establishes Scope Goals, Objectives, & Expectations of Project List Required Activities Time Required Cost Estimate Order & Dependency Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 3 experience considered senior.

Project Job Roles Graphic Designer Determines Appropriate Use of Color & Graphics Designs Wireframes Creates Logos & Images Optimized for Web Note: Slide data shows typical responsibilities / skill set for Project Job Roles in medium to large companies. Job titles may vary. Level 3 experience considered senior.

Consulting Tips Communicate Through Chain of Command Don’t Stop at Your Contact Gain Knowledge Regarding Your Client’s Business Outline Decisions, Present Options Communicate Progress, Show Results Punctuality Get Sign-offs, Document Decisions Know When to Fold ‘Em

2017 Internet Experts Average Salary

System Development Life Cycle Planning Project Definition Analysis Site Structure Design Visual Design

System Development Life Cycle Implementation Site Development Testing Launch Support Maintenance

Planning — Project Definition Conduct Client Survey Interview Purpose of Project Launch a Business Presence Selling Goods or Services Increase Brand Recognition Product Information Provide Operational Instructions Employment

Planning — Project Definition Conduct Client Survey Interview Target Audience Demographics Age Gender Education Financial Geographic Measurable Goals

Planning — Project Definition Conduct Client Survey Interview Branding/Perception Goals Signifies Goods/Services Name Slogan Logo Color Scheme

Planning — Project Definition Conduct Client Survey Interview Content Source Initial Technical Specs Web Benchmarking Competition Paradigm Shifts Other Sites that Your Users Frequent Offer Comparable Features / Capabilities Communication Strategy

Planning — Project Definition Write Project Brief Derived from Client Survey Your Understanding of: Project Goals Audience Profile Audience Perception Primary Message Competitive Advantage

Planning — Project Definition Develop Persona(s) Derived from Client Survey Fictional, Yet Realistic, Description of Typical or Target User Photo, Name, Quote, & Description Demographics Technical Profile Top Three User Goals Top Three Business Objectives

Planning — Project Definition Persona Benefits Provide an Easy Way to Describe Target Audience Used as a Guide for Expert Reviews How Each Persona Would Deal with Process Determine Potential Issues within Interface Consider as Template for Prospective UX Study Recruits

Planning — Project Definition Write Technical Specifications Establish Requirements Screen Resolution Browser Compatibility Download Time Web Standards Accessibility

Planning — Project Definition Develop Project Plan/Timeline For Each Phase of Project Establish Timeline for Deliverables Establish Timeline for Tasks Assign Due Dates Assign Resources

Planning — Project Definition Document Maintenance Considerations Develop Web Site Maintenance Plan Document How Site Will Be Regularly Reviewed Updated Set Clear Expectations Regarding Support & Maintenance

Analysis — Site Structure Content Outline Create List of Existing Content Brainstorm Content that Needs to be Added Trim Anything that Does Not Match Goals Group Content Into Categories Card Sort Create Outline of Content Review with Clients for Accuracy

Analysis — Site Structure Site Diagram AKA Sitemap, Flowchart Visual Representation of Content Outline & Site Structure

Analysis — Site Structure Page Description Diagram (PDD) Display Content that Belongs on Page Display Priority of Each Piece of Content Use Horizontal Axis for Priority First Column Lists High Priority Content Second Column Lists Medium Priority Content Third Column Lists Low Priority Content

Analysis — Site Structure Wireframe Layout of Web Page Depict Containers for All Major Page Elements & Functionality Navigation Images Content Functional Elements (e.g., Search) Footer Created for Home Page Each Unique Second Level Page Any Other Significantly Different Page On Site

Design — Visual Design Review Brainstorm Design Solutions Project Brief Sitemap Wireframes Brainstorm Design Solutions Branding Guidelines Technical Requirements for Screen Resolution Browser Compatibility Download Time Web Standards Accessibility

Design — Visual Design Implement Design Principles Use Design Elements Balance Rhythm Proportion Dominance Use Design Elements Point / Line Shape Color Typography Usability

Design — Visual Design Most Frequently Produced Deliverables

Design — Visual Design Most Effective Deliverable For Each Audience Type

Implementation — Site Development Technical Plan Targets Designed For or Supported Browsers Operating Systems Display Resolution Connection Speed Page Download Size 30K and Under 30-80K (Typical) 80-100K (Heavy) 100K+ (Requires Broadband)

Implementation — Site Development Functional Plan HTML DHTML (Dynamic HTML) Interactivity JavaScript, CSS XHTML (Extensible HTML) Includes Features of HTML & XML XML (Extensible Markup Language) Elements Describe Data Passed to Client Ties Database Data to Web Pages Client, Rather Than Server, Processes Data

Implementation — Site Development Functional Plan WML (Wireless Markup Language) Design Pages Specifically for Wireless Devices Uses WAP (Wireless Application Protocol) AJAX (Asynchronous JavaScript and XML) Create Interactive Web Applications Designed To Provide Immediate Response Google Maps PHP (PHP: Hypertext Preprocessor) Server-side Database Access

Implementation — Site Development Functional Plan Java Create Web Applications CGI (Common Gateway Interface) Defines how Server Communicates with Clients CGI Script Perl (Practical Extraction and Report Language) Web Design Software Create Web Pages Without Programming Generates HTML / Some JavaScript Dreamweaver, Expression Web

Implementation — Site Development Functional Plan Rich Media Audio / Video Search Secure Credit Card Transactions Backend Technologies Database, CMS, Personalization, Login Web Analytics

Implementation — Site Development Project Plan Timeline Tasks Dependencies Responsibilities Target Dates with Deliverables Build Site

Implementation — Testing Quality Assurance Lead Create Realistic QA Plan Manage Testing Process Prioritize Issues Ensure High Priority Issues are Solved Conduct Final Review Release Site

Implementation — Testing QA Testing Content Accurate, Understandable, Spelling, Grammar Conducted by Content Contributors / Content Editors Links Review Site For Linkrot Broken Links Functionality Does Site Perform Functions Defined in Project Definition

Implementation — Testing QA Testing Validity Validate HTML / XHTML / CSS Accessibility Section 508 Tests Browser / OS / Resolution Test Site on Target Browsers Connection Speed Get Analysis & Recommendations on Page Speed/Size

Implementation — Testing QA Testing Browsers Used in Web Application Testing Worldwide

Implementation — Testing QA Testing Usability Informal or Formal Testing with Target Audience Search Engine Optimization Load Testing Contact Server Administrator to Discuss Techniques Security Review File Authorizations Review Authentication Method Conduct Authentication Test

Implementation — Testing Prioritize Issues Priority 1 Critical Must be Fixed Before Launch Priority 2 Would Enhance The Site, Can Go Live Without It Address as Soon as Time Permits Priority 3 Nice Idea / Feature, Future Enhancement Will Consider For Future Release

Implementation — Launch Style Guide Visual Design Standards Logos, Colors, Typography (Keep Site on Brand) Naming Conventions Files, Directories, CSS, Images, Titles Site Structure Document Site Diagram Indicate How Structure is Built to Handle Growth Templates Provide (X)HTML Templates and CSS Indicate Layout, Typography, Size, Color, Navigation, Menus

Implementation — Launch Minimize Downtime Consider Current Web Site Traffic Patterns Deploy FTP (File Transfer Protocol) Everyone on Team is on Call

Support — Maintenance Decide What Content Needs Updating Determine Frequency Day, Week, Month, Quarter, Annual Who Maintains Site Content Who are Content Contributors How Will Site be Updated

Support — Maintenance Analytics (Collect Statistics) Number of Visitors Pages Viewed Views Per Visit Duration Popularity

Support — Maintenance Analytics Uses Issue Indication Diagnose Specific Issues Clues to Guide Further Investigations Measurement Plan

Support — Maintenance Analytics Uses Investigations Prove/Disprove Theories Traffic – Increase/Decrease Due to Referrer Technical – Page Not Loading Properly Content – Does Not Effectively Communicate Visual Design – Distract from Calls To Action (CTA) Navigation – Specific Links/Buttons Not Being Clicked

Domain Names Company Name or Business Description Be Brief Avoid Hyphens Choose Appropriate TLD .com, .net, .biz, .us, etc. .org for Non-profits

Domain Names Brainstorm Potential Keywords Avoid Trademarked Words or Phrases Know the Industry / Competition Use Searches Verify Availability Register Domain Private Registration Additional Fee Personal Info is Kept Private & Out of WHOIS Database

Web Hosting Allows Website to be Accessible Via the Web Space Allocated on an Owned or Leased Web Server Considerations Future Growth & Scalability of Web Host Operating System Types of Server-side Processing Supported Bandwidth of Internet Connection Guaranteed Uptime Technical Support

Web Hosting Types Virtual Hosting Dedicated Web Server Server is Divided into a Number of Virtual Domains Multiple Websites are Set up on the Same Computer Dedicated Web Server Exclusive Use of a Rented Computer & Internet Connection Housed in the Web Hosting Company's Premises Can be Configured & Operated Remotely Can Pay the Web Host Provider to Administer Site for You

Web Hosting Types Co-Located Web Server Computer Your Organization has Purchased & Configured Rent Space at Web Host Provider's Location Server is Located & Internet-connected at Provider Location Your Organization Administers the Computer