Skip to content

Microsoft Analytics Beta - exclude webpage parameters!

After almost one month of collecting data with Microsoft’s new adCenter Analytics (beta)*, I wanted to have a closer look at the many detailed reports today (and then - of course - blog about it). Turns out I’ve been collecting largely useless data because I had failed to exclude parameters like “?gclid=…” and Microsoft Analytics diligently counted all clicks coming from AdSense as calls to different pages. Stupid me, the option is right there at the top of the management view:

I’ll get back to this in another month. Click here to add your name to the adCenter Analytics invitation list and try it out yourself.

*Why didn’t I use Google Analytics like everyone else? Well, sometimes I’m a maverick, too. ;-)

Tagged , ,
2008 11 05 Stephan Rants Comments (0) Permalink

Content-aware resizing of pictures (seam carving)

I’m not sure why golem.de published an article on Seam Carving GUI (open source) today (maybe they have a selection of emergency posts for slow news days ;) ), but I’m glad they did because I had no idea something like this even existed.

If you have no idea of what I’m talking about, take a look this video:

Ever been in a situation where you had a picture with exactly the content (”message, meaning, …”) you wanted, but not with the right dimensions? Seam carving could have saved the day.

I used it for a stock photo today which just had to be 550×225 pixels to fit in a template (sorry, can’t post the picture because I’d have to pay for the rights again - I’ll post a link when it goes online). It worked extremely well because the important objects did not stretch along the entire length of the picture. The sky and mountains in the background were resized in a way which made it look as if the photographer had used a wide-angle lens.

Encouraged by my success, I decided to try something extremely challenging. Here’s a photo of me on the balcony of a hotel (it just looks as if I was trying to log into unprotected wireless networks - actually I was enjoying the sunshine and fresh air):

The picture above is 480 x 360 pixels. Let’s say I want to keep the width, but reduce the height to just 220px. Usually, this would mean cropping:

Notice that the top of the other buildings and the horizon is no longer visible.

With seam carving, you can keep all of this in the picture (also, it now looks as if I had a widescreen laptop):

As mentioned, this is an extremely challenging picture. Regular shapes are all over the place and if you look closely, you’ll find at least one odd area which would be noticeable even if you’d never seen the original picture (windows on the red building). Still, considering the difficulty, the software does an excellent job. You could fix the most noticeable problems in a minute in an image editor:

Pretty neat. I’m really looking forward to seeing what else will be possible with a few mouse clicks in the near future.

Here’s some additional info I scraped from the comments at golem.de:

  • If you’re using gimp, here’s a plugin for you.
  • Photoshop CS4 can do it, too (it’s called content-aware scaling)
  • For fancy online retargeting (how many names are they gonna give this?), check out rsizr. While I liked the animation, the result wasn’t that convincing (I guess it’s art):

If you still haven’t done so, go get Seam Carving GUI and have fun (did I mention it’s free and available for Windows, Mac OS and Linux?).

Tagged , ,
2008 10 29 Stephan Software Comments (0) Permalink

Websites with and without ‘www’

Double-u double-u double-u is one of the few things you can say much faster if you say it in German (just say “v v v”). I’m German, so I continuously strive for efficiency (nah, possibly I’m just lazy), which is why it annoys me that I still have to type “www” in front of some domain names to get to the desired website!

I mean, it’s 2008, the World Wide Web has been around for a while, so please, dear webmasters, could you make sure that your website works as http://www.example.com and http://example.com?

Here’s a list of offenders from the past few days (off the top of my head):

Now before you leave a comment and say “why don’t you just use bookmarks or press Ctrl-Enter in Firefox”, let me point out that there’s more to consider: If you can actually reach the same content with and without “www”, so can the search engines. Different URIs for the same resource might mean trouble (”duplicate content”).

AFAIK, the best way to handle both issues is a 301 (permanent) redirect. On Apache, make sure the domain with and without “www” points to the same directory and place an .htaccess file with the following content there (requires mod_rewrite):

RewriteEngine On
RewriteCond %{HTTP_HOST} ^example.com$ [NC]
RewriteRule ^(.*)$ http://www.example.com/$1 [R=301,L]

This will redirect users to URL with “www”. BTW, this code was taken from the excellent book “Building Findable Websites: Web Standards SEO and Beyond” [affiliate link]. It also has a chapter about weblogs which I think I should read. ;)

2008 10 16 Stephan Rants
Web development Comments (0) Permalink

How long would it take you to notice that your website has been compromised?

