As trends go through their natural cycle, the general public’s definition of ‘attractive’ websites alters. There’s no doubt that websites built in flash can be breath-taking. Wonderwall, AgencyNet 2.0 and Waterlife are a sweet reminder of the creativity and innovation that designers and multimedia developers are capable of.

However, while Adobe Flash provides what many ambiguously call the ‘wow factor’, it inevitably comes accompanied with unwanted baggage. The following are the main reasons why your website should not be built with Adobe Flash:

1. Lack of content management
   Websites nowadays are almost all CMS-driven. This means that the client or administrator can manage and maintain the content of the website instantly and without any technical knowledge. With the spread of Content Management Systems like WordPress and Drupal (both free and open-source), a website will never be considered of real value if its not constantly updated with fresh content (see my post on what makes a good website). With Flash, it’s almost impossible to have a proper CMS and therefore leaves you relying on a Flash developer to make any changes, and that within itself, is a tedious, time-consuming process. We’re at an age where sharing information has become as easy as tapping a button on your phone while on the road, the last thing we need is wasted (and costly) time on changes and updates
2. Search indexing and SEO
   There’s no real way for Google search to completely grasp the content of a Flash file. There are methods to give a general definition to the content, and therefore show up in some results, but for the most part, a Flash website’s left in the dark. Imagine putting so much effort in adding fresh, valuable content to your website as a social media tool to attract users, only for search engines to remain oblivious to it and therefore not bring you the interested crowd
3. Loading time and performance issues
   The main attraction in Flash is the reason behind its poor performance. Very rarely will you come across a website built in Flash that does not require significant time to load. And if it doesn’t, then it’s usually a lame, boring website that couldn’t been perfectly implemented with HTML and CSS instead. It is challenging to tolerate many seconds, and sometimes minutes, for a website to load
4. Lack of support across the different platforms
   When the iPhone first came out, users were too distracted with the eye candy to realize the lack of support for Flash. Now, with the overwhelming spread of the iPad, the inability to view flash websites in a number of devices has become a major issue of concern. In an open letter written in May, CEO Steve Jobs wanted to prove to the few doubters that Apple’s sole interest is to close all of their products, make them proprietary, and enforce its own way. The announcement also served as an indication that we might never see Flash playing on any of Apple’s gadgets again. If your website is not showing up on iPhones, iPods and iPads, then you’re losing grip on your audience
5. Instability of Flash player
   Flash player has been known to crash across the different browsers. Firstly, there was the famous bug that caused issues with Flash player 10 on Firefox that many blamed the open-source browser for, but later, many using Internet Explorer and Windows 7 shared similar complaints. The fact that this happened after Flash has been around for years is worrying for the future

Moreover, the arrival of HTML5 and CSS3 (along with the usual jQuery plugins) facilitates the switch
It’s far from an identical replacement, but the combination of HTML5 and CSS3 is extremely promising. Amongst other features, together they provide simple ways of embedding video and audio into websites. You also get full control of the appearance and can make all sorts of movements, transitions and animations. In fact, there is an entire cartoon built using only HTML5, CSS3 and jQuery called the CSS3 Man. Here’s a presentation of how HTML5 and CSS3 will shape on the new Firefox:

http://www.youtube.com/watch?v=gFmuNApHFec

Therefore, save yourself the hassle, be reachable, be light-wight and fast, appear correctly on all platforms, and avoid technical issues. It’s best to leave Flash behind and embrace the full potential of the alternatives while it’s a choice, before you’re forced to do so.

In December 2008, tech giant Google unleashed the stable version of its browser, Chrome. Less then two years later, it has eaten up over 17% of the browser market share, growing at an unprecedented rate. It’s fast and light-weight, and boasts a sleek interface. The problem, however, is that the small advantages of the new browser, come at big costs.

Google is definitely 'cooler' than Microsoft

Chrome is widely known as a free and open-source browser. Unfortunately, that is far from an accurate depiction. A proper open-source project has to stick to some basic rules and principles, and Google have failed to do the following:

