<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0"
    xmlns:dc="http://purl.org/dc/elements/1.1/"
    xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
    xmlns:admin="http://webns.net/mvcb/"
    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
    xmlns:content="http://purl.org/rss/1.0/modules/content/">

    <channel>
    
    <title>C77 Studios / Mark J. Reeves</title>
    <link>http://c77studios.com/index/</link>
    <description></description>
    <dc:language>en</dc:language>
    <dc:creator>mjr@c77studios.com</dc:creator>
    <dc:rights>Copyright 2007</dc:rights>
    <dc:date>2007-11-15T16:18:00-05:00</dc:date>
    <admin:generatorAgent rdf:resource="http://www.pmachine.com/" />
    

    <item>
      <title>Almost there, Safari</title>
      <link>http://www.c77studios.com/site/almost_there_safari/</link>
      <guid>http://www.c77studios.com/site/almost_there_safari/#When:16:18:00Z</guid>
      <description>Trials and tribulations of trying to use Safari full&#45;time.
I want to use Safari as my regular browser. WebKit&#8216;s taking off. There&#8217;s solid development efforts going on. It&#8217;s native to my OS. It&#8217;s never been quite there, though.


I&#8217;m a Firefox fan and advocate generally. One of the reasons for my support is its support for plugins, including the Web Developer Toolbar, which I use daily. When developing and testing pages, I frequently disable the browser cache so my refresh is ensured to contain the latest changes. This makes browsing any other site near impossible. Every little star icon in Gmail has to load every time the Inbox is refreshed.


Fully functional Gmail support is important to me. For that reason, I&#8217;d been using Firefox&#8217;s cousin, Camino, for Gmail, regular browsing, and project management web apps. Something&#8217;s been a little off there too, though.


So I tried Safari again recently, with the 3.0 beta. I ran into a few snags, though, that really impact me:

In Gmail, I could not hit tab from the Message field to hit the Send button. After composing a message using nothing but the keyboard&#8212;even to enter a recipient&#8217;s address and have Gmail autocomplete it for me&#8212;I had to reach for the mouse to send.
In Backpack To Do lists, the cursor wouldn&#8217;t place in the next, new list item automatically. Again, entering content with the keyboard, hitting enter on a To Do item submitted it, and left the cursor...nowhere. Reach for the mouse to click into the autogenerated new field.
Using Gmail Notifier as my default client, Safari&#8217;s &#8220;Mail Link to this Page&#8221; menu item wouldn&#8217;t launch a compose screen. In the past I&#8217;ve seen errors saying Gmail Notifier wasn&#8217;t supported. Recently it would launch a browser window but would redirect to the Inbox instead of the compose screen. At that point I switched my default browser back to Firefox, which did successfully launch the compose window when I mailed a link from Safari.

They sound small, but they&#8217;re things I do all day long. I gave up. Decided to use Firefox full&#45;time. That left me with my management apps (email, project management, etc) in the same application as my development windows. Not good, either.


Then I read the Surfin&#8217; Safari post, &#8221;Ten New Things in WebKit 3,&#8221; this morning. After my first pass through, I wanted to comment and say, &#8220;Yes, but until these three things work for me, I cannot switch to take advantage of these 10 new things!&#8221; I couldn&#8217;t comment. I couldn&#8217;t find an email address to comment.


I read through the article again and saw this:

WebKit 3 fixes many bugs, and supports additional text editing features like links and lists. We now have support from web applications like WordPress, Google Docs, GMail, Blogger, and many more.

I downloaded the OS X Tiger 10.4.11 update, launched Safari, browsed to Gmail, and&#8230;


We&#8217;re good. I can tab to the Send button. I can launch a compose screen. I can add To Do items with just the keyboard in Backpack. Now, however, typing in the To field in Gmail isn&#8217;t providing me the autocomplete address lookup! I&#8217;ve been noticing a severe lag in this in all browsers lately, and suspect something on Google&#8217;s end. This needs to be working and working fast. I need to be able to hit Compose (or hit &#8216;C&#8217; on the keyboard), be in that field, type a name, and be on my way to composing.


Once that&#8217;s there, I&#8217;ll be happy, and using Safari full time.


If you find yourself bouncing back and forth between browsers to try out features or for different uses, Bookdog is a great little OS X app for migrating and synchronizing bookmarks.


Update: I just noticed an &#8220;Older Version&#8221; link in Gmail. I clicked that and found myself in a Gmail where autocomplete of addresses in the To field works in Safari. I again wasn&#8217;t able to tab to the Send button, though. In fact, tabbing from the Message field brought me to the Subject field and inserted tab characters. So it&#8217;s up to Gmail to restore autocomplete...?


Update 2: It&#8217;s becoming apparent that once I type an address into the &#8220;New Version&#8221; of Gmail, it&#8217;s available in autocomplete going forward. I&#8217;ve also noticed that every Gmail screen now has &#8220;?ui=2&#8221; in the URL. Things could be working out nicely in Safari 3.</description>
      <dc:subject>Technology, Web Development</dc:subject>
      <dc:date>2007-11-15T16:18:00-05:00</dc:date>
    </item>

    <item>
      <title>Who&#8217;s writing about office chairs?</title>
      <link>http://www.c77studios.com/site/whos_writing_about_office_chairs/</link>
      <guid>http://www.c77studios.com/site/whos_writing_about_office_chairs/#When:23:07:00Z</guid>
      <description>Trying to find a good office chair...or just an opinion on them.
