Archive for the ‘Tools’ Category

Speeding your page load time will improve your Google ranking.

It is now official. Speeding up a site’s page delivery will be beneficial for each page’s ranking in the the Search Engine Results Pages (SERPs). So speed is now a ranking factor at Google. This has been officially announced on the Official Google Webmaster Central Blog.

Speeding up websites is important — not just to site owners, but to all Internet users. Faster sites create happy users and we’ve seen in our internal studies that when a site responds slowly, visitors spend less time there. But faster sites don’t just improve user experience; recent data shows that improving site speed also reduces operating costs. Like us, our users place a lot of value in speed — that’s why we’ve decided to take site speed into account in our search rankings. We use a variety of sources to determine the speed of a site relative to other sites.

Satisfied users.

If you still haven’t grasped the concept: Google has always emphasized that it liked pages made for users and not for search engines. A faster loading page means a satisfied user and as Google has all to win when it concerns satisfied users it is using what satisfies them, fast pages, as a ranking tool. Now, those having never seen the usefulness of Google Webmaster Tools can start running there to open their accounts.

:grin:

How to?

There are some simple ways of improving a site’s speed. First things first, use pingdom tools to evaluate your page’s load time. What I like with this new factor is that web designers will have to go back to the basics, re-use the core of web design coding, i.e. writing standards based code.

Standards.

Great day for standards. Using semantic and clean code will definitely help improve a page’s loading time. Using basic and clean tags will help your pages load in a whizz. Make sure you do not use deprecated tags and keep to your document definition (strict, transitional…etc.). Moreover, when using standards you get yourself a step ahead in optimising your code as the latter is easily maintained and you can just get any other coder to dive into your page to optimise it.

With the use of standards, you are bound to reduce the number of lines of code you would have originally used. Thus, pages are lighter and load time is decreased. All benefits!

External CSS.

Using standards implies the separation of presentation and content. This is done through the use of Cascading Style Sheets (CSS) and, more important, the use of external CSS. This also has an impact on your page load time. Why? Having all CSS in one external file means that the file will load only once (on the first page a site is visited) then, the same file is used by the browser to load all the other pages’ presentation. This means that your site’s pages will load faster as the CSS will be read only once and you will not have duplicate code to maintain all the time in each page if your CSS is written in them.

To get the most out of your CSS in terms of load time you can also improve the CSS file itself. Check out a previous article on how you can make pages load faster by minimising the CSS file.

External behaviour.

Should you be having behaviour on your pages (be they through Java or DOM scripting), the same advice as that for CSS goes. You need to externalise all the code to one external page to avoid constant recalls to all your functions each time a page is loaded. You can also think about progressive enhancement to improve the page loading when scripts are not activated or fail to load. All in all, keeping these simple and short will help improve your page loading capabilities. Other enhancements include the loading of all scripts after the content.

More…

These here are some simple examples on how the code can help pages in improving in terms of load times. It is very important to take these into consideration at the beginning of a project to maximise its ROI. This is a great example on how code and coding strategies can improve SEO, and Google is now making use of it.

You can push further in the ways a page’s load time can be improved for example, the choice of your server or image optimisation strategies.

Beware of blogging burnout.

Preparation is the key to success on a blog. Before launching a blog, one has to sit down and think about all the necessary steps to building one’s blog: niche, domain name, strategy, SEO, networking etc. With time and the growing experience on blogging and community building one can now have all the tools for launching a full-fledged successful blog from day one. Pro tips sites are now budding over the web such as Sam’s Web Guide and Icy Tips. One of the topmost tips is to be prepared and, in this field, having a well prepared number of posts even before launching a website is a win win strategy.

After the launch.

I’ve been blogging for nearly 6 years now starting from a daily nonsense life blog on Blogger back in 2004. There was no real direction to that blog and it mixed work and daily life. I must say that life blogging was easy as I chatted away on anything going from my impressions on the way people made extensive use of tramways in Grenoble to my own personal discoveries in the art of Web Designing. Things changed when I started the Web Design Bureau of Mauritius some 2 years ago.

