Archive for the ‘web design’ Category

Wednesday, February 1st 2006

Search Box Found

Important message to all readers!

I woke up this morning, finding that someone had left a search box behind. I’ve put it up at the top left for the time being. If you can’t find your search box, this may be it. Just send me a note. I’ll be more than happy to return it to it’s rightful owner.

Update: Actually, come to think of it – I think I’ve changed my mind. I’ll keep the search box for myself. I’ve always wanted one of those cool things that light up when you use it.

Saturday, November 19th 2005

Alternative Stylesheets

I have created a few alternative colour themes/style sheets. Just for fun really. (Choose your colour at the top of the page.) Your browser should remember which one you had selected on your last visit.

I’ve also moved all the CSS out into sepearate stylesheets to reduce the amount of space used on my webspace, as well as to make design tweaks simpler in the future.

Saturday, October 1st 2005

Some CSS3 Columns/Wizardry

Fini Alring has a great demo of CSS3 columns. It’s making me drool. For those who don’t have Firefox 1.5 beta there are screenshots.

Thursday, September 22nd 2005

New Design

After having played about with a three-column CSS layout, I decided to use the design for my blog.

So, here’s the result! There may be some minor polishing work left to do, but I think I’m mostly done.

I used Firefox for testing while I was building the design. Then I checked the result in Opera (no problems) and lastly in Internet Explorer. I made one small adjustment to the CSS for IE, in order to make links the right colour. (It seems IE doesn’t understand the inherit value for links.) Something I decided not to do for IE was swap the max-width property (which IE doesn’t understand) of the posts for the width property. Doing so would break the scalability of the design. I’d rather make it clear to users of Internet Explorer that they’re using an outdated browser…

So, If you’re reading this in Internet Explorer, and wondering what this design really should look like – try Firefox instead. You’d be doing yourself, me, and every single web designer in the whole world a huge favour.

I also added a favicon for anyone who may have bookmarked the site.

Update: Just for the heck of it I made a semi-transparent white PNG image for the background of links when hovered. That way I don’t need to find different suitable hover colours for the different background colours. Also, if I want to change the colour-scheme later on it will be much easier.

Monday, September 19th 2005

Playing Around With CSS – A Scalable Three-Column Layout

After having read the first few chapters of Lie and Bos’s book Cascading Style Sheets (3rd ed.) I was inspired to play around a bit with some of the nice things available in CSS.

Unfortunately many of these nice CSS features (such as the sibling or adjacent selectorme wants it very much!) don’t work at all in Internet Explorer 6.

Anyway, I put together a three-column layout based entirely on CSS, which a) is completely based on the users default font size and b) makes use of the full screen width. Actually, to my surprise, the basic layout seems to work quite OK even in rusty old IE6. Here’s what I’ve put together so far. Feel free to use all or parts of it if you should want to.

Can’t wait ’til the standards compliant browsers have a more substantial market share, so we can start using adjacent/sibling selectors seriously. They are truly wonderful for making good-looking typography.

Comments on this design, or other advanced CSS stuff, are more than welcome.

Oh. And one other thing I’m looking forward to play with is CSS3 colours, which will be allowed to be semi-transparent: colours with an opacity value. Sounds pretty neat, eh? Can only imagine it will be totally so.

Update 2005-09-26: As you may have noticed, I decided to use the three-column layout I was playing with here as the base for my new blog design…

Saturday, July 30th 2005

Many Rendering Bugs Fixed for IE7 Beta 2

Chris Wilson of the IE Team has just posted a list of bugs that have been fixed for Beta 2 of IE7. It’s a list which will greatly reduce the number and severity of headaches within the web developer community. Check it out:

In IE7, we will fix as many of the worst bugs that web developers hit as we can, and we will add the critical most-requested features from the standards as well. Though you won’t see (most of) these until Beta 2, we have already fixed the following bugs from PositionIsEverything and Quirksmode:

  • Peekaboo bug
  • Guillotine bug
  • Duplicate Character bug
  • Border Chaos
  • No Scroll bug
  • 3 Pixel Text Jog
  • Magic Creeping Text bug
  • Bottom Margin bug on Hover
  • Losing the ability to highlight text under the top border
  • IE/Win Line-height bug
  • Double Float Margin Bug
  • Quirky Percentages in IE
  • Duplicate indent
  • Moving viewport scrollbar outside HTML borders
  • 1 px border style
  • Disappearing List-background
  • Fix width:auto

In addition we’ve added support for the following

  • HTML 4.01 ABBR tag
  • Improved (though not yet perfect) <object> fallback
  • CSS 2.1 Selector support (child, adjacent, attribute, first-child etc.)
  • CSS 2.1 Fixed positioning
  • Alpha channel in PNG images
  • Fix :hover on all elements
  • Background-attachment: fixed on all elements not just body

I’m looking forward to seeing how IE7 will render my web gallery, which makes use of floats and fixed-position divs.

I’m also very much looking forward to the day when we can make websites from scratch and see our CSS code just work in all the major browsers… And the following may sound strange coming for a Firefox addict and advocate, but I truly hope that Microsoft puts a huge marketing campaign behind IE7 once it has shipped so it as quickly as possible replaces IE6 (where still in use) on Windows XP. Firefox will have the older Windows versions for lunch, and through continuous innovation it will probably keep growing on the XP & Vista versions too.

Update: Now if only Gecko would get support for soft hyphens, I would be a truly happy geek…

Thursday, July 28th 2005

A Few Words on IE7 Beta 1

If you didn’t already know, Microsoft has just shipped beta 1 of IE7. In fact, I’ve already had a visitor here using IE7. Being a website developer (although an amateur) I have been hoping that they would improve their severely broken CSS support. Back in February, when the planned update to IE was announced, it was unclear to what extent the rendering engine was going to be improved. Sadly, it now seems all too clear.