I&#8217;m moving into an office November 1st. I&#8217;ve got an IKEA desk at home to bring in. I&#8217;ve got the computers already. I&#8217;ve got a set of chrome shelves, some computer speakers, and a few spare chairs for seating. I need to buy an Airport Express for wi&#45;fi. I need to buy a good desk chair.


With two days to go, I&#8217;m no closer than I was two weeks ago. I&#8217;m not up for the drive to IKEA, or the shipping charges and blind faith required for an online purchase. I checked Staples: prices were low, but nothing grabbed me, and I&#8217;ve encountered too many online reviews that they fall apart after a few months of use.


I consider it a worthwhile investment, but I can&#8217;t afford an Aeron chair or a Steelcase Think, much as I&#8217;d like one. I swore earlier I was going to buy a Herman Miller Celle for $450, until I saw that adjustable arms and adjustable lumbar jacked the price up to $630.


I ordered an Office Star 2300 for $249, with free shipping. It had all the adjustable features I was looking for. I waited a day to find out just how soon I&#8217;d get it, and was told it was backordered til December. That explains why it&#8217;s out of stock on Staples&#8217; site ($259). It was a gamble anyway.


I&#8217;m intrigued by the lineup at SitOnIt Seating, including the affordable TR2, but the few sites I find it for sale on offer myriad configuration options, making it difficult to figure out what exactly you are choosing and getting. And unlike the Aeron or Think, the Internet isn&#8217;t abuzz with positive opinions. Or epinions. Or countless other sites that don&#8217;t actually offer reviews but really just product descriptions and links to retailers.


Update: This ranking puts the TR2 in the top 10. I found one retailer with a Yahoo! store and priced one at $370 with the adjustment options I wanted. I&#8217;ve got a request to SitOnIt to inquire about ordering direct. I also came across an article citing a KI rep, who said paying anything more than $250 was paying for looks, so I&#8217;ve got a request in with them to inquire about their Impress chair.


Who&#8217;s writing about their experiences with these chairs? Who&#8217;s pointing to solid, reliable, comfortable mid&#45;range products? Chairs that don&#8217;t cost $500&#45;1000 for comfort and reliability. Jason Santa Maria asked for recommendations, and ended up with a Humanscale Freedom off Craigslist. My Craigslist searches haven&#8217;t proven so fruitful.


