Archive for Web Development

Let’s Share

I’ve added a couple of links at the bottom of each post to make it easy to share them if you want to.
Do it :D

PS. I haven’t actually tried them because I don’t have an account on any of the sites so please let me know if they don’t work.

New Server

I’ve finally moved nordenfelt.com to the new vp server by ipeer. So far it looks good.
I forgot to set up two sub domains but that’s the only glitch so far and I can’t really blame any one else for that either :)

Is jQuery Becoming Standard?

I just stumbled across some interesting news, or acctually a co-worker did and sent me the info.
Earlier today jQuery’s weblog announced that Microsoft and Nokia will ship products with jQuery as part of the bundle.
According to the weblog Microsoft is going to ship Visual Studio with jQuery as a complement to their ASP.NET AJAX Framework and Nokia will incorporate jQuery into their widget plaform enabling it for their cellphones.

This is good news as it doesn’t only mean that jQuery probably will become stronger from this but also that I made the right descision when I picked jQuery back when I compared it with a few other libraries. See jQuery in action at photo.nordenfelt.com.

Sources:
http://jquery.com/blog/2008/09/28/jquery-microsoft-nokia/
http://weblogs.asp.net/scottgu/archive/2008/09/28/jquery-and-microsoft.aspx

Playing With Typography, Part 1-2 – Font Size

Just a quick update to the previous post.

In the body section of the CSS I wrote ‘font-size: 100%;’
If you set this to 62.5% instead you will have a 10px base for you em fonts.

The way this works is that 100% is the equivalent of 16px.
This means that 1em = 16px.
When you set the body font-size to 62.5% you actually set the base font to 10px (0.625*16=10) which will give you 1em = 10px.

In the ends this means that 1.2em = 1.2*10px = 12px. It just makes your life so much easier when setting the default font-size for your elements since most graphic design is measured in pixels.

Playing With Typography, Part 1 – Font Size

After my recent play-around with the typography on the site I decided to stay on the topic and this will hopefully be the first real post about it in a series of posts.

For this first one I’ve only been playing with fonts, font-sizes and line-heights.
It’s nothing special really but what is interesting is that it scales with the browsers increase/decrease font functionality which, for example, the ‘px’ measurement will not properly do.

From the example it is also evident that you have to adjust the font size depending on which font you use. Also line-height is very underestimated, and frequently forgotten. All browsers will give you a default value, just like with font-size, and that value will most likely make the text on your site readable. What you have to ask your self is if you want it readable or do you want your users to enjoy reading the text?

I’ve provided a couple of examples with different fonts. I’m not saying they are perfect in any way but hopefully they will illustrate how you quickly can change the way you present your texts.

View the examples here.

The CSS that made the examples:

body
{
	background-color: #EEE;
	color: #000;
	font-size: 100%;
}
h2
{
	font-weight: normal;
	font-variant: small-caps;
	margin:0;
}

div.times-new-roman h2
{
	font-family: times new roman;
	font-size: 1.5em;
	line-height: 1.6em;
}
div.times-new-roman p
{
	font-family: times new roman;
	line-height: 1.2em;
	font-size: 0.875em;
}

div.verdana h2
{
	font-family: verdana;
	font-size: 1.3em;
	line-height: 1.35em;
}
div.verdana p
{
	font-family: verdana;
	line-height: 1.3em;
	font-size: 0.75em;
}

div.sans-serif h2
{
	font-family: sans-serif;
	font-size: 1.3em;
	line-height: 1.3em;
}
div.sans-serif p
{
	font-family: sans-serif;
	line-height: 1.35em;
	font-size: 0.75em;
}

div.tahoma h2
{
	font-family: tahoma;
	font-size: 1.4em;
	line-height: 1.4em;
}
div.tahoma p
{
	font-family: tahoma;
	line-height: 1.3em;
	font-size: 0.8em;
}

div.helvetica h2
{
	font-family: helvetica;
	font-size: 1.4em;
	line-height: 1.4em;
}
div.helvetica p
{
	font-family: helvetica;
	line-height: 1.3em;
	font-size: 0.8em;
}

No More Spam?

I’ve added captcha to the comment form so I’ll hopefully get rid of the spam now. If it doesn’t work I’ll build one myself.

I realize that I don’t have any visible spam on the site but that’s because Akisemet manage to catch it. It still leaves me with the tedious job to go through it and make sure I don’t miss any real comments by mistake.

If you register you’ll get around the captcha bit although I’m not sure you can register, never tried it myself :)

Playing With Typography

I’m playing a bit with the typography on the site and would very much appreciate feedback.
What I’m aiming for is something that doesn’t look so damn boring like the rest of the web but it should still be readable and look nice.

I’m not too sure about the current setup but too tired to focus :)

I just noticed that you may need to refresh your browser cache to see the changes. Just hit Shift+F5 and it’ll do the trick.

