Screenr

Ever wanted to show someone (or multiple people) how to use a website or piece of software but didn’t have time to visit them? Screenr is an easy way to create 5 minute recordings of your computer screen and voice. It works by using your web browser and optional microphone without having to install additional software.

Chalkmark

Chalkmark is an online prototype testing tool created by Optimal Workshop, the same folks that brought you Optimal Sort, the online card sort. This tool allows you to test the response time and efficacy of design prototypes, saving you time, money and (possibly) sanity.

10 Tools to Improve Your Site’s Usability on a Low Budget

Although this article isn’t necessarily new, it’s certainly timely, as budgets have continued to shrink and offices are expected to do more with less. Early usability testing prevents wasted efforts later and this collection of inexpensive tools should help.

Color Blender

Having trouble coming up with a web site color scheme? Plug in two colors and let Color Blender create transitions between the two.

If you’ve run across a great article that you think would be helpful to the rest of us, don’t be shy! Post a comment or send an email to our office e-mail account.

Over the summer, the On-line and Electronic Subcommitee of the Strategic Communication Committee considered official Facebook use. Out of that review, Web Administration worked with UF’s General Counsel to craft a policy that accommodates the new opportunities available with the need to maintain a professional presentation and message.

University of Florida Facebook Page Policy

Posts and other content specifically added by administrators of the University of Florida Facebook page are official University of Florida content. Opinions expressed by other Facebook users do not necessarily reflect the opinion of the University of Florida. User provided content is not screened or evaluated during the submission process.

All content is bound by the UF Acceptable Use Policy. Further, users are expected to abide by applicable laws, regulations, rules and policies including the University Student Code of Conduct, the University’s Sexual Harassment Policy, and other regulations and policies concerning public communications.

We reserve the right to remove content.

We encourage users to report content that violates Facebook’s Code of Conduct by using the official Facebook procedure.

Join the University of Florida Facebook page and show your spirit as part of The Gator Nation!

Eight different developers and JavaScript experts from across the world (yes, the world) will be presenting during the virtual conference. They include:

• John Resig from the Mozilla Corporation and the creator of jQuery
• Paul Irish whose clients include Reebok, Adidas, Boost Mobile, Finish Line, and Monster.com.
• Many others, including the authors of many CSS and JavaScript books

You will not want to miss learning from all of these smart people. Attendees will chat with each other and will have the opportunity to ask the presenters questions.

Come join the UF web community for the webinar on Thursday, November 19 from 10 a.m - 7 p.m. at the CITT Classroom in 2215 Turlington Hall. For more detailed information about the event, visit the jQuery Summit event page.

You must RSVP to attend. If you RSVP and can no longer attend please E-mail us and let us know so we can free up a spot for someone else.

To RSVP for the event: http://oak.circa.ufl.edu/~cittreg/describe.html?sectid=1698

We hope to see you there.

10 Examples of Beautiful CSS Typography and How They Did It

The title says it all. This article includes the key CSS that makes the typographical magic happen.

How to Create a Valid Non-Javascript Lightbox

You see lightboxes and modal windows everywhere and most are created in javascript, but not this one. Jenna Smith has developed a lightbox that only uses valid XHTML and CSS. Yahtzee, folks!

Usability Testing Demystified

Author and usability guru Dana Chisnell has fashioned a terrific article in “A List Apart” meant to take away the fear people have over doing usability testing.

Sprite Me

A great way of increasing page load speed is by reducing HTTP requests by using CSS sprites. SpriteMe.org has created a web application that scans a web page and combines all CSS background images into one large optimized image.

We’re interested in your recommendations as well, so if you have links that you’d like to share with the rest of us, post a comment or send an email to our office e-mail account.

I am so excited to be a part of Web Administration. I look forward to sharing information and my experiences through this blog. Feel free to give feedback by commenting on any of our posts.

As a journalist, my curiosity is never ending. I constantly like to “be in the know” and I think you should too! There are constantly new developments in technology and new applications for existing technology, and the best part about it is - we’re just touching the tip of the iceberg.  I’m looking forward to my time here - sharing information with you about the things we are doing in Web Administration and all around the Gator Nation.

And just so you know, we love feedback! So please feel free to comment on any and all of my blog posts.

Card Sorting: Pushing Users Beyond Terminology Matches

Here’s the summary as it appears at the top of the article: “It’s easy to bias study participants, whether in user testing or in card sorting, if they focus on matching stimulus words instead of working on the underlying problem.”

Doctype

A free question-and-answer site for web designers that will allow them to find solutions to their problems.

Twitter Postings: Interative Design

“Summary: We made a timeline message more punchy, credible, and viral through 5 rounds of redesign.”

10 User Interface Design Fundamentals