My last post concerning mass sql hacks of websites shows what can happen if your website is distributing malware and you don’t act fast enough. In that post, I also mentioned it might be a good idea to have some sort of self-checking mechanism integrated in your CMS which would alert you if unauthorized changes were made. While I still think that’s a good idea, there’s a much easier and faster option when it comes to small, rather static websites: change detection services!

Here’s a few I found through search engines, a blog post from 2005 by Marshall Kirkpatrick and an article in c’t magazine 4/2008 (page 170):

ChangeAlarm - free, typically checks for updates once per day

ChangeDetect - free and paid membership options

ChangeDetection - free, typically checks for updates once per day, does not detect changes in HTML tags

InfoMinder - no free membership, 30 day trial available

TheWebWatcher - free for personal use, monitoring intervals starting from 1h

TracerLock - no free membership, max 20 URLs, 4 US$/month

TrackEngine - free, 19,95 US$/year for 10 “bookmarks”, 4,95 US$/month for 50 “bookmarks”, possibly includes more frequent updates for paid services

WatchThatPage - free, priority accounts available for donation of US$ 20/year. Fastest update: once per day. There seems to be no limit on the number of pages you can watch. Pages can be organized in folders. Simple keyword filtering available. Refuses to watch pages with badly mangled HTML.

Yes, I know, most of these sites scream “web 1.0″ at you and - ironically - seem to be averse to change themselves (the latest news on TrackEngine are from December 2001, Merry Christmas!). They won’t really help if you’re in charge of large websites with thousands of pages. However, they might be appropriate for small websites, like this one which has been displaying “OwNed By un alien …” for months on the “liens” and “evenements” pages.

I’ll update this post after trying out some of these services (you can subscribe to my RSS feed here ;) ). Please note there’s also tons of change detection software (running locally on your computer) which I’m not covering here.

2008 09 11 Stephan Business Tips
Security Comments (0) Permalink

Chiropractors “very satisfied” with heise.de redesign

Update: Heise made some modifications while I was writing this post, so not everything below still applies.

It’s summer time in Europe, many people are on vacation, others are distracted by the Olympics - if you were planning something outrageous, now might be a good time to get away with it. No, I’m not talking about Georgia, I mean the redesign of heise.de, Germany’s IT website no. 1.

Heise.de went from a table-based, liquid layout to a xhtml 1.0 strict compliant fixed width (elastic) layout. I don’t think anyone complained about the xhtml compliance, the key here is “fixed width”. Yes, I know. Discussed to death. In the left corner, we have “long lines are hard to read” and “fixed width gives you better control over the layout, making it easier to design visually appealing sites for lazy designers like me” whereas in the right corner we have “liquid layouts adapt to all sorts of different screens, which is what the internet is all about” and “if I believe the lines are too long I can resize my viewport myself, thank you very much”. I can’t tell you who’s right (because it’s one of these annoying “many shades of grey” topics) but what I can tell you is that switching from one camp to the other is going to make many people unhappy. Very unhappy.

2 billions. That’s the number of unhappy comments in heise’s discussion forum. Ok, it’s more like 5000 and only about 90% of those express disapproval. Still, even if you consider that the heise forum is most likely the place in cyberspace with the highest concentration of negativity, that’s a lot of unhappiness.

Is it justified? Well, judge for yourself. Or just let me tell you: yes! Let’s have a look at how they messed it up:

This is how the website now looks on my not-so-gigantic 1280×1024 screen. I took the liberty of highlighting the actual content, squeezed in the lower left corner. Some people on the forum are already complaining about a stiff neck from looking to the left all the time while others don’t like the content being so close to the end of the world edge of the screen:

What I dislike most is the odd combination of a centered upper navigation bar with a main content area justified to the left. It makes me feel seasick:

There’s also the large unused white area to the right which is making readers nervous because they expect annoying flashy ads to appear at any time (the medical term is “ad premonition disorder”).

Having studied 2534523 comments, I managed to identify certain patterns in behavior:

  • “It’s not a problem if you can fix it”: These folks suggest you manipulate the css to get the beloved liquid layout back. They probably use Linux, so they’re used to fixing everything they don’t like.
  • “Couldn’t you give users an option, maybe a switch in their profile which would let them choose their preferred layout? Hey, I might even be willing to pay for it”: Windows users.
  • “You’re not supposed to expand your browser to the full size of your monitor. A good OS wouldn’t encourage you to do this!”: Smug Apple 30″ cinema display owners.
  • “I hate you and I’m not coming back… at least not until tomorrow, but I’ll just return to see if you changed the design back and to post angry comments if you didn’t”: They’ll never leave and they know it.
  • “Hey, finally something I can write about in my blog!”:Yeah, that’s… uhm… me.

