JavaScript

I equate JavaScript with trying to learn a new language: I don’t understand it a lot of the time, but the more I practice the better I’ll get. I seem to be at a place right now, where all the individual pieces sort of make sense, but I can’t quite put them all together in any sort of logical manner. It’s sort of the equivalent of baby talk, hopefully by the end of the semester I’ll be up to speaking in complete sentences.

Contrary to popular misconception, Java and JavaScript are not the same thing. Java is a programming language that creates stand-alone applications, and JavaScript is a scripting language that has to be placed inside an HTML document to work. (Here’s a short article that explains the differences pretty well: http://www.dannyg.com/ref/javavsjavascript.html  if you can ignore the comic sans-ish type face in the title.)

What really hurt JavaScript (besides the rather unfortunate name that is always confusing people) is that there were no standards early on. JavaScript would work completely differently in the different browsers. It was a nightmare to try to get your JavaScript to work right for all users. But now that they’ve started standardizing, it has started to become more popular again. 

Mobile Devices

Designing for mobile devices seems to be the wild west of the web. It’s crazy, not all devices will display the same, and there aren’t standards for how the devices work— so the manufacturer decides the format. Of course, the good old W3C is working on mobile device standards (http://www.w3.org/Mobile/), and they give some good tips on how to make your site more mobile friendly. For example, style sheets are better than tables, validate your site, make sure you have text alternatives for images (like alt tags) since many mobile users turn off image capabilities, and keep things small (like page titles, urls, and such). Although, this is just good advice in general.

                An article on the Cameron Moll website (http://www.cameronmoll.com/archives/000415.html) talked about some different options that are being developed, the article is a few years old, but hopefully is still relevant. One thing they talk about is the use of handheld style sheets. You could simply add another style sheet to your site that would set the display for handheld devices. This seems like a good idea to me, unfortunately, support on devices is hit and miss. Another option is the .mobi top level domain. Like .gov is for government pages, .mobi would be for mobile devices. The W3C cautions against this (http://www.w3.org/2004/07/dotmobi_diwg.html) because .mobi would only be for use on mobile devices and not really accessible on other formats, defeating the purpose of a global internet—available for everyone.

                This is a really big, and complicated subject,  but the Cameron Moll article gives a good list of what works on mobile devices and what doesn’t, that I found kind of helpful:

Typography

• Heading tags are decently supported. However, many devices display some at the same size and weight (e.g. h1 and h2 = identical).
• p is reliable
• strong and bold are well supported
• However, em and i are not as well supported
• font-size is almost useless (currently). Consider using headings instead to control font sizing.
• font-family - don’t even bother with it. Nearly all devices currently default to a proprietary sans-serif.

Lists

• ul and ol are well supported
• dl is decently supported
• Consider using ol instead of ul for navigation lists. This allows the use of accesskey, which is fairly well supported on a variety of devices. Users can then quickly access menu items via keypad numbers. For example, try accessing menu items on Yahoo Mobile using only the keypad of your mobile device. Word of caution: There are concerns surrounding accesskey (e.g. keystroke conflicts), and it will likely be deprecated in the future. See “The Future of Accesskeys”.

Images

• Nearly all current devices display images
• However, users may browse with images turned off. Always use alt text (which, of course, is recommended practice anyway).
• Use images as little as possible, only where contextually relevant. Keep in mind some users may be paying through the nose per KB of mobile web data.
• If you must use text in an image, consider bitmap  fonts for optimal clarity. Example: “mobile edition” type rendered using Silkscreen, shown in the image at right.
• Be aware that some device browsers may downsize the image to fit within the screen width. Wide images may therefore become illegible.
• background-image support is decent at best. However, background-color is somewhat well supported.

Miscellany

• Surprisingly, floats are supported rather well. However, how practical is floating elements on a 200px-wide screen?
• border-style support overall is sketchy, but border-style: solid is probably the most reliable of the bunch
• margin and padding support is decent. However, use cautiously with screen real estate, and use em or % instead of px.
• JavaScript support is hit or miss, more ‘miss’ than ‘hit’ currently

 

Accessibility

When looking for information on anything relating to web standards, where would you go but the w3c schools website. The w3’s Web Accessibility Initiative’s purpose is to make the web usable by all people. Straight from the source :

“Web accessibility means that people with disabilities can use the Web. More specifically, Web accessibility means that people with disabilities can perceive, understand, navigate, and interact with the Web, and that they can contribute to the Web. Web accessibility also benefits others, including older people with changing abilities due to aging.

Web accessibility encompasses all disabilities that affect access to the Web, including visual, auditory, physical, speech, cognitive, and neurological disabilities. ”

As the internet becomes more and more important in our daily lives, it also needs to become more accessible to the general public. As web designers, it’s our job to make our sites as accessible as possible, not just for the greater good of mankind, but also just for plain practicality. If your site isn’t accessible, maybe that user won’t buy your product. They’ll go to a site that meets their needs better. From a business standpoint, accessibility it a must.

For a list of sites to test accessibility you can go to http://www.w3.org/WAI/ER/tools/.