overview_web_standardsx
Download
Report
Transcript overview_web_standardsx
overview of
Web standards
01
Web standards
Logan franken
What Are
Web standards?
Logan Franken
What Are
Web standards?
What Are
Web standards?
A collection of
Best Practices for website
Design and development
Who Cares?
Who Cares?
if it looks good, it’s fine, Right?
Sure, it looks good, but what about:
Sure, it looks good, but what about:
Screen-Readers
Search Engines
Cross-Browser
Sure, it looks good, but what about:
Screen-Readers
Search Engines
Cross-Browser
Maintainability
University Identity
Security
Sure, it looks good, but what about:
Screen-Readers
Search Engines
Cross-Browser
Maintainability
University Identity
Security
Performance
Keyboard Support
Color Blindness
Sure, it looks good, but what about:
Screen-Readers
Search Engines
Cross-Browser
Maintainability
University Identity
Security
Performance
Keyboard Support
Color Blindness
Privacy Notifications
Print Version
Spirit Animals
Sure, it looks good, but what about:
Screen-Readers
Maintainability
Performance
Privacy Notifications
Search Engines
Cross-Browser
University Identity
Security
Keyboard Support
Color Blindness
Print Version
Spirit Animals
GEEZ
Okay, okay
Okay, okay
Where can I get help?
Web standards guide
Ucsb.edu/webguide
WHOA
WHOA
Where can I get started?
CHECKLIST
Quick and easy reference
Best Practice Examples
Templates to get up-and-running
Get Involved!
Web standards Group
It.ucsb.edu/groups/wsg
Meets first Tuesday
10:30AM – 12Noon
Questions?
overview of
Web standards
02
Social media
Keri bradford
presentation
Bit.ly/wsgsocial
overview of
Web standards
03
Mobile and responsive
Logan franken
Mobile
and
What Are
responsive?
Logan Franken
Why support
mobile devices?
Two approaches
Two approaches
Device Experience
Responsive
DEVICE EXPERIENCE
Desktop Site
Desktop Site
Mobile Site
Desktop Site
Mobile Site
Tablet site
Optimized for each device
Optimized for each device
Maintain separate sites
DEMO
Responsive
The site
ONE future-Proof Design
ONE future-Proof Design
Development complexity
DEMO
Okay, SO I WANT
Device-experience
responsive
Okay, SO I WANT
Device-experience
responsive
UCLA MWF
UCLA MWF
Mobile web framework
UCLA MWF
Mobile web framework
Easily create a mobile site
DEMO
Learn more
Mwf.library.ucsb.edu
Mwf.ucla.edu
Okay, SO I WANT
Device-experience
responsive
Best practice templates
Ucsb.edu/webguide/best-practice-examples
Third-party frameworks
Twitter bootstrap
Zurb foundation
Questions?
overview of
Web standards
04
policies
Tessa mendez
Tessa Mendez
Policy Coordinator
Office of the Vice Chancellor
Administrative Services
[email protected]
Privacy
Notification
Statement
Surveys
Terms of Use
Copyright
Use of
University Name
Advertising
“Click-Throughs”
Goals for
Presentation
Privacy
Notification
Statement
Some websites are
required by law to
have a privacy
statement.
California
Information
Practices Act
§1798.17
Each agency shall provide on or
with any form used to collect
personal information from
individuals the notice specified in
this section.
What is personal
information?
NAME
If a website
collects
personal
information,
what must the
privacy
notification
contain?
http://www.policy.ucsb.edu/privacy-notification/
Why?
Respect and
Stewardship
California Online
Privacy Practice Act
For all other
UCSB websites a
link to a privacy
statement in the
footer is
encouraged.
Each agency shall maintain in
its records only personal
information which is relevant
and necessary to accomplish
a purpose of the agency.
Information
Practices Act
Who owns the data?
Surveys
Who governs its release?
Can people opt out?
(Public Records Act)
Are there controls on data reuse?
Who should people contact
with questions?
Copyright
Terms of Use
Reference
Information
Protecting the
University
Copyright © The Regents of the University of
California, All Rights Reserved. UC Santa Barbara,
Santa Barbara, CA 93106 • (805) 893-8000
Site Map • Privacy • Terms of Use • Web
Accessibility
Use of the
University
Name,
Seal,
& Logo
No person or organization may use the
University name in conjunction with
advertising or to list the University as a
user of any product or service or as the
source of research information on which a
commercial program or publication is
based.
Acknowledgements
and
Advertising
An acknowledgement is not
to promote or endorse the
sponsor, the sponsor’s
products or services.
Sponsor/Donor information
should not dominate any
UCSB Web page, unless the
page’s clearly stated purpose
is to acknowledge the support.
Internet-Based
Services and
Software
“Click-Throughs”
Indemnification
Regents Standing Order 100.4 (dd).9
requires the specific authorization from
UC Board of Regents to enter into
agreements where the University
assumes liability (e.g. provides
indemnity) for the acts of parties
beyond the University’s control.
Risk and Impact
Must consider the sensitivity of data
being stored or processed and the
business criticality of the functions
being moved to the cloud.
Favorability
Must consider other terms of the
contract: data access/ retention/ transfer,
governing law, limitation of liability,
representations and warranties,
response to legal orders, Terms of
Service, 3rd party audits, acceptable use
policies
What resources are available?
UCSB Privacy Notification Statement
http://www.policy.ucsb.edu/privacynotification/
UCSB Privacy Advisory
http://www.policy.ucsb.edu/policies/ad
visory-docs/privacy-statementadvisory.pdf
ABCs of Privacy and Access to
Records
http://www.ucop.edu/generalcounsel/guidance/access-to-andprivacy-of-records/index.html
Terms of Use
http://www.policy.ucsb.edu/terms_of_
use/
Use of University Name
http://www.policy.ucsb.edu/policies/lo
go/
Advertising
http://www.policy.ucsb.edu/policies/po
licy-docs/advertising-guide.pdf
http://www.policy.ucsb.edu/policies/ad
visory-docs/WebAdMatrix.pdf
Web Standards Guide
http://www.ucsb.edu/webguide/policies
Policy Website
http://www.policy.ucsb.edu/policies/
overview of
Web standards
05
security
Sam horowitz
Introduction to Web
Standards and Policies
Web Application Security
Why Security In This Context?
• Because lack of security is pervasive
•
•
•
•
Allows theft of sensitive data
Permits corruption of content or data
Allows bad things to happen in the UCSB’s name
Provides a vector for other types of attacks
What is Web Application Security?
• But I don’t have an application…
•
•
•
•
•
•
If you have a web server, that’s an application
If your pages display dynamic data, that’s an application
If your page has a form, that’s an application
If your pages use cookies, that’s an application
If your page uses any scripting, that’s an application too
Of course, if you write code for a back end, that’s an application
Understanding Security Risks
• The Open Web Application Security Project (OWASP) has compiled a
“Top 10” list of risks
Injection
Sensitive Data Exposure
Broken Authentication & Session
Management
Missing Function Level Access Control
Cross-Site Scripting (XSS)
Cross-Site Request Forgery (CSRF)
Insecure Direct Object Reference
Using components with known
vulnerabilities
Security Misconfiguration
Unvalidated Redirects and Forwards
A Word About Credit Cards
• Heard of TJ-Maxx, Target, or Michaels?
• Heard of Brockport College, USC or UC Riverside?
• UCSB processed 129K transactions totaling $13.8M last fiscal year.
July-February 239K transactions $11M
• Credit and Debit cards are special
• If you don’t have to take them, don’t
• You can refer to a payment processor (e.g. Authorize.net)
• If you do need to process credit cards, read the PCI DSS. It’s worse
than it looks.
Web Security and You
• As a web developer it’s your job to protect your users, UCSB, & the
worldwide web
• You need to know what you are protecting and what you should be
serving
• You need to know and understand what can go wrong & you need to
prevent it
There is Help
• The web has a plethora of help available
•
•
•
•
OWASP is a resource https://www.owasp.org/index.php/Top_10
Multiple tutorials are available by Google search
Wikipedia is pretty good in this area
Youtube videos explain risks and how to mitigate
• Vendors in this space have references too
• Veracode, HP Fortify, Imperva for example
Thank You
overview of
Web standards
06
accessibility
Logan franken
What Are
Accessibility
Logan Franken
What is
Web Accessibility?
Equal access
To web content for
everyone
Types of disabilities
Source: webaim.org
Visual
Blindness, Low Vision, Color-Blindness
Visual
Hearing
Blindness, Low Vision, Color-Blindness
Deafness, Hard-of-Hearing
Visual
Hearing
Blindness, Low Vision, Color-Blindness
Deafness, Hard-of-Hearing
Motor
Inability to Use Mouse, Slow Response Time, Limited
Fine Motor Control
Visual
Hearing
Blindness, Low Vision, Color-Blindness
Deafness, Hard-of-Hearing
Motor
Cognitive
Inability to Use Mouse, Slow Response Time, Limited
Fine Motor Control
Learning Disabilities, Distractibility, Inability to
Remember/Focus
The law
The law
Section 504
section 508
Americans with disabilities act (ADA)
Office of Civil Rights (OCR)
The law
Section 504
section 508
Americans with disabilities act (ADA)
Office of Civil Rights (OCR)
The law
Section 504
section 508
Americans with disabilities act (ADA)
Office of Civil Rights (OCR)
The law
Section 504
section 508
Americans with disabilities act (ADA)
Office of Civil Rights (OCR)
UC EALT
UC EALT
Electronic accessibility
Leadership team
Ucop.edu/electronic-accessibility
WCAG 2.0 Level AA
An accessible website
is a good website*
An accessible website
is a good website*
*vice versa
Resources?
Ealt General INFO
Ucop.edu/electronic-accessibility
UCSB General INFO
ucsb.edu/webguide/web-accessibility
Tools?
Amp tool
DEMO
Contacts?
Mark GROSCH
adaptive technology specialist
ada web compliance officer
ealt campus contact
Questions?
overview of
Web standards
07
Content management systems
David gurba
Content Management
Systems at UCSB
WSG - Web Standards and Policies
Presenter: David Gurba <[email protected]>
CMSs on Campus
● SiteFinity by Student Affairs
● Wordpress http://www.wordpress.org/
● Drupal http://drupal.org/
Drupal Resources
●
●
●
●
Development (Coding & Design)
Web Hosting
User Groups
Web Resources
Developers on Campus
Ocean ‘O Graphics Monica Pessino <[email protected]>
http://www.news.ucsb.edu
http://education.ucsb.edu
http://msi.ucsb.edu
http://www.oep.ucsb.edu
Recharge rate is ~$50 per hour for on campus clients,
and ~$70 for off campus clients.
Developers on Campus
Artworks David Gurba <[email protected]>
http://sagecenter.ucsb.edu
https://ccs.ucsb.edu
http://www.theaterdance.ucsb.edu/projects/odyssey/
https://rmp.id.ucsb.edu
Recharge rate $55/hr on-campus; $83 off-campus.
Web Hosting on Campus
LSIT http://lsit.ucsb.edu/
● has a Drupal Platform for L&S departments, projects
and professors. If your site fits in their platform you
may use it free of cost.
● http://lsit.ucsb.edu/helpdesk/shares/department
● Host PHP and other technologies for free.
Web Hosting on Campus
ETS http://www.ets.ucsb.edu/services/ets-
sites
● Host’s drupal websites
● Simple sites -- defined as those containing less than 80
feature "modules" -- cost $352/year
● Complex sites -- which are those that contain 80 or
more "modules" -- cost $980/year
Local User Groups
UCSB Drupal Users Group
https://it.ucsb.edu/groups/drupal
http://wiki.eri.ucsb.edu/sysadm/Category:Drupal
Santa Barbara Drupals User Group
https://groups.drupal.org/sbdrupal
Web Resources
http://drupal.stackexchange.com (free)
http://drupal.org (free, Issues, Docs)
http://buildamodule.com ($)
http://lynda.com (free for campus!)
https://drupal.org/irc (free, make a friend!)