Css Web Design

Client projects and tech blog posts about Css

Martin Profile Picture Many Friends will know me from my active involvement in the Quaker world. I've been dubbed the "Quaker Blogfather" for my Quaker Ranter (site) blog and my work in pulling together QuakerQuaker (site), an online magazine and blogging community with over five hundred members and 10,000 visitors a month. I am also a frequent Quaker workshop leader and published writer.

I started building websites in 1995 with an award-winning Nonviolence.org hub site and was a social media pioneer when I redesigned its homepage to a blog format three years later. Before going independent as MartinKelley.com in 2006, I served on the staff of Friends General Conference (site) for eight years, where I worked in the FGC Quaker bookstore and built the Quakerfinder, FGC Gathering and youth ministry sites. I also worked for Friends Journal (site) for two years, putting select articles from their Quaker magazine online every month. Since then I've been privileged to work with Quaker organizations such as Friends World Committee for Consultation (site), Friends Council on Education (site) and Haverford Friends Meeting (site). I've done some exciting media work with the Philadelphia Penn Charter School (site) and built personal sites for well known Friends. I bring our testimony of integrity to every business transaction and when I address topics such as search engine optimization or pricing philosophy, I try to do so from a Friends perspective.

Web Design Specialties:


Categories: quaker | Edit
Collected from LinkedIn:

"The list allowed me to click only three attributes, but for Martin I wanted to check them all. He is a wonderful, personable, creative person who also happens to be unflappable. I highly recommend his for web design." March 30, 2010

Tom Ferrick, Journalist/Publisher, Phlmetropolis.com
Hired Martin as a Graphic/Web Designer in 2009
Top Qualities: Great Results, Personable, Good Value.


"Martin has provided -- and continues to provide excellent service and consultation as a Web site developer. For my site on New York-based architecture and history, Mindfulwalker.com, I asked for some complex developments of and changes to a WordPress theme and the site installation. I received the service that I needed and more, and I'm very happy with the site today. Martin brings a variety of assets to his role: He is extremely knowledgeable and capable in programming and Web tools. He's also a good communicator, is very value-conscious about the service he delivers for the cost, and is understanding of client needs. Beyond this, Martin helped with some excellent tutorials as I took over the site. I plan to hire Martin again as I look forward to enhancements and additional developments for my site and business. Martin is excellent at what he does!" May 10, 2009

Susan DeMark, Journalist, Mindfulwalker.com
Hired Martin as a Graphic/Web Designer in 2007
Top qualities: Great Results, Good Value, High Integrity



"Martin provided great value in designing a website for my law practice. He was accessible and facilitated the process, despite our geographical distance, through email and telephone consultations. He was flexible in working with me to achieve what I was looking for within my budget." May 1, 2009

John Kindley, Lawyer.
Hired Martin as a Graphic/Web Designer in 2008
Top qualities: Personable, Good Value, High Integrity



"Martin is not only highly competent as a Web site developer, he's also one of the most honest and trustworthy people I've ever hired. I highly recommend Martin." April 30, 2009

James Maguire, Author, MaguireOnline.com
Hired Martin as a Graphic/Web Designer in 2006, and hired Martin more than once.
Top qualities: Great Results, Personable, Expert



"Martin has worked for our school to integrate Web 2.0 technologies into our communication materials. Martin is highly-personable and his is an expert in current technological approaches. This is a hard match to find in consultants." April 30, 2009

Michael Moulton, Technology Director, William Penn Charter School.
Hired Martin as a IT Consultant in 2007, and hired Martin more than once.
Top qualities: Personable, Expert, High Integrity.



"Martin has an outstanding grasp of everything there is to know about the internet. He is our "go-to" guy whenever we encounter something new and different, especially involving Web 2.0 and Search Engine optimization. He is also an experienced and skilled designer and has excellent PHP/CSS/HTML programming knowledge. Martin is a pleasure to work with in every respect!" May 1, 2009

Barbara Raphael, Founder/Owner, Raphael Webscapes, LLC.
Worked directly with Martin at Raphael Webscapes.
Categories: references
Tags: Architecture, Budget, Communication, Consultations, Go-To Guy, Graphic, Haddonfield, History, Honest, It Consultant, Journalist, Law Practice, Lawyer, Linkedin, New York City, Raphael Webscapes, School, Search Engine Optimization, Technology Directory, Trustworthy, Web 2.0, Web Designer, Website, Wordpress | Edit
Daretown School Home - Daretown SchoolThe mission of the Salem County Special Services School District, a regional educational service agency, is to provide high quality, cost-effective programs and services to the schools and districts of Salem County and Cumberland County, New Jersey. This site built with what are for me fairly generic tools: Movable Type as CMS, with Flickr intergration. The design style sheet was built from scratch using CSS.