At that time there were lots of pro-blogging websites but I was not prepared as I would have been today. I made the mistake of not planning which explains the difficulties in publishing posts during the first months of this site’s existence. Then, ideas came and I took the pace. But one thing remains difficult to me: taking enough advance on posts to be published. I do spend quality time on the job done here and am a normally well organised person but constant upriver preparation is still not perfect on this blog.

Blogging burnout!

One of the worse things that can happen is blogging burnout. It is not the common “writer’s block”. It is real burnout. This usually happens when one tackles a field that one is unacquainted to or that one doesn’t really master. It can also sprout when too much energy has been put in the launching and preparation of a new blog project and then the whole thing is burnt out because all the subjects or the best subjects have been dealt with. Then, it becomes a real ordeal to manage the whole thing.

Some mistakes I made before.

Getting over excited over the number of posts – When I was a budding blogger, I got really excited over publishing more and more. Each time I had an idea I jumped on my computer and typed my way through my post. I was happy with the job and excited about the ideas I was coming up to. The problem was that, after a while, all the ideas looked bland. Why? Because I was in a certain mood at one time and the posts would have a certain feel and that feel would be here for 5 or 6 posts then change on the following ones. This translated a lack of consistency but, hey, those were the origins of the life blogs where you showed your mood.

Publishing too fast – Publishing too fast was a by-product of my blogging excitement. When you start out writing a lot of posts, you are eager to get a readership and collect the comments on your views. The major problem in that is that you have to refrain yourself from publishing it all. Some days I would be publishing the whole 5-10 posts I would have written in one day. What a waste! It was like eating a whole week’s food on Monday and eating nothing else during the week. Then what? BURNOUT! (short lapse but still…)

This also had the drawback of not giving enough strength to each post. Large traffic websites can go about publishing several posts a day but on smaller sites, this boils down the impact of each post and idea.

Writing long posts – Writing long posts is an art in itself. I happen to be a talkative person and found out you have to master the art of long posts before actually writing them. Readers’ attention-span is short, especially over the web. It doesn’t help to beat around the bush when there’s not reason for it. So keep the posts short until you get enough stamina to run the distance.

Let’s talk about this.

Have you ever experienced this flurry of post ideas and reached the red zone? What were the reasons? Has it impacted on your blogging life?

Note: even if I no longer maintain the other blogs and have closed them down it has never been a result of burnout.

Would Twitter be better for SEO without URL shorteners?

Alice’s last post on the changes in search engines as well as the advent of real time search in SERPs (Search Engine Results Pages) triggered a specific question: how to maximize the use of Twitter posts from an SEO point of view? We are today working towards Social Media Optimisation but the objective here is to have a reflection on how such a tool can become a stepping stone in an SEO strategy.

Anchor text.

All SEO experts will stress on the importance of anchor text in net and deep linking strategies. If you’re not at ease with SEO, here’s a quick overview of the use of anchor text. Anchor text is the text generally used in linking. Most of the time it looks like: read more here/more here etc… One of the core elements in search engine rankings is the number of incoming links. However, search engine robots do not only evaluate if the incoming link is from a high PR page or from a homepage but also what the link tells it before it scans the landing page. Thus a “read more here” text gives less information than, e.g., “web design company” in the link. This IS the anchor text. The robot will evaluate it and have a first information about the theme of the landing page. It is therefore interesting to optimise this anchor text when you’re building your linking strategies.

The Twitter case.

Any Twitter user will have spotted the issue on the basis of the anchor text definition. There are 2 issues concerning Twitter:

  • As shown lately, url shorteners have been a problem (not huge but still) as viruses or phishing/malware pages can be hidden behind these urls. The problem does not come from hiding something behind a link itself, it can be done with any link. However, some users might be frightened of clicking on links now (which is the exact contrary of the current usage of the tool).
  • As an SEO expert, if Search Engines provide real time content by showing Tweets in SERPs, it would really be interesting to have real anchor texts which will increase the visibility of the landing page be it for a user or a search engine robot.

