HTML CSS JavaScript

I have a real post queued up to go in an hour or two. To tide you over until then, I present the web development quote of the week:

Since my attempts at capturing web developers’ hearts and minds by publishing fundamental research have failed miserably but my thirst for attention continues unabated, today I will once more shout at iPhone developers. That’s proven to work.

More specifically, today I will shout at web developers who think that delicately inserting an iPhone up their ass is the same as mobile web development.

My emphasis.

Read the rest of the excellent post* over at Quirksmode:

The iPhone Obsession.

*it really is. It starts off with the above quote but goes deep into some issues that people ought to keep in mind when working on mobile sites- especially when faced with the titular iPhone obsession

HTML + CSS + JavaScript = Content + Style + Behavior

This the one of the guiding principles of the way I make sites. We want to keep our content/data, in the form of HTML (HyperText Markup Language) code, neatly separated from the rules that tell the browser what it's supposed to look like, in the form of one or more CSS (Cascading Style Sheets) and rules that tell the browsers what it's supposed to do, for our purposes, written in JavaScript.

Why?

Well, there are many reasons. I'll give you two big ones and then it's onto the next section. We've got a lot to cover.

Read the rest of this entry »

Well, I leaked it earlier this week, so I might as well get started.

Welcome to How to Make a Web Site the Modern Way, a blog series outlining, to the best of my ability. how to build an HTML page using today's best practices. The focus won't be on specific coding techniques, although there will be some of that, it will be on how the pieces fit together. Without experience, it's tough to know how the pieces of a web page fit together in the best way. I've got some of that experience and I'd like to share it with people. So at the end of all of this, I'm hoping this series will serve as a one stop shop for people looking to understand the big picture.

First up: The Anatomy of an HTML Page .

Some basic principles:

• Fast: I want pages to be as fast as possible by default.
• Findable: This isn't really the same as SEO, but it's kind of like a cousin to it. I want to make pages spiderable, human scannable, computer readable and generally information rich.
• Standards compliant: I'm not a standards zealot, but I try my best to follow web standards wherever possible.
• Accessible: I try to make pages as accessible as possible.
• Usable: Usability is a deep topic, but there are things you can do, by default that will enhance the usability of your site.
• Intuitive: I want developers to look at the stuff I do and say "hey, that makes sense." I also want it to make sense to me when I return to it in six months
• Breakable: Which is a funny way of saying "graceful degradation," a concept that colors a lot of what I try to do. The idea being- if something's going to break, or not work as expected, make sure that it's not totally screwed up

I just wanted to point folks to the small project I started on Google code- Starter Assets.

It's based on some work I did at Cramer to standardize the development process there. The idea was to provide a standard set of files and a standard file/folder structure for people to start with whenever they were initiating a new project. I've expanded on it in this case to (eventually) include several doctypes (right now it's just xHTML strict- HTML5 will follow soon) and links to popular JavaScript libraries on the Google Ajax Library CDN (just jQuery for now.)*

To use, you'd just download or SVN export the folder that corresponds to the doctype/library combination that strikes your fancy and you're good to go.

I've released it in advance of a blog series I mentioned during my JavaScript presentation this past Thursday. It's a step-by-step tutorial on how I build web sites called, "Building a Modern Web Site."
Read the rest of this entry »

Here's the link I promised:

JavaScript 101: Adding Interactivity to Your Site Using the World's Most Popular Programming Language

*A note on the title- I'm just repeating what Douglas Crockford said. To remix the quote about IBM, no JavaScript developer ever got fired for quoting Douglas Crockford**

**Don't quote me on that

Again, I want to thank everyone that came out. It's always fun to attend the Boston JS Meetups and presenting there is even cooler.

And here it is:

Slides.

Just in time for me to do it all over again tonight at the Boston JavaScript Meetup. Well, not completely all over again as it's a new presentation tonight, but it'll still be two times at NERD this week.

Here are the numbers for DrunkenFist.com in the year 2009. There were 614,333 visits to that domain last year and the top browsers broke down like this:

Read the rest of this entry »

Check it out:

JavaScript 101: Using JavaScript to Add Interactivity to Your Web Site

Rob Larsen will lead an interactive session outlining the basic steps to getting started with using JavaScript using modern techniques. For the beginner it will serve as a road map to using JavaScript with confidence. For the more advanced user it will serve and a forum to discuss fundamental best practices as Rob will be soliciting feedback and discussion throughout.

It'll be basically a step by step on getting JavaScript onto a page, in a modern, "best practices" way. Starting with attaching the script to the page using the script tag all the way through writing a function and attaching it to an element. Each step will be split into three levels of discussion:

1. For the beginners each will simply be presented as "this is how you do it"
2. For the intermediate user it will be "this is why we do it this way"
3. For the advanced user it will be a question- "where does this fall apart and how can we make it better"

It should be fun. I hope to see you there.

Nothing groundbreaking. Just some atmosphere shots. The show was a lot of fun and it was great meeting everyone.

Read the rest of this entry »

Owing to the contrast on the A/V system, my last slide was illegible, so here are all the links that folks couldn't see.

The presentation itself:
HTML5 + WordPress

And the resource links:

The working group
http://www.whatwg.org/
Mark Pilgrim's HTML5 book
Dive into HTML5
The Modernizr library
Modernizr
The outliner
http://gsnedders.html5.org/outliner/
The post talking about Kubrick
I’m Messing Around With an HTML5 Version of the Default WordPress Theme

My other sites:
DrunkenFist.com (art portfolio)
@robreact

I'll have video of the presentation up shortly (I hope!)