archive-com.com » COM » S » SVENNERBERG.COM

Total: 274

Choose link from "Titles, links and description words view":

Or switch to "Titles and links view".
  • REST | In usability we trust
    whole lot easier Historically we ve only had to deal with one platform the desktop computer At this day and age where most of us have multiple devices and are always connected to the Internet this no longer holds true Building software have become more complex way more complex Continue reading About me My name is Gabriel Svennerberg and I m a UX Designer Frontend Specialist and Author from Sweden

    Original URL path: http://www.svennerberg.com/tag/rest/ (2016-04-28)
    Open archived version from archive


  • Stop Building Single Applications and Start Building Eco-systems | In usability we trust
    typically mobile tasks See 40 of people use their phone in the bathroom and other interesting facts Building multi device eco systems What this means is that we can no longer just think one application on one platform when we build software to solve a problem We need to consider the bigger picture How to solve that problem in a wider context The future of computing lies in building eco systems of applications for different devices that solves a particular problem But having to provide software on multiple devices How do we design build and maintain these without getting overburdened by the complexity and diversity Strong APIs I ve been thinking long and hard about this and the answer I ve come up with is this Build a strong and easy to use API with an eco system of simple clients using it The trick here is to put as much of the complexity as possible in the API and make it as easy as possible for the clients to use it This way the API is the piece you invest most in and that will live for a longer period of time It will provide a foundation on which you can build relatively simple clients around The core of my thinking is that you need to make it as easy and painless as possible to build the client applications New technologies comes and goes who knows what the next wave of connected devices will be Smart watches smart glasses or something else Whatever it is we need to make sure that we can be on that platform with relative ease without having to start from scratch What will the next wave of smart devices be Will it be Smart glasses Smart watches or something else Go REST I ve been talking broadly about API s here but what I advocate is to build a REST API REST is not a technology it s an approach It relies entirely on HTTP for communication so it s virtually technology agnostic This is good It doesn t require you to use a specific technology to build clients No matter what the technology they will likely be able to communicate via HTTP Keeping it technology agnostic is a key aspect Given that your API will live for a longer period of time you can t predict what new tech will be introduced and you can t predict which type of clients you will build a couple of years from now Use a simple Data Format Just as you should invest in a solid API You should invest in a robust data format The format should be simple enough to not add a lot of overhead but capable enough to transfer fairly complex data models I ve found JSON to be a good candidate for this It s simpler than XML or SOAP shudder but can communicate lists and nested objects An additional benefit is that since it s really a JavaScript object it

    Original URL path: http://www.svennerberg.com/2013/05/stop-building-single-applications-start-building-eco-systems/?replytocom=1443 (2016-04-28)
    Open archived version from archive

  • Javascript | In usability we trust
    Svennerberg 39 Comments The Google Maps API has evolved to version 3 This version is a complete rewrite and focuses primarily on speed The new API also features new ways of using it This article is the first in a series exploring version 3 of the Google Maps API This first article will take a look on how to create a simple map and explain some differences from the previous version Continue reading Dynamically Toggle Markers in Google Maps June 2 2009 Gabriel Svennerberg 9 Comments This article explains how to dynamically toggle the visibility of markers in Google Maps as well as how to deal with an annoying bug that occurs when trying to do this while using an utility library like the MarkerManager Continue reading Google Maps API version 3 is released May 28 2009 Gabriel Svennerberg 0 Comments Yesterday a new version of the ever so popular Google Maps API was released In the new version the focus has been on improving speed especially on mobile devices I ve been fortunate enough to be part of the beta testing and has been able to provide feeback directly to the developers So far I think they ve done a great job even if there s still more work to be done Continue reading Announcing MapTooltip March 31 2009 Gabriel Svennerberg 20 Comments One of the shortcomings in the Google Maps API is that there s no easy way to add tooltips to polylines and polygons That s why I felt inclined to build an extension to Google Maps that adds that functionality MapTooltip makes it possible to add tooltips to any kind of overlay It s even possible to have HTML inside it and to style it to fit your design needs Continue reading Updating images with Javascript March 17 2009 Gabriel Svennerberg 3 Comments This is a quicktip on how to update images on a webpage that retain the same filename but is periodically updated without having to perform a full page load Continue reading Non modal alert with jQuery March 8 2009 Gabriel Svennerberg 4 Comments In circumstances where you want to notify the user of something like for example that some information have been saved a non modal alert is an excellent solution It gets your message across without being intrusive and without the need for uneccesary user interaction In this article I will describe how to create it with the help of jQuery Continue reading Global variables in Javascript February 12 2009 Gabriel Svennerberg 13 Comments Global variables are evil Although possibly nifty for very small programs it quickly clutters the global namespace and increase the risk for name collisions as are program grows larger The risk for collisions are even greater when using different libraries and widgets Continue reading Working with Info Windows in Google Maps February 5 2009 Gabriel Svennerberg 54 Comments Having Info Windows in a Google Maps is a powerful way of displaying information about a specific point or object

    Original URL path: http://www.svennerberg.com/tag/javascript/ (2016-04-28)
    Open archived version from archive

  • Future Proof Your Methods With Options Objects | In usability we trust
    hence the name method Anatomy of a function Objectify Ok so how do we get around this issue The answer is simple Use one options object instead of several arguments It solves all of the problems listed above Check this out you don t have to remember in which order to supply the arguments no need to supply all arguments on all calls easy to provide default values easy to expand the number of arguments without breaking functionality Ok so how s this done then Let s take a look at the code for constructing the method var bio function options var id options id 1 name options name Empty description options description Empty The first thing you ll notice is that instead of taking multiple arguments the method only takes one called options But then you might be wondering what s going on inside the function Inside the function is a check that make sure that the object has certain properties and saves those into local variables If a property is missing a default value is provided Calling the objectified method Ok so now you know how to create the method but what about using it Let s look at some code Creating an options object var options id 1 name Luke Skywalker description Young talented man Calling the method bio options In the code above an options object is first created and populated with the values that you want to pass to the method The options object is then used as the single argument when calling the method Note The options object is created as an object literal which is a convenient way of creating objects on the fly Extending the object Now what if you need to add another argument No problem just change your method to embrace the new argument You could do it in one of two ways By providing default values By checking if the property exists and react accordingly The first way is how it s implemented in the example so you just need to follow that same pattern The other way is sort of the same thing but a little different Instead of providing a default value you can simply check if the property exists or not when you need to use it Let s try that with a new argument profession var bio function options var id options id 1 name options name Empty description options description Empty if options profession alert name is a profession else Some sort of fallback Now even if you call the method without supplying the profession property the code won t break Since we re checking for its existence the method will handle it gracefully This means that you don t have to worry about breaking existing functionality Pro tip You could make the call to the method more terse by creating the options object on the fly when calling the method like this bio id 1 name Luke Skywalker description Young talented man That

    Original URL path: http://www.svennerberg.com/2013/03/future-proof-your-methods-with-options-objects/?replytocom=1448 (2016-04-28)
    Open archived version from archive

  • CSS | In usability we trust
    Web Design is an enjoyable read and delivers some interesting advice on how to leverage your designs with the power of CSS3 Continue reading Ultimate Site Logo 2 For real this time November 21 2008 Gabriel Svennerberg 2 Comments After writing my first article on the subject Ultimate Site Logo I ve come up with two significant enhancements With the original solution there were two major flaws The first one was a semantic one and the other one a more obvious and technical one This time around I think I ve got all the details right Well if that s not Kaizen what is Continue reading Imagemap rollover September 1 2008 Gabriel Svennerberg 43 Comments Imagemaps was very popular in the early days of webdesign but seem to have fallen out of grace Probably due to accessibility problems and the rise of CSS based designs I think that it still has it s place when used properly and one being aware of it s potential accessibility problems In a recent project I was building a map where different regions of a map would highlight when you hover with the mouse over it Using an imagemap in combination with CSS and JavaScript seemed like the natural way to do it I thought that to actually code this solution would be pretty straightforward but soon discovered some peculiar quirks I also couldn t find any information about this so I thought that I d share my experiences with you Continue reading Ultimate site logo June 25 2008 Gabriel Svennerberg 4 Comments To have a good site logo is important It s one of the things that distinguish your web site from everybody else s It s also a design element that exists on all pages within your site Naturally you want it

    Original URL path: http://www.svennerberg.com/tag/css/ (2016-04-28)
    Open archived version from archive

  • HTML | In usability we trust
    of the more advanced ones In this article I will show you the power of CSS Combinators A toolkit that lets you combine the basic selectors to create more powerful CSS selectors Continue reading Click Areas for a Brave New Multi Device World January 8 2013 Gabriel Svennerberg 0 Comments Have you ever been browsing a web site on your smart phone or tablet and found that on some sites the links are so tiny and so tightly packed that it s near impossible to click the right one Continue reading CSS in the Head December 5 2012 Gabriel Svennerberg 0 Comments When optimizing a page you re obviously thinking about where to add different assets on it Stuff that is needed up front is placed at the top and stuff that is needed later can be placed further down After all we want the page to show something as fast as possible Continue reading Separation of Concerns November 7 2012 Gabriel Svennerberg 0 Comments Have you ever found yourself in a situation where you have a site where the HTML the CSS and the JavaScript are all tangled together and it becomes a nightmare to make even the tiniest

    Original URL path: http://www.svennerberg.com/tag/html/ (2016-04-28)
    Open archived version from archive

  • The Power of Combinators | In usability we trust
    980px margin 0 auto Affected elements with the ID Selector applied So far no surprises You re probably already familiar with these selectors and with that brief recap out of the way lets move on to more intesting things namely the CSS Combinators The Combinators The combinators are used in conjunction with the basic selectors As the name suggest they enable you to combine other selectors in different ways so that you don t have to have a class or ID on every single element that you want to target So why is this good then Well it serves you well to keep the HTML and CSS as separated as possible The least amount of extra attributes you have in the HTML the better It will not only reduce the page size but also make maintenance easier To learn more about the benefits of keeping the HTML and CSS as separate as possible read the article Separation of Concerns http codecraftingblueprints com post 15732181414 separation of concerns which explores the benefits in greater deatail Now lets move on to the combinators CSS Combinators There are four different combinators in CSS and they each bring their own unique benefit The Descendant Selector The Child Selector The Adjacent Sibling Selector The General Sibling Selector The Descendant Selector The Descendant Selector is just two or more selectors after each other separated by whitespace If for example you only want to target the p elements inside of the div class facts you could write facts p color ff0080 With this code only p elements that lives below the element with the class facts are targeted Affected elements with the Descendant Selector applied The Child Selector The Child Selector is a bit more specific than the previous one It looks almost the same but you add a greater than character between the two selectors Doing this you make sure that only the elements that sits on the level immediately below the first selector are targeted wrapper p color ff0080 Now only the p elements immediately below div id wrapper are affected Affected elements with the Adjacent Child Selector applied This is great for dealing with deeply nested structures where you want the styling to only target one level A common use case is when styling drop down menus These are often constructed with nested lists ul where you want the lists to have different styling depending on which level they appear The Adjacent Sibling Selector The Adjecent Sibling Selector targets only elements that s immediately after an element on the same level in the DOM tree It s used by inserting a plus between the first and the second selector h1 p color ff0080 Now only the p that s directly after the h1 is affected Affected element with the Adjacent Sibling Selector applied A common use case for the Adjacent Sibling Selector is when you want the first paragraph in an article to have bigger text than the rest of the paragraphs You could

    Original URL path: http://www.svennerberg.com/2013/01/the-power-of-combinators/?replytocom=1485 (2016-04-28)
    Open archived version from archive

  • Usability | In usability we trust
    November 14 2008 Gabriel Svennerberg 0 Comments On World Usability Day on 13 of November we gathered a bunch of people to put focus on usability The event which we called A nice cup of coffee on Usability Day was held at my former employer Visma Spcs office in Växjö Chris Jangelöv was host for the event Here s some pictures taken by from the event along with some comments The pictures are taken by Ola Karlsson Thanks a lot Ola Continue reading A Nice Cup of Coffe on Usability Day November 10 2008 Gabriel Svennerberg 0 Comments This Thursday November 13 is World Usability Day It s an event that takes place at different locations around the globe each year to put the spotlight on usability in our daily lives Here in Växjö Sweden we re going to celebrate this with a get together where I m going to talk a little about usability in general and a few others are going to talk about specific usability problems and solutions Other than that we re just going to have a nice cup of coffee some cookies and a nice chat The event takes place at Visma Spcs at 15 00 and will last for about one and a half hour If you re in the area and are interested in participating sign up by leaving a comment or by contacting me through this blog s contact page It s completely free of charge but you have to let us know in advance that you re coming Where s me back button September 25 2008 Gabriel Svennerberg 0 Comments My Firefox installation got upgraded to 3 0 2 today And to my surprise the back and forward buttons is gone Continue reading The use of buttons in web forms September 21 2008 Gabriel Svennerberg 27 Comments Action buttons exists at the bottom of almost every web form They re so common that we often doesn t even reflect on how to actually design them By gathering information from a few of the great minds in the field of web usability and also from my own experiences I ve tried to come up with a set of best practices on how to design them efficiently Continue reading Web Form Design Book review September 14 2008 Gabriel Svennerberg 6 Comments This book has a very narrow scope It s all about how to design web forms And when you think about it why not Most interactions with websites and web application happens through the use of web forms so why not make sure to design them as effectively as possible Studies have shown that completion rates of forms can be increased by 10 40 percent by designing them using best practices If the form is the check out form on an e commerce site you can easily see that this potentially can be a good investment Luke makes the observation that most forms suck Therefor it should be every designers mission to

    Original URL path: http://www.svennerberg.com/tag/usability/ (2016-04-28)
    Open archived version from archive



  •