Anchor text, a solution?

Today, the usage is url shorteners but it might be a good thing to add (or replace) this with the possibility of adding links to anchor text in one’s tweet. This would have some major advantages on the marketing front:

  • As stated earlier, a major help in terms of SEO and link building.
  • A better use of the 140 characters available as space will not be eaten up by the url sent out.
  • The follower might have better incentives to click on a link if the latter has explicit anchor text.

Let’s talk about this…

In the light of this exposé do you think that twitter would be better for SEO without URL shorteners? Do you think that Twitter should add such a linking tool or replace the use of these? Do you think that SEO strategies through Twitter would be great?

I can add my personal view on this: Twitter will not be doing it! Let’s talk about it in the comments.

What will change in 2010 with search engines ranking? (Google speaking only? Not sure …)

It will soon come the time where SEO may well be much more a matter of traffic management and analysis than ranking.

Search engines positioning standards are constantly moving, making ranking a permanent issue for websites visibility and business. Up to now, being the first (or at least at the top 5 of the first page) of Google was the real thing.

This reality is doomed to disappear.

Why?

Because Google now focuses on 3 distinct measures for ranking (and will be doing so even more in the near future):

  • Local and personal data (IP address, language, researches history: whether you are connected with a Google account or not).
  • Universal search is getting mixed up within search engines results pages for good (images, videos, podcasts, RSS. All this with results suggestions: definitions, similar / closed researches …).
  • Real time information included in Google results pages (social networking news, such as Twitter tweets already in Google results – probably tomorrow your FaceBook friends news – and for sure Google Buzz messages. Also used, what is new: keywords buzz at a defined time).

Of course, the already known key standards for ranking are still to be used, but their importance is decreasing for some of them (keyword in links, images, footer …).

What we are going towards is personalisation.
In the near future, do not be surprised if two persons doing the same keyword research at a time on Google will have different results pages …

What can you do?

I strongly recommend you to consider the 4 advice below:

  • Forget about search engine positioning as it is (looking in Google where your website is for a particular keyword). Have a look in the Google Webmaster tools which indicates the ranking tendency of your web site: this is probably the best indicator available.
  • Analyse your keywords traffic (in your traffic analytics tool: Google Analytics, Xiti …): consider even more your search engines traffic part as a whole. Identify your keywords groups based on common themes, and work on it.
  • Reschedule your SEO time: the long tail effect is getting a strong reality to face. As it is (or will) become 80% of your website visits, it has to be 80% of your optimisation time (and 20% with the other “top visits” keywords).
  • Stick to the fresh news and identify the popular keyword linked to them (use Google Ad Planner). Use them in your articles and news. Share your news as much as possible.

All of this is very Google oriented, but let me bet Yahoo / Bing will do just the same … in 2011?

A French version of this article is available here: Evolution du positionnement en 2010 – les choses à savoir

Google “star” feature to replace Search Wiki.

Google has been doing a lot of changes and enhancement on its major tools since the beginning of 2010. The most obvious aim of Google’s changes is that it is trying to get things personal. In the same way it has been doing behavioural marketing over the years (Google ads aimed to Gmail users according to the content of the email they’re reading), the urge to get the user to get more and more intimate with the web applications are growing. This is what drove Google to launch its new personalisation tool, the “star feature”, last week.

The “star” feature.

This might look self evident when we see it in action, the “star” feature stars a specific result in the Search Engine Results Pages (SERPs) and are available as “first” search results next time you search for the same keywords. This looks like a feature that seems to have been here all the time but never seen in Google. It calls to our common culture in software use to “star” elements and Google is launching it just now for its SERPs.

Why so late?

