copyright © 2012 certification partners, llc -- all rights reserved site development associate v2.0
Post on 27-Mar-2015
219 Views
Preview:
TRANSCRIPT
Copyright © 2012 Certification Partners, LLC -- All Rights ReservedCopyright © 2012 Certification Partners, LLC -- All Rights Reserved
Site Development Associate v2.0
Copyright © 2012 Certification Partners, LLC -- All Rights ReservedCopyright © 2012 Certification Partners, LLC -- All Rights Reserved
Lesson 1:Markup Language and
Site Development Essentials
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Lesson 1 Objectives
• Discuss Web page creation• Discuss mobile and cloud issues• Introduce text editors and markup languages• Introduce graphical user interface (GUI) editors• Discuss the history of markup languages• Introduce the HTML Web development trifecta• Discuss Web site development principles• Introduce hosting and Web service providers• Introduce the Habitat for Humanity Web site
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Creating Web Pages
• Web page authoring is becoming a standard skill set for many careers
• You must know:– Hypertext Markup Language (HTML)– Cascading Style Sheets (CSS)
• Additional technologies include:– Flash– Java– ActiveX– Microsoft Silverlight
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Mobile and Cloud Issues
• Web site development has been impacted by:– Smartphones, tablets and other mobile devices– The cloud
• Cloud services– Do not require knowledge of HTML to create Web
pages– Users simply "point and click" the available Web site
tools to design a personalized page
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Text Editors and Markup Languages
• You do not need to use a special editor application to create markup– You can use a simple text editor (e.g., Notepad
or Vi)• When creating HTML files, you must:
– Save the text as plaintext– Save the file using either the .html or .htm file
name extension
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Graphical User Interface (GUI) Editors
• GUI HTML editors:– Create HTML code for you
• You type page text as you would with a standard word processor
• You point and click with a mouse• Popular GUI HTML editors include:
– Adobe Dreamweaver– Microsoft Expression Web– Mozilla SeaMonkey– Adobe GoLive– KompoZer – Bluefish
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Why Learn Markup Languages?
• GUI HTML editors do not keep pace with the latest improvements in markup language
• You can add features to pages not supported by the editor
• You will not be limited by the GUI editor’s capabilities
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
History of Markup Languages
• Standard Generalized Markup Language (SGML)– Originally created by IBM in 1986– A metalanguage, meaning it is used to create
other languages– The basis for HTML, XHTML and XML– You create your own document rules using a
Document Type Definition (DTD)
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
History of Markup Languages (cont'd)
• Hypertext Markup Language (HTML)– Based on SGML, invented by Tim Berners-Lee– Allows hyperlinks– HTML vs. SGML
• HTML versions include:– HTML 3.2– HTML 4.01 (the most popular version of HTML)
• HTML 4.01 flavors include:– 4.01 Strict – requires all container tags and does not allow
deprecated tags– 4.01 Transitional – allows deprecated tags, not as strict– 4.01 Frameset – for use with frames
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
History of Markup Languages (cont'd)
• Extensible Markup Language (XML)– A subset of SGML, also a metalanguage– XML describes data instead of formatting– HTML or XHTML provides formatting and document
structure• Extensible Hypertext Markup Language (XHTML)
– Combines HTML with XML – XHTML allows HTML to become XML-compliant
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
History of Markup Languages (cont'd)
• HTML5– The latest version of HTML under development by
the W3C– Provides modern requirements for the Internet with
fewer plug-ins
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Universal Markup Creation
• Follow W3C standards• Benefits of following standards include:
– Code will render as expected in more browsers – Pages will be more scalable (as you add more
sophisticated content, you will not run into problems)
– Pages are more likely to be available to disabled users
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
The HTML Web Development Trifecta: HTML5, CSS and JavaScript
• The future of Web design lies within three technologies:– HTML5– Cascading Style Sheets (CSS)– JavaScript
• These technologies used together provide Web pages that easily adapt to smartphones, tablets, gaming devices and smart TVs, as well as to traditional PCs
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Project Management and the Web Development Project Cycle
• Create and document an initial Web site plan• Obtain relevant input from stakeholders• Communicate the Web site plan• Consider technical and non-technical concerns• Develop the site• Publish the site• Manage the site
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Developing Accessible Web Pages
• Americans with Disabilities Act (ADA)– Enforced by the U.S. Justice Department– Requires Web designers to create "reasonable
accommodations" for disabled users:• Ensuring that all images have text-based
descriptions• Providing text-based alternatives to all non-text
content (e.g., Java applets and Flash presentations)
• Providing easy-to-read forms
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Developing Accessible Web Pages (cont'd)
• Web Content Accessibility Guidelines (WCAG)– Provided by the W3C Web Accessibility Initiative
(WAI)– A product of worldwide cooperation
• Section 508 of the Rehabilitation Act– All federal agencies must ensure that all electronic
and information technology developed, procured, maintained or used by federal agencies be comparably accessible to users with disabilities
– Based on the WCAG
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Verifying Web Page Accessibility
• Many tools available, including:– W3C Page Validator – Total Validator – Cynthia Says – Vischeck – MAGpie
• Adopt a single W3C standard and apply it consistently throughout your site
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
General Web Page Accessibility Considerations
• Visual challenges– Text readability– Text support for images– Screen reader support
• Audio challenges– Alternative audio support– Alternative speech input– Text support for audio elements
• Cognitive and technical challenges
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Creating and Documenting an Initial Web Site Plan
• Site plan is a rough outline of planned development
– Site diagram
– Storyboard
• Wireframing
– The process of developing an outline for a Web presence
• Determining audience and message
• Validating design issues
– Consider issues such as central message, fonts, images, colors, ethnic and cultural diversity, and common color schemes
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Obtaining Relevant Input from Stakeholders
• Stakeholders are relevant organization employees or contributors who can provide or help determine:– The purpose of the Web site– The services that the audience requires from the site– Development timelines
• As you work with stakeholders:– Remember that non-technical people may be asked to
approve your project– You must translate technical issues into non-technical
language• Team members can include representatives from marketing,
IT, sales and other areas of your organization
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Documenting and Communicating the Plan
• Create a storyboard• Document decisions in meetings and follow up• Communicate the plan in various ways:
– Calling relevant parties to ensure that everyone is satisfied
– Sending e-mail messages– Sending postal ("snail mail") messages if necessary– Sending fax messages– Telephone calls
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Communicating the Web Site Plan
• Use oral presentations and presentation aids, including:– Presentation software – Overhead projection– Whiteboards– Easel and poster paper– Charts – Published handouts
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Leading Discussions
• Strategies leaders use to manage a meeting:– Make introductions– Recall past business– Create a list of action items, including timelines– Monitor time– Ensure proper discussion focus– Handle heated discussions– Distribute minutes
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Considering Technical and Non-Technical Concerns
• Leaders can ensure communication by:– Regularly asking if anyone has questions– Asking team members to summarize their
understanding of decisions– Asking a third party to deliver a summary of
progress– Writing regular updates about the project
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Developing the Site
• As your team develops the site, you will be engaged in various activities:– Creating markup code– Testing functionality– Approving the site– Publishing the site
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Testing Pages in Multiple Browsers
• As you develop Web pages, test them using multiple Web browsers
• Different generations of the same browser may interpret HTML somewhat differently
• Browser vendors also implement standards differently• Browser types include:
– Microsoft Internet Explorer– Mozilla Firefox– Google Chrome– Opera– Lynx
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Managing the Site
• When managing a site, you must be prepared to:– Create new content– Update dead links– Remove old sites– Remove unused pages– Ensure connectivity– Report access troubles – Process feedback from customers and
stakeholders
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Obtaining Feedback
• Your Web team must process various types of feedback
• Feedback can come from various sources• Ways to obtain quality feedback
– Providing Web forms on the site that ask for customer input
– Conducting surveys in person– Conducting surveys via e-mail
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Intellectual Property
• A unique product or idea created by an individual or organization– Generally has commercial value
• Never "borrow" content without express written consent• Review copyright and trademark issues (e.g., trade secrets,
licensing, infringement, plagiarism)• Understand copyright scope, reach and time limits• Consider ethical issues of copyright and plagiarism• Avoid copyright infringement, trademark infringement and
plagiarism by:– Reviewing content– Obtaining express written consent– Creating reasonable deadlines
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Outsourcing
• Increasingly, Web development work (including site design) is being outsourced to workers in remote locations– May save the company money– May require you to work with remote workers
• As you use and work with remote teams, you may have to obtain:– Non-Disclosure Agreements (NDAs)– Legal consultation
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Hosting and Web Service Providers
• Internet Service Provider (ISP)– Provides basic services
• Internet connectivity• Web server
– You need your own experts• Cloud service provider
– Provides more advanced services • Software-as-a-service (SaaS)• Backup services and nearly unlimited hard drive space • Advanced Web and database connectivity• Enterprise resource planning (ERP)
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Co-Location, Dedicated Hosting and Virtual Servers
• Co-location• Dedicated hosting (co-hosting)• Virtual server
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Costs of Using a Cloud Service
• Costs associated with a cloud service include: – Database connectivity– Per-service costs– Bandwidth– Customer support– Security– Application development
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Negotiating Web Services and Communicating Needs
• Be prepared to detail your needs• Negotiate prices by providing information:
– Potential amount of traffic– Hard drive space needed– Database and CGI needs– Additional services (e.g., custom applications)
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Information You Need from Your Service Provider
• Account information• IP addresses and DNS names of the server• Instructions about file and directory locations• Service provider's contact information
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
The Habitat for Humanity Web Site
• A not-for-profit, volunteer-driven organization that builds and sells homes for families worldwide
• Has built more than 150,000 homes worldwide
• A Web site example in this course
• Like any Web site, it targets an audience
– The site is part of a concerted effort to bring in volunteers
– People with technical expertise must run the site
– More than technical expertise is required –the Web design team must also understand the business goals
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Lesson 1 Summary
Discuss Web page creation Discuss mobile and cloud issues Introduce text editors and markup languages Introduce graphical user interface (GUI) editors Discuss the history of markup languages Introduce the HTML Web development trifecta Discuss Web site development principles Introduce hosting and Web service providers Introduce the Habitat for Humanity Web site
Copyright © 2012 Certification Partners, LLC -- All Rights Reserved
Site Development Associate v2.0
Markup Language and Site Development Essentials HTML5 Coding Cascading Style Sheets (CSS) and Graphical Elements Hyperlinks HTML Tables Web Forms Video, Audio and Image Techniques Extending HTML GUI HTML Editors and Mobile Web Sites Web Site Development for Business
top related