RKNet Blog... Thing

I realize that everyone’s probably already sick to death of hearing about Chrome, but I thought I’d chime in anyway.

Here’s a memory usage shot of Chrome versus Opera.

Click the image to see the big picture

It’s not really a fair comparison, as the same things aren’t open, but I realized that with the way I have Opera configured, it couldn’t be a fair comparison anyway. I have around 50 RSS feeds, one mail account, and at least one IRC channel which all contribute to the overall memory load Opera exerts on my system. That said, this shot was taken with 3 actual web page tabs open in Opera, and 3 browser extra tabs open (IRC, details for one feed, and the transfers window), and only Gmail and the about:memory pages open in Chrome.

Opera in this instance is using less memory. (WHOOO VICTORY!) Hardly a scathing indictment of Chrome’s use of system resources, as if I had Gmail open in Opera the memory usage stats would undoubtedly be much in favor of Chrome. Which in my mind is simply a strong argument in support of the idea that browser speed is absolutely predicated by the way the browser is used. A new install of Firefox will always be faster than one with plugins added. A new install of Opera should be faster before all the extra features are configured. IE will be faster without toolbars. Etc, etc. The base speed tests and resource usage tests that browser superiority enthusiasts look to for support of their favorite browser (in theory) only indicates the speed or resource usage of the browser at its optimum settings, meaning regular users may never notice a difference between browser speeds or system burden.

The operating system certainly plays a factor as well. Having played with Opera on Ubuntu lately, I noticed that the Windows version of Opera (9.52/9.51) is more stable and less demanding than it is on Ubuntu (7.10, Gnome). If anyone has an advice on how to make Opera and Ubuntu (or more to the point, Flash, Opera and Ubuntu) play nicer together, I’m open to suggestion. I’m actually rather new to this “linux” thing.

Incidentally, I found out about the about:memory feature via Lifehacker. If you haven’t done it already, I strongly suggest using the about:internets (yes plural) feature. :D

Do you have RSS feeds for sites that you like, but they aren’t in your language? Don’t you wish you could get those feeds translated and delivered in the language you’re most comfortable reading? Of course you do! Well, the internet is full of surprises and helpful little whatnots, and one of those items is a site called Mloovi. Mloovi is a Web 2.0-ized spelling of mluvi, or “to speak” in Czech (probably because they couldn’t get mluvi.com I’d be willing to bet! domaining is a harsh mistress).

This site will provide you with a widget linking to your RSS feed in 24 languages (including English), with the translations provided by Google. The only catch is they display ads in the bottom of the feed. In other words, certainly not perfect but a big help for making a single language feed available to speakers of other languages. I’ll be providing this widget for RKNet (check the sidebar at the right), and I would love feedback from people who speak the languages in the list on how well it translates, and whether or not you like the mloovi feed format.

Initial Feedback: This concept is clearly still in its infancy, and it does have some flaws:

• The widget generator produces an iFrame, which is not the most standards-compliant solution.
• I had to configure the height and width of the widget myself (160 by 600, in case you use the generator for all languages like I did).
• They maintain a directory of translated feeds, but the directory does not appear to be searchable, or even have a break down by date range or alphabet to make it easier to find previously translated feeds.
• You CAN sort the directory by language to find feeds already translated into your language, though.
• If you choose the widget generator, and have it translate your feed into multiple languages, it will show you progress on how many translations it has completed. (That’s a good thing!)
• There are quick links in the directory to add translated feeds to online feed services: NetVibes, Google, Yahoo, AOL, and PageFlakes. (This is also good! But it should be available as an option with the widget also.)
• The project owner encourages feedback, and I will be sending this list, along with some other suggestions, as soon as I get an opportunity.

Day one was fraught with challenges, up to and including having trouble finding the venue. It took a lot of wandering around, a phone call, and I think two concierge desk stops to finally figure out that the Copley Plaza Marriott was in fact through the Copley Plaza Westin and the attached mall. That said, on with the notes.

Session 1: Understanding Web Design - Jeffrey Zeldman