Can anyone recommend a site with recommendations on office chairs? (Or a non&#45;office superstore in the area&#8212;Boston or the North Shore&#8212;to check some of these options out?)


Update: Just found this review of the Celle that was informative. Still $630 with options.</description>
      <dc:subject></dc:subject>
      <dc:date>2007-10-30T23:07:00-05:00</dc:date>
    </item>

    <item>
      <title>A mishmash of recent updates</title>
      <link>http://www.c77studios.com/site/a_mishmash_of_recent_updates/</link>
      <guid>http://www.c77studios.com/site/a_mishmash_of_recent_updates/#When:04:27:00Z</guid>
      <description>Latest news for my neglected blog.
Busy

Last month I took on a full&#45;time on&#45;site contract gig in addition to a handful of projects. The contract ended 10/5, and I&#8217;m down to just one of the other projects, in addition to October&#8217;s workload. I&#8217;m very much booked for the next few months and continuing to receive requests. To keep up with all of this, I&#8217;m looking at a few options, including finding some allies to delegate production work to, and now looking for office space, so I can be more productive than I am in my corner of our home.

My iPhone

My iPhone has become indispensable. There&#8217;s been a few quirks and idiosyncrasies over the past month, but when I was heading into Boston on the train daily, and sitting on a desktop computer as a contractor, having the iPhone handy for email, the web, and music was awesome. That said:

Battery life: It hasn&#8217;t let me down yet, but I&#8217;ve had red 20% and 10% warnings on the train on the way home. Of course I&#8217;d spend much of the day refreshing email, and using Safari on EDGE on the train. Internet usage is the biggest drain. I guess 10.5 hours of usage isn&#8217;t so bad with that in mind.
Mail: I&#8217;ve had one frustration with mail and it&#8217;s largely stemmed from one client with images embedded in their mail signature. I&#8217;d already been routing all my POP addresses through one Gmail account, so I just set up Gmail through the iPhone&#8217;s predefined settings. The only catch is with attachments. A download, even if the two&#45;line preview is displayed, is forced when there&#8217;s an attachment to an email. Is this always true? Not sure. Do I have to sit and watch it say &#8220;Loading...&#8221; every time I&#8217;ve gone back to one of their emails. Yup.
Fast EDGE and slow EDGE: I read somewhere on the web that there are actually two versions of the EDGE network in use. I could tell you which one I was on at a given moment while on the train. EDGE is not particularly fast, but it&#8217;s functional. Slow EDGE is slow and cumbersome. Waiting 1 minute for an email to load is no good.
Crashed There were a few incidents, especially after the latest update (1.1.1). Sometimes I&#8217;d hit a page in Safari and the music would just stop. When I went back into iPod, it wouldn&#8217;t remember what album I was in, but would revert to a previous selection. One morning it completely locked. I had to look up how to reset it (hold both buttons in til it does), to reboot it and regain control. Another morning, as I slid the slider to unlock it, it stuck at the right edge. Hitting the top button would show/hide the splash screen, with the slider halfway up the screen. I had to reboot it then too.

I have not hacked it. I bought an iPhone to be productive with it and to use what Apple provided, not compromise that. (Interesting thoughts on that here. And the other side of the story, sort of, here.) At home, on wifi, it&#8217;s amazing. I can grab it and sit on the couch and have a full Internet experience in my hand. The only thing I&#8217;ve played with was renaming MP3s to create ringtones in iTunes, which 1.1.1 broke.


Btw, WordPress is optimized for iPhone.

Transparent PNGs

I&#8217;ve been trying to shift production work to using PNGs for some time. With two recent projects I&#8217;ve finally taken the time to make it work, not without some snags.


The process I&#8217;ve been using:

Save for Web in Photoshop (CS2) as PNG&#45;24 if you want alpha transparency (anti&#45;aliased &#45; edge colors fading over the background). To do this, you need to cut the graphic over a transparent background. You can also go transparent GIF style, and use PNG&#45;8, which will allow you to select multiple transparent colors, but the edges up to those colors will be aliased. You can&#8217;t float an image over any background with PNG&#45;8; you need to match the background color.
I then grab the images from my iMac over the network to my laptop, where I do coding. I drag and drop them onto GammaSlamma, a mac product that strips Photoshop&#8217;s embedded color profile info out of the image files. This was my biggest challenge working with PNGs. They&#8217;d render different colors in Safari and Firefox on the Mac, and probably different on Windows. GammaSlamma eliminates that concern.
There&#8217;s still a problem with PNG&#45;24: IE6. It doesn&#8217;t support alpha transparency in PNGs. There&#8217;s a solution. You can find it at http://www.twinhelix.com/css/iepngfix/. Unfortunately that solution isn&#8217;t without its snags. Because it replaces images through references to their parent, it breaks when you apply it to positioned elements. (You also have to specify each element with a PNG background image that it&#8217;s going to hit, as by default it just grabs all img tags.) Why is this a problem? Well, the project I&#8217;m currently working on has all these nice little boxes with rounded corners that can grow vertically over a gradient background. Using &#8220;bottom left&#8221; for my background image breaks when that image has position and is fixed, and binding a button to the bottom using position: absolute and a position: relative container, not to mention that that button is a PNG&#45;24 background image, breaks too. I got around it by using a double wrapper div, but I&#8217;m not a fan of that. I had to give up on the rounded corners and do PNG&#45;8 and push back on the gradient background. Same for the background&#45;image I was swapping using jQuery in the top of the box as different tabs were clicked. I had to do PNG&#45;8, and it can only sit over a specific background. Still, some progress has been made. A few steps can provide some nice effects, providing the layout is tempered with some restraint so they don&#8217;t pile up too fast.
Recent work

I need to put together a portfolio update together highlighting some recent work I&#8217;ve done. For now I&#8217;ll just say:


Cadillac, XSLT, NBC, Playskool, sIFR, jQuery, .NET, client press coverage (for Rack &amp;amp; Go).

Color suggestions?

I put together this version of C77 so I could update the design purely through CSS. I grabbed a palette (Giant Goldfish) off COLOURlovers and applied it. I&#8217;m looking for something new. If you&#8217;d like to suggest 5 or 6 colors that would work well, some orange is a must, feel free to send them my way.</description>
      <dc:subject>Clients, Mobile, News, Personal, Web Development</dc:subject>
      <dc:date>2007-10-12T04:27:00-05:00</dc:date>
    </item>

    <item>
      <title>Wanted: Freelance XHTML/CSS Developer</title>
      <link>http://www.c77studios.com/site/wanted_freelance_xhtml_css_developer/</link>
      <guid>http://www.c77studios.com/site/wanted_freelance_xhtml_css_developer/#When:03:48:01Z</guid>
      <description>It&#8217;s time to hire some help around here.
Posted on Craigslist Boston: 2007&#45;09&#45;27, 10:46PM EDT


I&#8217;m a freelance web developer and consultant who partners with designers and agencies (as well as direct client engagements) on projects ranging from backend, data&#45;driven application development to production work based on Photoshop comps. My clients turn to me because I&#8217;m fast, detail&#45;oriented and think through the ins and outs of their projects and designs.


I&#8217;m reaching a point where more work is coming my way than I can take on. I&#8217;m not looking to fill a position here, but for someone who&#8217;s got some free time and is looking for opportunities to shine in quick turnaround projects, expand their skillset, and make some extra cash. If you&#8217;re looking for some after&#45;hours work or are a freelancer with some gaps to fill, get in touch.


A few requirements (and pluses):


* You&#8217;re fast, a fast learner, know your way around Photoshop and CSS, and are savvy enough to dev on a local server and sync your changes with a staging site.

* You not only &#8220;get&#8221; web standards, but value them, and look for opportunities to deliver optimized, maintainable, accessible and search&#45;friendly markup.

* You can tell me who the key players are in the web standards/CSS field, and why they&#8217;re important.

* You can show me that you take pride in your work, through a portfolio or site with your name on it.

* I&#8217;ll be impressed by the markup I see there.

+ Experience with jQuery.

+ Experience with ExpressionEngine.

+ Knowledge of PHP/MySQL or .NET/SQL Server.


How we&#8217;ll work together:


I&#8217;ll split my rate with you proportionate to the work I delegate you on a given project. I bill clients hourly and on flat project fees, so it varies from job to job.


I have high standards for work that goes out the door and how I work with my clients. I&#8217;m looking for someone willing to follow my lead, and would like to be in a position where I can start a project, doing initial guides and slices in Photoshop and initial page templates, and then hand those off to build out. Integrity is of paramount importance. If that sounds good to you, let&#8217;s talk about working together.


More info on rates and my portfolio by email. More about me at c77studios.com</description>
      <dc:subject>Clients, News, Personal, Web Development</dc:subject>
      <dc:date>2007-09-28T03:48:01-05:00</dc:date>
    </item>

    <item>
      <title>I got an iPhone</title>
      <link>http://www.c77studios.com/site/i_got_an_iphone/</link>
      <guid>http://www.c77studios.com/site/i_got_an_iphone/#When:04:54:00Z</guid>
      <description>A few days ago, at the new price of $399, I got one.
A few weeks back I was in NYC with my designer counterpart. With time to kill after the meeting we took the train down for, and before our train back, we headed up to the Fifth Avenue Apple Store.


I hadn&#8217;t touched an iPhone yet. As with the store (an Apple store under a big glass box), I thought it was nice, but I wasn&#8217;t blown away. The iPhone was nice, but not $600 nice.


As I&#8217;ve posted recently, though, I&#8217;ve become somewhat enamored by the prospects of developing for the iPhone, and after a meeting last Wednesday, I was offered the opportunity to be reimbursed for one to be able to do real&#45;world testing of a project I&#8217;m pretty excited about.


I started hitting Engadget on my Sidekick II after the meeting, and saw all the new goodies, and the price drop on the iPhone. Thursday I headed into the Apple Store nearest me (North Shore Mall in Peabody, MA), where none of the new products were out. That was fine: 8gb and 4gb iPhones were $200 off, making my 8gb model $399, as promised. (You can actually get 4gb models for $299 while they last).


My intent was to bypass the activation process, documented days after its initial release, and just use it on wifi at home. It didn&#8217;t take long for me to decide to activate it, for the full experience, leaving my T&#45;Mobile account active until my contract&#8217;s up in November.





So I&#8217;ve got one. And my verdict? It&#8217;s nice. A few things threw me off at first, but once I got everything set to sync how I wanted, it couldn&#8217;t be better.

Mail: I started with all my accounts copied over and quickly turned them all off. I&#8217;m now down to a C77Studios.com account for when I want to send with that address and my Gmail account, which all my other accounts already forward into. I tried doing Gmail with POP first, wasn&#8217;t happy, and then used the built&#45;in Gmail settings. That threw me off too. The Inbox doesn&#8217;t filter based on a cut&#45;off date. It just shows 25, 50, 100, etc of your emails. The key is: &#8220;Use Recent Mode.&#8221; This grabs the latest email and pushes the others down. The 50th email is bumped out to make room for the 1st. You&#8217;re always viewing your most recent, and if you want to make room for more, you can Delete. You can&#8217;t empty your Trash, though, and you can&#8217;t move a message to another folder to keep it handy. That bothers me a bit.
More on Gmail: I&#8217;ve seen some complaints that whenever you send Gmail, it ends up in your Inbox. This isn&#8217;t an iPhone issue. This is how POP with Gmail has always worked. It&#8217;s because Gmail treats all your mail as one big collection. The Inbox, Archive, and Sent views in the Gmail application are just views; they&#8217;re not distinct folders. It&#8217;s actually handy sometimes to have a sent message in your Inbox anyway.
EDGE: Slow. Useful for iPhone&#45;optimized sites. Checking email takes a minute.
Mobile Safari: Awesome. I LOVE that I can have multiple &#8220;windows&#8221; open, which is a habit I&#8217;m used to on the desktop. Accessing Mint using the iPhone Pepper is swell. I use Camino and Firefox on my mac more than Safari, so I&#8217;m working on a process of migrating bookmarks into Safari for syncing using Bookdog and perhaps at some point Automator.
iPhoto: I took some pictures, set the wallpaper. I synced. Every time I synced my phone, iPhoto opened again asking me to sync. iPhoto sees your phone as a digital camera; you have to treat it as one. Delete all the pics from the iPhone when you import. If you want them back on it, drop them in an album that you set to sync. You just can&#8217;t leave them in Camera Roll.
YouTube: Phenomenal quality while on wifi. Haven&#8217;t tried it on EDGE.
Google Maps: Crazy to be holding a pic of my building in my hand. Haven&#8217;t really used it to navigate yet.
Contacts: This took a while. Zeldman described this well. The iPhone convinces you to abandon existing habits in favor of syncability. I&#8217;ve got email addresses in Gmail. I&#8217;ve got contacts in Highrise. I&#8217;ve got numbers on my old cell phone. I once downloaded all my LinkedIn contacts and imported them into Address Book. When I first synced my iPhone, it was full of people I&#8217;d never even call. I purged Address Book and started clean, manually entering and organizing friends, family and business contacts. I&#8217;m happy now. We&#8217;ll see how keeping up with it goes.
Overall: It&#8217;s easy to use and despite the lock on features, it feels personal. I&#8217;ve done the ringtone hack, and redone it post&#45;7.4.1 update. I&#8217;m not too intent on doing anything else to it yet (Installer hacks, etc). It is difficult to use in the car. I&#8217;m thrilled that I can use the Plantronics 510 Bluetooth headset I bought for my mac in the car now. (My Sidekick II doesn&#8217;t have Bluetooth.) But you can&#8217;t make a call on a non&#45;tactile keypad without looking down. Voice activation?
And the keyboard: I knew when I first saw it weeks ago I could make it work. I&#8217;m pretty quick and clean typing, but it&#8217;s one&#45;fingered looking down for confirmation. That&#8217;s the drawback. With my Sidekick II flipped open, I could tell where I was on the keys just like on a traditional keyboard and could focus on what I was typing rather than how. It&#8217;s a great UI, but it&#8217;s going to take some getting used to. I&#8217;ll mention the lack of Keychain (or saved passwords) in this context too. Without that, you have to navigate form fields and reenter account info every time you visit a login site. Something to put on the nice&#45;to&#45;have list.

I&#8217;m still playing with it. I spent the better part of this evening importing music from my iMac into iTunes on my MacBook so I could sync some with the iPhone. I&#8217;m very pleased with it so far. Definitely $399 nice.</description>
      <dc:subject>Mobile, News, Technology, Web Development</dc:subject>
      <dc:date>2007-09-09T04:54:00-05:00</dc:date>
    </item>

    <item>
      <title>.MOBI: Making Strides</title>
      <link>http://www.c77studios.com/site/mobi_making_strides/</link>
      <guid>http://www.c77studios.com/site/mobi_making_strides/#When:23:42:00Z</guid>
      <description>The Internet&#8217;s just information. Mobile&#8217;s the next medium.
The Internet&#8217;s really just about lots and lots of information. It happens to be that many of us access that information through web&#45;based or desktop email clients and web pages. In many parts of the world, a mobile handset is a user&#8217;s only gateway to the Internet. No matter how big your screen, the lines are blurring between these disparate interfaces. Email, IM and social network messaging are becoming interchangeable, and web content is all over (think Twitter updates via SMS). We&#8217;re getting closer and closer to the promise of ubiquitous computing (think tricorders on Star Trek).


The iPhone&#8217;s launch has brought attention and sophistication to the mobile web. Whether or not you&#8217;re sold on Apple&#8217;s execution, you probably look forward to the enhancements on other devices that it will inspire.


My second cell phone was from SprintPCS in 2000. It had a web interface that allowed me to read predefined news selections. I can&#8217;t recall much else about it. I next switched to Voicestream and got a Nokia 3390 Gold, with AOL IM on it. I&#8217;m not sure if I had web access, but I did start text messaging with that phone. From there it was to Cingular to get the new (at the time &#45; in 2004?) Nokia phone that unfolded to expose a full QWERTY keyboard that was split with the screen in the middle. I loved many things about that phone, but the email client was a clunky Java app and the web browser still left much to be desired.


Most recently, two years ago, I got a T&#45;Mobile Sidekick II. Easy to use, the Sidekick has a cheezy interface, but offers POP email, AOL IM, SMS, and web browsing. The web browser on the Sidekick does not read mobile stylesheets. Instead it pulls content through Danger&#8216;s server, formatting and positioning things down the narrow page. I use my Sidekick a lot, most often while on commuter trains. All of my email is copied to it, and I use IM when I&#8217;m away from the desk. I use the browser regularly to access sites like Google News, the Huffington Post, Google Reader (mobile), and Digg for the iPhone. I&#8217;ve yet to encounter a link I can&#8217;t click through and read in full. The only handicap is that I&#8217;ve disabled JavaScript to improve rendering times.


Now we have the iPhone with Mobile Safari that renders pages in full and allows you to zoom in and out to read regions of content. Opera Mini, found on Nokia phones and available as a download where Java apps are supported behaves similarly in its next version. Google leveraged the iPhone&#8217;s launch to be a real mobile player by embedding its Maps and YouTube apps onto the iPhone.


Now Google&#8217;s about to launch a mobile device.


What&#8217;s my point in all this? Critical mass is imminent. You can&#8217;t ignore this stuff anymore. I wrote about this a few months back and recently took a pass at formatting my content for the iPhone. While the potential offered by these devices is their improvements at making all web sites accessible on mobile, the real promise is in making content usable on them. Optimization. And to create an optimal experience, you need to understand the experience. I&#8217;ll likely gravitate toward the iPhone, perhaps replacing my Sidekick with one as my T&#45;Mobile contract is up in November, and I&#8217;ve been a bit disappointed with T&#45;Mobile of late. As I incorporate mobile into my practices, I&#8217;ll be sharing what I learn here, beginning with some recent announcements and resources I&#8217;ve been following:

Put Your Content in My Pocket by Craig Hockenberry at A List Apart
Mobile Web Design was released last week by Cameron Moll
The iPhoney emulator which I, sans iPhone, used to develop C77Studios.com/iPhone
Opera Mini Simulator &#45; Opera Mini is a popular mobile browser. The simulator enables you to preview your site as it would appear.
Apple Developer Connect &#45; Web Development for iPhone
Multi&#45;Safari &#45; If you&#8217;ve upgraded to Safari Beta 3 for testing iPhone dev, you can run older versions of Safari for your day&#45;to&#45;day testing
Added 9/4/2007: The good, the bad, and the ugly &#45; iPhone edition on WebStandards.org

If you&#8217;ve got any pointers or just want to connect on mobile development, email mjr@c77studios.com. You can also access my latest posts to del.icio.us and contact info at C77Studios.com/iPhone.


For more posts about mobile web development, visit http://www.c77studios.com/archives/category/mobile.</description>
      <dc:subject>Mobile, Technology, Web Development</dc:subject>
      <dc:date>2007-09-03T23:42:00-05:00</dc:date>
    </item>

    <item>
      <title>C77 Studios on the iPhone</title>
      <link>http://www.c77studios.com/site/c77_studios_on_the_iphone/</link>
      <guid>http://www.c77studios.com/site/c77_studios_on_the_iphone/#When:21:17:00Z</guid>
      <description>Your favorite site, optimized for the iPhone.
I don&#8217;t yet have an iPhone, but Put Your Content in My Pocket on A List Apart, and today&#8217;s release of Cameron Moll&#8216;s Mobile Web Design got me eager to play with structuring a site for one.


You can essentially view an iPhone&#45;optimized site in any browser, including Safari and Firefox. To better simulate the experience, I downloaded the iPhoney emulator. Here&#8217;s what things look like in iPhoney:





The emulator&#8217;s bigger than the device in your hand. It&#8217;s designed that way so the resolution of what&#8217;s rendered matches the higher resolution of the actual iPhone. I find the Digg iPhone interface really appealing, and used that as a basis. What I haven&#8217;t picked apart yet is the nifty JavaScript Digg uses to slide from the list of topics to the actually posts, which are contained in the same page.


The page is managed by my ExpressionEngine install, and uses the Magpie plugin I previously covered to pull in del.icio.us links.


There&#8217;s a few steps I took to make the page iPhone&#45;friendly. The following meta tag in your page keeps the iPhone from scaling the page as it typically would. We&#8217;re formatting the page specifically for the iPhone.

&amp;lt;meta name=&quot;viewport&quot; content=&quot;width=320; initial&#45;scale=1.0; maximum&#45;scale=1.0; user&#45;scalable=0;&quot;/&amp;gt;

The HTML is a straightforward series of &amp;lt;p&amp;gt; and &amp;lt;a&amp;gt; tags, with the &amp;lt;a&amp;gt; tags set to display: block with dimensions making the entire shape &#8220;clickable&#8221; by a finger of any size.


In the CSS, I set the body to turn off scrollbars, even though I did code to the anticipated width:

body { overflow: hidden; }

Then I defined all my shapes to fit 100% of the screen, so that they fill it nicely when turned sideways or vertical:

width: 80%; height: 25px; line&#45;height: 25px; padding: 10px 15% 10px 5%; font&#45;size: 15px;

Finally, all the &amp;lt;a&amp;gt; tags have a background image (the right&#45;pointing arrow) positioned as:

background&#45;position: right center;

That&#8217;s the gist of the coding. And if you&#8217;re really, really into the content that I post to del.icio.us and share on C77, you can now access it from your iPhone. Enjoy!


For more posts about mobile web development, visit http://www.c77studios.com/archives/category/mobile.</description>
      <dc:subject>Mobile, News, Technology, Web Development</dc:subject>
      <dc:date>2007-08-28T21:17:00-05:00</dc:date>
    </item>

    <item>
      <title>WEBDEV: Screen Scraping with .NET 2.0</title>
      <link>http://www.c77studios.com/site/webdev_screen_scraping_with_net_20/</link>
      <guid>http://www.c77studios.com/site/webdev_screen_scraping_with_net_20/#When:13:50:00Z</guid>
      <description>If you have permission, and a valid reason, to do so, scraping content off another site is easy in .NET 2.0.
For many screen scraping is most associated with legacy systems, green monochrome terminals of data, and is an approach to mine data from the memory — or screen — of an incompatible system and get it somewhere where it’s more readily consumed.


The term can also apply to HTML, and web pages, and in this context it often has a nefarious connotation as it can be easily abused. The techniques below would allow you to very easily grab a page off someone’s blog, strip out the posts, and re&#45;display them on your own site. Of course I’m not advocating this, and the advent of RSS, and its popularity amongst bloggers for content distribution, renders all this unnecessary. (See EE: Aggregating content using Magpie and ExpressionEngine.)


I worked on a project where it was necessary, though. A client’s antiquated site featured a set of “robots”: CGI scripts that harvested content from industry sites that were aware of the process and approved of its implementation. The scripts were deemed proprietary by the client’s previous vendor and thus had to be rebuilt.


The scripts were also cantankerous, and that’s not just a symptom of their age. There’s no parameterization or abstraction in them: when any change to the source web site breaks their functionality they can’t be easily updated.

How to build a better bot

We can grab the source page from another web site very easily, using the System.Net.WebRequest class and a System.IO.StreamReader.

WebRequest webrequest = WebRequest.Create(url); // Where url is a string containing the remote URL


StreamReader stream = new StreamReader(webrequest.GetResponse().GetResponseStream());


System.Text.StringBuilder sb = new System.Text.StringBuilder();


string line;


while ((line = stream.ReadLine()) != null)

{ if (line.Length &gt; 0) sb.Append(line); }


stream.Close();

That’s it. You’ve now pulled all the HTML from the source page into a string. Note the use of the System.Text.StringBuilder class, with the .Append() method described as 1000 times as fast as string concatenation.


That wasn’t enough to actually make use of the content. All I’ve done is grab the source page; I haven’t actually harvested anything from it yet. I also don’t have a fully functional page if I wanted to re&#45;render it in its entirety, as any relative paths to images, stylesheets, etc are now broken.


To parameterize identification of blocks of HTML I want to harvest into concise, editable patterns that can be modified to match changes on the other end, I turned to Regular Expressions in C#. Using my url value again, the first thing I did was update all src, href, and @import values to include that URL, where the existing value did not already start with http://.

using System.Text.RegularExpressions;


…


string output = sb.ToString();


output = Regex.Replace(output, “href=”(?!http)”, “href=”&#8221; + url);

Repeated for src, and @import values.


Now that that’s cleaned up, we can harvest all the headline links from the page, which contained a list of press releases. Using the same Regex call as above to glean the values and store them separately, I set up four patterns:


regex, to contain the pattern that matches a chunk of HTML for each press release:

string regex = “(&amp;lt;p class=”date”&amp;gt;).*?(&amp;lt;/ul&amp;gt;)”;

regexLink, to grab the link from the HTML:

string regexLink = “(?&amp;lt;=(href=”)).*?(?=”)”;

regexHeadline, to grab the title of the press release from the HTML:

string regexHeadline = “(?</description>
      <dc:subject>Web Development</dc:subject>
      <dc:date>2007-08-28T13:50:00-05:00</dc:date>
    </item>

    <item>
      <title>EE: Quick URL redirects using segment variables</title>
      <link>http://www.c77studios.com/site/ee_quick_url_redirects_using_segment_variables/</link>
      <guid>http://www.c77studios.com/site/ee_quick_url_redirects_using_segment_variables/#When:00:31:00Z</guid>
      <description>Catch and redirect to an updated URL on your site using ExpressionEngine&#8217;s segment variable.
This is my second post on using ExpressionEngine to power your blog or web site. ExpressionEngine is a feature&#45;rich content management system used by web designers and developers to power their own and their clients’ web sites. ExpressionEngine works for me as a flexible rendering engine that accommodates custom fields, easy content entry, and a tag&#45;based templating system that anyone can use to store HTML or pre&#45; and post&#45;processed PHP. With ExpressionEngine, I know I’ll never have to say, “sorry, the CMS won’t do that.”


This post came about when I was linked to on the ExpressionEngine Blog.


Happy as I was when I saw traffic start coming through from a link on the ExpressionEngine Blog, I was dismayed to see that my RSS feed, where the link came from, still had my older entry URL, without the /post. My previous design accommodated multiple entries and single entries on the /index template. ExpressionEngine will serve multiple entries as specified on the &#123;exp:weblog:entries&#125; tag, or filter down to a single entry if it catches its url_title on the URL requested.


But single entries weren&#8217;t long enough for the homepage in the new design, and I coded all my single entry links to a /post template. I checked and rechecked my homepage links and archive links, but the RSS feed slipped through the cracks. A single entry link off the homepage made it out into the wild, and I was starting to get some decent traffic on a less&#45;than&#45;perfect page.


I shot off an email requesting a change while working on a solution using my old template as a testpad. What did I use? ExpressionEngine&#8217;s segment variable.


The segment variable lets you grab a slice of the URL delimited by &#8216;/&#8217;.


On the URL

http://www.c77studios.com/post/ee_aggregating_content_using_magpie_and_expressionengine/

I could output the value &#8216;post&#8217; by saying

&amp;lt;? echo {segment_1}; ?&amp;gt;

To do so, you need to turn on PHP parsing for the template (Allow PHP?) in the Template Preferences Manager and set the PHP Parsing Stage to Output, so that the PHP code is run on the value output by ExpressionEngine.


My first step was to test things by doing a quick &#8216;hello world!&#8217;.

&amp;lt;?

if (&apos;{segment_1}&apos; == &apos;ee_aggregating_content_using_magpie_and_expressionengine&apos;)

{

echo &apos;hello world!&apos;;

}

?&amp;gt;

That worked, so now I had a functional conditional to catch the value. Since this was an urgent fix, I wanted to catch this specific circumstance and get them to the right spot.

&amp;lt;?

if (&apos;{segment_1}&apos; == &apos;ee_aggregating_content_using_magpie_and_expressionengine&apos;)

{

header(&apos;Location: /post/ee_aggregating_content_using_magpie_and_expressionengine/&apos;); exit;

}

?&amp;gt;

That accommodated this circumstance and eliminated the issue. NOTE:

&amp;lt;?

exit;

?&amp;gt;

is necessary in an ExpressionEngine template to suppress the rest of the page when redirecting using header(&#8217;Location:url&#8217;);


Crisis averted. But what about other URLs out in the wild? How to keep this from happening again, and how to not have single case code sitting around in my template?

&amp;lt;?

if (strlen({segment_1}) &gt; 0) {

header(&apos;Location: /post/{segment_1}&apos;); exit;

}

?&amp;gt;

There. Now it&#8217;s dynamic. If a request is made 1) on the /index (homepage) template and 2) has a segment variable on it, grab the segment variable and redirect to /post/{segment_1}. Any old URLs out there with the entry&#45;specific url_title directly on the root will bounce to the /post template, right where I want them to be.


UPDATE: Unfortunately this method isn&#8217;t foolproof. I had an inbound link with a querystring parameter (c77studios.com?ref=mjr). Even though there&#8217;s no &#8216;/&#8217; on that URL, the link was translated to c77studios.com/?ref=mjr by the browser or server, which created a segment_1 that doesn&#8217;t correspond to a post, which redirected to a dead end. I was able to fix the link, but haven&#8217;t yet updated the code to handle it.


For more posts about ExpressionEngine, visit http://www.c77studios.com/archives/category/expressionengine.</description>
      <dc:subject>Blogging, ExpressionEngine, Web Development</dc:subject>
      <dc:date>2007-08-22T00:31:00-05:00</dc:date>
    </item>

    <item>
      <title>Automate your manual Gantt chart in Excel</title>
      <link>http://www.c77studios.com/site/automate_your_manual_gantt_chart_in_excel/</link>
      <guid>http://www.c77studios.com/site/automate_your_manual_gantt_chart_in_excel/#When:19:05:00Z</guid>
      <description>Take some of the effort out of an Excel&#45;formatted Gantt chart.
The unstoppable Dave Seah recently posted an Excel file he uses to manually create Gantt charts. It&#8217;s a nice layout, but it&#8217;s manual: You still need to fill in the schedule and apply the cell background colors to define durations on the timeline.


About a year ago I put together a spreadsheet in Excel that does a lot of that work for you. I&#8217;d definitely call it a 0.5 version of what it could be. It&#8217;s pretty basic, and relies on some hard&#45;coded values, but it also puts to use Excel&#8217;s date functions to dynamically define durations that skip weekends and holidays, color&#45;code durations by label (&quot;Agency&quot; or &#8220;Client&#8221; in this version), and do all this just by entering a start date and the number of business days to spend on a task.


A few things to note:

This may require one of the Analysis Toolpaks or just a recent version of Excel. I seem to remember adding one of these (Add&#45;Ins under the Tools menu) when I put this together, but my current installation of Excel doesn&#8217;t have any checked. Perhaps I found a workaround.
This is, of course, unsupported. Download it, play with it, improve it, put your logo on it and call it your own. I&#8217;m just sharing some knowledge and a starting point here.
Column A is hidden. In Column A I stored the holidays we were given off where I worked so that, in addition to weekend dates defined by Excel, the chart would know additional days to exclude from the schedule.
The Start Date in Task 1 is a hard&#45;coded value. The End Date is determined by the number of days allocated, and subsequent Start Dates are determined sequentially following that task. This probably isn&#8217;t always the case, but the values can be overridden as you need to.
To use this functionality, do a Fill Down (Ctrl+D) on fields B:G for the number of Tasks you need, editing the Task, Days, and Owner fields for each new row.
Dates across the timeline are linear and the timeline can be expanded by doing a Fill Right (Ctrl+R). The first date should be entered manually.
The duration stripes use conditional formatting. (Conditional Formatting under the Format menu) They&#8217;re in an if...else sequence that first blocks off weekends and holidays in gray, then applies a background color for Agency tasks, and then a background color for Client tasks. It does this based on a formula that checks if the date above is within the range of the task (Start Date/End Date, already calculated or manually entered).
The values that correspond to &#8220;Agency&#8221; and &#8220;Client&#8221; are in the conditional formatting formulas. You can add additional values there.
The conditional formatting grid can be expanded out and down by highlighting cells and doing a Fill Down or Fill Right (Ctrl+D or Ctrl+R).

That should be enough to get a somewhat savvy Excel user started. This won&#8217;t work magic on its own. It does have enough of the thinking done, though, that it can be expanded and styled to cut down on the number of steps to put together a project schedule.


Download dynagantt.xls</description>
      <dc:subject>Blogging, Clients, Technology</dc:subject>
      <dc:date>2007-08-16T19:05:00-05:00</dc:date>
    </item>

    
    </channel>
</rss>