As weird as this might seem, there was a “star” feature type of tool available for Google account owners. It was called Google Searchwiki and had an extensive (for what it did) palette of features such as commenting and results re-organisation. This, along with the nightmare it suddenly became for SEO Experts, was a huge leap in personalising searches but… it never really caught user’s attention. Mind you, it might have had millions of users but Google calculates in terms of billions and this was the problem.

Useful or not?

Now Google is going on a new way of personalising results by replacing Searchwiki with this new feature. As useful as this might seem, I have to admit that I tend to forget about its presence as much as I did not really see any incentive in rearranging Google’s results. So is it still useful to have this “star” feature or not? What’s your idea on this subject? Would you be using such a tool as a regular or power Google user?

Test your web pages in Adobe Browser Lab.

So you’ve spent a lot of time designing your new web pages but are still wondering how they would look like in different browsers. Adobe Browser Lab is the new free tool from Adobe for easier, faster cross browser testing.

Build mega dropdown menus.

Since usability guru Jakob Nielsen recommended the use of mega drop down menus as useful on large scale websites, it has become impossible to ignore the way these menus are built. One of the best tutorials available is that of Soh Tanaka which drives you step by step into the building of mega drop down menus with jQuery.

Web Font Specimen, helping your typography.

Typography is not the easiest part of web design to master. It however is the core of web design. Tim Brown has set up Web Font Specimen which allows web designers to test, via simple files the rendering of the selected fonts on different browsers. A really useful tool!

Mollify, open source web file manager.

Mollify is a great open source web file manager with a sleek user interface and fast loading allowing you to give access to different users on a file hosting server. Access can be managed by different levels of permissions making this tool extremely useful.

Put a primer coat to your CSS.

Every web designer had his/her way of writing mark-up. If you usually start out writing your mark-up with all your classes and ids, PrimerCSS is the tool for you. Just drop in your mark-up and it’ll extract a primer stylesheet with all of these to get you up and running in no time.

Speed up your web pages via the CSS file.

As a Web designer, there are some rules that you have been acquainted to. One of the first being: “store all layout and graphics in a separate CSS file”. Nothing bad in this one. Knowing that a CSS file is downloaded once or updated if needed in a browser’s cache, this speeds up pages and adds more semantic through the separation of layout and content. All the good basics of CSS.

It happens that the content of a CSS file can easily grow. On some large websites it’s no surprise to see CSS files running over a thousand or two and even more lines. At the end of the day, a CSS file might in itself reach some 80kB or go over that. In France, the recommended “accessible” page weight limit is 27kB. So with an 80kB CSS file you’re just shifting the data bloating problem to another file. Its still here. So, this is my little trick to reduce CSS file weight. This will have, as a consequence, a positive result on your page loading time.

The Tool

One of my favourite editors is PsPad, lightweight, easy to use and packed with a whole bunch of useful elements. One of these is the ability to reformat the CSS/HTML in structured or inline format. A lot of tools do that too but PsPad is just one of those but allows me to manage whole projects in one go making it really handy.

The Trick

The simple trick is to actually structure the data of the CSS file then throw it to the inline version before uploading it to the server. Structuring the data is useful to clean the file. The CSS parser in PsPad realigns the code and structures it with the relevant tabs as well as drops all empty lines and redundant spaces. This increases readability.

Afterwards just reformat the CSS file content into “inline”. Here the tool will reformat the whole content to have each node on one line only per node. The file loses a bit of readability but gets improved in terms of spacing, hence reducing the filesize. Take a look at the 2 screenshots below. The first shows the weight of the layout.css file with structured content and, the second, the same file with inline content. The file size change is rather surprising:

Structured CSS file in PsPad

In line formatted CSS in PsPad

More ?

This small tutorial is but a mere trick to lighten up your file weight. Other solutions exist, solutions that would allow you to get those precious kB off your visitors’ shoulders with a view of proposing fast pages which would help them choose to convert on your site. On of them would be to use CSS shorthand and don’t forget precious tools like YUI. A good mix of those and techniques like the one presented here would surely help your pages load faster.

I increased my traffic by 179%, find out how.