Downloading Files with Javascript

I recently built a function which was supposed to generate a file and download it from a website.
The idea was that you had a list of items, you selected a number of them and hit post.
The selected items was posted via AJAX to a PHP script and that PHP script responded with a file that you would be able to download directly (ie. instead of actually showing a web page, the browsers download window should open. This didn’t work.

At first I couldn’t understand what was wrong and assumed that my PHP script somehow messed the file up but in the end it turned out to be AJAX. The browser received the contents of the file and the headings were correct and everything looked good but it still didn’t work.
I changed the call to standard JavaScript and it worked like a charm.

window.location = 'http://www.domain.com/path/to/download-script.php';

So the conclusion is: Don’t use AJAX when you want to initiate a file download in the browser, use window.location instead.

Favicon

I’ve added a favicon to the domain. It was a lot simpler than I thought it would be :)

W3C How to

Mobile (d)evolution?

Ericsson announced their results so far this year and their stock dropped quite a bit because the market was expecting more. I heard an interview with Carl-Henric Svanberg where he explained the main reason why the results aren’t as good as they used to be. He claimed that people simply aren’t buying as many mobile phones now as they did in the 90s because everyone already has a phone today. This might sound as a very good reason, it can even make sense unless you dig a little deeper into the current situation.

The truth isn’t quite as simple as just saying that people no longer have the need to buy a new phone. The statement in itself is true, I’m not arguing that, but with this fact in mind you as a company have to address the issue and this is the point where it gets interesting.

A quick search on the big mobile phone producers websites will let you see pictures and information about most of their newest phones as well as some of the older models. What strikes me as quite strange is the lack of innovation in these phones. In essence, Ericssons newest mobile phone is the same phone they released 2 years ago. It looks pretty much the same way, the hardware has been slightly upgraded and the user interface has been remodeled with new icons. Ericsson isn’t the only company where things look like this. You’ll notice the exact same trend with Nokia or any other large mobile phone producer. In fact, I dare to say, without having looked at them all, that Apples iPhone is the only innovative mobile phone in 5 years, maybe even more. That’s one phone amongst the hundreds that has been released over the past years.

Sony Ericsson has been using the same idea for a long time now. They have their 4-axis stick, or sometimes a square button which you can push in four different places, the phone profiles look pretty much the same and the user interface, horrible as it is, haven’t changed much in years. The same goes for Nokia, actually, I could cut and paste the above text to describe Nokias phones. Not even Samsungs new “touch” buttons impress me because they are still nothing but buttons.

Sure, they are giving us more juice in the phones. Nowadays we have a 5 MP camera and several gigabytes or memory. Some phones have built in WLAN and GPS. The list goes on, they are indeed upgrading the phones all the time, supplying us with more and improved features for every release. The mobile phone isn’t just a phone anymore, it’s a slimmed laptop. But what difference does the 3 or 5 MP camera do when the phones lack the ability do supply you with a usable interface because this is really what I’m talking about.

Navigating in the menus of a Nokia, Sony Ericsson, Samsung or whatever other brand there is is always the same tedious chore. They all look alike and function alike. And they all share the same short comings. You can compare this to the one phone I previously mentioned as innovative: Apples iPhone. Here’s a user interface that’s usable. It’s innovative and simple, you’ll learn how to use it in a matter of minutes. Of course it’s far from perfect but perfection isn’t something anyone should strive for because once you get there you’ve reached the top with nowhere to go but down and what fun is that?

I’d like to make a comparison here to really highlight the issue and my point here: Mobile Phone User Interfaces and the WWW. I work with the web on a daily basis and I am especially fond of building User Interfaces that doesn’t only look good but also usable.

If we go back 5 years and look at where the web was at the time and compare that to where the web is today and where it is going you’ll see a rapid evolution towards rich applications with the user in focus. You no longer build your websites to inform your customers, users or whoever might visit your site. You build your website to give them an experience they want to come back to, again and again and when you really compare today’s web with the one we had a few years ago the change is stunning. Or at least the potential is.

The same comparison on the mobile phone market isn’t quite as exiting. It takes about one minute to see that the User Interface in today’s mobile phones are the same as a couple of years ago. They have improved the graphics, given us a few more options so that we can configure the new hardware but in essence it’s the same UI. And it sucks.

I wonder how long it will take companies such as Sony Ericsson to realize that the problem with decreasing sales doesn’t lie with the fact that people no longer have the need to purchase a new phone. No, it’s because the new phones are the same as their old phone. It’s simply not worth the money to spend on such small updates because they are simply not exiting enough. Apple managed to create a great hype around the iPhone and it wasn’t the hardware that did that. It was the UI. It was the feeling of something new, something cool, an experience in your pocket. Unless the others catch on soon they’re going to be in for some dark years on the market.

« Previous Page« Previous Entries   Next Entries »Next Page »

10 Most Recent Twits

Loading twits...