About a month or so ago the TopSpot crew got commissioned to participate in the AIR Houston competition. The competition consisted of creating a fully accessible website for a non-profit organization in 8 hours. Our NPO was Kids Meals Houston. Essentially they are like Meals on Wheels but focus on local Harris County children that live in poverty and are hungry. These kids know what it means to be hungry and Kids Meals provides them with lunches on a daily bases. Our NPO representative Ruth, was just amazing. She provided us with everything we needed to build the site as well as moral support day of the competition. She came with Pom-Poms… yes Pom-Poms and it was really great to see her so excited about the website.

The Accessibility Internet Rally (AIR) is an award-winning, Web site building competition held annually around the country by Knowbility, a place where you can learn how and why to make technology accessible to everyone – including people with disabilities. . In the competition teams compete against one another and showcase their talents with the most accessible website they can create in 8 hours, valid XHTML Strict 1.0 and CSS of course.

It all started today at 9 am at UH. We had are design sliced out and started to code away. After some FTP problems with Godaddy we decided to host it ourselves and then we had really taken off. Each of us started to code away at our sections and once the Belafonte had put it all together, we started to populate the pages with content and get rid of bugs and quirks of all the major browsers.

Quite an interesting day. It was a great learning experience for all of us and Kids Meals got a website they can be proud of. I will link to it, soon as it is migrated off the development server and on to theirs. Check out the Kids Meals Houston website now live and running. Speaking of learning I decided to give the input check boxes a width and height in ems and now they resize when the text size is increased. A simple thing yet overlooked when creating a standard website.

Our NPO rep, Ruth was just awesome. Twice and energetic as us and three times as excited, the next picture speaks for itself

Looking forward to AIR Houston 2008!

Also this hotel is a giant waste of space. Huge open areas that have nothing in then but the crappiest artwork ever. Stuff you’d see in a flee market gallery. I’ve seen the same artwork multiple times in different location… buy one get one free?

Our rooms have four lamps and no overhead lights or fans. And we’ve got the best view too… its a wall, more like the side of the building. Its awesome.

• Content Strategy and Web Design – Keith RobinsonFor many Web professionals content can be the hardest part of the job

Currently Sitting in on

• Psychology of Color – Doris Brown A look into how color affects the way people use our Websites
  • Color doesn’t change, attitude changes, become more aware of your environment
  • colors and trends don’t sell alone, consider consumers response to color, demographics
  • Signs of impending color changes
    • Fashion industry
    • Entertainment industry
    • Museum collections
    • Economic issues
    • Sociological issues
    • Environmental issues
  • Colors through the decades
    • 1960s – vibrant colors
    • 1970s – more earth colors
    • 1980s – started using vibrant colors again
    • 1990s – iMac furbies Southpark minimalism
    • 2000s – non-vibrant, grays, dull colors
  • Current color trend
    • Red – (chili pepper red)
  • Color Calibration
    • Different tools used to calibrate monitors in order to achieve correct color through all mediums

Currently sitting in on

• The Contextual Web – Nick Finck On the emerging Internet, context is everything
  • Four aspects of context in web design
    • User
      • Define the user
      • Who is the user?
      • What are their challenges
      • What are their needs?
    • Task
      • What exactly is the task?
      • Who is involved?
    • Environment
      • What tye of environment is it?
      • What about the business environment?
      • Social environments
    • Technology
      • What type of technology will be involved
      • What are the technical limitations
      • How does the user interact with these technologies

Currently sitting in on

• Managing Web Design – Michael Lopp Often managing the design process is harder than the design itself
  • Design is making decisions, decision based on the Pitch
  • The perfect development process that never happens
    • Design
    • Develop
    • Deploy
  • Costs of skipping design is high, too much backtracking is involved
  • Design Process
    • “Imagination is more important than knowledge” – Albert Einstein
    • Constraints are your ally (deadlines)
    • Details matter
  • Soaking
    • Active Soak
      • Ask dumb questions
      • Pitch a stranger your idea
      • write it down, throw it away, write it down again
    • Passive Soak
      • Stop thinking, sleep on it
      • Great ideas emerge from random connections that a rational person would never consider
  • Brainstorm Guidelines
    • Controlled chaos
    • Discussion to find decisions
    • Gathering every bright idea you can
    • The nuttier, the better
  • Meeting Guidelines
    • Enough time for everyone to soak
    • Visible, touchable results
    • Is it real?
    • Directly maps back to brainstorm
    • Key: little victories
  • Who to invite?
    • Who are your detail czars?
    • Visuals
    • Architectural
    • Cultural
    • Practice
    • Who is the decision maker?

Currently sitting in on

• Pile it on with CSS – Jonathan Snook Taking a look at the power and flexibility of positioning techniques
  • Stop laying out your website with tables
  • Box model
  • Phark Technique
  • When something is set ‘postion: static’ you can not change the z-index

Currently sitting in on