Visit: Scsssd.org
Categories: Client Sites , Educational , Local , Nonprofit
Tags: Cumberland County, Education, Flickr, Movable Type, New Jersey, Salem County, School, School District, South Jersey, Woodstown | Edit
Mindful WalkerNew York City Journalist Susan DeMark looks for the stories behind the architecture, buildings, history, and nature of NYC and beyond. She and a graphic designer put together the look of the site and I performed the CSS magic to translate their vision into a WordPress blog.

Visit: Mindful Walker

Categories: Client Sites , Custom Design , Journalists & Artists , WordPress
Tags: Architecture, Css, Graphic Design, Journalism, Journalist, New York, Wordpress | Edit
Web 2.0 tools have changed the boundary lines between techies and program staff in many nonprofits over the past few years. At least, they should have, though I know of various organizations that haven't made the conceptual leap to the new roles.

OLD SCHOOL: Webmaster

Let me explain by talking about my own changing work role. Even a few years ago, I was a paid staff webmaster. You could divide my work into two large categories. The first was techie: I managed server accounts, set up required databases, designed sites. I got into the HTML code, the PHP, the Javascript, CSS, etc.

The other was content: when program-oriented staff had new material they wanted on the website they would email it to me or walk it over. I would put in my work queue, where it might sit for weeks if it wasn't an organizational priority. When it came time to add the material I would boot up Dreamweaver, a relatively expensive program that was only accessible from my laptop and I would put the material onto the website. Needless to say, with a process like this some parts of the website never got very much attention.

At some point I start sneaking in a content management system for frequently-changed pages. This seemed very hackish and not good at first but over time I realized it greatly speeded up my turn-around time for basic text content. But the organizations I worked for still relied on the old model, where staff give the webmaster content to put up.

NEW SCHOOL: Web Developer

Nowadays I'm a web developer, a freelancer with an ever changing list of clients. I typically spend about a month putting together a site based on a content management (like this) or automatic feed system (like I did for Philadelphia's William Penn Charter School). I do a certain amount of training and while I might add a little content for testing purposes, I step back at the end of the process to let the client put the material up themselves. I'm available for questions but I'm surprised about how rarely I'm called.

Here's two examples. Steadyfootsteps is a blog by an American physical therapist in Vietnam. When we started, she didn't even have a digital camera! I gave her advice on cameras, started her on a Flickr account, set up a fairly generic Movable Type blog with some custom design elements and answered all the questions she had along the way. She went to town. She's put tons of pictures and embedded Youtube videos right in posts. Here's a non-techie who has contributed a lot to the web's content!

Penn Charter is a school that was already on Flickr and Youtube but wanted to display the content on their website in an attractive way. I pulled together all the magic of feeds and javascripts to have a media page that showcases the newest material.

They're very different sites, but in neither instance does the client contact me to add content. They rely on easy-to-use Web 2.0 services: no specialized HTML knowledge required.

NEW TOOLS, OLD MODEL

I got an email not so long ago from an old boss who manages a monthly magazine. Her site has been radically rebuilt over the years. Dreamweaver is out and content management is in. They use Drupal, which my friend Thomas T. of the Philadelphia Cultural Alliance tells me won the recent popularity contest among nonprofit techies. This is great, a definite step forward, but what confused me is that my old boss was asking me whether I would be interested in returning to my old job (the successor who oversaw the Drupal upgrade is leaving).

They still have a webmaster? They still want to funnel website material through a single person? Every staffperson there is adept at computers. If a physical therapist can figure out Flickr and Movable Type and Youtube, why can't professional print designers and editors?

My hourly rate ranges from two to five times what she'd be likely to pay, so I turned her down. But I did ask why she wanted a webmaster. Now that they're on Drupal it seems to me that they'd be better off switching from the webmaster to the web developer staffing model: hire me as a freelance consultant to do troubleshooting, staff training and the occassional special project but have the regular fulltime staff do the bulk of the content management. I'd think you'd end up with a site that's more lively and updated and that the cost would about the same, despite my higher hourly rates.