1. They never released the entire code, making it more like an iPhone OS type of exploitation than it is a collaborative project
2. Instead of starting from down up, it is Google’s name that comes first, then the ‘open-source’ browser project. It defeats the purpose of celebrating the beauty of coming together from different parts of the world to bring a tool we could all benefit from. Instead, we are left with a product that gives all the credit to a company that has been making billions of dollars by ripping off advertisers (and here’s partly why it’s hypocritical, and problematic)
3. In the open-source economy, the success of projects relies on collaboration, not competition. When we all work together, we can collectively benefit. Here’s a TED talk that does a good job illustrating the advantages and mechanisms of the open-source economy:

http://www.youtube.com/watch?v=NgYE75gkzkM

Somewhat of a complicated lecture, but be patient, and it will all come together by the end of it

Most importantly: Google is determined to become the richest and most powerful entity on the planet, and its real competitor is not Microsoft, nor Apple, but the open-source movement. That is because instead of competing with equivalent companies, all driven by profits, it is up against a liberating movement that involves millions of people all working for the greater good. As a result, Google’s main objective with Chrome is to weaken the support behind Firefox, divide its people, diffuse the efforts, and hinder its growth.

Just as corrupt governments diffuse labor unions and rebellious groups by bribing and/or making lucrative offers, Google boasts a single, albeit solid, advantage: performance. That is the sole plus that can be made in Chrome’s defense. On the other hand, many forget about the following disadvantages in comparison to Firefox:

• Flexibility and customization is far superior in Firefox
• The massive list of add-ons available that provide a wide range of features via Mozilla make that of Chrome seem more like a joke
• HTML/CSS rendering bugs and inconsistencies in Chrome are a rare encounter in Firefox, making designers and developers work more to make their websites and applications appear properly on Google’s application

This does not mean, however, that there is something unethical about having two different open-source projects in the same industry – far from it. However, the services and functionality they offer must be different, and/or catering to different needs. Chrome is identical to Firefox in terms of who uses it and how.

While making the switch might seem appealing, let us not forget that it is a diminutive gain on the short run, and an enormous loss on the long one. Because soon, probably  by Firefox 4.0, the performance will be too close of a call. In the long term, though, we would be helping a company hiding many cockroaches behind the fridge become even more powerful and threatening, at the cost of the only movement that is seeking to benefit all of us, as well as bring the power to the people; the open-source.

When non-profit organizations and foundations made the realization that, despite their limited budget and resources, they could reach their target audience effectively (all thanks to the web), their objectives suddenly became much more attainable. Carrying out the tasks of a given development program might be costly, but at least spreading awareness of the issue, and reaching out to volunteers and doners, has become significantly easier.

KnowMore.org is a community-driven wiki that aims at aggregating corporations and entities to a publicly-accessible database to raise awareness about human-rights violations. It does so by researching and finding the companies and multi-nationals that are responsible for “attacks on democracy, worker’s and human rights, fair trade, business ethics and the environment.” It’s a brilliant initiative that brings valuable information in a centralized location for everyone to benefit from.

Not only is KnowMore.org impressive because of the initiative and online presence, but also  because of the way in which they’ve exploited the web (no pun intended). First of all, the look and feel of the website puts it way ahead of the rest (including many corporate websites). Secondly, the fact that it’s very easy to use (spin off from the widespread Wikipedia) inevitably encourages anyone with interest in the field to take part and add to the extensive database.

That’s not all. They’ve actually taken it to the next level by offering a Firefox add-on called KnowMore Extension. What this does is bring up a notification underneath the toolbar of Firefox whenever you are visiting a website of a company that has violated human rights one way or the other. And in order to avoid being what opposition would rush to claim generic, or over-generalizing, they actually indicate the exact rights that have been violated, as well as providing the link to learn more about the illegal activities of that particular company.

KnowMore.org notification bar

It’s like having the community do all of the work for you while you’re browsing.

