Mobile and Tablet Web Development – One Site Fits All
When the “World Wide Web” was introduced in 1990, it was only accessible via personal computers. Today, the web can be accessed thought a range of devices – laptops, tablets, mobile phones and even smart fridges and windows as demonstrated at CES 2012 in Las Vegas. Contemporary websites come in different shapes and sizes and provide a vast amount of information on practically anything one can think of.
With Internet surfing becoming a natural part of life and considering the ever growing number of browsers, web developers and designers have had to tackle a number of issues, for instance getting sites to render perfectly in different browsers, and supporting mobile browsing. Mobile Internet consumption has increased dramatically, with half of the current UK Internet users accessing the web via mobile devices. Following the trend, web designers and developers have adopted a ‘Responsive Web Design’ approach with the use of CSS3. In short, it makes websites automatically adapt to the elements of the users’ viewing environment: be it screen size, Operating System or device orientation in space.
Let’s take a look at the Earth Hour website as an example. If opened on a laptop, the users will see the full website. Accessed through a smartphone or tablet, however, the site gets resized while keeping all the relevant information in place. You may also notice that while the main navigation has reduced to a drop-down to save space, it still complements the site perfectly.
A quick note: if using media queries, the website may not fit all mobile devices unless developed with a fluid layout (which should become a standard when creating responsive websites), since they differ in screen sizes and platforms. Although not yet finalised by W3C, the international consortium on web standards, CSS3 has been used by developers on live projects as the technique supported by “modern” browsers (e.g. Mozilla Firefox, Chrome, and Safari – all with the use of prefixes).
An alternative to media queries are Touch Optimised / Web App frameworks such as jQuery Mobile and Sencha. These frameworks are built specifically for touchscreen devices and bring back some user interaction. The framework is cross-platform compatible, so there’s no concern about styling the website for individual devices. The only downsides – this would be a separate development from the standard HTML CSS site to which users would have to be redirected, and the result may not look as slick as the desktop version: the design capability of the framework is quite limited. It would, however, work flawlessly across a galaxy of touchscreen devices.
Overall, due to the popularity of mobile browsing, the need for responsive web design (mobile design) is a must for a customer-facing site: not only does it help market the company, it also shows the company is meeting the needs of its browsing customers.
Like this:
Why the browser vendor -prefix- saved the web
The following post is written by and reflects personal opinion of Ben Fowler, UX Engineer at Adgistics.
In a world where new CSS specifications are constantly evolving, the existence of browser prefixes has never been more important. Despite the flexibility we now have, some developers are complaining of having to repeat themselves in their code to achieve the same effect in several browsers, and that there should be just one ‘development’ prefix for all browsers. So why wouldn’t this work? Surely we shouldn’t have duplicate code?
A brief history
Back in the late ‘90s, the varying browser implementation of certain CSS properties was such that a site could render perfectly in one browser, but completely fail in another; hence the classic “This site works best in….” plaques found on many landing pages back then. Out of this and several other problems, the ‘standards’ and ‘non-standards’ (quirks) DOCTYPE implementation was born, which arguably saved the use of CSS on the web.
The generic ‘development’ prefix
If browser vendors were forced to use the same development prefix for a property i.e. dev-border-radius, developers would be forced to accept each browser’s interpretation of the property.
But if one browser implementation is different from another browser and breaks a site layout, the only options available are either to sniff out (not nice) the offending browser(s) and hide the property or abandon the use of the property altogether in all browsers, until the browser(s) changes its implementation.
Of course there’s every chance it won’t ever change and developers decide to abandon the use of the property altogether thus securing its journey into obscurity, never to be seen again.
The browser specific prefix
Browser-specific prefixes allow browser vendors to develop and potentially fix bad implementations, with the ability to leave any flawed behaviour behind in the prefixed version of the property.
During a property’s specification development, it allows developers to serve the property only to browsers which implement the behaviour correctly, preserving graceful degradation in other browsers. Whilst this might seem like an unnecessary duplication of code, it ensures the best possible development of the property implementation in all browsers.
Conclusion
Generic prefixes stifle property specification development, they offer developers limited flexibility, and potentially create more work in cross browser support.
Browser-specific prefixes save developers time and effort, and ensure healthy development of new property specifications which have seen the dramatic rise of CSS3 and its cross-browser support. Now there are even solutions that automatically add the relevant browser prefixes, allowing developers to code prefix free, without duplication of code.
How we use version control at Adgistics
The following post is written by and reflects personal opinions of Stephen Binns, senior developer at Adgistics.
In my time as a developer I’ve had the arguable pleasure of using a number of version control systems, from SourceSafe to Subversion. Most of these tools generally got in the way of what I was trying to do and resolving problems with them was less than carefree. After switching to Mercurial here at Adgistics, I haven’t looked back.
First of all, branching with Mercurial is dramatically simpler, meaning you’re more likely to use branches and therefore can isolate your commits from the main development stream as well as being able to merge changes from it into your branch. This really works for our agile approach as each story / unit of work has a branch associated to it. By having these branches we can identify issues quicker since it is much easier for our code review process to look at an individual branch.
Merges are simpler as well; I used to get the fear inside me when faced with a svn merge. With Mercurial you merge so often and (mostly) smoothly, it makes you realize how much the other tools were getting in the way.
Cloning is much quicker. If I want to get started on a new project I don’t want to wait for a good 20 minutes to pull the changes on my machine; that’s just wasting my time.
Mercurial is distributed. If I’m on my laptop I want to be able to commit things as I go along, not wait till I have a network connection to the office. With Mercurial I can commit all changes to my local repository and push them up when I get in.
I embraced the command line much more. With svn I tended to use the, admittedly very good, TortoiseSvn rather than the command line version. With Mercurial, the commands are so simple it’s often quicker and easier to type them. I still use a GUI for some of the actions I need and thankfully TortoiseHg is more than enough for my needs.
A few more ‘fluffy’ reasons why I like Mercurial include the web interface for the repositories. It allows me to view a repository without checking it out. The Visual Studio 2010 plugin VisualHg works great. It informs me of what I’ve changed and keeps track of file moves and renames, which used to be an utter pain in svn.
Overall, Mercurial has been a fantastic addition to our development process and works great with our build system which is built upon Hudson and also our code review tool – ReviewBoard.
Adgistics Digest #12: What you should have read in December
Although December is traditionally a month of retrospectives and forecasts, I have decided, not least because of the advancing season, to resist the temptation of presenting either and make the last edition of last year as packed with fresh news as the previous eleven. December is a month we expect to be filled with positive, pleasant and non-earth-shattering news. Like the public launch of the BBC’s Your Paintings project. Admittedly, the month also saw the collapse of one of the most anticipated mergers in recent times but who pays attention to such trifles when Santa is abseiling down the chimney?
Story of the Month
New Horizon
I could write a few pages on Adgistics’ quantum leap of 2011 – huge clients wins, new verticals, new market segments, and so on and so forth. However, since we have agreed not to look back and instead concentrate on things to come, I am very pleased to pre-release the news that Adgisitcs will be establishing an Australian presence some time in the next few months. Australia is a young and growing market and from working with our first client from the “land abound in nature’s gifts”, Kubota, serviced in collaboration with the creative agency: redhanded, we came into touch with local businesses and were overwhelmed by their extraordinary interest in Adgistics’ technology as well as our business approach. We are extremely excited and look forward to enlarging our footprint with great anticipation.
Marketing
Silly little claims
Good marketeers are expected to be creative. At the end of the day, it is in the job description – we create stuff. Usually a piece of copy or an image, should the muses be gracious – a new product perception. On a very rare occasion the best of us get to think of something that consumers pick up and actively promote themselves. December celebrates two great teams: Del Campo Nazca Saatchi & Saatchi, who seem to have developed a working photoblocker for South American beer brand Cerveza Norte, and Air New Zealand, who showed us that great promotion is not about global media campaigns with exorbitant budgets.
https://byebyerico.com/
Sore losers
Sometimes it takes more than an average amount of restraint to stop us from jumping up, hands lifted in dismay, shouting something along the lines of “come on! Really..?!” The industry is full of examples of bitter rivalries – Pepsi vs. Coke, Mac vs. PC, not to mention the legendary BMW-Audi-Subaru-Bentley standoff; picking on the competition comes with the territory. Instead of embarrassing itself by publicly accusing MacDonald’s of “breaking the rules of comparative advertising by degrading the Burger King brand” the chaps from sunny Florida should have learned from the ad and fought bullying with a touch of creativity.
http://goo.gl/y4TeB
Come on! Really..?!
Remember the humiliating Facebook-Google scandal of May 2011? Burson-Marsteller, the crisis management PR experts hired by the Social Media giant were caught trying to pay journalists to criticise Google’s Social Circle. Well, guess what? Now the PR gurus have someone to discuss their woes with. Unbelievable as it seems, Bell Pottinger, the legendary spin masters whose list of patrons includes such gems as the government of Belarus, Augusto Pinochet and Ali Abdullah Saleh, were caught being very creative on Wikipedia. To do something so blunt is shockingly unprofessional on its own, but to be caught boasting about it? Hilarious.
http://goo.gl/6WtH6
Technology
Blue Chip Facebook
A possible IPO for Facebook, the company that has long become the symbol of the Social Media economy, has been discussed for ages. A year ago we rather sarcastically commented on the company’s $50 billion valuation. Twelve turbulent months later that number has doubled. In a way, investing in Social Media makes sense: with new wars looming in the Middle East, the European economy slipping in and out of comas, Japan in ruins and the United States losing its top-tier credit rating, people certainly will not be short of subjects to discuss. In that context and considering the company is allegedly responsible for a remarkable third of UK divorces, investing in suicidal post reporting tool will not be a waste either. In preparation for the IPO, Facebook will start incorporating sponsored stories into the main news feed of the site. Considering the woes IPOs brought tech firms in 2011, going public is a brave decision for a company whose valuation surpasses its current annual revenue 25 fold. On the other hand, who wouldn’t want to grow a blue chip company in 8 years?
http://goo.gl/vV0YF
Sick of Apple
I am often (deservedly) criticised for writing too much about Apple. Whereas I totally agree that there are plenty of other important players in the industry, and trying not to give in to the hype and not treat every newsbite tagged “Apple” as if it announced the discovery of life on Mars, the Californians do provide an unrivalled amount of stories. Just for a laugh, I have counted the main ones from December; you may decide whether they are newsworthy for yourself.
- December 1st: Apple: stopped supporting Carrier IQ with iOS 5.
- December 3rd: Apple licensed iOS scrolling patent to Nokia and IBM, offered license to Samsung.
- December 9th: Motorola Mobility wins German patent suit against Apple. How often does that happen?
- December 12th: Amazon.com announces Steve Jobs’ biography to be the best-selling book of 2011. It hit the shelves in October.
- December 13th: Federal Aviation Administration approves the use of iPads as electronic chart and digital flight manual readers in the cockpit.
- Another one for December 13th: Apple is rumoured to be discussing buying Anobit, an Israel-based flash memory manufacturers. For Californians it would be a rare acquisition of a non-software company.
- Yet another one for the day: a three-page contract that established Apple Computer Co. is sold for $1.59 million at Sotheby’s, soaring past the presale estimate of $100,000 to $150,000.
- December 14th: Steve Jobs becomes the hero of a graphic novella.
- December 16th: it is reported that the Samsung A5 processors used in iPads and iPhones are manufactured in Austin, Texas. Samsung builds microchips in the States. How often does that happen? Seriously…
- December 22nd: Apple is investigating fuel-cell-powered MacBooks.
- December 22nd: Apple posts a document detailing the international availability of iTunes Match and iTunes in the Cloud.
- December 23rd: It is announced that Steve Jobs will be awarded a Special Merit Grammy. Steve Jobs. A Grammy.
- Another one for the same day: the Vatican Library’s collection of writings and drawings by Michelangelo is available on iPad.
- December 29th: The US Patent & Trademark Office published a patent application from Apple that offers a possible glimpse at next generation device security: Face & Presence Detection.
Oh, there is one more thing… On December 28th it was reported that the next generation of Windows Phone is going to come with a cloud backup tool. Now, I could say that the description sounds a little like iCloud but hey, 14 stories are enough.
Zeitgeist
The Times are A-Changin’
Even in the (generally alien to most people) world of luxury goods, few brands attract as much spite as Vertu. Founded 14 years ago, the British-based division of Nokia became the unrivalled symbol of status toys. Its concierge service may indeed be very good but then there are professionals one can hire just for that. Vertu phones are hand-made and the simpler models indeed look very “solid”. For as long as the differences between the mobile handsets were determined by differences in manufacturing quality, Vertu had a reasonably solid stream of clients. Simply put, one could pay £400 for a piece of plastic or £4,000 for a piece of polished steel (£40,000 for white gold etc.). Provided money was not a factor, the purchase made sense. Unfortunately for Vertu, the unprecedented technologic progress of the last decade changed the conversation. Suddenly, the company found itself in a corner: the market for technically outdated handsets that cost tens of thousands of Pounds is small. It certainly still exists but it relies on people who are either very conservative when it comes to technology or status hungry nouveau riche. The more conservative clientele would not buy a touchscreen, those younger in spirit would prefer something cool, the upper middle class – something a touch cheaper, while the elitists (and it is safe to assume a considerable number of Vertu’s clients like the idea of belonging to a small private club) would abandon the brand altogether if it dropped the price. In good times Nokia could afford an eccentric aristocratic uncle who shuns the plebs. In days of global recession that see both Nokia and many of its customers bleeding cash, the kooky relative has become a nuisance. Ironically, financially, he is not a liability, but there are two aspects more important than money, both casting a shadow on the core Nokia brand that doesn’t seem to need any assistance sliding into the cold abyss as it is. The social aspect aside, it is the technology. Combining the concept of Vertu with cutting edge specs is impossible – these handsets are not bought for 18 months; keeping the status quo is embarrassing, the phones are archaic. The sale is unlikely to be the end of the brand though. It has fans in China, the Middle East and Russia, countries less finicky when it comes to social stratification. Very much like Maybach, Vertu cannot stay in the West, not in this day and age.
http://goo.gl/zHLKk