I've heard enough stories of places where secretaries have come out of the shadows to embrace content management and have helped transform websites. I'm the son of a former secretary so I know that they're often the smartest employees at any firm (if you walk into an office looking for the expert on advanced Excel features you'll surely find them sitting right there behind the receptionist desk).


FINALLY: WHAT'S UP WITH DRUPAL?

I'm trying to join the bandwagon and use Drupal for a upcoming site that will have about a dozen editors. But there's no built-in WYSIWYG editor, no little formatting icons. Sure, I myself could easily hand-code the HTML and make it look nice. But I don't want to do that. And it's unrealistic to think I'm going to teach a dozen overworked secretaries how to write in HTML. The interface needs to work more or less like Microsoft Word (as it does in Movable Type, CushyCMS, Google Docs, etc.)

Most Drupal sites I see seems from the outside like they're still old school: staff webmaster through whom most content funnels. Is this right? Because if so, this is really just an institutionalization of the content hack I did six years ago. Can anyone point me to lively, active Drupal sites whose content is being directly added by non-techie office staff? If so, how is it set up?
Categories: Drupal , Practical 2.0 , Web Design
Tags: Css, Dreamweaver, Drupal, Flickr, Javascript, Movable Type, Penn Charter, Philadelphia, Php, School, Web 2.0, Web Developer, Youtube | Edit
William Penn Charter School Media PagesOne element of a general social media consultancy project I've undertaken with Philadelphia's William Penn Charter school is a dynamic media page. They had collected a large number of photos, movies and podcast interviews, but the media page on their site was static and without pictures. I worked with them to come up with media policies and then built a media site that automatically displays the latest Flickr sets and Youtube videos, all laid out attractively with CSS. The Flickr part was complicated by the fact that Flickr doesn't produce feeds of sets and this required access to it's API and fairly extensive Yahoo Pipes manipulation. The original podcasts were just uploaded MP3 files and I worked to collect them together via Odeo (hosting) and Feedburner (feed publishing), which then provides RSS and iTunes support. The actual content for the page is collected together on the Martinkelley.com server and embedded into the Penn Charter media pages via javascript. Other work with Penn Charter includes Google Analytics and Dreamweaver support.

Update: PennCharter redesigned their website in August 2009 and the Media Page is unavailable.

Client Testimonial:

"Martin has worked for our school to integrate Web 2.0 technologies into our communication materials. Martin is highly-personable and his is an expert in current technological approaches. This is a hard match to find in consultants." April 30, 2009

Michael Moulton, Technology Director, William Penn Charter School.
Hired Martin as a IT Consultant in 2007, and hired Martin more than once.
Top qualities: Personable, Expert, High Integrity.

Categories: Client Sites , Educational
Tags: Analytics, Consultant, Css, Dreamweaver, Flickr, Javascript, Media, Odeo, Penn Charter, Podcasts, School, Yahoo, Youtube | Edit
Martin Kelley's work has been featured by top newspapers and tech blogs. He has given workshops and presentations on educational and Web 2.0 themes. He is available for speaking engagements and freelance writing.


Publications/Media

ReadWriteWeb (republished on NYTimes.com), Technology is Great but Are We Forgetting to Live?, January 22, 2009. Quote and citation. Read more.

Web 2.0 Mashups and Niche Aggregators, published by the O'Reilly Media Shortcuts Series. Commissioned author.

Quakers in the Blogosphere (PDF), Western Friend/Friends Bulletin, February-March 2006, editorial features Quakerquaker.org.

FGConnections, The Witness of Our Lost Twenty-Somethings, Spring 2005. Author.

Friends Journal, "The World Is Hungry for What We've Tasted," October 2006. Author.

Beliefnet.com, "Best Spiritual Blogs," August 2006. Cited QuakerQuaker.org.

Waging War on War, Washington Post, profile of a number of peace groups including Nonviolence.org.

Not Your Father's Antiwar Movement (subscription required), Atlantic Monthly, cited Nonviolence.org.

USAToday, Missiles Aren't the Answer, featured Op-Ed, November 16th, 1998. Author.

Iraqi Crisis Increases Activity on Peace Network, a major New York Times profile of Nonviolence.org, February 21, 1998.


Fellowships

Friends Institute Fellowship, Philadelphia Yearly Meeting, for work on Nonviolence.org (1996).

Pickett Endowment for Quaker Leadership, helped support 2005-2006 activities that led to the creation of QuakerQuaker.org.

