About Craig Webb

Listen – the message is everything

A website that conveys a cohesive brand experience is the primary marketing asset for any business. All other marketing emanates from, and hails back to, the company website.

Exceptional user experiences start with strong online and editorial content that grabs attention, tells great stories, and clearly expresses the brand’s core message, mission and values.

Simple visual strategies, functional architectures, and beautiful content-oriented design solutions support that message.

I offer experience working directly with clients to develop creative assets and build new marketing content. Contact me today for compelling creative marketing, innovative interface design and front-end web development.

SAFE Disposal event in Astoria NY

On Saturday September 17th the NYC Department of Sanitation held a Queens SAFE Disposal Event at the parking lot of Astoria Park.

SAFE is an acronym which stand for “Solvents, Automotive, Flammable, Electronics”.

The purpose is to collect electronic trash which is illegal to throw out through street trash removal in New York City.

I had been storing old computers for over a year, hoping an event like this would occur in the neighborhood so when I heard about the special trash day I made a plan to cart my old electronic gear over there to ditch it.

Not far from Astoria Park, I carted my old mac and monitor over in a manhattan-style shopping cart. I was surprised when I got there to find police directing traffic at Astoria Park south and 21st. St., a block away.

There was a traffic jam of cars lined up waiting to circle through and unload their electronic waste.

Astoria Traffic Jam
The traffic jam bringing electronic trash into the Astoria Park parking lot.

I rolled in to the receiving area for walk-ins and hand over my gear. After an opportunity for a photo with the trashies I walk over to see the bigger operation.

NYC Sanitation Rep
NYC Sanitation Representatives were out to answer questions.
meet the Trashies
It’s a dirty job. I got an opportunity to meet the Trashies.

Cars were circling through the parking lot which was full of garbage that was already collected. Big semi trucks were lined up to haul it away.
I spoke to representatives at the event. They said they will hold a similar event next year.

I think that the city needs to hold these events more often. There is obviously a need and a desire by people to do the right thing and dispose toxic electronic gear properly.

There are other events scheduled for other neighborhoods this year.

For more information, visit the City of New York at NYC.gov

Another resource is GrowNYC
GrowNYC is the sustainability resource for New Yorkers


NYC SAFE disposal collection area
The collection area for NYC SAFE disposal in Astoria Park parking lot.
Large electronics collected
Large electronics collected at NYC SAFE Disposal.
Trucks and trash
Trucks and trash lined up for disposal in Astoria Park.
boxes of electronic trash
Boxes and boxes of electronic gear on loading pallets.

Rootscamp 2013 – fieldworkers, strategists and the urgency of progressive organizing

12/16/13 @cwebba1

I just returned from the Rootscamp 2013 Conference, hosted by New Organizing Institute (NOI) in Washington DC. Rootscamp is a conference for progressive organizers held every year in the post-election / pre-inauguration season. This is my second year attending.

I saw the Rootscamp review posted by Slate so I thought I would post my own. Slate has argued that Rootscamp ignored the Affordable Care Act as both an issue to address and as an achievement. I disagree and I think that Slate misses the point. Rootscamp isn’t about specific issues or about supporting the administration, although those things happen too. Rootscamp is about progressive organizing and the lessons and tactics learned by professionals in the field.

Rootscamp is about fieldworkers and the strategists who love them. A non-fieldworker can feel like an outsider in a cloistered society. Everyone seems to know everyone else from previous battles. I volunteered and helped to work the registration table and monitor a few sessions. As a volunteer, I had a great opportunity to meet people and get to see the NOI staff in action.

Rootscamp is run as a “un-conference” where session subjects are offered and produced by attendees. Each Rootscamp conference is a mashup of funk, new voices and sophisticated strategic planning.

As a technology specialist, I attended some sessions about technologies for organizers. Fieldworkers are big on programs to sort data, parse email lists and APIs. One session went over various technologies available for organizers. Some were specialized web apps, but GoogleDocs was mentioned as a valuable resource as well. Attendees were encouraged to contribute and I offered that everyone should explore Lanyrd.com.

Other sessions attracted me. Sessions like What we need to do now to win in 2014; another session was about creating defining stories to drive engagement; and another was about creative agit-prop tactics. With an interest in content development and story telling, these strategic subjects really got my juices going.

Two things about Slate’s argument about Obamacare: First, Slate’s article seemed to come with an agenda. Coming to #Roots13, I wondered if Valerie Jarrett would show up and get heckled again about global warming. I wondered as well what attendees think about the NSA spying scandal and the genocide in Syria. Valerie didn’t show and I did not hear about the NSA or Syria although with 16 sessions per hour I may have missed it. Rootscamp was not about my pre-conceived list of grievances.