Reading the official what’s-new page, it seems us web-devs will just have to hope for a speedy release of IE8 with some real improvements:

CSS Updates – Internet Explorer 7 includes fixes for issues with the Cascading Style Sheets (CSS) feature. Both the peekaboo and guillotine bugs have been addressed, and work on other issues is under way to provide web developers with reliable and robust CSS functionality.

Oh, so both the peekabo and the guillotine bugs have been fixed? Well, that really is good news. But it also makes it quite clear what the prime objective for IE7 is: to stem the flood of people moving to Firefox. They’ve thrown in some tabs and a search box, hoping that doing so will be enough to plug the never-ending leakage of IE’s market share. In fact, IE7 Beta 1 is, at least on the surface, pretty much a Firefox clone.

Over at the IE Blog, someone has now posted a screenshot of how IE7 fares with the Acid2 test. Not surprisingly, by now, it sucks just as hard as IE6 does.

Back in March, Chris Wilson said:

Additionally, with every subsequent major release of IE, we have expanded and improved our implementation of web standards, particularly CSS and HTML.

Well. I don’t claim to know every detail of the IE version history, but my feeling is that the improvements made to the IE7 rendering engine (so far, at least) makes it one of the IE releases which made the smallest improvement over the previous version.

Quite obviously, Microsoft woke up far too late to be able to make any real improvements to IE. When they finally got started, there just wasn’t time to address such nonessential things as standards support. At least, this is the interpretation I make of the comments made by the IE developers. They’re always mentioning a lack of resources and making there’s only so much we can do-type of statements.

However, there may still be some improvements before the final release though. A quote from the Internet Explorer 7 Beta 1 Technical Overview gives us at least some hope:

The final release of Internet Explorer 7 will focus on improving the developer experience by reducing the time needed for developing and testing on different browsers.

If there’s any truth in that statement, Microsoft are going to make pretty serious changes to the rendering engine before shipping the final. Also, if they deliver on that promise, it would get them in line with their new Microsoft does (almost) no evil policy. (I’m talking about fully documented & open XML document formats in the next Office, improved standards compatibility of Microsoft.com, MSN Virtual Earth being virtually cross-browser and with open API’s, etc.) Well, we’ll have to wait and see. But, I tell you this – if they make the final IE7 fully CSS 2.1 compliant then I won’t say another negative thing about Microsoft here for at least six months a whole year. And that’s a promise.

Update: Just remembered another good thing Microsoft has done recently. They remade msn.com, in a strive for total standards compliance! XHTMLstrict, baby, strict! Of course, there are still some errors – but they have been narrowed down to seven in all. Not bad for such a large website front page!

Monday, May 30th 2005

CSS – Designing for the Web

Just received my (free!) copy of Håkon Lie and Bert Bos’s book on Cascading Style Sheets (Cascading Style Sheets – Designing for the Web, 3rd ed.). Very nice!

The front cover of Cascading Style Sheets - Designing for the Web. The back cover of Cascading Style Sheets - Designing for the Web.

I was sent a copy for free in exchange for a user review over at amazon.com, which I feel is a great deal 🙂

This (the third) edition has been updated to fully cover the details of CSS 2.1. Without having read the book properly yet, it seems to be a very useful and complete guide and reference.

Beforehand I thought the book would only be a technical (code-centered) guide to CSS, but it turns out to contain many practical design tips as well. I would say it is useful for both beginners and advanced website designers. (I thought I knew basically what there was to know about CSS, but the book has already tought me several new and useful things.)

The book is split into logical sections, and for each CSS property discussed there are symbols indicating which browsers support the property in question.

Reading this reminds me how much I love using stylesheets for website design…

Ok, this is getting a little out of hand here. I’ll try to think of something negative and add it to this post at a later date… 🙂

Thursday, March 17th 2005

Microsoft being Microsoft

At the beginning of March we could read the following at the IE Blog:

We know we have a lot more work to do in addressing our consistency issues with CSS and furthering our coverage of these standards. Expect to see more detail on our plans in IE7 in the future.

Now we can read that IE7 will (according to unofficial sources) not include full support for CSS2, just like IE6 doesn’t include full support for CSS1. (The IE team are claiming it does, but judging from how this CSS1 test page displays in IE6 it clearly doesn’t.)

So, congratulations all fellow website devs – we all just got another five years, or so, of hair-tearing and endless IE-hacking.

Update: I just found this petition asking the IE team to include (real?) standards support in IE7. I would probably have worded it slightly differently myself, but the basic message is there.

Update 2: Robert Scoble just wrote I’m also telling you that the support for standards is changing at Microsoft. Stay tuned. in the comments to his post about the Acid2 challenge.

Wednesday, March 16th 2005

Is Microsoft going to be good?

Hakon Wium Lie has written a great article for CNet which challenges Microsoft to live up to their claimed commitment to interoperable software.

Hakon proposes that the Web Standards Project hosts a test suite, named Acid2 (Acid was the nickname of one part of the CSS1 test suite over at W3C – have a look and you’ll see why), which will serve as a means of testing the capabilities of modern web browsers in general, and IE7 in particular.

I think this is a great initiative, and I think it’s good that it has been made in a forum which gets a certain amount of publicity, and that it was made by someone who knows what he’s talking about. Now it’s just a matter of convincing the IE devs that this is what we want.

Seriously. Making websites could be fun, all over again, if only all web browsers (hrrrk-hmm IE cough cough) would follow standards – and all the standards. So, I’d better get a-nattering over at the IE blog…