“Apps” when the term first became… well… massive, referred to what is called native applications. These native applications include those which come preinstalled on your device, which are often hard or impossible to delete, as well as all of those that you can find in an app store. The require being downloaded, and having their information installed onto the device to work.
These apps are an incredibly popular way of doing things, and for certain tasks they’ll remain the fore-runner for their unique features. The problem is that they’re very weighty, and use up a great deal of your limited hardware memory. The solution is mobile web apps.
Mobile web apps use little memory at all, and for the most part, or at least as far as the viewer is concerned, act exactly like native apps. This is swell, since most of the popularity of apps depends upon their appearance and usability.
There are still some limitations for the mobile web app against its native equivalent. First off web apps always depend on having, you guessed it… the web! On the other hand native apps can offer us plenty of entertainment when we find ourselves without connection, which is often the time we most like to turn to apps for fun.
Games, language tools, or your whole music library can be stored in your phone, at the cost of much memory, but without the reliance of an internet connection to function. This is one fundamental downside to web apps at present that will take some problem solving.
Another issue is with integrating existing features on your phone for the use of the app. Language tools can access your microphone to check pronunciation. Other apps might require access to your camera / photos to work, and without these features would lose their purpose.
These are all still barriers to mobile web apps breaking away from native apps, but no doubt, new breakthroughs to report on won’t take long.
Every year (or maybe more like month) the best practices for web development, and in particular mobile web development seems to transform. Just like a teenagers fashion sense, the mobile web is constantly changing, still laying down the foundations for its adulthood.
This time rather than giving an overview of what you should concentrate on, I’ve composed a checklist of current worst offences to make against mobile web development best practices, dare to see if your website is guilty of any?
It really doesn’t go down well for me when first visiting a web-page if i’m immediately bundled by demands to register, or sign-up for newsletters, or anything else like that. If your site is informative or entertaining the user will know to return, try to be more subtle.
This means all types of clutter people, let’s break it down. Menu’s should be minimal, even more so on the mobile web, you do not need a top menu, a left margin menu, and submenus spilling out from all directions all over the content. It becomes difficult to navigate, and the user will lose the will to even try.
This also goes for design. You want the user to easily be able to look around your site, for as long as possible, so don’t deter them with bright blinding background designs that detract from the content. Clean and simple is definitely the way forward.
If you have a song or video to show your visitor, please be polite enough to allow him or her to choose if and when they watch or listen to it, thanks. Nothing’s better than when a full volume advert for athletes foot comes blaring out from the phone speaker on a busy commuter train at 8AM. Do Not force your multimedia content onto your viewer, or they might not come back.
Because the industry of web design – and all associated fields – are still so young, they remain in a stage of intense: growth; development; learning; experimentation; and excitement.
As such, and with the nature of the web, everything is generally shared openly in an enormous group amalgam of great minds from all over the world, accelerating the growth and development, and fueling the excitement factor.
This in sum is why the way we use the internet is evolving so quickly, and why you find so many articles trying to keep track of the evolution. It also explains why you so often find the developments of 12 months ago now being referred to as out-of-date.
All of this also helps to explain why keeping updated on trends for mobile website development best practices can give your business a professional edge over your competition.
You’ve seen hundreds of these things by now, but might not have known that they had a name. Ghost Buttons are the new(ish) little icons that act as buttons for changing page on a website. The great things about ghost buttons are, firstly that they allow for elegant navigation without the need to clutter the screen with more menu options. Secondly they allow you place navigation buttons wherever you like on your page, including superimposed over high-res images with covering them.
There is a rising number of websites using hidden menus which only show when you hover the mouse along the top, left, or right of the page. This is another great development to help unclutter the page, and create a stunning user experience. It applies both to the web and the mobile web, but having extra space on screen is particularly useful for the mobile browser.
Scrolling kills Clicking
Recently the prominence of scrolling has taken big strides past clicking. Again this applies to all web browsers, but it’s particularly effective for mobile users. Scrolling left or right can navigate through pages or images, eliminating the need to aim and click the mouse, or pulling your winter glove off to click the tiny icon with your trembling finger.
The significance of the mobile web – as you may well have heard – is growing, and it’s growing quickly. Though after a few decades of build-up, the existing content on the web is in the majority of cases not fit for mobile or tablet browsing.
Mobile, tablet, or other browsing devices will still be able to access the page most of the time, but the layout and content will not be optimised for user, and the likelihood is that, disappointed, they will end up looking elsewhere. For the website owner, this is money down the drain, and will reflect poorly in business performance, how important this will be over the next few years is anybody’s guess, but what’s certain is that it will become only more and more relevant and important.
But what will a developer actually do with your existing website to get it ready for the mobile web? Well there is a great deal to think about, and not all is relevant, though it’s handy to stay on top of the basics, so here are a couple of great points to start with.
The viewport is the area of the content that the user will see, and it was introduced as an element of HTML5 using the <meta> tag.
Typically when a user clicks onto a webpage which is not designed to be responsive, he will find that the layout of images and text have become confused, and will likely need to constantly cycle in and out of zooms to effectively navigate the page, and to read the content as it was intended. Setting a viewport is basically selecting exactly where everything will land when the page is visited by devices with different screen sizes, thus the design responds to the audience for optimal appearance and usability, easy!
Finger / Thumb friendly navigation
Another important first step for responsive website development is that the cursor needs to be finger or thumb friendly. We’ve grown used to using accurate mouse cursors, but now menus, links, drop down menus, and any other clickable elements need to respond to a larger, less accurate clicker. The human hand.