Not Valerie Jarrett

The focus of the conference is organizing and the structure of conversation revolves accordingly. Maybe “Obamacare” did not specifically take focus because it is no longer an organizing issue.

Fieldworkers and organizers are focused on fresh battles. The Affordable Care Act as an organizing issue is now embodied by dozens of Planned Parenthood organizers. Obamacare as an issue has transformed into the clarion call for gun reform and the need to defend transgendered people.

Urgency has currency at Rootscamp. Progressive issues compete in the Rootscamp idea market to gain traction and support. Up-coming off-year elections are organizing battles worthy of focused attention.

Maybe Slate will write a second article that goes into depth about issues that were discussed at Rootscamp instead of a boorish diatribe about what was not discussed. #Justsaying.

Goodbye to Summer

Swimming at Astoria Pool ended last week and the pool has been drained. I swim in the adult swimming program. I swim with the Early Birds in the morning and the Night Owls in the evening. This year I earned a 25-mile t-shirt in each but I did not win a trophy.

Last year I won third place at the Night Owls. The trophies were beautiful this year so I regret not winning one.

I never won any trophies growing up and when I first won a trophy many years ago I thought it was rather silly to get one in mid-life.

I’ve learned to compete and care about winning the trophies. Another man almost beat me a couple of years ago and I put on the steam to win. Winning matters to me now.

Early Bird Party at Astoria Pool, 2013
Early Birds with new 25-mile shirts celebrating at Astoria Pool, 2013

The New York City Pool Program has an awards ceremony at the end of the season to give out the t-shirts and trophies. It is a slightly cheesy affair at Hamilton Fish Pool in Manhattan, always with food catered by Katz, a relay race, a synchronized swimming performance and a musician. We love it because we get to be together and share the moment.

The swimmers who come every year to Astoria Pool get to know one another. We don’t talk much during the season. It’s hard to talk when swimming. So the Awards Ceremony is a great occasion to congratulate each other.

Astoria Pool is the largest pool in New York. Constructed in the 1930’s It is outside, in the park and just a fabulous ruin.

The swimmers from Astoria always comprise the largest contingent at the Awards Ceremony. This year I counted 45 names listed in the program bill winning 25-mile shirts from Astoria. Five people such as myself swim in both morning and evening programs. Yay Astoria!

We’re the biggest group of swimmers by far. They should have the awards party at our pool.

We have a potluck party at Astoria Pool to thank the staff and schmooze one last time. This year I made egg burritos for the Early Birds, and spicy chicken strips for the Night Owls. Other people brought candies, cakes, cookies, coffee. Most of the food is hand-made by the swimmers.

After it is over I’m sad to see the summer go, but glad as well to move on to other things. Work, learning and new things to do.

Next summer will come and so will we. Old friends and new, the Swimming Birds at Astoria Pool.

My message to Google

Hi, I recently applied for a User Interface Design position at Google. Call me.
You really need help.

I just found a missed work opportunity buried in a “conversation”. Can I turn this format off? I want to see a new link in my email list whenever someone sends me an email, next in the linear time line, like other emails do.

Also, I suggest that you get out of China. They have major human rights violations. There is more to life than the almighty yen, you know.

Don’t forget to call me about the User Interface position. You had better do it quick.

The format for Google Gmail is hard to read.
The format for Google Gmail is hard to read.

Social Networking needs “Spam-within” filters

Like many people, I work with craigslist for work search as well as to advertise my services. Unfortunately, also like many people, I receive a lot of spam messages through the craigslist system. I do not want to block craigslist messages, but I do want an easy way to mark spammers, many of whom create accounts with big email hosts like gmail or hotmail, from within the craigslist message, so that they can be eliminated both from the craigslist community and from the gmail community. Administering this could be as simple as a “Spammer” button embedded within the craigslist email. Everyone would benefit from eliminating spammers, so I wonder why the large email hosts are not working with the craigslist team to implement this?

After that, include Twitter, LinkedIn and FaceBook “Spam-within” filters (there I named it) and viola – you’ve got it. As more and more business is conducted from within social networking sites, a method to mark and shut down spammers needs to be implemented. It is too blunt an instrument to block all of GMail or Yahoo! or HotMail (I’ve considered it), so this is an issue that all parties would do well to band together and implement.

Problems accessing FireFox Bookmarks User Data and a method for processing exported bookmark data for use in web pages or other external formats

By Craig Webb

