• “Type is Visible Language” by Erik Spiekermann
• “My Life In Typefaces” by Matthew Carter
• “More Perfect Typography” by Tim Brown
• “On Web Typography” by Jason Santa Maria

Yesterday I was given the opportunity to attend day one of An Event Apart in DC because the lovely people who organized the event allowed me to make up the second day of last year I couldn’t attend. I picked day one for this year’s event because I wanted to hear Jonathan Hoefler’s presentation on web typography.

Hoefler made the case that he didn’t like the phrase “Fonts on the web.” He prefers, “Fonts for the web.” The main different is that web font is a new creation rather than taking existing fonts and put them on the web. Hoefler went on to explain and demo how he and his designers reworked their fonts to solve problems specifically for the web. They focused on making types clear on screen and extending their family and features for multipurpose usage. Hoefler also showed off the tool they built in house to allow their designers to see how the fonts render natively in the browser. After seeing the works that go into their web fonts, I wish I could have a subscription to its cloud typography.

While Hoefler’s talk was eye-opening, Whitney Hess’ was inspiring. I could definitely related to the struggle of being presence: Get distracted easily, find themselves easily irritated and feel imbalance in their work life, health and family. As I am listening to her presentation, I kept thinking to myself that I need to be better at being presence. I need to turn off all electric devices after work and being presence when I am with the kids. I made the change immediately yesterday.

Another engaging presentation was from UX expert Jared Spool. He was such a smart speaker. I wish I could go to his new school and learn just a bit of his skills on UX strategy, but I don’t have $60,000 and two-year commitment. On top of that, I have a family to feed.

Jeffrey Zeldman, Luke Wroblewski and Josh Clark were all great. I was glad that I sat right on the first row, kept my laptop closed and my eyes and ears opened.

Last week George Mason University launched its first comprehensive brand profile. After reading through its 96-page documentation, we revised the Mason Law site to comply with the Mason’s Brand. I crafted the new word according to the brand’s guideline. I changed the typography to Minion Pro and Myriad Pro to comply with Mason’s primary typefaces. The fonts are served via Typekit.

As of today Visualgui is no longer supporting legacy browsers, particularly Internet Explore 8 and below. The markups have been revised and to take advantage of the new HTML elements. Without providing support for older browsers the markups are much more simplified, but the main reason for the switching is to improve accessibility with ARIA roles.

After listening to Bruce Lawson talking about ARIA roles baked in HTML5 default elements on “The Web Ahead” (episode #74) with Jen Simmons, I was inspired to do my research on it. Even though I have already used ARIA roles a few years already, I have learned that I didn’t use them quite correctly. After some Googling, I found the documentation on “Using WAI-ARIA in HTML” from W3C to be very helpful, especially the recommendations table.

As much as I want to support legacy browsers, I ought to move forward. After all this is my personal site. It is a place that allowing me to experiment. So if you are using legacy browsers, I apologize that Visualgui might not render correctly. If you can, please consider upgrading your browser.

Another significant change is that the text on Visualgui is now powered by Typekit.

My go-to sans serif typeface is Andrian Frutiger’s Univers. Its family has grown to 44 different weights and styles. You can’t get any more versatile than that. For serif, my go-to typeface is Robert Slimbach’s Minion. It’s a vanilla text face that gets out of the way.

Vài phút nhìn lại:

• Giờ Này Anh Ở Đâu
• Một Chút Quà Cho Quê Hương
• Biển Nhớ

• Responsive web design still came up many times at the conference.
• Many libraries are using WordPress for their web site.
• For its web site redesign project, the UNC library team is consisted of 4 web developers and 20 plus content contributors.
• The MacEvan library contracted out $50,000 to build an iOS app.
• The Cornell team for its library project is consisted of 6 UX designers, 9 web developers and a handful of contributors

I wish we have a team or a budget like the libraries mentioned above.

Presentation from Shari Thurow at Computer in Library 2014

Searchers on mobile

• Quick fact
• Location
• Personal information

What searchers expect

Use elevator as an example to guide users.

Usability tips for labeling

• Don’t put prompt text in text form. Leave form empty. Put help text underneath
• Provide the right contexts
• A label must be representative of a page and section content on a web website
• Page title is important for findability. Lead with most important word
• Name your image with context. Example: not logo.jpg, but mason-law-school-logo.jpg
• Don’t use gray for navigation.

Labeling system

• document (descriptive)
• navigation (concise)
• content (both)

Responsive Design

For responsive design on mobile, provide full desktop site. (I am not sure how to accomplish that since the whole point of responsive design is to adapt to different devices.

Recommended book

Mobile Speech and Advanced Natural Language Solutions

The UNC team shared the process of redesigning the UNC’s library web site at the Computers in Libraries 2014. They set out their goals: discover, access, services, branding and device neutrality. They focused on the user’s wish list: search, hours, contact info, place to study, renew books. They chose WordPress as a platform. They had 40 people, including 4 developers and 20 plus content contributors, involved in the redesign projects. The most impressive accomplishments was reducing their contents from 10,182 HMTL pages to 250.

I ran the homepage to YSlow and it received a “D” for its performance. I took a look at the codes and the amount of CSS, JavaScripts and inline CSS are overwhelming. Sites like this showed that WordPress is getting as worse as Drupal. WordPress’s ease of use comes with a price. Slapping a responsive theme and throw more CSS on top isn’t the way to go. The UNC team didn’t seem to take performance into consideration for this project.

The teacher appreciation committee at our sons’ daycare asked parents to bring in a thank-you note for their teachers. So I decided to do some typographic notes for each teacher and printed them on the Southworth’s Corners Paper. I bought the paper for my resume project in a class on professional design practices. Even though the paper is beautiful, I only used one piece for the class project. Since I rarely use printed resume nowadays, I could use it for something else. Check out the teacher appreciation notes I posted on Pinterest.

Update

When I handed the notes out, one of the teachers asked,”Are you a professional graphic designer?” I nodded and she went on, “I thought so because this doesn’t look like an average design.” That made me smile. She’s also a really awesome teacher. Our little Dan loves her.