Tag Archives: website

How Adobe FormsCentral Saved My Project

Adobe FormsCentral, one of their growing number of apps at Acrobat.com, has been on my review list for some time but didn’t have a great angle to write about until recently. Adobe FormsCentral literally saved a recent project of mine, and I was surprised how its strengths dovetailed with the technical issues I was facing.

The project objective was straightforward:

  • Build an online registration form
  • Include payment integration with PayPal
  • Send email notification to the user and the client on submission
  • Store registration data or send it via email to the client

The client’s website is constructed with Ning, which made its name as a social community builder but now is a blend of that and a typical content management system. Unfortunately, Ning’s backend is fairly difficult to work with unless you are doing basic CSS or HTML changes. The Perl script that we used last year to submit the form data was not allowed by Ning, effectively scuttling our existing solution. I was worried that Ning would force the form to be hosted elsewhere until I thought about FormsCentral, which has a few characteristics that made it ideal for this job:

  • A robust set of form elements covered all the inputs I needed.
  • The ability to embed my form on any webpage with an iframe let me put this form on a Ning page with no problem.
  • The FormsCentral service handles all the notifications and submission data storage, so I didn’t have to write code to handle it myself.
  • Multiple user accounts through FormsCentral meant that my client could run reports and check registrant data as easily as I could.

FormsCentral comes loaded with 50 templates for various industries, but I only needed five text fields so a blank template was adequate. In the Design tab, I was able to make fields required, limit the total characters, include help popups and restrict input to certain types like text, number or email. These are all typically included with forms services like FormsCentral. The one design feature that is completely absent is the ability to dictate design with CSS, which I’d normally use to design a web form. I understand Adobe’s focus on non-programmers, but CSS could really make it easier to apply design elements throughout forms.

The Options tab pretty much covered the rest of my project requirements. I created a Submission Receipt that is sent to all users after they complete the form. I also set up a notification to be sent to the client and myself after every submission, though I was a bit disappointed my client had to create an Adobe ID and log into FormsCentral in order to be added to the notifications list. I also noted that I couldn’t create my own HTML email template to be used for notifications or receipts.

Payment processing is also set up in FormsCentral’s Options tab. Configuring PayPal payments with this form was the most difficult step to master. Registering the PayPal account with the form is easy enough but connecting the form fields to the purchase functionality can be confusing. In the Payment Processing settings, I had to specify the purchase field, quantity field, price and description. The user selected their quantity in a particular field on the form, so that was used for the quantity field. (I also could have set it for exactly one item, which is helpful in some situations.) The purchase field is what confused me because, in this case, the form’s Submit button is also considered a valid purchase field. It was what I needed for this project.

FormsCentral forms can be distributed up to three ways:

  • An HTML page hosted at FormsCentral. An example is https://adobeformscentral.com/?f=zGP2-N2bVVS-pV5I4D7hMQ.
  • A PDF form with interactive form fields. This can be submitted by the user when offline, and the data is stored locally until an Internet connection can be made.
  • Embedded via iframe into an HTML page. The embed code looks like this:


script type=”text/javascript” src=”https://formscentral.acrobat.com/Clients/Current/FormsCentral/htmlClient/scripts/adobe.form.embed.min.js”>
script type=”text/javascript”>
var fzGP2_2dN2bVVS_2dpV5I4D7hMQ = new ADOBEFORMS.EmbedForm({formId:”zGP2-N2bVVS-pV5I4D7hMQ”, server:”https://adobeformscentral.com/”, width:640, showHeader:false, transparent:true, widthAfterRedirect:640, heightAfterRedirect:400});
fzGP2_2dN2bVVS_2dpV5I4D7hMQ.display();

You can see some embedded parameters, such as background color, form width and the iframe size after the form is submitted and a redirect URL is specified. (I didn’t use this because FormsCentral lets you show a confirmation message after submission.)

The View Responses tab is where the client and I could see the submitted data. Everything is stored, and PayPal even returns the transaction ID and total dollar amount to FormsCentral so the payment data is complete. A report can be exported from the File menu within FormsCentral, or you can view the Summary Report tab to see some charts based on your data. These did not help me much because most of my data was non-numerical, and the charts can only display data as a full count or an average. My client and I focused on the View Responses tab, which had all the data we required.

The Ning platform could accept FormsCentral’s embed code since it’s pure HTML, and the form itself worked perfectly. This got us around the limitations imposed by Ning and also provided me the data handling that I normally would have executed with my own scripts. Ultimately, FormsCentral gave me more tools with less work and helped both me and my client be more efficient. FormsCentral does have its limitations, mostly imposed by the product’s emphasis on the non-programming user. However, FormsCentral is designed for projects like this one and I was lucky to consider it!

FormsCentral can be run as a 30-day trial for 99 cents or paid monthly for $14.99 per month. This allows up to five forms and up to 500 responses. An annual rate of $143.88, recently reduced, provides 5,000 responses per form with unlimited data storage and unlimited forms. Note that the Acrobat.com apps, including FormsCentral, are not included in Adobe’s Creative Cloud product.

BOOK REVIEW: Google Analytics Is More Than Inserting Code

google-analytics

I’m always impressed that O’Reilly’s books drill so deep into a topic they can squeeze out a 200-page book about something mundane like Google Analytics, the analytics engine used by countless websites. Most developers don’t do much more than implement the code and watch the page view statistics, but Google Analytics by Justin Cutroni (a Google Analytics Certified Partner) covers a lot more.

I was really impressed by a couple things in Google Analytics. Firstly, the book explains Google Analytics’ back-end processing far more than any source I’ve seen before. I found it intriguing from a developer’s perspective. Some may not find these details very useful but there are some practical applications for this knowledge. For example, knowing how the analytics engine parses results helps us know how long it will take for recent data to affect the dashboard.

The other aspect of Google Analytics that really impressed me is the chapter on advanced tracking techniques. It’s a large chapter (50 pages) that alone can really extend the usefulness of Google Analytics beyond what most people get out of it. The information on tracking e-commerce alone covers the price of this book. Generally speaking, the advanced information is what makes Google Analytics worth reading.

Google Analytics is also well-written and I like how Justin added some working examples and exercises on implementation, so readers can use techniques right away. Not everything in Google Analytics will pertain to a customer’s needs, but developers who use Google Analytics should at least be aware of all the service’s features—and Google Analytics covers pretty much everything.


Google Analytics

Justin Cutroni
Published by O’Reilly
US $29.99
Rating: 10/10

BOOK REVIEW: Designing With Web Standards, 3rd Ed.

dwws3rd

In 2005 I adopted web standards to improve my skills in web design and make that a major component of my work, and the book that really drove it all home was Jeffrey Zeldman‘s Designing With Web Standards. Part pundit, part teacher, Zeldman walked me and many others through web standards and turned the discipline into the gold standard for building websites. This point was made clear in 2006 when I wrote a less-than-exuberant review for a piece of software and the creators responded by pointing out my personal website does not validate with XHTML Strict.

Now it is 2010, HTML5 is emerging and Zeldman has written the third edition of Designing With Web Standards with the help of Ethan Marcotte, who also wrote a bit of Handcrafted CSS. As a reader of a previous version, I found the new third edition to be less useful than the first because much of the old material still exists in the new edition. Many chapters are the same or similar and new game-changing technologies, such as CSS3 and HTML5, are covered but still in the early stages of adoption. XHTML, the central language of web standards, hasn’t changed much at all in the past decade. The next decade will be more important, as XHTML is supplanted by HTML5 and browsers really begin to converge on one standard (even Internet Explorer).

Zeldman’s writing is sharp and clear as always, and the third edition is an essential read for those new to web design or web standards. For experienced web designers who know web standards, the third edition is a great refresher but not too different from the first or second editions.

Designing With Web Standards, 3rd Ed.
Jeffrey Zeldman with Ethan Marcotte
Published by New Riders
US$49.95
Rating: 8/10

Adobe Revamps Adobe TV Website

Have you seen the new Adobe TV website? It’s always been a good source of training on Adobe products, and last week Adobe launched a new website design that helps make things easier to find. I haven’t had time to work with it yet, but at first glance it’s definitely easier to navigate directly from the homepage. Adobe TV is a particularly good source of videos from events like Adobe MAX and other conferences, so I recommend trying it out if you haven’t done so already.

Here’s the press release:

PRESS RELEASE

Adobe today launched the newest version of its popular video channel Adobe TV, an innovative Web site offering free expert video training across Adobe product lines. Designed in response to customer feedback, the site offers users new ways to experience and access Adobe TV episodes through streamlined navigation, robust search options, customization features and interactive capabilities.

Produced and delivered using leading Adobe products and technologies, Adobe TV is the first Web site to deploy a video player built with the Open Source Media Framework. Announced in April 2009, the framework offers production-ready components to streamline the development process, reducing the time content publishers spend creating playback technologies. Adobe TV is also developed with ColdFusion 9, a powerful technology for building dynamic Web sites and Internet applications.

Adobe TV now offers new additions such as a resizable pop-out window that allows users to view content while simultaneously working within their Adobe applications. A new homepage provides quick and easy access to relevant episodes, with the ability to sort by most popular, most viewed, highest rated and recently added. And users can download the Adobe Media Player to view and save content offline, and receive new programming as soon as it is released.

Adobe TV users who register with a free Adobe ID can:

  • Interact with show hosts by asking questions in the comments section
  • Create playlists and add them to a personal episode library
  • Customize their homepage by adding or removing content feeds
  • Comment on and rate videos

Keeping designers and developers connected to the latest features and programming,

Adobe TV series include the Emmy award-winning Dr. Brown’s Photoshop Laboratory, as well as Benchmark, CS Insider and Short and Suite. Exclusive videos of keynote sessions from this year’s MAX Conference will also be available on Adobe TV shortly after the sessions take place.

Adobe TV offers free training on Adobe products, including insider tips, techniques and behind-the-scenes videos delivered on demand. Viewers can learn design experts’ favorite tricks and take tours of cutting-edge creative studios. Share content via email, Facebook, Delicious, Digg and StumbleUpon, and by embedding it into blogs or Web sites.

BOOK REVIEW: Even Faster Web Sites

soudersbook

It’s rare for a book to catch me off-guard with unique techniques, but Even Faster Web Sites seems to have done it. The book is written about the topic of website performance and optimization, which grants users a faster, leaner browser experience and less hassle with slow-loading pages and images. I had always known about image optimization tools in Photoshop and coding techniques that help make pages smaller and faster but Even Faster Web Sites surprised me with tactics and techniques that are a level above.

First, a strong pedigree

The book’s stable of authors is enough to make web designers take notice. The main author is Steve Souders, who works on web performance at Google and created the Firebug extension YSlow. Some chapters are written by other authors including:

This is a large group of authors from some of the most recognizable companies in the web technology industry. The books such authors put out often stand out, such as Web Form Design by Luke Wroblewski. The writing is solid and the grasp of the web technology is really top-notch.

Magic behind the curtain

I was surprised at how much Even Faster Web Sites revealed to even an experienced web designer like myself. The chapter on image optimization offers several techniques such as PNG crushing and optimized sprites that only experienced web designers will already know about. I think some parts of the book are less helpful for designers than developers and programmers, but all designers working with HTML, CSS and JavaScript are programmers by definition and those chapters might be dense but are definitely helpful.

One of the most impressive aspects of Even Faster Web Sites is the testing and research produced by the authors. Some books get away with stating rules and best practices, but this one provides evidence to support what it recommends. The charts and tables convinced me that I have some room to improve my own website-building practices for my clients, and I’m excited to provide even better service thanks to this book.

Even Better Web Sites is an outstanding book, and a rare book that’s a good read for designers and developers of every skill level. The only designers who don’t need this book are those who know everything about web design already. Some of the techniques explained in this book seem to border on magic. I recommend you pick up a copy and learn how your websites can move even faster.

Even Faster Web Sites
Steve Souders
Published by O’Reilly
US$34.99
Rating: 10/10

Reviewing An Old Favorite: Steve Krug’s Don’t Make Me Think

Don't Make Me Think
Don't Make Me Think

Steve Krug’s Don’t Make Me Think left a big impact on me when I first read it several years ago. I knew the basics of writing and designing for web usability but Don’t Make Me Think crystallized the subject in a way that appealed to both web designers and users who didn’t know HTML but did know a bad website when they saw one.

The second edition, which was published in 2006, offers a few new chapters on accessibility and user “goodwill” but leaves out some of the chapters on user testing (though they can be found online at www.sensible.com/secondedition). I re-read the book recently and was surprised by the experience: Don’t Make Me Think is still a great book, still a classic, but it is beginning to look dated.

Many of the examples shown are either ancient (see Yahoo!, circa 1999, on page 27) or no longer exist (Productopia.com, which is studied in detail on page 118–121). This is bound to happen to any book, but Don’t Make Me Think is four years old in its current edition and the first edition was published way back in 2000. Web design has changed so much since then and it’s time for Steve to revise Don’t Make Me Think to acknowledge the changing landscape.

Don’t Make Me Think also makes assumptions about average users that I think could be revisited. I think Steve is still mostly correct in describing users’ behaviors as comparable to firemen making snap decisions, but some more specific behaviors and assumptions deserve another look. One is the notion that users don’t expect to reach a homepage by clicking on the logo at the top of a page. Another is the assumption that pull-down menus are bad for usability: I personally agree with this one but they are often effective for quick access when users don’t need to scan a long navigation. I’d be very interested in seeing a third edition of this book that takes another look at users’ “default” behaviors.

Rocket Surgery Made Easy
Rocket Surgery Made Easy

Don’t Make Me Think is still a valuable book for any web designer, and years later I still find myself using Steve’s ideas to describe web usability to clients. I hear Steve plans to have a new book out before year’s end, Rocket Surgery Made Easy. It’s listed as a “do-it-yourself guide to finding and fixing usability problems,” and might incorporate some of the user testing chapters pulled from Don’t Make Me Think. Perhaps it will address some of the new possibilities and pitfalls in web usability that have developed in the last decade.

Adobe Web Apps, Part 2: BrowserLab

Adobe has become more and more aggressive in the field of web applications, producing various services like Photoshop Express and Acrobat.com to complement their shrink-wrapped software. According to Devin Fernandez, Senior Product Manager for Dreamweaver, the company’s “hosted services” strategy takes advantage of the convenience and quick development times inherent in online applications. Shorter production times means that these applications can be developed and improved faster and more often.

Betas for two new online applications were announced recently by Adobe. One is InContext Editing, a streamlined online content editing system that’s handy for Dreamweaver users. The first part of this series comprises an analysis and review of InContext Editing. The other application is BrowserLab, a service that allows website testing for multiple browsers. This practice is essential for any web designer and any tool that makes the process easier deserves a look.

Pain points

Adobe looks for “pain points” when developing products: I’ve heard this phrase more than a few times during various demos and discussions over the years. BrowserLab is Adobe’s response to several of customers’ pain points: speed, convenience, simplicity and productivity. BrowserLab is designed to improve these four points for users. The browser emulator concept is not new—BrowserCam and browsershots.org are two services similar to BrowserLab—but Adobe hopes to improve on the concept.

BrowserLab is currently in limited distribution. Adobe planned to accept only 3,500 users for the initial preview but demand was high enough that this was increased to 8,300. The service is being tweaked and improved in preparation for a full launch, at which point it will become a paid service. For now the development team is focused on improving stability and performance.

The BrowserLab experience

BrowserLab has the same professional black/gray design as most of Adobe’s other web applications. The application is easy to use, though BrowserLab has relatively few functions and doesn’t need much user interface to be effective. There are only three view modes: 1-up, 2-up and onion skin view. Onion skinning overlays one browser image on another, which is a good way to see small differences between browsers. Users can also zoom anywhere from 75% to 200% to get a close view of the results.

Onion skinning overlays one browser result with another—in this example, Designorati.com is being tested with Firefox 3 and Internet Explorer 7.
Onion skinning overlays one browser result with another—in this example, Designorati.com is being tested with Firefox 3 and Internet Explorer 7.

I like using BrowserLab, but for a product like this the big question is whether or not it can faithfully test all the browsers you need tested. At this time BrowserLab can emulate four modern browsers and one browser that I consider non-modern:

  • Internet Explorer 6 for Windows
  • Internet Explorer 7 for Windows
  • Firefox 2 for Windows and Mac
  • Firefox 3 for Windows and Mac
  • Safari 3 for Mac
BrowserLab already has most of the browsers I test for, and several others are in the works.
BrowserLab already has most of the browsers I test for, and several others are in the works.

Internet Explorer 8, Safari 4, Opera and Chrome and next up for addition to BrowserLab. I think BrowserLab needs to emulate all these browsers in order to be successful: the ability to test all needed browsers in one application is what will make BrowserLab popular. Fortunately, the BrowserLab team tells me they are working on this right now. For now BrowserLab has a limited browser set, and that’s one reason why I still use bonafide web browsers to test my websites. Dreamweaver’s Live View is also a nice tool for website testing, but it’s not always accurate.

Another reason why I test in actual browsers is because BrowserLab is not a browser emulator: it works by screen-capturing websites in various browsers and displaying the resulting images. These images are not interactive, so you can’t test JavaScript or CSS interactivity and you can’t see Flash or other animations. Flash can also give BrowserLab a false image: in one test, BrowserLab showed a Flash animation’s mask did not work in Firefox 3 for Windows. I checked it out in that browser and learned the browser applied the mask a split-second after rendering the rest of the page. BrowserLab captured the screen too soon to reveal this. Scott Fegette, Technical Product Manager for Dreamweaver tells me the BrowserLab team is looking to actual emulation of browsers in a web application, but for now they are going to stay with screen captures.

Top: A website I designed, tested in BrowserLab. Bottom: The same website viewed with the same browser being tested in BrowserLab. The Flash graphic and headlines (styled with sIFR 3) are not visible in BrowserLab but do work online.
Top: A website I designed, tested in BrowserLab. Bottom: The same website viewed with the same browser being tested in BrowserLab. The Flash graphic and headlines (styled with sIFR 3) are not visible in BrowserLab but do work online.

Top: A website I designed, tested in BrowserLab. Bottom: The same website viewed with the same browser being tested in BrowserLab. The Flash graphic and headlines (styled with sIFR 3) are not visible in BrowserLab but do work online.

Still, BrowserLab is a handy tool if my computer’s unavailable, and it’s online so I can use it anywhere. I want to see more available browsers (such as Internet Explorer 8) and it would be nice to be able to mark a particular capture as a model and have BrowserLab show where other browsers fail to duplicate it, but I think BrowserLab is on its way to becoming a good tool for web designers.

One more thing for Dreamweaver users

Dreamweaver users can leverage BrowserLab even further with an extension that allows screen capturing and testing directly from Dreamweaver CS4. The BrowserLab extension requires Extension Manager 2.1 and comes in two parts, but completing the installation process will add a BrowserLab panel to Dreamweaver CS4. From there users can send a local or server copy of the active page to BrowserLab for viewing. The combination of Dreamweaver’s Live View and BrowserLab allows users to preview dynamic interfaces, including JavaScript and Ajax, and also preview websites from behind a firewall. Other service-based solutions can’t do this.

Adobe Web Apps, Part 1: InContext Editing

Adobe has become more and more aggressive in the field of web applications, producing various services like Photoshop Express and Acrobat.com to complement their shrink-wrapped software. According to Devin Fernandez, Senior Product Manager for Dreamweaver, the company’s “hosted services” strategy takes advantage of the convenience and quick development times inherent in online applications. Shorter production times means that these applications can be developed and improved faster and more often.

Betas for two new online applications were announced recently. One is BrowserLab, a service that allows website testing for multiple browsers. This practice is essential for any web designer and in the second part of this series I analyze and review BrowserLab. The other is InContext Editing, which I first saw last year at Adobe headquarters in San Jose and has since been upgraded to version 1.5 in late April.

InContext Editing

InContext Editing is a streamlined online content editing system deployable by Dreamweaver CS4 or the InContext Editing website, incontextediting.adobe.com. While many content management systems are proprietary and others like Drupal are open source and web-based, InContext Editing is a standalone web application so it doesn’t require extra code or installed software to work—all it requires is a modern browser. The user interface has the same gray design style found in BrowserLab and other Adobe web applications, and it looks good and works well.

Editing with InContext Editing is simple and effective.
Editing with InContext Editing is simple and effective.

InContext Editing has more functionality than BrowserLab but that also creates some weak user interface elements: for example, in order to reconfigure a website’s settings you have to click its Manage Users button, which then takes you a screen where the Configure Site button resides. It makes more sense to have both buttons available from the main window. Another example is the Remove Site button, which I had to use when one of my client’s websites launched and the testing site was no longer valid. It’s possible to remove a site from InContext Editing, but it’s not clear that all users must be deleted and all invitations rescinded before the Remove Site button reveals itself.

Managing users with InContext Editing is easy, but it can be hard sometimes to find what you need to administer users or site settings.
Managing users with InContext Editing is easy, but it can be hard sometimes to find what you need to administer users or site settings.

The other difficulty I had with InContext Editing is some difficulty handling content modified with JavaScript or Ajax. I learned this after using InContext Editing with a website modified with sIFR 3, which replaces text with Flash text so designers can use fonts beyond standard web fonts. InContext Editing was set up to edit a content block with only headings and paragraphs, but it said it could not function because prohibited tags were in the content block. I learned after some troubleshooting that sIFR, which was modifying the headings, caused the fatal error even though the HTML code was not modified. InContext Editing works well for simple webpages running standard HTML code, but scripts and dynamic content can make it incompatible. Adobe hopes to improve InContext Editing’s handling of these components in the future.

Despite these usability issues, and what seems to be a lot of time loading pages and building editing screens, InContext Editing is a handy tool for web designers whose clients have small pages and want to revise some content. I like that it’s simple, quick, and doesn’t require any software installation. It’s supposed to be so easy that anyone can use it, but there’s a learning curve and I had to consult with the help files a few times.

InContext Editing + Contribute?

One thing that excited me about InContext Editing was the possibility of using it in tandem with Contribute. One of my clients in particular already uses Contribute in-house for content management and the combination of Contribute and InContext Editing would have allowed them to edit content inside and outside the office. However, it seems that Contribute CS4 will not allow editing if InContext Editing code is detected on a page. Adobe’s position is that InContext Editing is designed to make simple updates to basic webpages, while Contribute is designed for more sophisticated webpages and workgroups.

Two benefits for Dreamweaver users

Adobe has made both BrowserLab and InContext Editing especially tempting for Dreamweaver CS4 users. InContext Editing is easily deployed by Dreamweaver CS4, with editable and repeating regions available with a click in the InContext Editing panel. You can also manage the CSS classes available to clients with this panel. The code for InContext Editing regions is quite clean, with a single div tag around the editable content:

< div ice:editable="*" > Content here < /div > (spaces added for clarity)

Editable regions can be inserted with Dreamweaver CS4, very much like template editable regions.
Editable regions can be inserted with Dreamweaver CS4, very much like template editable regions.

The asterisk property for the “editable” attribute allows all available HTML formatting in InContext Editing, including strong/em, indenting, creating lists, inserting images and more. The web designer, working with Dreamweaver CS4, can restrict these however he or she chooses. Regions can also be created directly with InContext Editing from the web browser. The other treat for Dreamweaver CS4 users is the ability to set up a keyboard shortcut for invoking InContext Editing within a web browser—however, it involves editing a JavaScript file and looks like anyone with an HTML editor (or a text editor) can hack it. Here’s how it’s done:

  1. Open the ice.conf.js file. If you use Dreamweaver to set up a website for InContext Editing, this will be found in includes/ice/ by default.
  2. Rewrite the PC keyboard shortcut (found in line 43) and the Mac keyboard shortcut (found in line 60).

The future of InContext Editing

I’m curious to see how InContext Editing fares in the future, given the many choices available to web designers for editing and managing content. Adobe is currently meeting with InContext Editing customers for feedback for a version 2 to be released in the future, but we’ll see how that turns out. It’s hard to say how much InContext Editing will change from version 1 to version 2, but I think InContext Editing’s simplicity and its browser-based ease of use gives it a lot of potential. More robust editing and management tools will help InContext Editing secure a place in the web designer’s toolkit.

BOOK REVIEW: Search Engine Optimization for Flash

seo-flash

Back in the late 1990s and early 2000s, Flash was the red-hot new technology for the Web. Designers were building user-unfriendly splash screens and sometimes building complete websites all in Flash. Eventually a counter-movement developed that steered designers back toward semantic HTML markup, web standards and other lean, user-friendly web design methods.

One of the claims made against 100% Flash websites was that they are not indexed by search engines, since they cannot read text set in Flash. This never made sense to me because my own website at jeremyschultz.com is 100% Flash and it is indexed very well—some of the work in my client portfolio actually scores higher than my clients’ websites or names. One can only conclude that Flash can co-exist with a well-optimized website, and Todd Perkins‘ book Search Engine Optimization for Flash explains why.

Working with Flash

SEO for Flash had a lot of great information I didn’t know about—for example, Adobe has given Google and Yahoo! a special version of Flash Player that allows those search engines to index Flash text and links with no problem. Flash applications and movies can be optimized for search engines just like a regular HTML page—it’s just done differently, and it gets more complicated with JavaScript, AJAX and dynamic content are thrown into the equation. SEO for Flash details all the techniques needed to maximize search engine optimization for a variety of Flash projects. It goes even farther by including a chapter on optimizing Rich Internet Applications (RIAs) built with Flex, an application development program that uses the same ActionScript as Flash. This was an unexpected inclusion.

What brings the book together is the final chapter on optimizing a Flash website. Over 40 pages were devoted to this chapter and it tackles real-world examples, so it may be the most useful segment of the whole book. Some books make the mistake of teaching guidelines and techniques without applying them—which then requires the reader to practice and figure out how it’s done. SEO for Flash gives the reader more insight into this critical step of the process, such as focusing optimization efforts on searchable text, deep links and shared data sources.

Where’s the files?

I really love this book—it debunks several myths, does a great job teaching its readers and focuses on a neglected segment of web design. However, there is one glaring flaw: there are several exercises throughout the book that refer to Flash, HTML and XML files. Unfortunately, these files are quite hard to find. The book does not come with a disk and the online version (available at safari.oreilly.com) does not link to them. The files are actually found on the book’s page in O’Reilly’s online catalog under the term “Examples.” The download is a large ZIP file, which makes me wonder why the publisher doesn’t break the exercises down into smaller packets for easy access and hyperlinking.

Despite this, Search Engine Optimization for Flash is a great resource for Flash designers building projects for the Web. Todd does a fine job explaining all the important techniques for optimizing Flash content for search engines, and given Flash’s evolution from a cool animation tool to a content delivery application I think it’s important for all Flash designers to understand how to maximize search engine optimization for their projects.

Search Engine Optimization for Flash
Todd Perkins
Published by O’Reilly
US$29.99
Rating: 9/10

Adobe Releases InContext Editing 1.5

Adobe recently released Adobe InContext Editing 1.5, a new content management tool that allows clients and other users to edit website content in a browser and without coding skills. Contribute has traditionally been Adobe’s only product to allow this kind of editing capabilities, but Dreamweaver CS4 introduced InContext Editing last year and Adobe is developing it further.

From the press release:

“Adobe InContext Editing 1.5 is a fully hosted online service that extends the productivity and profitability potential of Adobe Creative Suite 4. InContext Editing enables the less technical client to easily update their Web site content from any browser without installing any additional software. In addition, this new hosted service gives professional Web designers the ability to enhance their business with long-term cost effective maintenance programs they can offer their clients, while enabling them to also have more time to spend on what they do best – design work.”

Editable regions are created in Dreamweaver with the same process used to create editable regions for Contribute, so InContext Editing can actually serve as an online substitute for Contribute (though Contribute has more capabilities). InContext Editing is available through a web application similar to what’s found at Acrobat.com, and web designers can set up websites at the InContext Editing Administration Panel found at http://incontextediting.adobe.com/.

Key benefits from the new InContext Editing 1.5 release include:

  • Ability for professional Web designers to assign editable regions to a Web site from directly within a browser;
  • Simplified administration controls for Web designers to easily safeguard design integrity;
  • Web-based editing capabilities for Web designers’ clients to make updates from virtually anywhere.

A free preview of InContext Editing 1.5 is available now at http://incontextediting.adobe.com/. More information about this hosted service can be found at http://www.adobe.com/products/incontextediting/. I’ve requested some extra materials from Adobe and I hope to speak with someone on the development team, so stay tuned for more information.