This looks like a flabbergasting John Chowish title but there is a reason to it. It is actually an experiment I lead over 10 days and looks like @kurtavish and @blebon found out the trick and jumped on the wave. The Wave, that’s actually the idea of the experiment. It was an experiment on trends and their impact on a site. The other thing I wanted to see was the increase in traffic with the bounce rate that goes with it. All it cost me to do this was the time I put in posting the trendy topic on the site. The topic in question was to offer Google Wave invites for free (currently running at 15€ apiece on ebay).

The idea.

The idea in itself is simple. Being curious about everything on the web I got into the Google Wave waiting list just as it was budding. Like the 99 999 other lucky Wave enthusiasts, I received my wave login along with some invites to send. The marketing test idea was already here. 100 000 persons, this means a total of 2 million lucky Wave users compared to the billions of possibilities. So I launched out to give them away to see how people would react to the trend.

And they DID react. All in all, this site had a 179% increase in traffic. The increase is easy because of the low but really precise audience the Bureau has. So, it was more important to check the bounces. This would show whether the site was going with the trend or nor. I’ll let you find it out by yourself:

Increase in traffic

1.23% bounce rate. Meaning that the message got to the reader. This is where you can achieve great things. Related posts and all will drive the readers to check other parts of the site and maybe catch up some interest in your content.

The future.

The contest giveaway idea is not new but the way to do it is also important. The current technique for the Google Wave invite was to either have a tweet or a blog post. Why? 2 reasons:

  • The site got 2000 visits with a 1.18% bounce rate over the 10 days, just take 15 persons with at least a hundred followers who will tweet your contest, you’ll be reaching 1500 persons in one go. Along with that, the person makes a back link to your site. Many would say: “A Twitter backlink huh?”. Well, my Twitter profile has a PR 4, other Twitter pages can be 3 or 2. In the long run, the total amount of back links will pay.
  • Following the same idea, the blog posts and buzz over other blogs get you to have traffic from other sources. You can also receive the benefits of back links from these. These also will be a good element for your SEO in the long run.

These marketing techniques are really great for increasing your site’s presence on the web. Now, this is not a MMO (make money online) blog. Therefore the persons getting into the contest and actually reading the content are a targeted audience interested in the Web and Wave, while a lot of people on MMO sites would just come round and go. If you want to really use these techniques, you have to understand what type of readers will be attracted and what are the chances of having them staying and participating.

Win a free Google Wave invite.

Google Wave is the new craze over the Web. The new communication tool is as interesting as promised and many a company are thinking about switching from their own internal collaboration tool to Google Wave even if the latter is still in Beta/Preview. So people are all running after the wave which is currently looking more like a tsunami than the simple caressing ripples we usually get on our Mauritian shores. Why? @webmastergeek showed me that the Google wave invites were even on sale for nearly $50 on ebay.

As usual the Web Design Bureau of Mauritius will not be doing things like everybody else does! Here things are free and offered. Just ask all the winners we’ve had over the past months, everybody’s happy. Now, let’s wave together.

The new craze, Google Wave

15 Google Wave invites to be won!

Now, this one will be short and quick. You want a free Google Wave invite? Just enter the contest here on the Web Design Bureau of Mauritius. The terms first. The contest will last 10 days as from today the 26th of October 2009. Thus ending on Wednesday 4th of November 2009 at midnight. 15 (fifteen) wave invites will be immediately sent to the winners after random listing. The contest is open to EVERYBODY. Here are the different options you have to enter the contest, just do one or both of these:

  1. Write a post on your blog talking about this contest (it does not have to be a long one) linking back to the Web Design Bureau of Mauritius and then put a link to that post in the comments here.
  2. Tweet about this contest on your Twitter profile with a link to the Web Design Bureau of Mauritius and then put a link to that Tweet in the comments here.

Really easy huh. Just for precision, only those comments abiding by the above rules will be entering the competition. Up to you now.

And another word, check out Zack’s superb article on the new Google Wave Haters… a real must!