As @davemcfarland wrote, “Nice, short list of user interface design basics.” Couldn’t agree more!

Ten reasons to learn and use web standards

Like we said on Twitter, an oldie, but a goodie.

250+ Resources to Help You Become a CSS Expert

A great list to check out if you’re really dedicated to becoming a CSS know-it-all.

6 Ways To Improve Your Web Typography

Let’s face it, you can never read too much about typography on the web! You would be surprised how much the right font can spice up a web site.

25 Classic Fonts That Will Last a Whole Design Career

While we’re on that previous note, check out this piece on classic, durable fonts.

Web citizens trying to kill Internet Explorer 6

Former UF Webmaster Mark Trammell was quote in this article about a campaign against IE6.

An Overview of The CSS Summit

If you didn’t get a chance to attend The CSS Summit, catch up with our overview of it here.

Jobs @ Web Administration

UF Web Admin is hiring! Right now, we’re looking for an OPS Web Designer and a student OPS Web Designer. Feel free to pass along the info if you know someone who’s interested.

• Brian Fling — Design and Development for the iPhone
• Kelly Goto — Workflow and Process
• Matt Harris — Using WordPress for Content Management
• Ryan Irelan — Incorporating Subversion into Your Workflow
• Dan Rubin — Great CSS Design
• Kevin Lawver — Introduction to Ruby on Rails
• Christopher Schmitt — Moving to HTML5
• Mark Trammell and Juliette Melton — Conducting Effective User Research

Christopher Schmitt and the team from Environments for Humans have offered us this webinar at a special discount. The best way I can think of to show our gratitude is to pack the room on September 17th from 10am to 7pm at the CITT and learn from these brilliant speakers. You must be present to view the content as we are not provided any additional streams.

To RSVP, visit our registration page and sign up as seats are limited. Also, this event is prioritized for UF faculty/staff, but if a student wants to attend, we’ll try to squeeze you in.

Sounds great, right? It gets better.

The Summit Series is entirely online, meaning you can skip the hotel reservations, the 5-hour flight delays and those little bags of peanuts the airlines give you while they secretly lose and/or destroy your luggage.

Our office purchased the meeting pass and watched the Summit in our conference room, but attendees are certainly allowed to participate from the comfort of their own home or office.

The CSS Summit, the first installment of the Summit Series put together by Christopher Schmitt and Environments for Humans, featured CSS-specific presentations from some of the top names in the business like Molly Holzschlag, Dave McFarland, Jason Cranford-Teague, and others.

Here’s a summary of some of the key takeaways from each of the speakers at the conference:

CSS and Troubleshooting IE6 with Kimberly Blessing

“Support does not mean that everybody gets the same thing”. Kim led her presentation off with this quote because it’s such an important point to remember when troubleshooting cross-browser inconsistencies. *cough* IE6 *cough*

The goal when troubleshooting IE6 is not to match the look pixel-for-pixel, but rather to try to preserve a similar and enjoyable user experience across all browsers. In order to do this you need to do determine what level of support you are going to give IE6, decide which factors will influence when support for IE6 will end, and document a technical strategy to cover coding techniques for dealing with IE6.

Kimberly also mentioned End of Life messages (EOLs), which are basically scripts that display a message prompting IE6 users to upgrade their browser. She mentioned a few sites that use this technique like YouTube and Facebook, but she didn’t officially condone them

Object-oriented CSS with Nicole Sullivan

Nicole’s three-prong web development philosophy is simple:

1. Work out of respect for the design
2. Designers make our code beautiful and clever on the outside as it is on the inside
3. Respect the original design vision. Consistent design = clean code = fast site

Object-oriented CSS is all about leaner code and easier maintenance. Elements like headings should be treated as the most basic reusable building blocks of a site. Anytime you can reuse them, you’re getting a performance freebie. You should avoid location-dependent style because it can easily lead to code bloating down the road.

One great suggestion to promote lean code Nicole shared was to create modules. In a module you would separate an object’s code into two parts: 1. A container and the content and 2. The structure and skin. One class solves the browser bugs, positioning, presentational elements and generally does the heavy lifting of CSS. The other class “skins” the object, adding the style. The goal is very predictable skins in which the complexity is absorbed.

Tomorrow’s CSS3 Today with Dave McFarland

Dave covered some of the highlights of CSS3 including advanced CSS3 selectors as well as some of the CSS3 properties that you can begin using today. the key takeaway frmo his talk was that while the modern browsers (Safari 4, Firefox 3, Chrome, etc…) are beginning to ship with increasing CSS3 support, these versions of the browsers simply don’t have a great enough market share to warrant widespread use of CSS3.