This blog entry describes a series of experiments that I recently conducted. My objective is to export my FireFox bookmarks, clean up the HTML bookmarks file, and format it into a usable, straightforward XML format that looks like this:

Website name
Website URL
This is what this website is about
My XML Bookmark format
My XML Bookmark format

Exporting clean, usable bookmarks from FireFox turns out to be difficult. The exported HTML code is loaded with lots of extra tagged-code that is hard to remove and slows or stalls the program. Choking the file is tons of unwanted ICO junk; line upon line of MIME-formatted code that makes it nearly unreadable and impossible simply to open.

I believe that including ICO MIME code in a bookmark export is nothing less than sabotage by FireFox. Why would anyone want this code? I challenge software developers to develop software so that users HAVE UNFETTERED ACCESS TO THEIR DATA.

My Method:

To start, I have exported my FireFox bookmarks into HTML format. I open my HTML FireFox bookmarks file and examine the source code, which declares itself to be a !DOCTYPE NETSCAPE-Bookmark-file-1 file. It also says:

< ! This is an automatically generated file. It will be read and overwritten. DO NOT EDIT! -->

I edit. I add a piece of JavaScript code that was provided by a Mozilla Expert, Edward N Heinrich, in a Mozilla forum. The JavaScript code is intended to strip out the ICO Icon Attribute code that FireFox exports along with the bookmark URLs.

Heinrich* did not explain how to use the JavaScript. He never replied to further queries, so I’m not sure that I am properly applying this code, however I do get the desired result.

Here is Heinrich’s JavaScript code. I added JavaScript language tags at top and bottom:

javascript: (function(){ var ls=document.getElementsByTagName('*'), lsl=ls.length; for (var i=0; i=0;i--) e[i].parentNode.removeChild(e[i]); alert('Cleanup Complete - Save as Web Page, Complete\n'+'('+lsl+' bookmarks, '+el+' descriptions)')})();

After pasting in the code, I opened the bookmark HTML file using my Safari browser. The JavaScript program is executed and it hides the icon code and various other attributes, but the program does not strip them out. A look at the source code reveals that the icon MIME junk is still lurking there.

I tried saving the open HTML file as a new HTML document but upon opening the new file I found that it is still polluted with MIME icon code.

My next experiment was to copy the HTML text from the Safari browser window and paste it into a TextEdit file in RTF and HTML UTF-8 format. I saved one copy as an HTML file and another as a RTF file. Only the HTML version re-opened in Safari. The RTF experiment failed.

The TextEdit HTML file successfully opened in Safari. I examined the source code to find that the odious icon code from FireFox had been successfully eliminated (yay!), however, Safari/ TextEdit had imposed its own weirdly redundant Apple combination of CSS styled-code and old-fangled HTML-2 code on each line of the bookmark list. The Apple TextEdit HTML code looks like this:

The CSS style is:

p.p4 {margin: 0.0px 0.0px 0.0px 0.0px}
font.f2 {font: 16.0px Times; color: #0000eb}

So my file is still choking with excess code, but it is way-tons better than the FireFox export. The next steps of this experiment are clear. I copy/save the browser source-code into a TextEdit file and proceed to strip out the Apple/Safari code, replacing it with my XML tags.

It is ironic that in order to get my bookmark code out of FireFox in a usable format, my recourse is to use Apple technology. To me, poor software design is epitomized by a need to use third-party software to manage tasks and access user data.

Getting the MIME code out of an exported FireFox bookmark file without the automation of the JavaScript file provided by Edward N Heinrich would be an impossible chore. The JavaScript described in this article provides a way to mechanically remove large sections of tagged code. Utilizing various Apple software functions continues the code-cleaning process, and the final objective may be accomplished with Find/Replace.

Now I am free to quickly copy-paste Folders and URL data to organize it within my HTML file.

If anyone knows a simpler way to get clean bookmarks out of FireFox, please let me know.

* * * * * *

Here are some additional FireFox software interface problems with bookmarks that I consider as design-feature flaws in need of correction or improvement.

When I first started saving bookmarks in FireFox many years ago, each bookmark was saved separately. I spent lots of time moving the bookmarks into folders, using the FireFox Bookmarks Organizer. The FireFox Bookmark Organizer interface is painfully slow and tedious; another reason why I want to get my bookmarks out of the software.

Recently, FireFox offered an innovation – the ability to open multiple webpage windows in the browser by using tabs, along with the ability to save all of the opened tabs into a bookmark folder. [At this writing, Safari cannot save multiple tabs]

Utilizing the ability to open multiple web pages into tabs, I developed the habit of searching for a subject, opening multiple websites, and saving all of them in a folder named for the subject. I will save 30+ pages on any given subject into one folder. Alternatively, I will conduct tasks such as a job search and save an entire day’s search drek into a dated Job-Search folder.

Now I have zillions of these folders. Unfortunately, I find that when multiple web pages are saved in a folder by using tabs, the individual URLs are saved *with no individual descriptions*. It will now be necessary to revisit each individual website, get a description of what it is, and manually type a description into my exported data. This sucks.

In the best of all possible worlds, I would have the option to choose what data is stored and exported in my easy-to-copy and read preferences file. For example I would choose: website URL – YES; Page Descriptions – YES; ICO Icon in MIME format – NO; Time-stamp – NO.

At the time of Export, I would also like to be able to re-select what information I want to export – some or all of it.

Since I have used the tabbed-folder option and I have lost the website descriptions, I would also like to define the order in which data is exported. I would like to invert the order of the Website name and the URL.

FireFox prompts the user to save tags along with web page bookmarks, but there is no way to export the tags along with the URLs, website name and descriptions. The columns of the Bookmark Organizer can be reordered by dragging them, but the organization of the exported data is not controlled or affected by changing the column order.

It would be great if the user’s work adding tags could be accessed and exported along with the user’s URLs and other data that they describe. It also would be great if the Bookmark Organizer user interface acted as a tool to modify and format export data.

In Conclusion, This article explored how to clean out unwanted code from HTML files exported from the FireFox Bookmark Organizer management tool. Obtaining clean HTML exports of bookmark URLs should be a simple task in FireFox, but other software programs have equal barriers to overcome.

I aspire to a design standard that users should have unfettered access to all of their data. No browser currently holds this standard, so it is important to let software developers know what we expect and need. Let me know if this article is helpful to you.

© 062109 Craig Webb. All rights reserved.

Re-doing my presentation layer (again)

I spoke to another developer last week about his work. I learned that he uses templates to design his web pages. He said something about “why bother trying to reinvent the wheel”.

Something about the conversation struck me. As a designer, I think that it is important for me to know the code. So I embarked on re-working on the website. I’m glad that I did.

My intention was to create some new content. Instead, I got involved with attempting to manage my most recent slew of bookmarks, and I started re-reading material about Blueprint.

I found a page that has an AJAX tool that allows people to re-program their blueprint code. I played with the tool, punched numbers on a calculator, and came up with something that I like. The new iteration of my website (the front end) is built with it.

Setup Tool for Blueprint set to 888
Setup Tool for Blueprint set to 888

Not many people still measure in picas but I sure do. My history reaches back to line-o-type and hand paste-up. I like a design that can divide, as easily into thirds as in half, so I like my numbers to count in twelve’s, sixes, threes and twos.

The page layout that I came up with 888px wide, 30 18px columns and 12px wide gutters. One thing about picas over inches is picas are smaller units and therefore more accurate. 18px wide columns give me much more flexibility than Blueprint’s default 30px. I like my 12px gutters as well. They provide a little more white space.

I spent a day and a half on building the first page. I did 12 more today and posted them. The content is the same as before – I am re-arraigning the chairs on the Titanic – but it is necessary to have the structure flat. There is a lot of “fudging” going on right now. I don’t believe in having “the site is down for reconstruction,” signs go up on my site.

Now, I can work on content development with clarity of the parameters of the site.

Re-working my website presentation layer

I figured out that a Presentation Layer Architect designs websites at the code level, and that this design structure is critical for desirable traits such incorporating flexibility, expandability, Progressive enhancement, usability, graceful degradation, search optimization, semantic design and so forth. Read more»

Craig Webb Art
Capabilities – Bill Miller Photography

Court Square Place, L.I.C.
Court Square Place, L.I.C.,
Bill Miller Photography

Bill Miller Photography, a specialist in real estate and building property photography, has documented property and design for some of the greatest builders, owners, developers, architects and designers in New York City and nationwide.

Bill Miller needed to update his website and add search optimization functionality to make it visible for clients using search marketing.

Craig Webb Art was asked to develop a comprehensive website solution.

Download the PDF
Craig Webb Art – BM Capabilities Report
to learn how Craig Webb Art helped Bill Miller Photography to develop a website marketing tool that increases visibility, displays photography to spectacular effect and facilitates content management.

Concept, design and creative development.

Build a core identity and message tailored to your target audience.

Craig Webb Art provides all aspects of New Business Communications Development including project management, creative development, copywriting and graphic design.