Categories: Martin
Tags: Atlantic Monthly, Beliefnet, Fgconnections, Friends Institute, Friends Journal, New York Times, O'Reilly Media Shortcuts, Philadelphia Yearly Meeting, Pickett Endowment, Quaker Leadership, Readwriteweb, Usatoday, Washington Post, Web 2.0, Western Friend | Edit

Web Designer, Content Editor, SEO Specialist

See also: Print Resume, LinkedIn profile.

SKILLS

Consulting: Fifteen years of experience in nonprofit world. Much of this work consists of educating staff and leadership on effective use of online communication technologies. Current focus is on analytics, integrating social media, and helping nonprofits adopt content management systems.

Web Development: Proficiency in HTML, XHTML, PHP, CSS, PERL (CGI), MYSQL, Adobe Dreamweaver, Six Apart's Movable Type, Drupal, WordPress, t and related content management systems, along with Search Engine Optimization techniques and analytic tracking methods. Experience with various shopping cart backends for E-Commerce applications. Comfortable with Quark Xpress, Adobe Pagemaker, Adobe Photoshop, Joomla, and Javascript. Close follower of Web 2.0 developments.

Editing: Experience as Acquiring Editor for nonprofit publishing house; proficient at negotiations, copy editing, marketing.

Categories: Resume
Tags: Adobe, Analytics, Annual Reports, Bulk Email, Cheltenham High School, Consulting, Content Editor, Delicious, Dreamweaver, Drupal, Editor, Feedburner, Fellowship Of Reconciliation, Flickr, Friends General Conference, Friends Journal, Geography, Graphic Representations, Haddonfield, Internet Communications, Javascript, Joomla, New Society Publishers, Ning, Nonprofits, Nonviolence, Oreilly Media, Pagemaker, Pax Christi, Pennsylvania, Philadelphia, Philosophy, Photoshop, Quakerquaker, Raphael Webscapes, Resume, Search Engine Visibility, Seo, Six Apart, Social Media, Villanova, Villanova University, War Resisters League, Wordpress, World Game Institute, Wyncote | Edit
Martin Profile PictureMartin Kelley is a web designer in the Philadelphia area. Here's the story of his evolution from activist book editor to social media web guru!

Categories: Martin
Tags: Alternative Press, Book Editor, Economics, Editing, Email, History, Independent Bookstores, Journalism, Music, New Society Publishers, Peace Groups, Philadelphia, Pictures, Quaker, Small Business, Social Media, Typesetting, Web Design | Edit

I'm working on an international site built in Movable Type and including statements in multiple languages, including "Right to Left" languages like Arabic and Hebrew.

I was pleasantly surprised when I cut-and-pasted an Arabic text from MS Word into Movable Type and found the letters looking good both in the MT entry box and the resultant post. I didn't realize just how powerful UTF-8 encoding is and how well MT supports it throughout the system. Still, the output wasn't correct, as it wasn't displayed in right-to-left fashion. I needed to figure out the CSS for this kind of output and an easy way to allow the client to set this without forcing them into coding.

Using the highly-recommended Rightfields Plugin I added a checkbox field for posts that should be displayed in RTL. Here's a screenshot:

RightFields has an IF function that we can use to set a new DIV with our RTL style. Here's the coding in the MT template, stuck in just after the "entry-body" div:

<MTExtraFields>
<MTIfExtraField field="RTL">
<div class="rtl-display">
</MTIfExtraField>

Note: you'll also have to add similar code to close the div at the end of the passage.

Finally, as best as I can determine, this is the proper CSS designation for RTF display (Microsoft has a good webpage on this). It works in Firefox, IE7 and IE6.

.rtl-display p {direction:rtl;text-align:justified;text-align:justify;}

I'd be happy to get any feedback or corrections to this. I'm a typical 'Merican whose foreign language skills don't go far past a dozen phrases lifted from Sesame Street and long-ago French classes. Arabic and Hebrew typesetting are quite unfamiliar terrain.

Categories: Movable Type
Tags: Fashion, Hebrew, Highly Recommended, Languages, Movable Type, Ms Word, Pleasantly Surprised, Resultant, Rtl, Screenshot, Wikipedia | Edit

Hire Martin! I build sites and online promotion campaigns to your specs and budgets and can be your guide to social media marketing.

Also available: my resume, a brief biography, organizations I've worked with, speaking and workshop engagements, client recommendations and a portfolio of recent work:

Recent Entries

Recent Comments

Archives