Line25

Top 5 Web Design Debates That Cause the Most Riots

Read the full post

The world that surrounds the topic of Web Design is home to many debates and opinions on best practices or generally how things should and shouldn’t be done. While many of these opinions are accepted and taken on board by everyone, there are some that end up being split into two opposing camps. One camp will provide an expert opinion for one side of the argument, while the other contradicts with an equally valid argument. Let’s take a look at the five most popular debates; the ones that often end up developing into digital riots with opinions flying like arrows across the vast no-man’s land known as the comments section.

Should links open in a new window?

Camp one says:

Links to external sites should always open in new windows. There’s nothing more annoying than browsing a website, clicking a link and being whisked off to a totally new site, losing the page you wanted to revisit. Internal links should maintain the browser session in the current page, but anything that leaves the site should open in a new tab or window.

Camp two says:

As web designers we shouldn’t take the control away from the user. Whether a link needs opening in a new window is their choice. There’s nothing more annoying than a website taking control of my browser and opening a new tab or window for a link without my permission; if I wanted to open it in a new window, I’d do so! The problem only gets worse with inexperienced computer users, new windows break their trusty ‘back button’.

The mediator says:

In general, opening a new window should be avoided, but is recommended for some situations such as opening a help link in a shopping cart or opening a non-html document such as a PDF. To further aid the usability of your site, use a small icon to identify links that do open in a new window, or provide an options panel that’s configured with Javascript.

Further reading:

Should links use the words ‘Click here’?

Camp one says:

‘Click here’ has been proven to provide a higher click through ratio than descriptive anchor text. ‘Click here’ is a call to action people associate with the web, so it should be used on links to achieve the highest click through results.

Camp two says:

Using the words ‘Click here’ hinders the usability of a site. Instead of being able to see where the link goes and what it does, the user has to read the surrounding text to gain an idea of what’s going to happen. Quality guidelines suggest that anchor text should explain what a link offers.

The mediator says:

A descriptive link should always be used to help increase your site’s usability, accessibility and optimization for search engines. It is be interesting to hear that ‘Click here’ performs better on banner ads, but I’d imagine that bounce rates would also be in favour of descriptive links.

Further reading:

Should Bold <b> and Italic <i> tags be used?

Camp one says:

If your aim is to make a word bold, use the <b> tag. It’s not correct to use the <strong> tag if the word doesn’t have any extra value or importance. Screen readers pronounce the <b> and <i> tags differently, and they are also included in the HTML5 specification.

Camp two says:

Bold and italic tags are often used to make text appear bold or italic, so semantically anything that is being used for visual aesthetics should be reserved for the CSS stylesheet, and not included in the HTML markup. If an element has of specific importance or requires emphasis, the <strong> or <em> tags helps identify it with meaning.

The mediator says:

<b> and <i> tags shouldn’t be used to make text appear bold and italic for the sake of it being bold or italic, this visual styling should be left to the CSS. If a word or passage of text is of high importance, either the <strong> or <em> element would be the best use. The <b> and <i> can and should be used when no other tags fit the situation (eg: <cite>, <var>, <dfn>). An example might be text in another language.

Further reading:

Should a logo be enclosed in a <h1> element?

Camp one says:

Logos shouldn’t be wrapped in a header one, the <h1> element should include a description or title of that particular web page. This is the best approach for SEO, otherwise the primary header for every page would be the same – the company name.

Camp two says:

The main identifier of what website you’re on is the logo. With the <h1> being the largest level of headers, it’s natural to place the logo and site title inside a <h1>. This way, when the page is viewed without CSS, it still holds the same visual structure and hierarchy.

The mediator says:

The definitive use for a <h1> is to describe the subsequent content. Therefore if a particular website has a title or heading that describes the content and appears in the design, this should be placed in the <h1>, otherwise the next highest structural and descriptive item would be the logo.

Further reading:

A site should be viewable in IE6

Camp one says:

Internet Explorer 6 makes up 10% of the market share, so it’s crucial that a website is made to work in IE6, as well as newer browsers. There lots of major corporations who have large networks running IE6, as well as lots of computer users who don’t know how to upgrade.

Camp two says:

IE6 is considerably out of date and doesn’t support the technologies that are present in web design today. It’s poses a risk to the user’s online security and is the never ending nightmare for all designers. Large companies including YouTube are phasing out support, so should you!

The mediator says:

IE6 usage is definitely on the decline, and its death will be quicker with large websites dropping support. Whether you support IE6 depends on your own user statistics. Alternatively, consider offering more basic page styling to IE6 users rather than fixing complicated layout and CSS problems.

Further reading:
Free web shadows pack for every subscriber

Join the mailing list to have new content delivered straight to your email inbox. Every subscriber gets a free pack of realistic web shadows.

Written by Chris Spooner

Chris Spooner is a designer who loves experimenting with new web design techniques collating creative website designs. Check out Chris' design tutorials and articles at Blog.SpoonGraphics or follow his daily findings on Twitter.

82 Comments

  1. Marco says:

    Now THIS was a very interesting read – hands down for that. Very well written too.

    About opening in new pages: target=”_blank” isn’t valid XHTML strict too :) .

    • Thanks Marco!
      I wonder what the ‘proper’ method of opening in a new window is, Javascript maybe?

      • MikeR says:

        You can use rel=”external” in your anchor and then use the following Javascript:

        function externalLinks() {
        if (!document.getElementsByTagName) return;
        var anchors = document.getElementsByTagName(“a”);
        for (var i=0; i<anchors.length; i++) {
        var anchor = anchors[i];
        if (anchor.getAttribute("href") &&
        anchor.getAttribute("rel") == "external")
        anchor.target = "_blank";
        }
        }
        window.onload = externalLinks;

        Much better than any popup window script!

      • Marco says:

        There is no proper way – W3C also thinks HTML doesn’t effect the browsers behavior.

        There are indeed a couple of JavaScript workarounds, but no real HTML solution.

        This is also because HTML is only intended to be presentational – now how it should behave.

      • if you’re already using jQuery on your site, then you don’t even need to add the rel attribute. Just drop this into your document.ready block:

        $(‘a[href^="http"]‘).click(function(e){
        // stop the default action
        e.preventDefault();
        window.open(link);
        });

        It looks for any link which begins with an http in the href attribute. Nice and tidy, although I personally think it’s a little silly to have to go to that trouble to open a link in a new window when the target attribute is already there.

      • I use this when i want to make a link to open in a new window/tab it`s a trick i learned from Chris Coyer(Css-tricks)
        $("a[href^='http://'&quot;).attr("target","_blank");

        but this can`t work in WordPress cause all the links in WP starts with html so maybe adding a class for external links can solve the problem

      • Adam says:

        The proper method:
        Right Click -> Open in New Window

        ;)

  2. ximi says:

    Great summary of some common web design debates.

    I think in the end everybody has to decide how he wants to handle certain things on its own.

    Here are my 5 Cents on the different debates:

    External links should open in new windows/tabs, internal wants not.

    Links should always use descriptive text, especially for screen readers, etc.

    We should use <strong> and <em> (when do we ever make a text bold without it having any importance?)

    Even though I put the logo in the h1-tag up until now I have to go with the other side of the argument. The word or sentence that describes the content of the specific page should be in the h1 tag (e.g. the title of a post).

    And I’m completley against IE6 support. If no one ever starts dropping the support we’ll never get rid of it…

    • ximi says:

      Sorry, I used the strong and em tag in the text above and wordpress misinterpreted it as actual html tags…

      • No problem ximi, just edited your post. I should really make some adjustments to the comments section to disallow HTML tags to avoid such problems!

        Great additions too. As for the <strong> <em>, I learnt recently that <b> and <i> have their place in some scenarios, but for the most part <strong> <em> are the way forward.

  3. Gaya says:

    Very nice read.

    Some interesting points here.

    For external links: I mostly open it in a new tab for the users. mainly because the clients ask us to.

    On click here: I’ve been thought not to use those words as they describe what the user will see very badly.

    I always use strong and em since they are valid and easy to use.

    I have never decided about putting your logo in the H1 tag. I use different methods and they all seem to work fine.

    On the IE6 support. I grew tired of fixing everything for IE6 so I dropped support a while ago, someone has to do it, right?

    Thanks for this article Chris!

    • Thanks Gaya,
      What do you think about the opposing argument on new windows? Where it’s seen as going beyond the user’s control and opens it without their permission?

      I personally prefer to use the middle mouse button to open windows that I want separate. I’ve also seen novice users get confused when their back button breaks after a new window has opened.

  4. Roland says:

    Thank you, Chris. I already knew all that answers and I always had a big battle with my boss about those questions, especially about the last one. Now at least I know, that I’m not the one, who thinks and feels the same.

    At last the war with IE6 is almost over. I actually think, that Microsoft has to be the killer of IE6. They born it and they will have to kill it. Maybe they have to make some kind of update, that will terminate IE6 and then everybody, who still uses IE6 (I really want to beat them with my keyboard) will need to install new browser :D

    Anyway, very good article and very good “food for brains” for amateur designers who want to raise the usability of their websites.

    • Thanks Roland
      I enjoyed writing this one from both sides, and coming up with the middle ground area. It helped give me some insight into the opposite arguments to my personal preferences.

      …Although for IE6 I think everyone is secretly in Camp Two!

  5. jay design says:

    Its great that big websites like YouTube are leading the way for the demise of IE6.
    There are Javascript plugins you can use on your sites that detect whether a user is running an ‘out of date’ browser and will prompt them to upgrade.

    • Definitely, the more large sites that drop support the quicker it will fade out.

      I guess the range of ‘upgrade notices’ could be an argument in itself, there’s some that give you a subtle notice, some that prevent you from seeing the site and some that are styled up like a Windows update notice…

  6. ian says:

    Interesting post for sure, thanks for that.

    With regards support for IE6, personally I think that websites should support IE6, even if the experience offered is slightly different from other, more modern browsers.

    You could also add another one: Should a website work with JavaScript turned off?

    • Should websites work with Javascript turned off is a good one. It’s probably quite widely accepted as a best practice, but I always wonder how many users actually have it turned off.

      I guess there’s some large corporations that have it turned off on their employee’s workstations, along with the ball and chain around their ankles.

      • Matt says:

        Two reasons the site should work with JS turned off.

        One, it’s the right thing to do. Screen readers don’t do JavaScript, and accessibility is important.

        And two, search engines don’t really do JavaScript either. I’d say most sites get a lot more visits from spiders than from blind people, but you design for both the same way.

        • Sebastian says:

          Screenreaders even don’t do HTML ;-)

          But I totally agree with you that important information should not be presented/added by JS. Progressive enhancement and graceful degradation are the way to go. And thanks to ARIA even users depending on assistive technologies can start to “use” javascript-driven websites without any drawback.

      • Alan says:

        I think the statistics show that only 4% of people have JS switched off, i think it was on the W3C site i seen it.

    • c. says:

      A site should *function* in any browser, but I don't think it has to look perfect, or even pretty in older browsers.

      There should never be a question of whether or not a site works without JavaScript, the correct answer is always YES, it should work! I have had to turn off JavaScript on a good number of sites because it was so poorly written that it actually hinders my ability to use the site.

  7. Matt says:

    Nice article.

    I tend to go with a new window for external links, but not for internal. But I’m letting my personal preference dictate that, which I probably shouldn’t.

    Click here is not semantically correct, and it’s bad SEO (unless you’re selling clicks on the next page).

    I always use strong and em.

    The logo should be enclosed in an H1 on the home page only.

    You have to support IE6 at a basic level. Lots of irony in the fact that designers who argue over whether or not we should open links in new windows feel like they can dictate what browser someone should use. So the site has to be attractive and fully functional in IE6, but that’s it. And no enhancements or new features for IE6 users, either.

    • jay design says:

      I’m not sure that its dictation – more like education. Its important that the percentage of internet users still using IE6, (the more casual of which, often don’t even know what browser they’re running) to see the light and upgrade. This in turn is going to improve their online experience regardless of making designers lives a whole lot easier.

  8. Eplehans says:

    Awesome article. Ive often asked myself the same questions. I will defenitively put this in the back of my head in my new project.

  9. Really good article here, Chris. I pretty much agree your points on most of them area.

    I think opening links to external websites is pretty much essential if you don’t want the user to be whisked away from your site reading the article they were on – I hate it when I’m taken away from what I was reading.

    And I definitely think IE6 should be phased out now. I’m all for progressive enhancement. Recently, I actually did a few type based posters on my blog about progressive enhancement to vent some frustration. :-)

    • Bobby Jack says:

      What if I, the user, want to be “whisked away” from your site? I’m clicking a link, after all; that’s what I’d expect. If I REALLY want your site to remain open, I’ll open the link in a new tab. That approach gives control to the user. Your approach, however, makes it impossible for me to browse the way I want to.
      BTW, reports have shown that, far from ‘keeping users on your site’, opening links in new tabs actually have the opposite effect. If you want to keep people on your site, don’t open links in new windows!

  10. dani says:

    For the open links in new tab or window cases, just let users choose the proper way. With the descriptive warning for the open in external links option, surely.

  11. Alan says:

    Great article Chris, and i must admit i have had the whole <b>, <i>, <strong> etc debate before.

    With regards to IE, i stopped supporting it about 3-4 months ago now, and i use an IF statement that displays a small yellow bar at the top with links to all the main browsers. As someone said if we don’t stop supporting it, it will never go away. That being said large companies like BT are still on IE6

  12. Nice Read Chris.

    I open external sites in a new window and I use a Strict DOCTYPE so I use the following simple script inside the anchor tag, which validates:

    onclick=”window.open(this.href); return false;”

    I still test in IE6 primarily because some potential clients may still be using it and I wouldn’t want my designs to render improperly giving them the wrong impression of my expertise.

  13. Robin Cannon says:

    Good article, definitely worth raising the point that there is still debate about some of these issues, even if most people will come down clearly on one side or the other.

    I always think the “Click here” argument is easily resolved, however. There’s nothing to stop you combining both “click here” and informative text within the same link, e.g. “click here to view our portfolio”.

  14. Tom Bradshaw says:

    Nice article Chris.

    I’d only open links in a new window if they were to an external site, I like to use something like fancybox as it’s like a new window but it keeps the user on the site so it’s better for usability, plus it looks pretty cool.

    I’m not the biggest fan of using click here as a call to action as I think people can tell if a link is a link or not – that said I do get told by the powers that be that it needs it, so I give in.

    I’ve always been told to use <strong> tags as that is beneficial for SEO. Likewise putting an image in the seems like a waste, the h1 is vital for SEO thus it should contain your most important keyword.

    Like you said i think we’re all in Camp two when it comes to IE6, even if we keep it quiet ;) I support IE6 like I support the England football team, when it works I’m happy – when it’s not then all hell breaks loose!

  15. Melody says:

    It’s funny, I’ve been debating for the last couple of weeks whether or not I should links that open up in new windows altogether.

    But the thing that I’ve grown to learn about “click here” is its failure to contribute to SEO, and in a world where you only get places if you put yourself out there–everything counts :)

  16. Nina says:

    Very important points you’ve mentioned there, they really help out.
    Thanks :)

  17. lono says:

    great article, external links should always open in a new window!

  18. Great post. These are things I always go back and forth about when designing web pages.
    Thanks!

  19. Awesome post. I find myself in this flamewar on occasion and both sides have valid arguments. Good stuff.

    One correction, in the section about ‘<b> and <i> there’s a typo in the first line of the mediator section.

    Instead of ‘<b> and <b>’ it should read ‘<b> and <i>’.

  20. Rick Nunn says:

    Really nice article Chris. More like this.

  21. Adam says:

    Great post Chris, I don’t know where you steal the time from!

    Should links open in a new window? – Is exactly why the middle mouse button was invented :p

    And IE6, well that can drown :D

  22. I know this list could have been endless, but I think “do designers need to be able to code their designs” would have been in my top 5 :)

    I was recently surprised to see, in a quick twitter poll I did, how many people like external links to open in a new window/tab when browsing: Opening links in new browser windows or tabs

  23. Laura says:

    I had been a bit ambivalent about use of H1, until I read (Andy Clarke possibly) that using H1 for site name/logo meant that it had no distinction between all the pages on the site.

    I look at it this way: The site name is like the title of a book, and H1 is for primary chapter headings. You would not call the book title a chapter, so you should not call the site name/logo an H1 element.

    ymmv of course….

  24. Love the article, and it is a strong debate but on IE6, I fully agree that it needs less support for it. As less browser support comes for it, people will just have to get a newer version and browse with that.

    As for h1, yes I think it should be an image. it goes without question.

    Very good read and I would recommend it to a lot of people. :D

  25. axisadman says:

    As usual Chris a well written and thought provoking article.

  26. Zach Waugh says:

    Interesting article. One thing to consider regarding IE6 support is those stats (10%) are only for visitors to w3schools.com, which is naturally going to be web developers/designers and more likely not to use Internet Explorer. I believe the actual market share for IE6 is around 20% (source: http://arstechnica.com/microsoft/news/2010/02/ie8-chrome-have-most-momentum-in-browser-wars.ars). Regardless, I’m in camp two, time to stop supporting IE6.

  27. Tedi says:

    Great article Chris! I cannot wait until ie6 is dead!

  28. Tedi says:

    Great article Chris, I cannot wait until ie6 is completely dead!

  29. Jennifer says:

    I enjoyed this! I’m a new follower and new fan. I agree with most of the comments back as well, its nice to be reassured that what you have been doing is the way others are doing it too.

  30. Very interesting. I’ve definitely been on both sides of each of these arguments before. I used to be on the support IE6 side, but recently dropped support for it. If Microsoft isn’t going to support their own product, why should I?

  31. I think opening external links in a new window is the best way to go. It’s definitely more intuitive for the user, because they are leaving the construct of the current site and viewing another. Sure, there will be a “back” button problem for some, but I think most people are used to this way of thinking and will merely close the new window or tab when they’re done viewing the external link.

    As for ie6, I started the beginning of the year by informing all my new clients that I would no longer be supporting it. Down with ie6, I say! ;-)

  32. c. says:

    I used to be a frequent installer of older Windows OS, so I was always thankful for websites that worked in the default installed browser. Windows 2000 comes with IE5.0 and cannot upgrade beyond IE6.0, Windows XP likely comes with IE6.0. If I'm trying to download drivers so that I *can* upgrade to a better browser, I'm going to be a little upset when I get a "fuck you, upgrade your shit" message instead of giving me access to the things I need.

    Yes, Win2k is considered an "expired" OS, but Microsoft has extended support on it multiple times (I think it is still in extended support, as in you can still get service packs, etc.). I have heard that there are a fair number of businesses and/or government agencies still using Win2k because it can work on cheap, elderly machines without difficulty.

    Certainly make it functional, make it usable in IE6, but don't lock people out.

  33. - Our clientele, due to corporate restrictions, use ie6 up to 60% of the time on some sites we maintain. ick. so we are stuck until the fleet goes from XP to 7, which will happen in the next 24 months. Then we can ditch it entirely.

    - Links to PDFs = new window

  34. Rebecca says:

    Good article. I am really looking forward to IE6 disappearing.

  35. I'd have thought the fluid vs fixed layout debat was has more than bold vs strong.

  36. Matthew says:

    Thanks for sharing this great article.

    I tend to use this script to open new windows, works well with wordpress too!

    $(function(){ $('a.new-window').click(function(){ window.open(this.href); return false; }); });

    Once you add the class "new-window" to a link, it will open as a pop up window.

    I hope you find this handy!

    Cheers!

  37. Matthew says:

    B.T.W – You need Jquery installed in order for the above to work.

  38. Manuel Velazquez says:

    Why do we, as web designers\developers, feel the need to recreate the browser's functionality? First it was the back button, then the zoom/enlarge function, now its the open in new window option. The browsers already have a back button, zoom feature and for new windows users can click with middle button or right click and select open in new tab/window. My opinion is that all links should open in the same window, and let the user decide otherwise.

    As for IE6 support, I charge extra if a client wants it, explaining the reasons for that.

  39. sideshow says:

    How Flash use is not on this list can cause a riot in itself…

  40. Very original article! Glad to see you were thinking outside of the box on this one …

  41. The links opening in a new window debate is killer. I frequently find myself having to tell others that it really should be up to the user, but then again it does have it's benefits to link other websites to new tabs.

  42. Great article, Chris. I will refer people to this article every time they want to start one of these debates :P

  43. BigM75 says:

    the article is great, nice

  44. WC says:

    I despise links that use javascript to open a new window and don't have the URL in the href. THAT takes control away from the user completely.

    On the other hand, just having the anchor's target set to open a new window allows the user to have their browser settings make it do what they want. If they want a new window, new tab, or just use the same window, it's the user's choice.

    For usability's sake, though, external sites should always default to opening in a new window if the user hasn't told their browser to override it. This is the kindest solution for the non-savvy.

    IE6 support is definitely a business decision. If it's a personal site, I don't bother with it. If it's a site that expects sales, it's still pretty necessary.

  45. BryanSamo says:

    I find this discussion regarding IE6 fascinating. Yes, developing for it is annoying. Yes, users should upgrade and it's annoying that they don't. I work for a very large e-Commerce concern and our conversion rate in IE 6 is around 7%. Not a large percentage, but 7% of sales is a significant amount of revenue to just ignore because it's difficult to support the browser that our customers are using.

    Links should never open a new window, unless the user is in checkout or opening a PDF file. That's the whole point of navigating the web. A user may want to have a stream of sites that they visit and be able to use the back button. By forcing new windows, we are controlling how they browse. Clients like to open a new window on external links because they want to keep users their own site.

    The works "click here" should only be used on sites created in 1995.

  46. Jose says:

    Good article. I appreciate the insight.

  47. Amberly says:

    Hey Chris

    Great concept. Beautifully executed

  48. Jenna Molby says:

    great points, thanks for sharing.

  49. nedi says:

    Great! I love how simple yet so creative these are.

  50. Kieran Smith says:

    For the life of me, I cannot figure out why if people want a link to open in a new window, *they* don't open it in a new window. It will take two seconds to learn how to do it (right click, middle click, control click, etc) and then we wouldn't even be having this conversation. =)

    I understand the marketing perspective. I guess I'd just rather educate folks how to open a link in a new window than irritate the folks who do know how by taking away their ability to make their own decision. Keeping someone on your site longer won't make them buy something, in my opinion, especially if you are irritating them in the process.

  51. virande says:

    The debate between web design and content is a never ending one. While many feel that content is the main part of a website, others are of the view that it is the design which holds more importance. The answer is that both are needed for a successful website.

    Thanks.

  52. Alex Mcvitie says:

    I think the user should have the choice to open a new window, I think its maybe the users you have to think about, what sort of users do you have, will they understand a new window has opened ?
    This might sound a bit silly but I definitely think its worth thinking about.

    I personally think the user should have the choice.

    As for "click here", Again depended on the users knowledge and how well your css has styled links ?
    I personally think if the css is done right it should be obvious for the user and give some sort of description of where the links going.

    "<strong> or <em> tags helps identify it with meaning. " very true I agree.

    I've always put the logo in <h1> even before I knew why lolz…

    I have dropped support for IE6 and I've got a sneaky suspicion that most designers will do the same (if they haven't already) and with big companies beginning to follow suite and drop support I don't see IE6 being around for too much longer,and thank god to be honest, I've lost far too much sleep over fixing bugs for IE6 :(

    Great post by the way Chris really beginning to become part of my routine reading your blog :) great work.

  53. Kai Köpke says:

    Great article!

    IE6 Support depends on the project and client customers for me. But if supported, its not more than a base support. Layout and important functions have to work – not more…

    Greetings from germany :)

  54. Martin says:

    I feel that if links are external to your site then they should open in a new window

  55. Thanks for the great article. It's good to read about two different solutions to the same problem. I'm sure I will use some of your tips in my next website.

  56. ben says:

    Regarding to "Should links open in a new window?", well, it also depends on the culture of the visitor. Most chinese visitors would like to open new window for any clicks.

    I also don't know why, but they just like it.

  57. Great article can see both sides apart from the IE6 I understand it but bloody hate it :p

  58. Danilo Ramos says:

    Uhuu ! Very Nice !

  59. Jacqueline says:

    Great post. I got annoyed at the first point, then laughed at myself.

  60. Harpal Singh says:

    Thanks for posting.so nice and mind blowing post

    Website Designing Services India

Sorry, comments are now closed