In short, use CSS3 at your own risk. If you believe your target audience is likely to use browsers with adequate CSS3 support, then using CSS3 properties and selectors to enhance to your designs may not be a bad idea. However, if your analytics show that many of your users are still browsing with IE6/IE7 and older versions of other popular browsers, then it’s probably only going to hinder your sites usability.

The key is to use CSS3 sparingly to progressively enhance your designs while making sure that you don’t alienate or hinder your users that aren’t using a modern browser with CSS3 support. For more information on CSS3 selectors and properties, visit http://www.css.info or www.w3.org/Style/CSS/current-work.

CSS & Fluid Width Typography with Jason Cranford-Teague

The main focus of Jason’s presentation was the future of web typography. Scalable Inman Flash Replacement (sIFR) has been the popular pick for accessible custom typography since its release in 2005, but its drawbacks, namely its requirement of both Flash and javascript to be enabled in the user’s browser, clearly leave the door open for something better to come along.

Enter the @font-face rule.

The implementation is simple. Embed the font of your choice with the @font-face rule, then call it with the font-family property like you would any standard browser font. The problem lies in the file formats. Modern browsers, besides IE, are beginning to support the Trutype (.ttf) and OpenType (.otf) formats (IE only supports Embedded Open Type .eot). However, fonts are considered intellectual property meaning, of course, that embedding them through @font-face is subject to EULAs (End User License Agreements).

Another stalemate for the time being? Perhaps, but these are exciting times for the future of web-native fonts. Jason pointed to Small Batch, Inc.’s Typekit service, Kernest.com, and Cufon as evidence that a new era in web typography is coming soon.

CSS & Flexible Layouts with Zoe Gillenwater

Why bother with flexible layouts? Zoe Gillenwater asks, “why not?”

The benefits of flexible layouts are pretty clear: they respect the user’s preferences, they increase usability, readability and accessibility, they maximize typographic control, and they take advantage of screen real estate while preserving design proportions.

Reaping these benefits, however, takes a good deal of planning. It’s important to realize that not every comp can be successfully turned into a liquid or elastic layout. You have to design the site differently from the start, taking into consideration which features are not compatible with a fluid-width layout such as fixed heights for anything containing text.

When putting together a site with a flexible layout there are a few general techniques to stay away from: irregular shapes defining a text area, text matched with images that can’t expand, and horizontal alignment across columns, just to name a few. Instead, try using scalable images or images that can slide along with the resizing of the window.

CSS & Coding Layouts with Stephanie Sullivan

Great design is all about overcoming challenges and making things work. A website is made up of its content; the information, sales, marketing, etc… If the content is the core of any website, doesn’t it make sense the layout of that content is key in any website’s design?

Think about these questions when drawing up your next wireframe or comp: How do you best present this content? How do you want your user to interact with this content? Make sure to be logical and create a flow through the site.

CSS & The Open Web: A Brave New World with Molly Holzschlag

Last, but certainly not least, was Molly Holzschlag. Author of over 30 books on Web Design and related topics, Molly brought her experience in to discuss the ever-growing importance of open standards on the web. As the popularity of web apps continues to grow, standards are becoming more and more vital.

Designing with a foundation in standards not only helps to ensure more positive user experiences across the board, but can also prove to be cost effective. Some of the benefits of designing with standards are that it provides infrastructure and process, it offers a variety of content delivery options and allows for effective scaling and growth.

Next Up: The DIY Summit

If you missed out on the CSS Summit, don’t worry, the Summit Series continues on Sept. 17. with the DIY Summit. According to the event description, the DIY Summit is “for those who go it alone, designing and managing entire websites by themselves, either by choice or by chance. Whether they are freelancers or in-house webmasters in a larger company or university, our goal for the DIY Summit is to streamline the workflow for those who don’t have a team to fall back on.” Register now! You won’t be sorry.

22 Questions to Ask Before Developing a Website

If you’re a practicing newbie with a direction in mind, don’t forget to have a project plan! Start with these 22 questions.

HTML Dog HTML Beginner’s Guide

Now that you’ve asked all the right questions, you can take a look at this HTML beginner’s guide to get up to speed on proper coding.

Web Developer’s Field Guide

A huge resource for designers and developers, including sections on topics such as design inspiration, AJAX, CSS layout, SEO tools, and much more.

Directory of College & University Facebook Pages

Now that social media is all the buzz, why not review what other schools are doing online. Varsity Outreach has compiled a list of Colleges and Universities with a presence on Facebook, including data on their fans.

Web Content Inventory Spreadsheet

Although not the most exciting, having a clear understanding of your site and how it is structured can certainly help when trying to improve the information architecture. Donna Spencer has developed a spreadsheet that can help you organize your website structure.

If you have run across any web sites that you’d like to share with the rest of us, post in our comments or message us on Twitter.