This would normally have been the end of this post, except that I had an epiphany when I turned my monitor by 90° (it’s fixed on an Ergotron monitor arm and my graphics card supports this, too). This changed everything! All those print media sites like SPON, sueddeutsche.de, faz.net and even wort.lu suddenly looked great! I wonder why…

“Hey, it looks good on my screen!” (the one on the left). ;)

2008 08 14 Stephan Attempted Humor
Web development Comments (0) Permalink

Totally awesome furniture (and other stuff that you can’t buy)

One of my brothers sent me this link to John Nouanesing’s catalogue after seeing one of his designs on Ehrensenf (the German version of Rocketboom).

Me: “Too bad you can’t buy anything :(”
Brother: “I thought you had some contacts in China, this stuff is screaming to be sold”
Me: “Wouldn’t that be… you know…”
Brother: “Capitalism? ;)”

He’s studying law, BTW (and just to make sure this doesn’t come back to haunt him when he’s about to be nominated to the European Court of Justice or something like that, let me point out that we were kidding and that it’s now 5:45 AM in Ningbo and nobody’s in the factory to pick up the phone, anyway).

The morally immaculate way is - of course - to look at the designs and let their total awesomeness* inspire your creativity.

*I don’t think I’ve ever used “total awesomeness” before, so you’d better take a look. ;)

2008 07 22 Stephan Attempted Humor
Ideas Comments (0) Permalink

Thin borders fade automatically in Firefox

First time I noticed this: The div with the logo and the language selection div below have a 10px solid left border in blue (matching the background color) and a 1px white bottom border, which leads to a nice gradient in Firefox 3:

Nice, though I wonder if this behaviour can be influenced. In IE, Firefox 2, Opera and Safari it looks like this:

(Before you mention it, I know the language names lack padding in the lower screenshot - my mistake, but unrelated to the issue at hand)

2008 07 10 Stephan Web development Comments (0) Permalink

SQL Injections - why companies should care (and users, too)

While I had read reports about successful mass SQL attacks on hundreds of thousands - by some estimates even millions - of websites months ago, I didn’t really care much, assuming that this issue would only concern outdated, irrelevant and poorly coded websites.

I realized I was wrong (partially wrong) about a week ago when I was looking for recipes for my newest toy, a blender from a brand every YouTube user knows. Unfortunately, the manufacturer’s website contained not only recipes, but also references to a malicious external script:


For a moment, I thought about making a stupid video showing some JavaScript that does not blend but then decided on contacting the company first. Indeed, only one day later the site had been cleaned.

Normally, I wouldn’t even mention this on my blog, since I believe “public shaming” is only justified if a company or webmaster does not react withing a reasonable time or if the case at hand is particularly outrageous (before you disagree, please consider that my entire blog is about not being perfect and still having a lot to learn). However, when I visited the website again on Sunday (in order to show the company’s products to a friend and restaurant owner), NoScript showed the site had been compromised once more and was trying to distribute malware again (this time, the evil domain was mainadt.com instead of suppadw.com). When I tried to send another message over the contact form this morning, Firefox 3 wouldn’t even let me visit the page without a very clear warning:

The reason Firefox is showing this warning is that Google now “officially” considers this site (possibly) harmful:

Aside from the obvious “make sure your code is not vulnerable to SQL injections (and don’t forGET it’s not only about POST parameters*), what can be learned here?

If your site has been compromised, you should react quickly and make sure it can’t happen again. Otherwise Google will sooner or later list your website as “suspicious” and you’ll certainly lose visitors and business. A compromised website also reflects poorly on your company and your brand. I would be particularly concerned about the negative effects in the case of companies relying heavily on the internet for business (including internet marketing). Furthermore, one has to wonder if you might be held liable for exposing your visitors to malware.

Don’t rely on expensive third party scanning tools. Did you notice the “Hacker safe” logo in the first screen shot above where my virus scanner was already showing a warning? Instead, I suggest hiring a capable programmer (you’ll need one to fix the vulnerabilities anyway) and have him customize a monitoring solution which issues a warning anytime your website or database has been “illegally” modified (I might pick this idea up in a later post). This would make sure you’re the first to realize when something is wrong, not your visitors or Google.

If I were a capable programmer familiar with ASP and MSSQL and had some free time, I’d think about spending a few hours searching for affected websites, somehow ranking them (e.g. “best known”, “in my area”, etc.) and then contacting them with an offer to remove the malicious code and the vulnerabilities (or maybe redesign the entire website). Think about it, there might be millions of affected websites out there, this seriously screams “business opportunity” (BTW, I’m not a… er, not familiar with ASP and MSSQL and I’m busy, so please don’t contact me). Of course, sooner or later someone’s bound to misunderstand your offer (”this guy hacked our website and now he’s asking for money”). ;-)