• Real World Accessibility – Derek Featherstone Get the scoop on creating accessible Websites from one of the world’s top experts.
  • Small accessibility problems might be a large problem for those who have a disability
  • Having standard search on the advance search page can be a major accessibility error
    • (He’s dancing on stage now)

Next up is the long drive home.

It was great meeting all these new and interesting people. Looking forward to WJS 2008 (Just not at the Adam’s Mark).

Webmaster Jam Session 2007 was held at the Adams Mark Hotel this year and next year they should just do it in Houston.

Adams Mark Hotel, featured the lovely Gracia and her incredible lack of southern hospitality.

Largest hotel in Dallas, more like Texas and it doesn’t have free WiFi…. Let alone WiFi that you’d have to pay for?

Who puts a cat-5 cable in a modern hotel room and puts a paperweight around it with an extension that doesn’t dial anywhere on a 10 year old phone

We call the hotel front desk five times only to find out they need a credit card on file in order for “incidentals” and of course this couldn’t be the same credit card we had on file when we checked in, or so we were told by the 3rd person who transferred us.

After much deliberation we’re finally able to connect to the whopping fast 300k/s connection.

As far as the rest of the room is concerned, the bathrooms are powered with high tech futuristic super toilets that if you’re not careful will flush your everything down along with your soul and any loose change you’ve got.

The sink in the bathroom seems to drain the water and make these weird demands for more as if its thirst remains to be quenched.

Oh how can I forget…. The sink and the bathtub with the beautiful clear brown water pouring…. I guess the whole idea is, “if its brown drink it down, if its black send it back.”

Now lets move on to the fact that Dallas sleeps, fast. Seems to us that everything in and around the hotel decided to close at about 7ish on a Friday night. Now that’s a business plan. So we drive out of downtown in to the most ghetto of places to get food and some dude offered us bootleg DVDs…. Guess he didn’t catch the geek vibe. …. and this is only day one.

• The Dawning of the Age of Experience – Jared Spool A look at how experience design is changing the Web
  • Eliminate major redesigns break design challenge into small chunks
  • Heavy emphasis on feedback mechanism collect as much information as possible
  • get everyone involved decisions make things happen
  • Successful Experience design integrate the user and the business

Currently sitting in on the

• Design Panel – A Common Thread-Bryan Veloso, James Craig, Rob Jones, Dan Rubin Inside the Minds of Top Designers
  • (they’re hiring… looking for a .net programmer, with java experience and sql database experience, with light system admin knowledge starting at $12.00 an hour! w00t!)

Currently sitting in on

• Measure Twice, Code Once – Rob Jones How to use web statistics and analytics to get better results from your site.
  • Hes talking about analytics and how javascript based analytics collect data
  • Javascript solutions are very popular today, easy to add to your site, power data collection capabilities
  • Useful Links
    • Occam’s Razor’s blog
    • Fireclick > free analysis on how your site is doing compared to a whole
    • Compete > shows statics of companies
    • SeoMOZ

Currently Standing at the Microsoft Booth watching the latest unreleased videos about Halo 3 on the massive Dell XPS 20″ laptop desktop

Currently sitting in on

• Typography: Beyond the Font – Jeff Croft How to produce web typography that doesn’t suck
  • The Elements of Typographic Style
  • Jeff Croft suggest resting all the tags to 0
    
  • Type size refers to the em square not the character size
  • In CSS, the em square is sized using font-size
  • Sizing Text
    
    • Relative sizing reefers to percents and ems (these sizes are relative to the parent element)
    • the 62.5% trick is setting your body to be 62.5% that way you can manage your ems in a 10base setting
    • Absolute sizes are just that, absolute. Downsize is they can not resize thus making them not accessible
  • Color
    • Contrast between color is crucial
    • Instead of using black on white use gray on white or white on gray
  • Tools
    • Character entity references
    • Smartypants
    • Typogrify – gets rid of Widows, quote marks, apostrophes, etc, warps initial quotes, adjacent caps, and ampersands with classes for styling.
    • sIFR – use flash in order to create better typographical headings
  • Tricks
    • -9000px < gotta love it.

Currently sitting in on

• The Broken World – Molly Holzschlag Solving the Browser Problem Once and For All
  • Differences between different browsers such as IE 6 and 7, Mozilla Firefox, Opera, and Safari

Currently sitting in on

• Kissing Cousins: Classic Design and Web Design – Chris Bernard What we’ve learned and can apply from a history of design
  • Compression of classical design and web design
  • Chris is going over different art movements through 1900 till present day
  • Gestalt theory

End of day one… I’ll add more content to this posting later.

1st SIGGRAPH
2nd BarCamp Houston
3rd Webmaster Jam Session

• Emerging Technology
• SIGGRAPH Expo
• Electronic Theater
• XSI User Group
• Job Fair

All of them were a great learning experience and a way to meet a lot of people in the industry. Anyone who is into technology, art, 3D graphics, animation should go to SIGGRAPH at least once you’ll want to go again and again.