Web Site Design and Development Process
Download as DOCX, PDF6 likes2,003 views
The document outlines the typical process for designing and developing a website, including: 1) Information gathering such as interviews and requirements to understand goals and content. 2) Planning and specifications to outline design, functionality, and costs. 3) Design of templates, prototypes, and visual layout. 4) Development of HTML/CSS, forms, and other functionality.
Web Site Design and Development Process
- 1. DARYA A. BUSHMAKIN, MBA Facebook / Twitter / LinkedIn / Pinterest / Instagram / Video Resume / Website / Slideshare (603) 689 – 4513 / dbushmakingmail.com WEB SITE DESIGN AND DEVELOPMENT PROCESS Information Gathering / Analysis Input: o Interviews with clients o Mails and supporting docs by client o Discussions Notes o Online chat o Recorded telephone conversations o Model sites/applications etc. Output o Work plan o Cost involved o Team requirements o Hardware-software requirements o Supporting documents o Approval Questions to ask: o Purpose o Goals o Target Audience o Content Planning / Specification Building Input: o Reports from analysis team. Output: o Complete requirement specifications to individuals and customer/customer's representatives, responsibilities, timelines and costs, client goals, target audience Modules of site o Layout, site navigation, dynamic parts of site o Interactive forms, ecommerce, flash, etc. Site Map o List of all main topic areas ofsite,sub-topics, if applicable. Access To Servers And Build Folder Structure o FTP host, username and password o Control panel log-in information o Database configuration
- 2. DARYA A. BUSHMAKIN, MBA Facebook / Twitter / LinkedIn / Pinterest / Instagram / Video Resume / Website / Slideshare (603) 689 – 4513 / dbushmakingmail.com o Any languages or frameworks currently installed o Required software and resources (stock photography, fonts, etc.) Design Input: o Requirement specification. Output: o Site design with templates, images and prototype. Customer comments, feedback and approvals can be communicated. Web designer will create one or more prototype designs for web site (usually a.jpg image) Wireframe and design elements planning o Where visual layout of website begins to take shape Development Start with a base template Lay out main sections and content Begin carving up HTML/CSS by inserting major sections (main <div>s) for header, footer and content area. Begin adding text and image content. Elements such as interactive contact forms, flash animations or ecommerce shopping carts are implemented and made functional duringphase. Develop and test special features and interactivity. Fill with content. Test and verify links and functionality. Content Writing Input: o Designed template. Output: o Site with formatted content. There are professional content developers who can write industry specific and relevant content for site. Message, amount of copy, nuances of language, tone, etc. Launch, Testing and Delivery Input: o Site, requirement specifications, supporting documents, technical specifications and technical documents. Output: o Completed application/site, testing reports, error logs, frequent interaction with developers and designers.
- 3. DARYA A. BUSHMAKIN, MBA Facebook / Twitter / LinkedIn / Pinterest / Instagram / Video Resume / Website / Slideshare (603) 689 – 4513 / dbushmakingmail.com Complete functionality of forms or other scripts An FTP (File Transfer Protocol) program is used to upload web site files to server Web designers offer domain name registration and web hosting services Confirm all files have been uploaded correctly and site continues to be fully functional Marks official launch of site, as it is viewable to public Integration testing Stress testing Scalablity testing Load testing Resolution testing Cross-browser compatibility testing (IE, Firefox, Chrome, Safari, Opera, iPhone, BlackBerry, etc.) W3C Validation (HTML, CSS) Promotion: Be sure client is satisfied with product and all contractual obligations have been met (refer to project charter). A closed project should leave both and client satisfied, with no burned bridges. Provide documentation and source files Get client to sign off on last checks, provide contact information for support and officially close project Maintain a relationship with client (checking in a month down road to make sure everything is going smoothly is often appreciated). Maintenance Output: o Updated application, supporting documents to other life cycle steps and teams. SEO (Search Engine Optimization). Ongoing promotion Technical maintenance Content management & updating Site visit activity reports Staff training and mentoring Considerations: Often times, clients change their minds in the middle of the process. Some clients want to see ready made templates rather than a customized design. Many of the steps above intersect and are not meant to be chronological. Helpful Resources 6 Phases of the Web Site Design and Development Process- http://www.idesignstudios.com/blog/web-design/phases-web-design-development-process
- 4. DARYA A. BUSHMAKIN, MBA Facebook / Twitter / LinkedIn / Pinterest / Instagram / Video Resume / Website / Slideshare (603) 689 – 4513 / dbushmakingmail.com A 6-Step Process for Producing a Website - http://sixrevisions.com/web-development/a-6-step- general-process-for-producing-a-website/ A Comprehensive Website Planning Guide - http://www.smashingmagazine.com/2011/06/09/a- comprehensive-website-planning-guide/ Design Process - http://www.vanseodesign.com/work/design-process/ Following A Web Design Process - http://www.smashingmagazine.com/2011/06/22/following-a- web-design-process Gathering Information for Website - http://www.totaltravel.com/media/check-list.pdf Guide to Creating Website Information Architecture and Content - http://www.princeton.edu/communications/services/docs/IAguide2.pdf How to Build a Website - http://webdesign.about.com/od/beforeyoustartawebsite/p/build_website.htm Our Website Development Process - http://www.web-eze.com/process/website-development- process.html Planning and information gathering - http://www.ineonova.com/s1a13/web-design-project- phases/1-planning-and-information-gathering.html Six Phases of Web Site Design and Development Process - http://www.idesignstudios.com/faq/process/ Starting Out Organized: Website Content Planning Right Way - http://www.smashingmagazine.com/2010/03/17/starting-out-organized-website-content- planning-the-right-way/ Systems development life-cycle - http://en.wikipedia.org/wiki/Systems_Development_Life_Cycle The Complete No-Nonsense, Step-by-Step Guide to Designing Websites - http://www.webdesignfromscratch.com/design-process/web-design-process/ The Website Development Process - http://www.draydesign.com/website-development- process.htm Web Design Questionnaires, Project Sheets and Work Sheets - http://www.smashingmagazine.com/2010/11/26/web-design-questionnaires-project-sheets- and-work-sheets/ Web Development Life Cycle - http://www.macronimous.com/resources/web_development_life_cycle.asp Website Development Process - http://www.attitude.net.nz/website_development_process.html