HighEdWebDev 2006 Notes
October 23, 2006
Peter Mosinskis, Supervisor of Web Services, CSUCI
Presentation & Session Materials for HighEdWebDev can be found at:
http://www.highedwebdev.org/2006/presentations/index.html
Table of Contents
End of The Web As We Know It
Page is no longer smallest part of web: instead microcontent like RSS, instead of buying albums buying single songs on iTunes Instead of links, syndication links sites together Content itself is more important than the container
How important is home page? People don't necessarily start on home page anymore. More syndication means less people using home page probably.
How important is info arch and graphic design if you don't interact directly with site (rather thru microcontent)
Copyright implications of RSS? That content has copyright protection! Make sure that pulled in feeds aren't violationg copyright (Ticketmaster vs Microsoft)
Mobile Web
People are married to mobile devices
We are one of the only countries that pay for incoming cell calls 30 countries with more cell phones than people (2006) 3G Cellular - broadband speed on cel Always on, always connected Multimedia computers (Nokia) - no longer call some devices "cel phones"
Designing for small screens
Environmental conditions (light+sound) are different Browser compatibility-few mobile standards Accessibility-what about mouse?
Location-based services- do you create mobile-specifc content and ability to perform certain tasks
Evolution of Content
What content is, and who is writing it?
First browser was an editor and a reader (Berners-Lee); the read/write web is becoming more prevalent
50 million Americans creating content (blogs, etc) increase in web info
-
Move towards dynamic web content (internet content is changing, more realtime due to blogging)
-
Info literacy-able to identify quality credible content (Sturgeon's Law)
-
Participation-mass media move to my media
-
Attention economy-inexpensive to produce content (Youtube): now challenge is getting and keeping attention (used to be opposite in 1950s)
-
Paradox of choice-paralyzed by # of choices
-
Long tail-selling less of more, put everything out there on web
-
Importance of ambient findability (you can't use what you can't find) findability precedes usability
Rich Media
YouTube: 100 million videos a day, 65-75k videos added per day
Web as platform
Web office apps
Start pages: Netvibes + Pageflakes
Collaboration: Stikipad + Basecamp
Content
Validating credibility of our own content (Stanford guidelines for web credibility) Ceding control: we don't control message (Facebook/Myspace)N we need to work in this paradigm New skill sets Accessibility of emerging tech: AJAX, podcasts Security concerns: similar passwords across internet for common services, also storing enterprise data on web apps
Everyware
-
Computing will become invisible
-
World network (Skynet?) Bringing wifi, wireless, GPS and RFID together to provide location-based services and people-tailored services.
-
Move from a web of people to a web of things: replacing cards and keys, how do we deal?
-
Moral ethical and privacy issues of ubiquitous computing
The World Is Flat: traditional industries are being flattened (craigslist vs print classifieds) Web development might become a commodity, where is our value? Our value is understanding the business and business objectives, not just the technology.
Daniel P. Harvey, Eastern Illinois University
Ryan Gibson, Eastern Illinois University
Challenges
- Creating RSS fees
- Data entry problems
- Managing existing feed
- Overall too complex for a faculty member
Solution
- Web interface
- Eliminate coding XML
- Eliminate RSS feed data errors
- Automatic linking to audio file
- Storing files all in one place
- Generate as much info as possible automatically
Technology used: LDAP SSO (single sign-on) + PHP + MySQL
- Database & upload interface centralized
- Data stored within each person’s own acct.
- Use PHP FTP file functions for upload & validate file types
- RSS feed connects to DB and queries channel and item data
- PHP: must configure maxfilesize on PHP
Web Interface
- Change title of their channel
- View Item Listing
- View RSS feed
- Preview media
- Upload Media
- Update RSS feed
- Edit Item Information
- Delete Items
- Set Start and End Date
Q & A
How much space do you make available?
Unlimited right now.
How big are the files?
Approx 75MB per lecture for a Tues/Thurs class (longer class time).
What infrastructure do you have in place for podcast recording? What kind of training do you offer?
Part of larger initiative. Lent iPod, iTalk and lapel mic to interested parties.
Examples in the wild: Geology, Music, Examples of Spoken Middle English, A/V E-Tour of Campus Trees
Further Issues to deal with:
- Group/collaborative podcasts: multiple users to contribute to define channels
- Filtered podcast feeds: filter XML feed based on parameters set by the user
- Doesn’t insert ID3 tags (I wonder if there is a PHP module for this…)?
- Gathering user data (usage stats)
- Directory of podcasts
Through a grant (CampusEAI consortium) in which they would get $1mil over 5 years
- Oracle portal
- Helped them bootstrap the expertise
- Helped push the issue through the political/administrative process
- Best practices developed in consortium
Think Good Thoughts:
- Why are you doing this? Portal for portals sake is a waste of time…
- What purposes does it serve?
- Can you support it?
- What do you need to support it?
- What are we focusing on?
Training is necessary!
Focus Groups
- Do not develop in a vacuum, keep in close contact with your audience
- Don’t assume what is required
- Listen more than lead
Pilot Project
- Sets expectations
- Allows you to learn w/o major pain
- Get feedback for improvement
Students want customization (information, colors, fonts)
Geneseo “should’ve done” list:
- More departments/audiences sooner
- Implemented quickly after training
- Remember “big picture” goals: why? Is it helping the university?
How many on the portal team? 5-6 people on portal team, one guy (Paul) as lead
Things to consider: portal concept as “desk away from home”?
Lee Staton, Indiana University Southeast
Jenny Johnson Wolf, Indiana University Southeast
Case study: 14 days for production, corresponding with print & advertising schedule, research was outside of that
Micro-site: small off-shoot of parent web site, unique URL, specific to target/product
- It’s not your main web site (microsite.com)
- They’re a part of a total web presence
- You can get razor-sharp precision in a microsite that you can’t get on a larger web site, which has to be all things to all people
- Microsite might apply more effectively to an individual
- Building a microsite is a data-driven process, based on research
- Campus-Specific Research
- Institutional research
- Web traffic reports
- Competitive analysis of academic & non-academic web sites
- External Research
- Stamats (Teens Talk), gathering national statistics
- Arbitron (for media buying)
- Webinars
- Other research sites
- Forrester.com
- Jupiterresearch.com
- Zdnet.com
- Pewinternet.org
- Stamats.com
- Stamats shows that students decide on schools based on majors, not on school overall…so why not highlight on microsite
Case Study Microsite URL: success.ius.edu
Chose name b/c nationwide stats showed that outcomes are important to students
Goals
- Web traffic
- New records
- Applications
- Enrollment
Use Real Current Students as:
- Photography models
- Podcast & radio talent
- Bloggers
Integrated marketing: interest to Microsite driven by print/radio/web/theater/billboards/direct mail/email
Sample Ingredients
- Academic stuff
- Financial stuff
- Fun stuff
- Branding
- Marketing
- Imagery
- Podcasts/vodcasts
Measure success of microsite!
- Check it frequently
- Report on it frequently
Results of microsite example: 6000 unique visitors, online applications 50%
Microsite examples: Miller’s Man Laws, Kraft’s U Starvin, Hanes Socks on the Run
Edudirectories.com – estimated 35 times to return to web site between prospect & enrollment, how do you keep it fresh?
Tips
- Will need to be prepared so sell the idea
- Get campus buy in
- Get precise, measurable goals
- Make it extremely focused on a highly specific audience/demographic
Cal Anderson, Truckee Meadows Community College
Types of PDF Forms
- Static PDF: no form fields, print & fill out
- Dynamic PDF: can grow & shrink
- Interactive PDF: fillable form, can grow & shrink, but can add buttons & validation
Why PDF Forms?
- People can fill out any time
- Reduce inefficient data entry
- Document security
- When done right, supports assistive tech
- Formats: URLEncoded, PDF, FDF/XFDF, XML/XDP (Designer Only)
Ways to Create PDF Forms:
- Using Acrobat Pro
- Create PDF from Word/Excel
- Then uses “Acroforms”
- Backwards compatible to Reader 5+
- Using LiveCycle Designer
- WYSIWYG Form Designer
- XML based design
- Can tie in with database, populate form data FROM database
- You can import from Word, but it interprets stuff incorrectly
- Must have at least Reader 6.02+
Making a PDF Interactive
- Fillable fields
- Field validation
- Calculations
- Dynamic Capabilities (dynamically grow fields); only in Designer
- This is important when form is being printed (which he didn’t say, but is ALWAYS; people may want to print a PDF at any time for a record)
- Add Buttons (to have more fields dynamically appear; is that accessible?)
Submitting PDF Data Delivery Method
- Print
- Email: data is sent as an email attachment in XML (Designer) or FDF (Acrobat Pro); I suppose you could still print out a copy for a record; this method is not recommended
- Database (recommended):
- Create a DB w/ table names, fields
- Use ASP code/script for data processing
- Reference code file in the HTTP Submit button
- Data sent via URL Encoded (Query String or POST)
- ASP processes form data & adds to DB
- ASP can either redirect to web page or redirect WITH DATA back to a PDF file (as long as its pushing FDF formatted data back into PDF file)
- Sample code for FDF conversion in Session Handouts
- Redirect to PDF comes back as a popup
Q: What about saving form content as a person that’s filling out the form? This is important for long forms, for people with disabilities that use AT or need time, or for those who want a record of the form? What about FDF vs. XFDF?
A: They use Import and Export buttons on the form. Export exports PDF to FDF and saves locally? Import loads FDF from a local file on the computer. Apparently Acro Pro 8 will allow file data saving in Reader (may need new Reader version, reader 8).
Other Points
- X.509 support in Acrobat could be used to check digital signature data to re-use frequently used information.
- Sub-form/branching only available in Designer.
- http://presentation.tmcc.edu/ notes
Things to Consider
Is there no auto mapper to automatically or easily create database from PDF file?
Rose Pruyne, The Pennsylvania State University
Big rollouts part of older, print culture, as well as Microsoft annual software release cycle
Cycle of big rollouts sends the wrong message:
- We like to fiddle with stuff more than content
- Indicative of political football (internal conflict over web site)
- Web treated like print media
- We’re not sure what we’re doing with the web site
Big Rollout Issues
- New users to the web tend to ask around: new site blows out “tribal memory”, experienced users can’t help, so whole user network breaks down
- Users have to learn a new taxonomy (new link naming & meaning, etc.)
- No matter how much you communicate, still surprises some
- Users are disturbed/upset by change
- Take a long time to accomplish (anywhere up to 18months)
- Can become obsolete before they’re done
- Use a lot of resources
- Sometimes require content freezes
- Encourage “design by committee” b/c of their high profile
- Bog down web teams and decrease ability for rapid response (or fall behind on rollout)
- Always take longer than anyone wants
- Lead to proliferation of site-wide mistakes
When Big Rollout May be Required
- When big identity change happens
- When big disarray and every layer needs to be touched
- When content mgmt. system is implemented (MAYBE)
Agile Programming: “small, early, frequent and regular changes”, i.e., constant changes in small doses like Google Beta
- Keep users close, make them part of the team, their feedback drives change
- Fix the bugs users find FAST
- Your users are your teachers, you will learn as you go
- Always test, evaluate, validate, document
- Practice team programming
- Make web standards your mantra
- Leverage reusable objects
- Documentation: good commenting in programming code, files, tables, tasks, frequency of administration, what clients are related, who is on the team
One model: minor redesign of home page, then gather feedback & work out kinks, and apply to sub-sections of site (such as Yahoo)
Advantages of Incremental Design:
- More manageable for small shops
- Better use of part-time, temporary employees
- Allows prototyping and perfecting before moving on
- More feasible to drop stuff that doesn’t work
- Documentation less cumbersome
- Rolling back is minor
Watch out for:
- Clutter creep (like Amazon), where incremental redesign has gone too far, and site architecture gets cluttered
- Don’t work too fast
- Rabbiting: make sure incremental improvements ripple out throughout the rest of the incremental changes
References: http://blogs.das.psu.edu/rtp/id/; Articles: Jared Spool; Kelly Goto, info on usability
Martha Carrer Cruz Gabriel, Universidade de Sao Paulo
Why search engines? If we can’t find info, it doesn’t exist! - “Digital share of mind”
84% of online Americans use search engines, 87% found what they’re looking for
Search Engine Habits
- Rarely search beyond 1st page of results
- 50% leave after 2nd page of results
- 75% of users trust search engine results
- Need to be in top 10 to see web site in search
SEM vs. SEO
Search Engine Marketing (SEM): off & on page optimization
- Offpage: sponsored links, link building, directory listings (DMOZ), article writing, affiliate programs, press releases
- Onpage: SEO techniques
- SEO: part of SEM
- 98% of search engines are crawlers
- SEO concerns web page code & structures
Be patient: SEO effects only happen after indexing, which can take 45+ days
Keywords are at the core of SEO
- You must know what words people use to search (will depend on audience)
- Singular and plural words are treated differently; whole words are indexed, not word parts
- Strategy: find keywords people are using, optimize for those words, measure and test keywords and phrases (use task-based tests)
- Generic keywords attract traffic; specific key words attract conversion – both are important for broad and narrow searches
Page Code
- Page URL: influences page ranking; keywords in page URL are important
- Metatags: important to do even if search engine doesn’t use it (some do)
- Description: must stimulate user to click
- Keywords: use only 1-2 keywords per page
- Title: should contain keywords
- Heading Tags: improve ranking
- H1 gets more importance than H2
- Keywords should be at the top of page in heading tags
- Adding ALT text increases page searchability (can index that content)
- If you can, use keywords in the ALT text
- First paragraph of page: useful if you can use keywords and a brief description of the page
- Links: add keywords in text next to link (“see Courses at: www.my.edu/courses.htm”)
- Content: spread the keywords in the page. Keyword should be between 3-8% per page, no more than that, or you can get banned from SE’s
- Only 2% of web is seen via search engine
- Flash content not seen from most SE’s, except Google
- Dynamic pages: keep whatever you can as static text!
SEO vs. Sponsored Links
- Specific keywords: organic optimization SEO
- General keywords (words w/ too much competition): sponsored links or adwords
Getting Listed
- Google.com/addurl and/or Google Site Map
- Get linked from already indexed web site
- Make sure your web site is worth linking to
SEO increases traffic but not conversion: conversion is more complicated (based on business, web design, etc.)
Tips
- Check SEO frequently
- Optimize pages, not entire web sites
- Optimize for target audience, not search engine
See presentation web site for notes on tools
John Wagner, Princeton University
Princeton - 9,500 Students
Mixed structures (previous Perl/CGI/support)
Goal: Provide access to users across the University, based on our ability to support and for recognized need
Tools
- Apache ½
- PAM & LDAP Auth
- PHP5 & MySQL (as supported languages)
- Any scripting language running on Red Hat Enterprise 3 (Perl, Python)
- Stats tools (AWstats)
User Model:
- Free service: PHP+MySQL with no support (very insecure)
- Dept LAMP: $22/month for 2 sites (test & dev); charge for site development
- They have 22 sites @ this rate
- 2 IP’s, $11/each (test + dev)
- Shared Server: $60/month; charge for site development
- They have 22 sites @ this rate
- Dept ROXEN (for content mgmt); charge for site development (there is waiting list)
- Buy own server: $5k/year + server cost (UPS & system support); charge for site development
People go w/ LAMP b/c is secure & the cheapest.
Total 65 installation instances
Management: automate, simplify, decentralize
Morpheus: based on shell scripts
Users can download & install one script to get a server up and running
Douglas Tschopp, Augustana College
Helps to provide information: not the only solution
80-90 cards is optimal; 200 is way overkill (maybe only for internal users)
Art: selecting what cards you use, and interpreting the data at the end
Process
- Take cards
- Cards represent terms on a web site
- Sort them into piles of groups that would fit together
- If a card names the entire pile, put it on top
- If term doesn’t fit, set them aside
- If no term exists, write in on a card
Multiple card sorts for different audiences; test different terms for different audiences
Research shows task-based navigation is best, so test tasks using card sorting
- Only problem is, when a user is a member of multiple audiences
- Also the number of audiences that you have within an academic web site can make it difficult to list all possible tasks
Examples of things trying to solve:
- Main navigation button titled “Welcome”; words that either they were using, or others were currently using
Software
- Java-based CardSword and CardSword Zorro (on SourceForge)
Testing
- 10 HS students, who were not interested in the University
- 10 visiting scholarship candidates (all from different groups)
- Testing with adults: don’t use electronic card sorting, do in person!
Other Tests
- Group testing: test a group of HS kids (such as girls) to see how they iterate through the information
Results
- About was terrible, “General Information”
- FAQ; intramural – students didn’t know what it is
- Computing Services – students didn’t understand
Drew Hill, Campus Web Coordinator, SUNY Oswego
Usability Philosophies:
- Big ($, time, staff, report, resources)
- Usability tends to suffer
- Little
- Requires less, more feasible more frequently
- Should be part of continuous improvement process
- “Path of least resistance” for testing: make it easy for others (you bring the beer, watch your neighbor)
Wireframes
- Make a Plan
- Make a schedule (1+ phases)
- Set goals (nomenclature, info arch)
- Problem statement (how will goals be confirmed)
- Identify sections to be studied
- Confirm critical paths (how to apply, where to find majors, etc)
- Determine user profile (identify target audience)
- Methodology (what you’ll do and how)
- Testing outline (how testing will happen, also post-test follow up)
- Summary of results
- Recommendations report
- Develop Usability Script
- Wireframes are rough representations of content placeholders, where content will be plugged in (no colors, no logo, nothing graphical to distract from functional aspects)
Methodology
- 6-8 people, 1 hr sessions (of high-school students)
- Testing done with wireframes
- Copy was “greeked” (lipsum)
- Video tape sessions w/ nondisclosure
Near-Launch Testing
- 16-18 HS juniors & seniors
- Prototype GUI
- Use a web survey tool to gather data
Post-Launch Testing
- Thinking out loud
- Used eye-tracking software
- Video & audio recording of experience
- Took a semester to gather!
Tools
- ULab Data Tool (Indiana University) – Excel spreadsheet to aggregate data
- ASL EyeTrac 6000
Tasks
Testers
- Pre-launch: 8 in each group; different HS groups (one rural, one urban)
- Post-launch: 3 HS, 3 faculty/staff, 3 current students
- Smaller groups better than larger groups; better small groups w/ frequent testing than larger group with infrequent testing
Observations
- The Good: Lots of data & good findings; little time investment
- The Bad: eye tracking hard to use & didn’t yield enough data (could be specific to that version); hard to quantify some data (such as video); hard to schedule participants (high schoolers)
- For future: more scenarios; testing on-site in people’s actual environment; focus on critical paths & institutional goals (such as admissions); repeat testing often with small groups
- When to stop testing? One way is to set out a certain percentage of success on a type of task?
- It would be good to get to quarterly testing; testing different things quarterly, some of the same tests, but most different
Resources
www.usability.gov/templates - CIF (common industry format) for usability reporting
www.sensible.com/ - Steve Krug’s site
www.indiana.edu/~usable/tools_templates.html
Carol Burritt, Monroe Community College
Since 1999
- Gathering info in Lotus Notes DB (includes PW protection, workflow + approval)
- One button export to the Web, with a RTF that goes to print for publication
- ½ was using this process (worked well, ½ didn’t)
- Process problems
- 30 originators
- content balance was unstructured & scattered
- Editing styles varied greatly
- Sloppy editing
- Interoffice mail
Project to fix remaining ½ (“Pubflow”)
- Timeline: 1 year
- Scope: structure content in Lotus Notes
- Participation: all people would be trained for production
- Must be sustainable (they did it with grant project)
Problems
- Wanted to go out of InDesign into Notes for editing
- Participation: big learning curve for Banner
Dorothy Hoskins, TextenergyLLC, XML consultant
- Map Tags to Styles (used for XML import into InDesign)
- Map Styles to Tags (used for export)
Rick Ells, University of Washington
Tim Berners-Lee “HTML should convey the structure of hypertext, not the presentation of the document”
Device independent approach important for making the web work
Keyboard test: the primary test of whether an interface will be accessible to assistive tech or not
X-C/P – XHTML markup, with content/presentation separation
XCP accessibility:
- Keyboard accessible
- Alternative stylesheets
- ALT text for non-text elements
- Labels bind titles to form controls
- Logical structure of elements to help in semantic interpretation & navigation
- Coherent sequence of content
- Page-by-page display
Dynamic rich media (AJAX, ATLAS, FLEX, Flash)
- Dynamic modification of page content between page loads
- Most current AT is page oriented (page is scraped AFTER loading by AT)
Features of User Interfaces that Are Accessible (Java Accessibility API, Microsoft Accessibility API)
- Standardized roles for interface divisions (each box in a UI has a standardized naming and use convention; makes it possible for AT to integrate closely)
- Standardized properties for elements (common in software languages)
- Focus mgmt
- Interaction model
- Device navigation mappings
- Semantics Interpretation
- Change Notification
Web Applications: you must look at Sec508 1194.21 (apps) AND 1194.22 (static web pages)
Progressive Enhancement: build a foundation of standards-based, validated accessible content & function, and ENHANCE with rich media (enhance as a supplemental function, not as core functionality)
ATLAS: MS version of AJAX
Definition of web application: if important content is being manipulated between page loads, you have a web application
- Evaluate by 1194.21 and WCAG2
What to figure out:
- How to notify client of content changes, and their location
- Managing focus so that it works with AT
- Standard roles for document parts
- Negotiate contract between client and application
What can fall apart w/o careful implementation
- Losing semantics
- Silo’ed approach to thinking
- Toolkit bias
- Vague direction from management
Key issue: AT software is not great, this is a weak link
Brian Wm. Niles, TargetX
History of Recruiting
- 1.5 approach: talk AT the student
- 2.0: you are no longer in control of the message: who, when & how
New Statistics
- 25% of college applicants 1st point of contact was admissions application (TargetX research)
- 2 companies have indicated 20-25% are applicants that the U. has not previously communicated with
- 75% of students are researching colleges online
- Students would like to have profiles of students (90% want a financial aid estimator); 70% would like to use IM to talk to counselor
- Email: used to talk to “old people”
- IM: used for casual written communication with friends
- People don’t want to be contacted via IM; people want to contact others via IM (no clear stats on this either way)?
Sam Jackson: a student who is blogging a college search process
“The Over Achievers” – book about students who are at the high-end of the academic process
“Why Most University Web Sites Suck” – from a blog
Campus visit is important!
Helicopter parents: parents overly involved in the process; Millennial generation are very close to their parents, so creating an inclusive process to communicate with the parents
Key Points
- Start recruiting earlier – students are starting searches earlier (sophomore & junior year of HS)
- Embrace parents – collect names & email addresses, involve parents-of-students association in recruitment activities
- Dedicate resources to “electronic recruiting” – less roadwork, more online
- Hire the right vendors – with experience in electronic marketing, not just print
- Let go – admissions office is no longer in control; they’re talking about you other places; they want the truth (like Amazon, RateMyProfessor, checking user reviews)
- Get personal – involve yourself as a marketing person in the technology (IM, blogs, podcasts, etc); participate personally yourself before you use it professionally
Other Ideas
www.targetx.com/knowledge (best practices & resources web site)
Keynote Speaker: Todd Markelz, Assistant Webmaster, Google
Google landscape
- 18 webmasters for ~8000 employees
- They are developing their own CMS (XML+XSL)
InternetWorldStats.com:
- 77% of world’s internet-connected users are outside of the US
- 67% of the world’s Internet users primarily speak a language other than English
Higher-ed is unique in that your wide-ranging experience gives you an edge to complete a variety of tasks; gives you a bird’s eye view/big picture that you can’t get working in a small area in the private sector (ideal environment for growing as a web professional); you don’t need to feel like an expert in any one area, the big picture is more important
Helping researchers share their expertise & discover the web
Higher ed wants to “do the right thing” to solve problems on the web; that culture is embraced in higher ed (such as building standards-based, accessible web sites); not about easiest or fastest solution
Personalized home pages: are picking up steam