• Missed this session entirely. :(

Session 2: Lessons of CSS Frameworks - Eric Meyer

• Missed over half of this session. :( I blame Mass traffic.
• Hits on server vs. File size. The more hits to the server, the slower the load times. File size isn’t nearly as much of an issue.
• IE(6) does not cache 2nd tier stylesheets. (stylesheets linked from within other stylesheets)
• IE6 wants nothing to do with your fancy link styling. Don’t rely on it to convey critical information if you think you’ll have a significant amount of IE6 visitors. (Know your audience!)
• Mobile phones probably can’t handle your stylesheet (iPhone notably excepted from this guideline).
• create a grid or layout background to use for debugging.
• Create a debugging stylesheet that replaces more subtle elements with large, bold colors to see exactly how your major elements line up.
• Set default colors in the body of the document to override any CSS weirdness or absence.
• Try to avoid measurements in pixels. Percentage or EM will provide better usability and cross-browser support.
• Create a framework file. This is a totally empty stylesheet, containing only elements, classes and ids, as well as comments explaining the general purpose of each. This provides the framework for others to understand your work, and gives you a blank to start from in future work.
• Maintain clean, logical naming conventions. Don’t use .RedBigText use .Header or .CallToAction. This way if you have to make this class perform a function other than red, big text you can make those changes while maintaining your markup.

Session 3: Good Design Ain’t Easy - Jason Santa Maria (turned 30! Happy Birthday!)

• Look to be different. Be familiar with popular box models & learn what you can do to separate yourself from them.
• Print != the web. (!= is does not equal for those who aren’t familiar) Therefore, instead of innovating based on standards of print, we must look to usability standards and concepts to build a better (mousetrap) website.
• Design reinforces your message.
• Design fills in where content leaves off to create impressions.
• Referenced the storytelling power of a mostly visual chart of Napoleon’s progress.
• Pacing must be capable of including all pertinent info. Editor’s Note: I don’t remember what I meant by this note.
• Design must account for flexibility, changes, functions
• Design must be able to demonstrate depth, or give the visitor confidence that they can navigate comfortably.
• Design for your audience, not just to fit your box model.
• Take advantage of the medium, learn to apply the tech to its fullest.
• Plan before you do, and make stylesheets accordingly flexible
• Level of design intricacy hinges largely on the type of content it is meant to showcase and support.
• “Design can’t not communicate.” - David Carson, Helvetica
• The Golden Rule or other ratio is a handy reference for balancing a box model.
• Links:
• A Brief Message
• Fray
• Principles of Beautiful Web Design
• No One Belongs Here More Than You
• We Tell Stories
• “You can have it in any color you want, as long as it’s black.” - Henry Ford regarding the Model T
• Art direction should apply to the web also.
• Evaluate the saclability of unique content art direction (i.e. serious differences between pages, breaking from one standard template between pages).
• Marry your design to your code.

Session 4: Web Application Hierarchy - Luke Wroblewski

• You have approximately 1.6 seconds to make an impression on a first time visitor.
• References Steve Krug’s excellent book Don’t Make Me Think in regards to illustrating how we use the web. We don’t read. We track around the web looking for the next thing to get us to our intended informational goal.
• Great presentation on the web is comprised of a balance between information and emotion, or Visual Organization and Personality.
• Organize things in ways people can relate to. For example, organizing information in a customer lookup system like a rolodex.
• What’s front and center is critical
• Presentation should follow desired function
• Downplay non-critical information
• Create context by applying contrast, placement and seperation
• Consider the color scheme. Contrasting colors attract attention.
• Make uniquely important items distinct from the remainder of the page.
• Focus on your use of labels, whitespace, and the scanability of your page.
• Proximity of items, similarity of items, and pattern of items dictate how noticable they are.
• The more differences between neighboring items, the higher the contrast and the more likely a visitor is to focus on it.
• Orchestrate the distribution of visual weight (what’s most noticable to what’s least noticable) to influence user experience.
• Avoid too many “look at me!” items as it creates confusion.
• Avoid too few “look at me!” items as it leads to disinterest
• Information should not be distributed via firehose
• Be aware of how people access and use your site. Or how it is intended to be used at least. These factors inform how the hierarchy of information should be structured.
• Consider how people find you and what you want them to do when they get there.
• People come to your site for some kind of content. Don’t let the overhead (structural elements of your website, other navigation, etc) overwhelm that content. Give the people what they want.
• Visually prioritize the actions you want or need people to take
• Strive for a clear, logical flow of information using visual cues and standardization of content. (Hint: Centering text is very unhelpful when trying to achieve this logical flow.
• Consider your overall signal to noise ratio when displaying lots of information. Too much contrast and the data gets overwhelmed. Too little and the data itself is overwhelming.
• Luke’s site: Lukew.com

And then it was lunchtime! Will talk more about that when I get around to my travel log post. I’ll have the rest of day one in a seperate post, so keep your eyes open, and if you aren’t already subscribed to the RSS feed, by all means hit the GIANT PURPLE BOX at the top of the site to do so. :)

As an Opera desktop edition user, I am part of a browsing minority.

I started using Opera years ago, back when they still had banner ads to support their desktop offering. Some friends recommended it to me as a browsing alternative, if I recall correctly. I was getting sick of IE, and all the Netscape users I knew were either holier-than-thou about their quirky browser or said it wasn’t really all that great. Don’t recall anybody mentioning Firefox at that time. I tried Opera out, but I didn’t quite “get” it back then, so I stopped using it. IE was just going to have to be good enough, and I didn’t feel like configuring something just to surf the web.

Time went by and I got sick of Internet Explorer and its unwelcome antics, so I went and got Opera again, thinking it was worth another try. It had improved massively, and as I figured out the features I got really comfortable using it. Everything worked, everything displayed right, I had tabs, I had mail, I had RSS, I had IRC. Life was good.

Well, the tech being used on the web has accelerated rather quickly, particularly where java, flash, and creative CSS are concerned. As these cutting and/or bleeding edge techniques were adopted, I started having trouble. Flickr was basically unusable. A few others had some really agitating quirks, too. My enjoyable IE alternative was becoming a liability.

Also, Pet Peeve time: If you run a website, do not tell me I am using the wrong browser, do not refuse me your content because you assume my browser will not display it. That is the absolute fastest way to send a visitor packing. That would be like going to the grocery store and getting yelled at by the produce guy for bringing your own shopping bags. Usability testing means making sure YOUR site works. Complicated sites may not work in all browsers. If your functionality demands things be done a certain way, and it won’t work in all browsers, then do the testing and find a non-insulting way to inform your clients of how to get the most out of your site. It’s very bad business to decide who gets to view your site and how. I’d rather surf a site that displays a little funky in Opera then show up and be told that I’m not allowed to view the site until I change browsers.

As new releases of Opera come out, the challenges do lessen. Yet with the latest update to WordPress, I am faced with a rather irritating challenge. The “Add Media” tool is now a (very slow) AJAX-type pop up window, rather than the on page form used in previous versions. It absolutely will not work in the most current version of Opera. I have to use Opera 9.5b (aka Kestrel) or Firefox to make it work. (Haven’t bothered testing in IE 6, and IE 7 is out of the question because I won’t upgrade.) I have yet to find a simplified plugin or fix for this issue, so for the time being if I wish to use images or embed any other kind of files, I’ll just have to use another browser. I prefer not to, it’s just a simple matter of convenience.

So I feel inclined to ask, what are your browsing habits? Do you use more than one browser on a regular basis? (Note: Usability testing in multiple browsers doesn’t necessarily count, unless you do it all day.) Do you run across sites that tell you that you’re doing it wrong, and don’t come back until you get one of the browsers we bothered to test? Do you ever run across sites that just plain don’t work?

Possibly most importantly, What is the responsibility split between content developers and browser developers for making sure that web technologies work for internet users?

I personally feel like it’s 70/30. The browser developers have a responsibility to build a platform which will support the latest approved standards. The content developers have a responsibility to utilize those standards to develop what gets displayed in that browser. It stands to reason that if something is coded correctly, it will display correctly. (I realize that’s not always the case, but generally, it is true.) If someone wants to employ bleeding edge code, hacks for cross-browser compatibility, or just generally be sloppy, they shouldn’t expect people to conform to the browser in which it happens to work best. At this time I know this site needs many improvements in this regard, something which irks me every time I go to post, because I know what I should be doing is a code audit. (Incidentally, I am still seeking willing contributors, if you’d like to help me keep the good times rolling while I take care of such matters.)

Weigh in, web denizens! Your voices shape the tomorrow of our future, or the future of our tomorrow, or the flatulence of our tomatoes or something like that!

If anyone is subscribed to the straight up site RSS feed of RKNet, I’d encourage you to hit the RSS link in the header of the site for the Feedburner feed, because I just added:

• Flickr automatic updates - which I promise to try and make interesting!
• del.icio.us automatic updates - a once-per-day summary of what kind of bookmarking I’ve been doing. That way all the lurking SEOs can learn my sources and super-special secrets without having to check too many things or stalk me on Twitter! (Note: This last statement is fueled by paranoia, and by the fact that I feel like I’m getting a lot of friendings by random SEO people lately. What gives?)

Good stuff!

Today I put a click mapping app on RandomKitty.net. It will give me “heat maps” of where people click when they are on the main page of the blog. I may add it elsewhere, but the home page needs an overhaul before I do that. If you’d like to view the current heat map of RKNet, go to http://www.randomkitty.net/clickheat and log in with the username and password of “checkit” (no quotes obviously). You’ll have to look at the whole week or the whole month to really get any data, and most of that was me clicking random areas to generate data that I could view to test my installation. I look forward to getting a little eye-tracking information for the site. I’ve been doing a lot of usability reading lately and I know that observing the patterns of people who visit your site is a great way to learn how to cater to them in a more educated fashion. (Or I could just ask: how do you like the site? Is it easy to use? Entertaining? I love feedback, good or bad.)

I also signed up for a Twitter app that will now auto-feed the new posts to the RKNet twitter account. I’m hoping that it will spread the news a little more effectively, maybe get a couple more people on the proper RSS, so they can tell me the Twitter update is annoying and can I please turn that off? I’ve also collected a lot of unique and bizzare followers on Twitter here lately, although I did end up following zefrank, and I even participated in a project to tell really short bedtime stories. (There are some really sweet ones in there.) I’m contemplating signing up for a reverse item, that will post my tweets to the blog, but that could be pretty blah if it’s just me. It would be way more fun if the other writers also posted their tweets.

I just got turned down for displaying Project Wonderful ads, but I’m not down about it. It’s just inspiration to really clean up the home page, get some content squeezed out of the fascinatingly weird group I hang out with, and resubmit. Besides, setting up a PW account was an important step for me. Not so I can subject you the viewer to ads here, but so I can eventually promote RKNet and monetarily support sites that I visit and enjoy at the same time! Win win. Besides, I am in the process of setting up another app that will hopefully drive some more traffic, maybe provide you the gentle readers with some links to other fun internet items (as if you need anything else but RKNet! PFFT!), and perhaps even drag in a little cash for yours truly. Mmm… delicious petty cash.

Speaking of del.icio.us, I finally figured out how to get a feed of links put up by people in my network. It’s like a whole world opened up. I suddenly understand the social value of the site with stunning clarity, and I have to say I’m networked with some folks that have great taste in linking.

The more I experiment with the various services, apps, and information sources that are out there, the more fun I have. It may not all be terribly productive, but most of it does provide me with opportunities to meet new people and learn new things, and I think that’s pretty valuable, don’t you?

Traipsing about my collection of RSS links, as I am oft wont to do, I discovered one labeled Blackr. Despite the obvious Web 2.0 name, it struck me as curious and I proceeded.

Blackr is described as a way to view Flickr content without all the noise of navigation, comments, and various whatnots. There weren’t any examples provided, but the general concept was sound.

I was presented with four bookmarklet options: black background, black background with a white border, white background, and white background with a black border. I chose the bookmarklet for viewing pictures with a black background and a white border.

As a test, I hopped over to Gatochy’s photo stream, a personal favorite Flickr gallery. Picking an enchanting photo of Anna May Wong, I clicked the bookmarklet with my breath held for impending browser doom. (As an Opera user, I tend to be a little skeptical of neat new add-ons, as most of them are designed with Firefox in mind.)

The results?

Wow! The photo really stands out with the crisp border and the dark background, like putting diamonds on black velvet. I imagine that this tool would be most useful for people who have to find photos for a specific purpose and need a lightbox approach to viewing Flickr images. People who really prefer a minimalist approach to image searching, and people who like fancy web toys might also find a lot of use for this bookmarklet.

It’s also got keyboard shortcuts available to change the background/border, and to turn the effect off so you can continue on your Flickr-y way. (The 1,2,3,4 options listed on the Blackr site don’t work for me, as they’re already assigned as Opera shortcuts.)

All in all, a really neat bookmarklet tool for Flickr fanatics! I give it a 4 out of 5.

Only the del.icio.us RSS feed can produce such gems as:

http://ascii.techhappens.com/ - An ASCII art generator.
http://www.dumblittleman.com/2007/10/10-surefire-ways-to-kill-your-crabby.html - Seen near a lifehack.
http://www.myscienceproject.org/j-shot-3.html - Located in the vicinity of jello shot instructions.
http://link.ezer.com/tools/google_serps_rank_checker.asp - Nearby a SERP rank checker.

It’s such an endless treasure trove of stuff. I would recommend subscribing, and not necessarily trying to review all the links that come through each day, but to use a feed reader with a search option to locate links of interest to you.

I use the feed reader built into Opera, and the “Quick Find” search function native to the reader searches both titles and content for whatever you’re looking for. However, it does seem to only return whole strings. For example, say I know there’s a link somewhere in my feed reader for Puppy Chow name brand dog food. I can search for “name brand dog food” but not “name brand food”.

I’m always looking for more snazzy, user-generated feeds of neat info and ways to keep track of it all.
What is your favorite feed reader and its favorite feature?
What are your favorite feeds?

I was so excited when I found out Wilco had a new album, entitled Sky Blue Sky, just the day after it released. I immediately downloaded it off iTunes and I’m loving every moment of it. Hopefully I’ll get a chance to see them in concert this year. (You can subscribe to the tour update RSS feed with this link right here: http://wilcoworld.net/tours/wilcodates.xml) They are absolutely electrifying live, I just wish I’d gotten pictures.

Speaking of the sky and getting electrified, the other day we had some serious storms here in NH, and there was an actual tornado warning for the area. I told the people I was having lunch with (a New England native and a Floridian) that they didn’t really need to worry, because the sky hadn’t turned green yet. Having lived in central Illinois for several years, and having family who lived in the same area, I’d heard the tale that when the sky turns green, it’s time to run for cover. As it turns out, even science isn’t sure about why the sky turns green, and how often it is a true indicator of exceptionally foul weather to come! It does appear to be a common enough trend to be used as a common warning sign of possible tornadoes, though.

Found at least one decent photo over at stormeyes.org:

In recent weeks I feel as though in the struggle to constantly produce content, I Can Has Cheezburger has slowly changed formats from its origins of “amusing image macro cats of various internet origin”. At this point it seems to cater less to savvy internet addicts with a general fondness for cats and seems to be favoring crazy pet owners who enjoy photographing their pets in specific poses so they may then make up a lengthy caption that explains the entirety of any joke they may have been trying to drive at, even if it’s not actually funny when done with subtlety. I will cite examples that have lead me to a reaction of *cutcutcut* instead of I LOL’D!

• Is this supposed to be a lol-dog? More like a corndog amirite?
• A primary example of what I like to call “Trying too hard”.
• Should have been “Diabeetus”. Seriously, what else do you do with a cat like that besides make fun of Wilford Brimley?
• Yes, we get it, you own a cat and a giant stuffed Ewok. Does anyone care? Is this funny to anyone?
• No, David Bowie has one “stuck” pupil, not two different colored eyes. Thanks for playing though.

I actually unsubscribed from the RSS feed after a rash of this nonsense. However, going back to look for the links of what I feel were the biggest offenders I do admit I saw several from the last few days that did in fact make me LOL. I definitely respect the site for being on top of the petfood issue, since undoubtedly a large part of the audience isn’t just basement-dwelling nerds, but actual pet owners who love their animals. Nevertheless, I’m discouraged to see some of the posted submissions turn towards the dark side of generic 40-cats-crazy ladies posting photos of their “babies”. Keep it sharp, ICHC!

And lest I forget, HEY ICHC! A Challenger Appears! (They always do.)
LOLBots - A collection of image macros and captioned photos of various robots. A co-LOL-ction for those with animal allergies? A site for the more technologically inclined? Generally freaking awesome? You be the judge. They’re out to prove that “Robots are the new kittens”, which I take to mean that they want to prove robots are just as adorable and LOL-worthy as any ol’ LOLcat ever was. They’ve already been linked to by a few webcomics, like Diesel Sweeties and Questionable Content. The traffic generated from those links was enough to force them to throw up a makeshift splash page. Plain though it is, you get an immediate taste for their sense of humor with a photo of Data LOL-ing with the caption “INVISIBLE EMOTION CHIP”. How nerd-tastic is that?