As a user, don’t follow my bad example in the first screenshot. Instead, disable JavaScript by default and enable it only for sites you can trust. This can be done best by using the excellent NoScript plugin for Firefox. Don’t think that Firefox + Google alone can always protect you, you won’t get the big red warning above unless the site in question has been compromised for some time.

*technical details can be found in Michael Zino’s article ASCII Encoded/Binary String Automated SQL Injection Attack and by following some of the links I posted before.

2008 07 07 Stephan Security Comments (1) Permalink

Expression web span lang tags

Does Expression Web (version 1 or 2) add <span lang=”something”> tags (”lang spans”) to everything you type in design view? It nearly drove me crazy with this behavior and the many language-related options in different menus, but after I figured out what was going on I actually came to appreciate this feature (when working on multilingual sites).

Why does xWeb do this?

Try this: Select some text and go to Tools > Set Language and choose - let’s say - Alsatian. You should see xWeb adding <span lang=”gsw-fr”> to your code. This will always happen unless your entire page is marked to be in Alsatian with lang=”gsw-fr” xml:lang=”gsw-fr” in the html element or using <meta http-equiv=”Content-Language” content=”gsw-fr” /> .

So, anytime the language of some text on the page does not match the language for the entire page, xWeb adds the lang spans.

BTW, you can set the meta tag by going to File > Properties > Language > Mark current document as though it seems the language information specified in the html tag takes precedence over the meta tag when xWeb decides on adding the lang spans (thanks to Cheryl D Wise for the link to the W3C FAQ and to MrMox for pointing out that the meta tag alone doesn’t always solve lang span issue).

This doesn’t explain why xWeb adds the spans when I just type text on my keyboard!

It appears that whenever you type something, xWeb checks the input language your system is using and sets the language of your text accordingly. This means you get the same result as if you were to select Set Language from the Tools menu, triggering the same effect as described above: If the input language doesn’t match the document’s language, xWeb adds lang spans.

How do I switch this off?

Unfortunately, there doesn’t seem to be a simple “never add lang spans” option. You can find some possible answers on the web (e.g. here and here), but they didn’t work on all of our systems.

So what do I do? Type only in code view?

I don’t recommend this as you might make mistakes with html entities (like typing & instead of &amp;). Instead, go to your Windows Control Panel > Regional and Language Options > Languages > Details and make sure that all input languages which are specified on your page are available (otherwise, add them).

Example: In my company, we’re working with Swiss-German keyboards on websites which are mostly in English (en-us or en-gb), German (de-de) or French (fr-fr):

Now when I edit a page which is in German, I just have to make sure that the correct input language is selected:

Voilà, no more lang spans! Furthermore, if I wanted to add some text in English, I could simply switch the input language and xWeb adds the lang span, which means I can easily check the spelling on a page with multiple languages (and voice browsers should pronounce the text correctly, too).

Is that all?

No, it gets even better! If you’re editing an existing page where the language has been set, you can go to Tools > Page Editor Options > General and select Automatically switch keyboard to match language of surrounding text. Expression Web should now select the right input language automatically for you (hey, this saves you two mouse clicks!).

Thank you, everything is working now! You’ve just increased my productivity by at least 200%!

You’re welcome. Here’s the my Amazon.de whishlist. ;-)

Wait, it still isn’t working!!

All right, I got this working on three very different systems, using xWeb1 and 2 as well as Win XP and Vista x64. It’s no longer an issue casing trouble for us, we did, however notice behavior which can only be described as weird (or buggy) from time to time. For instance, it is perfectly possible to have a page were no language meta tag is present (and no language is assigned in the html tag), but a language is nevertheless set under File > Properties > Language.

You could also try experimenting with the language related options below which I haven’t mentioned so far (just don’t ask me what they’re supposed to do) or ask for help on the Expression Web forum:
Tools > Page Editor Options > General > Default Page Language
Site > Site Settings > Language

2008 07 03 Stephan Software
Web development Comments (0) Permalink

Best of SQL injection attacks*

Click to resize:

A fix? Uhm… maybe you can find a good self-help book on SQL injections:

This must be a world record

You should also consider hosting scripts locally:

SCNR.

*no, it wasn’t me. ;)

For serious information:

2008 07 02 Stephan Attempted Humor
Security Comments (2) Permalink