RSS ? Recent Blog Posts

Blogs » Web Tech
 

Technically Speaking

: Web Tech Blog

Conditional Comments for HTML Email

by James Edwards

Did you know that you can use conditional comments in your HTML email to detect different Microsoft mail clients, in the same way that different versions of Internet Explorer can be detected on the Web? Well, you can!

 

Learn JavaScript From The Master At Web Directions South

by Matthew Magain

Douglas Crockford, the father of modern JavaScript, is just one of the web superstars presenting at this year’s Web Directions South conference. SitePoint readers are eligible for discounted tickets!

 

9 Ways to Put Site Screenshots in Your Web App

by Josh Catone

Manually creating screenshots for outbound links on your site is a time consuming process and completely infeasible if you want to create screenshots on the fly. Here are nine services that will automatically create screenshots for your site or app via an API.

 

Beef Up Firebug in a Jiffy

by Andrew Tetlaw

The next frontier in front-end web development tools is performance measurement and reporting.

At the O’Reilly Velocity Conference Scott Ruthfield, VP of Engineering & Technology at WhitePages.com, gave a talk titled ‘Jiffy: Open Source Performance Measurement and Instrumentation’ and revealed Jiffy, a web application interface performance measuring and reporting tool. Jiffy captures performance measurements for any specified event at the client’s end, storing them in a database, and reporting on them.

At the same conference Bill Scott, Director of UI Engineering at Netflix, in his presentation ‘Improving Netflix Performance’, talked about an internal performance monitoring project he’s been working on that included a handy visualization extension for Firebug.

In one of those fortuitous crossing-of-paths that seem to happen so often at conferences, Bill adapted his Firebug extension to use Jiffy performance data resulting in the Jiffy Firebug Extension. This extension is a handy visualization of the performance data provided by the Jiffy JavaScript library, making it viable to use the library in an immediate, stand-alone, single-session mode.

Jiffy client-side measurements are captured using a JavaScript library with a simple API, called Jiffy.js, and posted back to the server via Ajax. Jiffy.js uses a “mark and measure” approach; you mark a start …

 

Top 5 Tips for Staying Awake

by James Edwards

It’s been my observation that we web developers are a fairly nocturnal bunch. We beaver away long into the night, building the next big web app, trying to meet client deadlines, or fiddling with some new technique or technology that has us all excited.

Makes me wonder how much of the sum output of our industry happens in the middle of the night, and what is it that sustains us through those wee small hours? Is it fueled by the pure nervous energy of obsessive compulsion, or are there concrete things you can do to boost your performance beyond the physical impulse to sleep?

For me, it’s both — part obsessiveness, and part practical routine — it’s simply quieter in the middle of the night, with no phone calls and fewer distractions, and that really helps me to stay focused.

But there are also a number of simple, practical things I do to help me stay on form. I can only speak from personal experience, but with that proviso, I present this short list of tips I use to cope with sleep deprivation.

  1. Drink a lot of coffee

    Although the short-term buzz you get from coffee is largely psychosomatic, the effect over several hours is …

 

How To Engineer Your Way To The Front Page Of Digg

by Shayne Tilley

The ability that digg has to move massive amounts of traffic to one site has many marketers, site owners, and entrepreneurs salivating at the very prospect of producing something that the digg crowd will, err, dig. So much so, in fact, that it is possible to engineer your way to the front page of digg.com.

 

4 Easy Ways To Spruce Up Your HTML Markup

by Kevin Yank

In the last issue of the Tech Times, I mentioned I was hard at work with the team here on a new front page design for sitepoint.com. While most of our time has been split between tweaking the CSS styles and crafting the PHP code that will generate the page, any major redesign brings with it the opportunity to improve the HTML code at the heart of your site.

Of course, any newly-written HTML code these days should validate. But there’s more to good HTML code than validation. Validation is the bare minimum you should be doing to assure the quality of your code.

This issue, I’d like to take a look at four simple things you can do to make sure your HTML has that nice, new markup smell.

Take Care Of Your Heading Structure

This is something I’ve banged on about in the Tech Times before. The headings in your document (<h1>, <h2>, etc.) should form a consistent hierarchy: one or more <h1> sections each containing <h2> sections, which in turn may contain <h3>s. Resist the urge to skip heading levels (e.g. placing a <h5> after a <h1>) to indicate levels of “importance” in your content.

The easiest way to check your heading …

 

BBC Rejects hCalendar Microformat Because Of Accessibility Concerns

by James Edwards

The BBC have announced that they’ll be removing hCalendar microformats from their online programme listings, because of the accessibility issues with the ABBR design pattern.

To summarise the problem: some microformats use the title attribute of an <abbr> element to store ISO format dates, as machine-readable expansions of dates written in natural language, for example:

Meeting to be held on
<abbr class=”dtstart” title=”1998-03-12T08:30:00-05:00″>
12 March 1998 from 8:30am EST
</abbr>

However this can have a serious impact on blind users who have their screenreader set to expand abbreviations, because what the screenreader says is essentially gibberish to the user. For example, Window Eyes at its maximum verbosity setting will say this:

Meeting to be held on one nine nine eight zero three one two T eight three zero zero zero zero zero five zero zero zero

This similarly impacts on users with a cognitive disability, who look at the data in a tooltip and are faced with equally incomprehensible information. A date is not an abbreviation, and an ISO formatted date is not an expansion; the ABBR design pattern is both conceptually and demonstrably broken, period.

Unfortunately, the microformats community have not been taking this issue seriously, despite considerable debate and alternatives being offered (albeit, less than perfect …

 

SproutCore: JavaScript Applications

by Andrew Tetlaw

Revealed by Apple at the recent WWDC as the basis of the MobileMe web applications, is the newest member of the JavaScript framework fraternity: SproutCore. I’m pretty sure that if I told you SproutCore was yet another JavaScript framework for creating rich browser application interfaces, you’d prefer to scrub your eyeballs with steel wool than keep reading. Don’t head off just yet though, because SproutCore is quite different from other frameworks and worth taking a look at.

SproutCore is an open source framework for creating desktop-style applications that run in the browser using only HTML, CSS and JavaScript. You first create your application within a local development environment and then use the SproutCore build tools to compile the application in to a set of static files you can place on your web server. The term ‘thick client’ has been coined by SproutCore’s lead developer, Charles Jolley, to describe SproutCore’s approach. SproutCore applications are totally independent of any server-side technology. The whole application runs in the browser; the only interaction with the server is to save or load data via Ajax.

When I say, ‘creating applications’ I mean sophisticated, Model-View-Controller based application design, inspired by Apple’s Cocoa. …

 

Dust-Me Selectors: Now Compatible With Firefox 3!

by James Edwards

Today we released Dust-Me Selectors Version 2.1, the handy Firefox extension that trawls through your style sheets and cleans up unused selectors.

The primary change with this version was to add support for Firefox 3. Making this change wasn’t a difficult task for me — all I had to was upgrade to Version 1.0 (beta 3) of base2, and add a couple of UI tweaks.

Firefox 3 support aside, you should notice no huge difference in the performance or feature set.

For more information, to read documentation and to install the new version, check out Dust-Me Selectors on sitepoint.com.

Incidentally, if you’re interested in getting the most out of Firefox 3, you might like to check out our free eBook, Firefox 3 Revealed, available for download now.

 

Sponsored Links

SitePoint Marketplace

Buy and sell Websites, templates, domain names, hosting, graphics and more.

Logo Design, Web page Design and more!

99designs

  • Custom logo designs created ‘just for you’.
  • Pick the design you like best.
  • Only pay if you’re satisfied with the result.