An alphabetical tour of digital media landscape terminology, covering concepts from Ajax to Usability. Designed for training of journalists entering the digital media landscape.

2. Knight Digital Media
Center

3. Web Geek Basics
Scot Hacker

4. Ajax •Asynchronous Javascript and XML
•AKA “Javascript finally works”
•No full-page refresh, URL doesn’t change
•More like desktop apps
•Async database updates

5. Bounce Rate
•From stats/analysis
•User hits one page and leaves
•You want to reduce bounce

6. Cache
•Data stored locally for performance
•Client (browser) stores copy of page
•Server stores precompiled Java/PHP/Python, etc.

7. Cascading Style Sheets
•Syntax for controlling appearance of pages
•(HTML is for logical structure, CSS for looks)
•Decoupled from HTML
•Targets either official HTML tags or custom elements
•Ideally site-wide

8. Client-side / Server-side
•Servers provide services
•Outlook/Mail.app are clients of your mail server
•Firefox/Safari/Chrome are clients of a web server
•PHP/ASP / Django / Rails are server-side
•Javascript/Flash are client-side

9. Content Management
System
•aka CMS: Database-backed publishing system
•Creates pages “on the fly”
•Site workflow, consistency, automation
•WordPress, Drupal, Sitepoint, Ektron, dotCMS...
•More than 600 on the market
•Free <--> $$$ ... often proprietary

10. DNS
•Domain Name System
•Translates IP addresses to human-readable domain names
•A critical backbone
•A "nameserver" runs DNS software

11. Domain
•example.com
•Top level domains: .com, .net, .org, .edu, .gov
•Subdomains: www.example.com, projects.example.com
•Create/manage at a “registrar” like GoDaddy or Moniker

12. Embed/IFRAME
•Code running on remote site embedded in yours
•HTML and/or Javascript
•Google Maps/Charts, Vimeo videos, widgets
•Copy into HTML mode in your CMS (permissions)

13. File Formats - Audio
•Audio alone not great on the web (except podcasts)
•MP3 - Most common compression format - 1/10th size
•128kbps+ for music, 64kbps for spoken word
•Compressed MOV also acceptable
•AIFF and WAV - Raw, uncompressed

