|
******************************
*** DesignGeek ***
******************************
Tips and techniques for the digital designer
In this issue:
-- Fast Finds with Adobe Bridge CS3
-- Keywords in OS X and Windows
-- Preflighting HTML E-mail
Issue 67, 11/30/07
Written by Anne-Marie "HerGeekness" Concepcion
... for her clients, colleagues, random contacts and interested subscribers
(c) 2007 Seneca Design & Training, Inc.
==========================
Fast Finds with Adobe Bridge CS3
==========================
The problem with a folder-based filing system is that some items belong in more than one folder. You see this in real life with paper documents: Should loan statements go into "Personal Finance" or "Tax Info"? Do take-out menus go in the kitchen junk drawer or the one in the TV stand?
We have the same problem with computer files. Aliases (or shortcuts, on Windows) can only take you so far.
Instead of spending precious hours duplicating and aliasing your files into more and more Byzantine folder hierarchies, try approaching the task from a "Google" point of view -- where you rely more on metadata to sort and find files, and less on their physical location. By tagging a single file with multiple keywords or phrases, you can easily retrieve it from even the biggest hard drive or server without having to know its folder hierarchy. I've heard this philosophy called "Piling, not Filing."
Adobe Bridge, included free with all Adobe Creative Suite products, lets you do this (as does OS X and Windows -- more on that below). But if you're a designer working with any Adobe software, Bridge is the one to focus on. And the new "Flatten View" button in CS3's Filter panel makes it even easier.
-----
Head Start
-----
Open Adobe Bridge CS3 from the Programs or Applications folder on your hard drive, or by clicking the shortcut to Bridge button from any of the Creative Suite programs' Control panels. Once Bridge is open make sure you're using the default arrangement of panels (Window > Workspace > Default) so you can follow along.
In the main Bridge window, select a folder on your hard drive from either the Folders or Favorites panel at the upper left. As usual, Bridge shows you thumbnail previews of the folder's contents in the large Content pane.
Bridge CS3 has a new Filter panel at the lower left of the window, listing metadata categories of the thumbnails you're looking at. For example, if the folder you selected has 36 files in it, the File Type metadata section in the Filter panel might break it down like this:
Illustrator document: 3
Photoshop document: 10
TIFF document: 19
Word document: 4
You can click any of these entries to make Bridge "filter the view" -- to show you only the thumbnails of the File Type you selected, temporarily hiding the other ones. Click the entry again to toggle it off , and you're seeing all the files in the selected folder again.
The other categories in the Filter panel -- Date Created, Date Modified, Keywords, and more -- work the same way, and you can select multiple entries from any of these categories. For example, you could select "Illustrator documents: 10" and the most recent entries in the Date Modified category to see just the Illustrator files you edited in the past couple weeks.
Right now you're like, "Big deal. The Finder/Explorer can do the same thing, sort of, if I view the contents as a list and sort them by file type." But, a) Remember that Bridge can show you thumbnail previews as you do this, which is not possible in any list view in Windows or Mac OS X; b) You can filter with any keywords the files have been tagged with -- more on this later on; and c) in CS3, you can use the Filter panel in combination with "flattened" views to do cross-folder filtering and sorting.
-----
Flatten the View
-----
If the folder you selected in Folders or Favorites contained not only the 36 files but also some subfolders, the Content area will also show you their folder icons by default. The metadata of the files contained in any of these subfolders aren't listed in the Filter panel. You need to double-click a subfolder in order to see these. In other words, the Filter panel only shows you metadata from one folder level's worth of files at a time.
But that's just the default behavior. Instead of drilling down into a subfolder, then moving back up to the parent folder, then drilling down into another subfolder, and yadda yadda, go back to the parent folder and click on the Flatten View icon at the top left of the Filter panel. It's easy to miss as it's about four microns in diameter. Look for the tiny icon of a folder with a red circle/slash on top, and click it.
In a few moments -- depending on how many files those subfolders contained -- you're looking at a thumbnail of every single file contained in the parent folder, even the ones in its sub and sub-subfolders. (Note how the "Look In" menu at the top of the Bridge window reports the parent folder name followed by "+ subfolders".) The subfolders haven't been deleted -- nothing has been moved around on the hard drive -- they're just temporarily hidden. You can click the Flatten View icon again to toggle it off, if you want to verify it for yourself.
Now that you're looking at all the files in the parent folder, the Filter panel aggregates all the metadata associated with each file.
So, if you had applied the keyword "logo" to various logos in various subfolders in the parent folder, after you turn on Flatten View you'll see a listing like "logo: 11" in the Keywords section of the Filter panel. Select that entry and instantly, all the other thumbnails disappear except for the eleven pieces of artwork tagged with "logo" which had been scattered throughout the subfolders. You can click on an individual file to see its folder path in the Bridge window status bar.
From here you can do all sorts of things, such as compare the logos close-up in the Preview panel, open them, create a contact sheet in InDesign or Photoshop (from the Tools menu in Bridge), check to see which Pantone colors they use (in the Metadata panel at right), and so on.
-----
Bridge Keyword Secrets
-----
As you view filtered groups of files, it's a good idea to start applying keywords to what you end up with. That way, the next time you want to see the same files, you can just click a keyword entry or two in the Filter panel. The fastest way to batch apply keywords to files is to create and apply a metadata template in Bridge from the Tools menu, but you don't need to get that advanced.
Just select all the thumbnails you want to apply a keyword to and then click the checkbox of one or more keywords in the Keyword panel at the right of the window. (If the keyword you want isn't in the list, you'll have to create it first. More on that below.) That action applies the keyword to each file.
It's most helpful if you tag files with more than one keyword, because you never know what you'll be filtering or searching for in the future. Conveniently, the Filter panel always has an entry for "No Keywords." Select that entry to see which files in the current view lack even a single keyword.
Keywords and other metadata you apply to files in Bridge are cross-platform and available to any user who's looking at the file's thumbnail in Bridge, even over a network. Even if a file's keywords aren't part of your own Keywords list (because they were created and applied by another Bridge user) they still appear in your Filter panel and can be used there to filter the view like the other metadata.
In your Keywords panel, these "non-native" keywords appear in italics, grouped under an "Other Keywords" category. To add one of these to your permanent list of keywords, select it and choose Keep Persistent from the Keywords panel menu or contextual menu; or drag and drop it onto any of your existing sets of keywords.
In the middle of the summer, Adobe released an important update to Bridge CS3 -- version 2.1.0 -- that greatly enhanced the utility of keywords in the program. Now, finally, we can easily import and export keywords, edit them in a tab-delimited file, and create deep hierarchies of nested keywords.
My favorite new feature, though, is a simple one: Add a bunch of new keywords at once. It's not intuitive at all, so read this closely: To quickly add multiple keywords in Bridge CS3, click inside the new *Find Keyword* field (part of the 2.1.0 update) at the bottom of the Keywords panel. Then, enter your keywords or keyphrases in the field, each one separated by a comma or semicolon. Finally, click the New Keyword or New Sub Keyword icon directly to the right of the field, and each one is added individually to your list.
For detailed information on how the new Bridge CS3 keyword features work, read this Adobe Tech Note:
Changes to Bridge keyword functionality with Bridge CS3 2.1 update
http://www.adobe.com/go/kb402660
|| top ||
==========================
Keywords in OS X and Windows
==========================
Speaking of keywords ...
Apple and Microsoft have been beefing up their OS's to accommodate the Google approach to file management -- at least as it applies to hard drive searches -- for a while now. You can apply keywords to any file in OS X by adding them to the Spotlight Comments area in a file's Get Info dialog box. (Select the file in the Finder and choose File > Get Info.) Both Spotlight and the Finder's basic Find command can include keywords in searches.
You can apply keywords to JPEGs -- and *only* JPEGs, not TIFFs or whatever -- in Windows XP via the Properties dialog box, and include them during searches from Window's Search command. Windows Vista enhanced this feature, letting you add keywords (which they call "Tags" but are the same thing) to Office files as well, and not just in Properties but also directly in an Explorer window or in an Open/Save dialog box.
What is supremely frustrating for every digital designer who wants to move towards a Piling, not Filing way of life, is that the keyword tagging supported in their OS only works in that OS! They aren't cross-platform, and with one exception, Adobe Bridge doesn't recognize OS X/Windows keywords and they don't recognize Bridge's.
While researching this article I read that with its new Tags feature, Vista is employing the same XMP specification for file metadata as Adobe (who developed it). Unfortunately, a specification is not the same as a standard, so at this point there's very little cross-over.
The only person on the planet I know who has both Vista and CS3 running on the same computer is my partner-in-crime over at indesignsecrets.com, David Blatner. I asked him to test out Vista's tagging abilities with Bridge. He found that -- Hallelujah! -- most JPEG metadata is shared between Vista and Bridge, regardless of where you add it. But it doesn't work for any other filetype we tried. You can add keywords to a Word document in Vista, but Bridge not only can't see them, it says that the file type doesn't support XMP metadata when you try to add them in Bridge.
Adobe says they don't want to spend limited resources on developing features that are OS-specific, so at this point we're still miles apart from being able to apply a keyword to a file and have that stick, dadgumit, regardless of where we access it. We need to get these knuckleheads working together.
|| top ||
==========================
HTML E-Mail Preflighting
==========================
I just got a call from a client, a web designer, whose boss told him he's now in charge of starting up the company's HTML E-mail marketing campaign, and had no idea where to start. He asked, "I can just copy and paste HTML code into a new Mail message and send that, right?"
It felt like hearing your kid look up at you with their big brown eyes and ask, "Mommy, Santa Claus is real, right?"
I spent some time with him breaking it down, pulling liberally from my DesignGeek article about "CSS in HTML E-mail:"
http://senecadesign.com/designgeek/dgarchives/designgeek54.php#cssemail
But I had written that story over a year ago. There's been some big news since then, and some new tools as well. Let me catch you up.
-----
Microsoft's Own Time Machine
-----
Anyone who has been creating HTML e-mails for a while is aware of the Great Tragedy Of 2007: Microsoft's decision to rely on Word's HTML engine, rather than Internet Explorer's, to interpret and render HTML e-mails in Outlook 2007. Since Outlook is used by the vast majority of Windows users, and Word is far dumber than IE when it comes to HTML, it was a crippling blow to designers everywhere.
The grim details were best expressed in Campaign Monitor staffer David Greiner's blog post back in January, shortly before Outlook 2007 was publicly released, "Microsoft Takes Email Design Back 5 Years:"
http://tinyurl.com/ylo74r
Check it out ... over 450 comments and counting.
The gist of the debacle is that to ensure your HTML E-mail renders satisfactorily in Outlook 2007, forget about anything beyond kindegarten-level CSS. It's tables, tables, tables baby.
David has updated his CSS in E-Mail chart to include what's supported and what's not in Outlook 2007, the new Yahoo! mail, and Windows Live Mail. Here's the link to the PDF version of the chart (90K):
http://tinyurl.com/23fvh6
Quality reading can be found in his more recent "state of the state" blog post, "A Guide to CSS Support in E-mail: 2007 Edition," where he discusses his chart in more detail:
http://tinyurl.com/2n4j8k
-----
New Services
-----
While investigating this topic, I came across two services that will help ensure your HTML e-mails will render properly in most e-mail programs, both local and web-based.
The first is a free service called Premailer (actually, it's a little Ruby program that a developer wrote as a service to humanity). It will parse any web page -- presumably this would be the web page containing your HTML E-mail under development -- into a page of e-mail-ready HTML.
What that means is that among other things, Premailer converts relative links to absolute ones, and while it leaves CSS declarations in the header intact, it also applies them in-line, since most web-based e-mail services like Gmail and Yahoo! ignore header code.
You can optionally have it generate a Plain Text version of the URL you feed it. For plain text, Premailer does things like add lines of hyphens or asterisks above and below H1 paragraphs (sort of like what I do here), and adds the full URL (in brackets) after every link.
Premailer
http://code.dunae.ca/premailer.web/
The other service is called the Inbox Inspector, from HTML E-mail service provider, MailChimp. You don't need to be a MailChimp customer to use it (even if you are one you'll still have to add it separately to your account).
Here's what it does. Paste your HTML into the web-based Inbox Inspector, and MailChimp will show you detailed screen shots of how that e-mail will appear in 16 different e-mail programs -- AOL, Gmail, Outlook (including v2007), Eudora, Apple Mail, Yahoo! and so on.
It also analyzes the HTML for typos and broken links, but more importantly, Inbox Inspector runs it through a SpamFilter Check. This results in a report listing how likely your e-mail will be caught in the major spam-catcher nets out there, and explains why, so you can modify the code before you send it for realies.
Inbox Inspector can be purchased for $39.00 for three separate Inspector reports. Use this service toward the end of the HTML development process, as an actual HTML E-mail preflight tool, and it'll pay off big-time.
MailChimp Inbox Inspector
http://www.mailchimp.com/add-ons/inboxinspector/
|| top ||
*^*^*^*^*^*^*^*^*^*^*^*^*^*^**^*^*^*^*^*^*^*^*^*^*^*^*^*^*
MASTER THE LATEST DESIGN APPS WITH HERGEEKNESS!
Do you like what you read in DesignGeek? Find anything useful? Bring me or any of my hand-picked Associate Geeks in for a session or two of hands-on training for your workgroup; here in Chicago or any other city near an airport, and you can have this level of expertise all to yourself. All training comes with three years of 24/7 follow-up support for each student by phone or e-mail.
To learn more, or hear what other clients have to say, contact us or fill out the no-obligation "Request a Training Quote' form on Seneca's site:
http://www.senecadesign.com/training/request.html
Recent training clients in Chicago and throughout the U.S. and Canada include the MacArthur Foundation (Illustrator); Bobit Business Media (InCopy, InDesign); Columbia College (Photoshop); CCH/Walters Klewer (InDesign); Skeo Worldwide (InDesign, Photoshop, Illustrator); VOA Associates (InDesign); Rhea & Kaiser (Photoshop, Illustrator, InDesign); and Exhibitor Magazine (InDesign).
*^*^*^*^*^*^*^*^*^*^*^*^*^*^**^*^*^*^*^*^*^*^*^*^*^*^*^*^*
|| top ||
--------------------------------
DesignGeek is a free monthly publication written by Anne-Marie "HerGeekness" Concepcion, a cross-media designer and authorized Adobe and Quark training provider. She owns Seneca Design & Training, Inc. in Chicago, Illinois (http://www.senecadesign.com/).
Anne-Marie also writes InCopyFlow (for InDesign/InCopy workflow users), free subscription at
http://senecadesign.com/designgeek/incopy.html
... and writes InDesign tips at the blog she co-hosts with David Blatner, InDesignSecrets, at
http://indesignsecrets.com
To subscribe to DesignGeek or read archived issues, go to its home on Seneca's site:
http://www.senecadesign.com/designgeek/
To unsubscribe, follow the link at the bottom of this page.
Contact Seneca by phone at 312-946-1100 or e-mail at info@senecadesign.com
Copyright 2007 by Seneca Design & Training, Inc.
Please forward without cutting. Please contact Seneca for reprint permissions. We don't guarantee accuracy of articles. Company or product names mentioned in DesignGeek may be registered trademarks, we use the names in an editorial fashion with no intention of infringement.
--------------------------------
If you had received this by e-mail instead of reading it on my web site, your unsubscribe link would appear right here.
|