There are many organizations and non profit entities out there that are striving to make this world a better place. KnowMore.org is like many of them in principle, but far more effective in practice. That is because they have managed to reduce their costs by making the entire platform online, engaged with visitors via the attractive interface and the easy, familiar wiki system, and reached out to many more via the effective Firefox plugin.

If you are part of an NGO or a social development initiative, then the standards set by KnowMore.org should be your immediate goal. That is partly why our beautiful web is power to the people.

I had previously discussed the 7 must-have Firefox add-ons for web developers and designers. I had also spoken about AdBlock Plus, which is, at times, the most downloaded Firefox extension out there. Now I think it is important to bring up an add-on that revolutionizes the way many people exchange files via bulk storage and sharing websites such as RapidShare and Megaupload.

SkipScreen is a seemless addition to the world’s best browser that automatically skips tedious and frustrating intermediate pages preventing you from reaching the file you are trying to download. Whenever someone wants to share a large file (regardless of its nature) and chooses to do so via a file-sharing online service, he or she saves the hassle of having to own web space accessed via an FTP client, and it’s free. The problem, however, is that the recipient has to pass by at least three or four ad-flooded pages before reaching the point of having to wait for a timer to finish because he or she has done the blasphemous move of refusing to sign up for a “premier” account.

Not anymore. Not with SkipScreen:

http://www.youtube.com/watch?v=io8_J5cBkj0

Click on the link and start the download immediately. No more torture.

Regardless of how often you come across files hosted on any of the numerous supported websites, this add-on is golden like the oldies. Install it directly from the Firefox Extensions page, and forget that it even exists, just like it’ll make you forget about painful intrusions ruining the otherwise beautiful and seamless web experience.

On June 30th, the Mozilla Foundation released the latest version of the world’s best web browser: Firefox 3.5. The original plan was to bring out Firefox 3.1, but as the developers realized that the changes and enhancements were significant, it was given the honorary title of 3.5. As always, there are load of new features incorporated, but let’s talk about the most important ones:

1. Performance: Much faster than before, and even more secure
2. HTML 5: Always way ahead of the rest, FF 3.5 now offers features such as embedding videos natively using Ogg Theora, without needing plugins (such as Flash Player)
3. Private Browsing: Google Chrome introduced it, but FF took it to the next level. Now you can have the browser automatically forget about certain websites that you visit, and can clear browsing history going back a few hours only.
4. Location Aware Browsing: Now you can choose to show your exact location so that websites can use it in their online applications. This opens the door to endless opportunities for online services.
5. CSS rendering, downloadable fonts: There are many new web technologies introduced. CSS renders even more accurately than before, and now we can break free from system fonts and take web design to the next level

Here’s a video that illustrates what’s new in a couple of minutes (I would’ve embedded it using the native Ogg Theora format, which would’ve been incredibly exciting, but many haven’t upgraded to FF 3.5, so I’m sticking to the old-fashioned YouTube):

http://www.youtube.com/watch?v=k5Zbc-Rg6e8

As soon as you start browsing, you’ll feel an even better internet experience. All my add-ons are still compatible (and those that aren’t, had released updates that are applied the first time you open FF 3.5). The one thing I noticed, however, is that the ColorTabs extension isn’t showing the selected tab the way it used to (but I’m sure it’s a matter of a soon-to-come update). Other than that, the Mozilla Foundation have outdone themselves with a state-of-the-art web browser.

It is moments like this when shear joy turns into depression when you realize that 14% of the internet users are still running Internet Explorer 6.

As a web designer, it’s quite a task to explain to a regular user the disadvantages of Internet Explorer 6.0. Mostly because there are so many reasons to hate the Microsoft browser, that anyone who has to deal with its annoyances will rush into yelling and swearing, and would never be able to make a rational argument. But generally speaking, this is why no one should even consider using IE6:

1. It does not comply with web standards
   That basically means that web designers and developers have to spend an extra 40% of the time of the project just to make the website look acceptable on it. In many cases, developers give up because you can never make it render the website properly. But unfortunately, that does not change the fact that there is still a significant number of users that continue to stick with it.