14. File Formats - Image
•TIFF, RAW - Uncompressed, large files, high-quality
•PSD - Photoshop native, with layers, masks, editable text
•JPG - Best for web photography. Full color, lossy compression
{ •GIF - Smallest files for line art (256 color, transparency)
•PNG - Full color, lossless compression, transparency, OSS

15. File Formats - Video
•MOV (QuickTime), WMV (Windows Media)
•Also MP4, M4V
•Can be compressed or uncompressed
•Aim for 4MBs/minute in compression
•Even compressed, files and bandwidth bills are big
•Recommend embedding w/ Vimeo or YouTube

16. File Formats - Web
•Only these can be in web folders:
•Documents: HTML, CSS, JS, PHP, ASP maybe PDF
•Audio: MP3, MOV, M4V, MP4, WMV (compressed)
•Video: MOV, FLV (compressed)
•Images: JPG, GIF, PNG (compressed)
•Orphans = unused = clutter

17. Fluid vs. Fixed Layout
•Resize browser window to test
•Fluid works on more devices, but gives less control
•Fixed more common by far (mastheads)
•Recommended width for fixed: 960px (i.e. 1024 screen)

18. Fold (below the)
•Analogy to newspapers
•Content out of sight before user starts vertical scrolling
•Used to be considered worthless; not anymore

19. Font family
•You can only use fonts installed on all/most computers
•These tend to be grouped by similarity
•font:12px verdana,arial,helvetica,sans-serif;
•Situation changing fast!
•TypeKit, Google Fonts

20. FTP
•File Transfer Protocol ( http:// nntp:// email:// ftp:// )
•Internet’s oldest protocol
•Move files between any two computers on net

21. FTP
•File Transfer Protocol ( http:// nntp:// email:// ftp:// )
•Internet’s oldest protocol
•Move files between any two computers on net

22. Hash tag (Twitter)
•Instant saved search - gathers conversation on same topic
•Popular for breaking news, conferences
•User can click to see aggregated tweets

23. Hexadecimal
•Six-character representation of a color
•16.7 million possible color values
•Use in Photoshop, Flash, Dreamweaver, HTML, CSS...
•Match image colors to web colors, build palettes

24. HTML5
•Latest standard, not an animation tool!
•New semantic tags (article, section, header, footer, aside)
•New video handling
•Offline storage / browser database
•Geolocation
•Canvas

25. Metadata
•Data about your data
•Like card catalog at library
•MP3 tags
•EXIF data in photos
•HTML meta tags - content not shown in browser

26. Open source
•Software created collaboratively, often without pay
•Firefox, Apache, Linux, WordPress, Drupal
•The best matches quality of best commercial software
•You’re free to modify or scrutinize

27. Permalink
•URL representing a permanent story page
•Story may disappear from home or beat pages
•Often includes a date, story keywords

28. Plugins
•Software that extends other software
•Spam control
•Email comments
•Contact form
•Override roles
•Conduct polls
•Integrate Twitter/Flickr etc.
•Photo galleries
•Events systems

29. Responsive Design
•We now have to cater to smartphones and giant monitors
•Rather than serve multiple site versions, respond dynamically
•bostonglobe.com is a great example

30. RSS
•Really Simple Syndication
•A “pull” format that feels like “push”
•Lets users digest or discover your content w/o browser
•Lets other sites integrate your linked headlines
•Generated automatically by most CMSs
•Internally: XML
•Atom format is similar

31. RSS

32. Semantic Web
•Page elements tagged in a meaningful way
•Machines reading page source code can understand context
•HTML5 helps by providing new <article> and <footer> tags
•Microformats
•Formats like RSS, Atom, XML, JSON
•Build with clean code to encourage the semantic web

33. Server
•Can mean either a physical machine or software
•Usually a “pancake” w/very fast drives, high-rated RAM
•Servers live in data centers with high redundancy
•“Web server” can also mean software like Apache
•Don’t confuse “web host” (company) with “server”

34. Tag (HTML)
•A “container” that wraps text in a document
•Can take “attributes” (some required)
•All tags must be closed
•All lowercase
•Proper nesting

35. Tag (Taxonomy)
•Similar to Categories or Beats, but less formal
•Site may have a dozen categories but hundreds of tags
•Sometimes used for User Generated Content

36. URL
•Uniform Resource Locator (aka URI)
•Every tiny piece of content has a unique address
•Sometimes physical, sometimes virtual
•Make them readable!
•Include keywords for SEO
http://kdmc.berkeley.edu/blog/2010/feb/22/webcasts/
protocol://subdomain.domain.tld/path/to/resource
http://news.cnet.com/2300-17938_105-10002703-4.html?
s=0&o=10002703&tag=mncol;thum

37. Usability
Usability is the study of the ease with which people can employ
a tool in order to achieve a particular goal
•User testing: How long to achieve a task?
•Small focus groups - 5 users
•Eliminate confusion points
•If a site is hard to use, people leave
•Homepage should clearly state purpose
•Ask people to do simple tasks, record them

38. Usability (cont.)
Usability is the study of the ease with which people can employ
a tool in order to achieve a particular goal
•If they can’t find the it, they can’t USE it
•Search needs to rock
•Write for the web (short, scannable)
•Anticipate and answer user questions
•Jakob Neilsen: useit.com
•Usability 101 & Top 10 Web Design Mistakes

39. UI/UX •User Interface/Experience
•You can’t design an experience
•You CAN design FOR an experience

40. Validation/Web Standards
•Standards matter (w3.org)
•The key to fixing what’s broken
•Structural perfection
•Google is blind
•Important for SEO
•validator.w3.org