EDIT

I am not the only one giving these invites away. Maximize your chances by participating on all these sites:

Wanna improve your web designing? Read elsewhere!

I remember a girl who wanted to write, during my university days, a research paper on “Science and technical students and their approach to canon literature.” The first thing to be done, as she was being guided by her tutors, was to define “canon literature”. It happens that she dismissed science fiction, hence dismissing J.R.R Tolkien who entered the British canon in 1996 with “The Lord of the Rings”.

I’m saying this because sometimes, reading things out of our own world might give us other approaches to our work. These might help us improve our way of designing web sites. They might push us to other boundaries which are less rigid than just building either with creative juices and forgetting usability or doing just usability and code while forgetting the fun part of things.

You might for example tackle this report on Experts vs. Online Consumers: A Comparative Credibility Study of Health and Finance Web Sites published by a Stanford (Google anyone?) research group. This sheds some light on how experts evaluate a site according to its content, while online consumers evaluate the same sites on the basis of design. So if you want a website that sells both to experts and consumers (lightly said) you would need to have both content and design. Consumer Web Watch has a lot of other reports of that sort.

Who knows, you might even want to try Maslow’s classic psychology research on human needs where he defines the characteristics of the basic human needs and how to satisfy them. This is taught to marketing students: by designing a product that fulfills more needs than that of your competitor, your product might have more success whatever the price. Examples: Iphone, German/Italian Cars (for Europe) which can’t be sold in the US because of the need for bigger cars…

As the Dalai Lama said “Each year, go somewhere you’ve never been before”. This just might work to improve your web desiging.

Twitter Follower Killer.

The Web Design Bureau of Mauritius has been working on a Twitter plugin to be released by next week : the twitter follower killer.

The concept.

You have a Twitter account and are being followed by numerous people. People chose to follow you and can decide to stop doing it but what if you don’t want some specific person not to follow you. Say, an ex-girl(boy)friend, your employer or all the members of your company, or even an enemy.

The groundbreaking solution.

A bookmarklet built by the Web Design Bureau is currently undergoing tests and will soon be the object of a public release. This bookmarklet will allow you to kill your follower, meaning that the follower will no longer have access to your tweets. The plugin acts directly on the followers database.

Testing.

Testing is underway. The code is complete and I will be testing it on my own twitter account: http://twitter.com/sachindb. The aim of this test is to delete all my followers by next week meaning that you can subscribe to the tweets and be banned by next week. You’ll be able to re-follow me afterwards.

Stay tuned for the coming release.

Most Web designers do not use CSS frameworks.

I’ve been hanging around CSS tricks which I didn’t visit for quite some time. It happens that Chris Coyier, Css Tricks editor, made a survey on the use of CSS frameworks. These are used to rapidly prototype website designs. I have jotted on some of them around on the Web Design Bureau : 960gs and Blueprint. As things go on, these are useful tools but I don’t use them as I have my own way of developing websites and writing my own code. I also have a tendency, when I am the code master, to code things from scratch following specific design patterns.

Now, if you don’t use a framework, it doesn’t mean you’re a dork. You might just not have time to try and master a tool or have difficulties that any developer has to dive into other people’s code. I, for some time, thought that I was not doing a good thing for not using frameworks and I have tried some of them. I would like to stress that frameworks should be used for rapid prototyping, I don’t think that they’re good groundwork for complete integration. You might want to have complete control over your code.

All in all, my thoughts were confirmed in reading the CSS Frameworks survey results. I don’t have anything against them but I just like to control and throw my own code. The poll confirms that over 50% of the Web designers (answering it) do not use any framework. Others do use frameworks but the results are disseminated among a variety of those and many build their own. If we look at things the other way round it also means that around 30% of Web designers are using frameworks, meaning that these are gaining as design patterns and standards.

I think that it takes time to master a framework and this is whart hinders their progress in the community. It might change with time and who knows, I might myself be in the new riders of frameworks.