2. It does not support .png with transparent  backgrounds
   This is just appalling. There are numerous designs that rely on images with a transparent backgrounds, while using alpha. This means that images that have a shadow, for example, or any sort of gradient, while being on a transparent background will not show up correctly in IE6. The .png format is the only common one that supports those features, and it cannot be rendered by the disgraceful browser. There are some hacks and work-arounds, but they don’t always work, and are inefficient.
3. It is insecure
   The number of security holes and vulnerabilities is yet another impressive achievement by Microsoft. When browsing the web, it is extremely vital to be safe from potential threats, and with IE6, you are far from that.
4. Its performance is really sad
   While there are unlimited browser tests out there that would prove this point, it doesn’t take much to realize how much slower IE6 is compared to any browser, on any operating system. It’s slow, it’s sluggish, and just ruins the experience that is normally enjoyable.
5. Lacks many features
   Who can browse without tabs? How can you surf the net without your favorite Firefox add-ons? After a while, we become used to certain features and certainly cannot live without them. Since IE6 is outdated, users are limited and cannot take advantage of the true beauty of the Internet.

With all of those problems, IE6 continues to be a popular browser. In fact, 14% of the browser market share belongs to IE6. If you haven’t heard, there are strong movements across all corners of the Internet to wipe IE6 off of the world map:

• RIP IE6
• Bring  Down IE6
• IE Sucks
• Dear IE6, please leave

RIP IE6

Despite the aggressive campaigns and awareness techniques, Internet Explorer continues to have a significant market share. Ironically, that is mainly Microsoft’s fault. Firstly, IE6 comes pre-installed with Windows XP. And since many users do not allow automatic updates, they remain using this primitive tool. To make it worse, Microsoft released Windows Vista, which was a complete failure, thus forcing users to downgrade to XP, and not not even upgrade their browser. So not only do they produce the worst web browser to date, they reassure it’s prolonged existence with an even worse operating system.

However, there is reason for optimism. The awareness campaigns are reaching more and more users and the Firefox add-ons are catching on by word of mouth. Much more importantly, the official release of Microsoft Windows 7 is just around the corner (ETA: October 2009), which will either ship with Internet Explorer 8, or with nothing at all. It’s simply a matter of time.

To all of the web designers and developers out there, I tell you: hang in there, this will all be over soon.

UPDATE: YouTube will soon be dropping support for IE6. Read about it here, or here.

At 747,978 download a week, Adblock Plus is the most popular Firefox extension. It is an absolute must have for anyone, regardless of how you use Firefox, or how you surf the web. Despite it’s overwhelming popularity, I was surprised to see that many people aren’t aware of this revolutionary invention, which is way I’d like to discuss it.

Adblock Plus is an add-on to Firefox that automatically detects advertisements on a given web page and completely blocks them, thus giving the user a much more pleasant, ads-free experience. Upon installing, you will find the “ABP” icon on the top right corner (next to the search field), giving you access to all of the options if and when needed. It works based on a long list of online advertisement suppliers and therefore immediately recognizes them and omits them from rendering in the first place. Moreover, you can keep adding filters for those advertisements that are not already predefined.

For example, if you visit masrawy.com (one of the most popular Arabic websites dedicated to news), you will notice that they are so desperate for advertising, that you can hardly read the text without feeling this constant, irritating pressure. Besides the fact that the design and layout is a catastrophe, the ads are quite intimidating:

Masrawy.com with irritating ads

However, by installing the Adblock Plus add-on, the page actually focuses on the content for a change:

Using the AdBlock Plus Extension

Needless to say, there are thousands of ad-driven websites that would be much more enjoyable without the adverts. And if the add-on doesn’t automatically detect and ad, you can always right-click on the object, and choose the option: “Adblock image”. After that, you are left with several options regarding the filter that you will apply. The most appealing of which allows you the automatically block anything from a chosen directory. And since many websites place advert-related files in a single directory, blocking it entirely is easy and effective.

