Tag Archives: XHTML

Foundation Website Creation with CSS, XHTML, and JavaScript

In a real bookstore

I would have announced this earlier, but somehow with the trip to Taiwan, the subsequent jet lag, and the whopper of a cold I had this past week has delayed me from getting this post out until now. But here it is: My book titled “Foundation Website Creation with CSS, XHTML, and JavaScript” is now out! I saw two copies of it today on the shelf at Barnes & Noble in Walnut Creek earlier today (pictured).

This project came up at a real interesting time. I was just starting the final quarter of my masters degree program through University of Denver in computer information systems, and the last thing I wanted to do was to take on extra work. But of course, this opportunity to collaborate on this project was too good to pass up, so I opted for no sleep for a few months and somehow got both done last June. Man, it feels good to be done.

My fellow authors Jonathan Lane and Meitar Moscovitz and I have put together a book that covers a professional introduction to the core technologies involved in front-end website development. In it we have tried to convey modern best practices from a web standards perspective as well as from a user-centric project management perspective to give the emerging web developer a solid foundation as to what to expect in a professional web design workflow. I hope the readers of this book find the information contained therein to be valuable platforms for further exploration and learning.

The book may be ordered from Amazon, and you might even find it on a local bookstore shelf!

Researching web information architecture, usability, and standards

If you are a web developer, web designer, web architect, web usability expert, in a similar role, or just have an opinion on the subjects of web architecture, usability, and standards, I need your help! I am doing a research paper on the arguments in favor of having large enterprise organizations develop policies for the following issues:

  • Implementing and enforcing a standardized user interface for an enterprise web presence.
  • Developing an enterprise web information architecture.
  • Developing and enforcing a web style guide.
  • Enforcing web standards (i.e. valid XHTML, CSS, DOM scripting using ECMAScript standard, etc.
  • Usability and accessibility issues (Section 508, case law, etc.)

Broad category? Yes. But hey, it’s easier than writing about how to curb global population growth or global warming. I’m trying to positively influence the world through better enterprise web strategy. My goal is to bring standards-based web design out of the sidelines and fully into the mainstream at the enterprise level. I think the case has been made clear for small web infrastructures and web 2.0 plays, but the enterprise still lags in this area and it is a far more challenging problem due to the information and organizational complexity of such behemoths.

I need your help! If you have any suggestions, opinions, recommended books, citations, essays, or good URLs to post, please let me know in the comments! Any opinion on this topic is welcome.

Thanks!

The Four Pillars of the Web

My old high school was deeply involved in Round Square – an international organization of high schools that practiced education that strongly aligns with the following “pillars”:

  • Internationalism
  • Democracy
  • Environment
  • Adventure
  • Leadership
  • Service

My XML teacher mentioned this in the current week’s discussion, almost as a passing thought, but I thought this was a poignant list that is worthy of expounding upon here. These pillars are:

  • Valid code
  • Accessible code
  • Semantic code
  • Separation of content from presentation

Valid code (standards compliance)

Web code should validate according to the specifications set forth for what you’re using. Browsers today often let you get away with murder here by still allowing tag soup to occur – mostly due to documents being still served as text/html instead of application/xhtml+xml. Blame IE6 for now. But standards-mode does exist in all modern browsers, enabled by the power of the DOCTYPE declaration – a simple declaration of independence from browser-lock. Imagine an enterprise architecture, nay an entire Internet, where web applications are completely standards-compliant and the user could move freely between platforms, applications, browsers, and websites without fear or concern for compatibility.

Accessible code

Creating accessible code means thinking about the bare framework of your website infrastructure first, and adding on bells and whistles in a way that gracefully fail over in case of a problem on the client. You can’t predict what people will want to use when they show up to your website, so start with the lowest common denominator. Turn off all your CSS, Javascript, plugins, and images. Only deal with your app in terms of the HTTP requests coming in and out, and the HTML that presents itself. Would you build a house without pouring a foundation first? Heck no. Make a purely accessible web experience your foundation and then add your 15 pieces of flair, Mr. Fancypants. Make sure that your site is as usable to a Lynx, phone, or screenreader user as it is to your cutting-edge IE7 and Safari 3 folks.

Semantically correct code

What the hell is this box of beer bottles doing in my garage? Had I tagged it appropriately, I would clearly see that it is glass non-twist-off bottles suitable for home brewing. Not that I am able to drink most homebrew due to the barley malt causing me reactions due to celiac disease, but I digress…

XML encourages the web author to tag their content appropriately, explaining in-line what the meaning is for each item. Using XML technique in coding your XHTML documents means you are applying more meaning than the usual “here’s a paragraph” markup, information that could be used by future generations. Won’t somebody think of the children?!?

Separation of content and presentation

Spend some time at the CSS Zen Garden and you get the point. Content and presentation do not like to sleep in the same bed. They like to flirt with each other, play the field, sleep around. Tying them together with presentational markup and inline styles just means an unhappy, possessive relationship where neither party is able to grow.

So those are the pillars. Things I’m sure the Round Square would approve of. Keep these in mind and help your code realize its true potential as a member of society.

Two Steps Back

I’m deeply concerned for Apple’s lip service to web standards support in their latest suite of products.

First of all, the iPhoto 6 RSS generation is invalid, proprietary, Safari/Apple-only code. Let me get out my yea flag and give it a wave. I’ll use that feature approximately never. What is the point of sharing your photos if almost everyone you know does not use Safari? I love Safari – I love it’s support for standards and it’s ease of use. But let’s be realistic here with iPhoto and photoblogging. Do we want to be able to use and enjoy photoblogging and share it with everyone? Or do we want to create a proprietary, useless piece of technology that only a very few people will be able to experience? The last thing I want to explain to people is “Oh, I created this with a Mac and that’s why you can’t see it.” Does not sound like happy, positive word-of-mouth marketing to me…

Next up is the travesty that is the .Mac blog. Bask in the aqua glow of those horizontal scroll bars. View source and see the horror of dozens of inline CSS styles applied liberally to empty div tags. This is worse than the HTML 3 font tag madness and completely misses the point and exposes a deep misunderstanding of what web standards were meant for. What is most frightening is that the document almost validates against XHTML 1.0 Transitional. It’s as if they inserted all this crap-generating tools and kept running it against the validator, just to say “hey, it validates!”, without understanding that the XHTML is supposed to be simple and meaningful.

Extra credit goes to the .Mac blog’s title props: “Blog”. Well done. Does anyone care that this is a public-facing website for a prominent and trend-setting company?

Most disturbing is the core of this issue, which is the .Mac blog’s creator. Let me direct the audiences attention to line six of the source code:

<meta name=”Generator” content=”iWeb 1.0.0″>

Which means that there is this software thing that is made to be openly placed into the hands of idiots, that is going to create highly-bollocksed-up code that makes FrontPage look like the W3 brain trust.

Lord help us all.

If there is such a thing as Web 2.0, I am sure that this is not part of it.

DW8

What I love about the new Macromedia Dreamweaver 8:

  • The Mac installer is a smaller download than the windows version.
  • CSS code completion improvements
  • PHP coder improvements and support for PHP5
  • Improved CSS rendering
  • CSS visualization of margins and padding
  • Faster than the last version
  • Background file operations
  • Document tabs and window management commands like Tile, Cascade, and Save Panel Layout Sets – oh my.
  • The full studio comes with a Contribute 3 license.
  • Improved support for web standards
  • Find diffs using integrated BBEdit or opendiff

Best version of Dreamweaver. Ever.