When writing my new sites I try to use the new features of HTML5 and CSS3 and so on where appropriate. Specifically at the moment I’m styling up a blog posts page and want to apply style to the new HTML5 <footer> tag.
Firstly, to use the new HTML5 elements as you would’ve a <div> in XHTML or older HTML, you need to tell your clients’ browser to render these new elements as block-level:
article, aside, footer, header, section {
display: block;
}Once that’s done you’ll also need to include a special Javascript for older Internet Explorer browsers to enable styling of the new elements. I’ve not had a chance to look at this script in detail (it’s minified, I’m lazy…), but I’m confident it’ll do the job. Just to note that it’s only Internet Explorer you need this fix for – Gecko and WebKit-based browsers automatically style any unknown elements (and thus these new HTML5 elements). The script homepage at time of writing is here, all credit for the script goes to Remy Sharp. To use it, simply put this in your tag:
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
The script is hosted on Google Code, but you can download it to put on your own server to save an extra DNS request.
Yes, it’s true. I can’t stand screen scraping for several reasons.
- It’s not exactly the easiest thing to implement in most cases (often the data you need is behind login forms that don’t use standard HTTP authentication).
- It probably breaks the terms and conditions of using the site you’re trying to scrape from
- Even a tiny change on the remote site could ruin your scrape, and its out of your control. Often when things change, you have to pretty much go back to the drawing board
- There are a few ways of screen scraping (regex, DOM loading, xpath etc.)
- It’s a lot of work when it would probably be easier to just ask the site in question for some sort of feed
- It’s a zillion times harder (if not impossible) when using AJAXified sites
- Using DOM loading may not work if the site does not validate
There is only one thing that comes to mind that makes screen scraping just marginally easier, and that is the much more descriptive HTML5 tags that are coming out, but even then I’m not sure how useful that might be.
Correct me if I’m wrong, but it seems to me that screen scraping is a total waste of time?
I had an interesting argument earlier today. One of our websites is being redesigned at the moment, and the page layout has the logo and company name at the top, and below the menu is a subtitle. I noticed that two things which should be the same weren’t, and in doing so noticed that the company name was not in an <h1> tag, but just an <a href=”..”>…
Normally I would do something like this:
<img src="logo.gif" alt="Company Logo" />
<h1><a href="/home">Company Name</a></h1>
<ul>
<li>About This</li>
<li>Portfolio</li>
<li>Get In Touch</li>
</ul>
<h2>We are an awesome company!</h2>
<h3>About This Company</h3>
<p>Content...</p>
Showing here that “Company Name” is the overall most important thing on the page. However, one of the developers here has structured it slightly differently:
<img src="logo.gif" alt="Company Logo" />
<a href="/home">Company Name</a>
<ul>
<li>About This</li>
<li>Portfolio</li>
<li>Get In Touch</li>
</ul>
<h1>We are an awesome company!</h1>
<h2>About This Company</h2>
<p>Content...</p>
If I view the page without CSS, the company logo becomes unimportant and lost, but the “We are an awesome company!” tag line becomes the most important thing on the page. I’ve not come across this different way of thinking before, and I’m just wondering what other people think – what should the <h1> be?
It could just boil down to choice – whether you see the overall site name (e.g. “Company Name”) as the most important thing or something else… Maybe you design your pages in completely different way?
This kind of lazy form creation really annoys me. This company is trying to make users jump through hoops just so their form developers don’t have to bother reformatting the data into an acceptable format to them.
Read the rest of this entry »
Argh, it really annoys me when web designers have check boxes or radio buttons that do not have clickable text attached. If you’re writing your website correctly (semantics-wise at least) then you shouldn’t have this problem because you’ll be making use of <label for=”…”>. It’s really not hard, and it’s such a simple solution for a big (well, medium) usability issue. Note that the value of the for=”…” attribute must match the id=”…” attribue of the element it is meant to label, not the name=”…” attribute as some people think…
Consider making:
<input type="checkbox" name="remember_me" /> Remember my login
Into:
<input type="checkbox" name="remember_me" id="remember_me" />
<label for="remember_me">Remember my login</label>
kthxbai.