Ethical Issues

There have been arguments made against the Firefox extension, claiming that it prevents the ad-driven sites from supporting their cause, and will therefore eventually become extinct. I’m don’t really agree with such arguments, so I wouldn’t be able to speak on behalf of those who do. You can find an elaborate article from Beep.name about using Adbock Plus. While there are some interesting points on the table, I personally stand by my motto of the free internet, and all the power to the user.

We have already seen that the most important websites are community-driven, and take an open-source approach to sharing the information. Websites owners will have to be a bit more creative with their source of revenue, and perhaps look into other options that are geared towards the user. Without a doubt, it has now become blasphemous to not make the user the center of every decision taken in a website or online application.

So if you do not have Adblock Plus installed, you need to do right away – you’re missing out on a lot of painless web surfing.

There is absolutely no doubt which browser we all should be using, regardless of the OS of choice. The beauty of Mozilla Firefox lies in the ability to customize it and extend it to fit your needs. While there are thousands of free plugins out there, I’ve complied a list of the seven add-ons that I believe any web designer or developer cannot live without.

1. Web Developer
   As one of the most popular add-ons in general, Web Developer is an essential tool, or rather, series of tools. It gives you the ability to break down the CSS of any website, dig into the code, or disabling it altogether. It also gives you control over forms and images across the websites. For example, you can disable all images, view image paths, hide background images, and much more. One of the neatest features, in my opinion, is the resize option, which allows you to automatically resize your browser to predefined dimensions. That way you can check to see how people of different resolutions view the web page. And if you’re anal about your valid XHTML and CSS code, Web Developer comes packed with validators that can check the code for you, even if it’s on your local machine.
2. Firebug
   Ever had to switch between the browser and your HTML editor dozens of times for small changes in your code? Well, whether you want to test out small amendments or drastic changes, Firebug makes it extremely easy and saves you a lot of effort and time. The icon stays at the bottom right of the browser, and all you need to do is click to view the entire code of the page your on, ready to be edited. Any changes you make are immediately reflected on the page, so you can try out all you want and not worry about making permanent changes, or having to switch back and forth. For any HTML element you select, Firebug will list all of the CSS classes affecting it, and you can easily add, remove, or edit the attributes.
3. ColorZilla
   If you’re a designer, and recognize color codes easier than people’s names, then you definitely need ColorZilla. When you’re on a web page and see a color that you need, you either dig into the code and search for it, or take a screen capture and open it in Photoshop or GIMP to use the color picker to identify it. Thanks to ColorZilla, you have the color picker right in your browser and it will recognize all the colors and give you the codes associated. It also allows you to zoom in and out.
4. IE Tab
   We all hate Internet Explorer. It doesn’t take a genius to see what a horrible invention it is. Unfortunately, though, IE6 still represents more than 12% of the market share, and there’s no use in denying it. If you’re running Windows, IE Tab allows you to open the Internet Explorer on your PC as a tab in Firefox. This way, you won’t even need to open the program (and can happily remove all shortcuts), and it has become easier to switch between tabs to see how the page renders on both browsers.
5. Measureit
   Sometimes you need to know sizes of different components on a given page. Or you might want to see what the actual width of a div is, as oppose to what it’s coded to be. Measureit is a neat tool that allows you to take measurements of anything on the page you’re on – could you save you a lot of time and effort.
6. StumbleUpon
   This is an extremely popular plugin amongst Internet users in general. But as a web designer, StumbleUpon could be a very convenient way to surprise yourself with inspirational websites, free design tools, and tons of useful information out there. If you’re taking a break from a task, but want to explore the design globe, then set up your account to show you those kind of websites, and stumble away for a while.
7. Flagfox
   It’s always important and interesting to know where the website you’re visiting is hosted at. Flagfox places a flag of the country hosting the website in the address bar, and by clicking on the flag, you can see all the details, including the Whois information.

That completes my list. Feel free to share your thoughts, and leave a comment to let me know if there is any plugin that I’ve missed.