2

I had accepted the task of building a client a website. She had the requirement “it had to scale to mobile devices”. Not even that, but I’m assuming her screen size she viewed the site on is a little bit smaller than mine and she’s dissatisfied because the page displays “incorrectly” for her. For example the horizontal navigation bar takes up two lines and text isn’t flushed the way she wants it; but all of this works on my computer.

How are such problems avoided or resolved? Is it that it’s not possible to develop a website with a specific target platform? How specific does it need to be, for example I coded it on using a 24” monitor but my friend’s laptop is 13.3” and the website’s busted?

Are there any links to articles that could explain to a non-technical person it's not trivial just to say "make the website display the same on all devices"? Also how do you articulate the question to the client that it doesn't make sense to say "display the same" as having 10 links on a navigation bar on a large screen is usable but squishing 10 links into a smartphone screen is stupid.

UPDATE: looking back on this, it would have really helped if we had met at least once in person as in my experience UX design requirements is really hard to do only by email.

  • For the included question "How to test your website on 100 devices" There are simulators available, either directly online, where you enter your URL and get a preview rendering for different browsers and devices, or for download, where you can see how your page will look on several devices. – Falco Jul 23 '15 at 15:39
  • @Falco that's good to know. Would you be able to link to such websites that do this for free? Or name such a product that can be installed locally? – Celeritas Jul 23 '15 at 18:55
1

go for responsive website design. Responsive design will solve the problem that you are facing. GOOGLE responsive and you will get many articles. Read them and learn the trick.

| improve this answer | |
4

Firstly, and unfortunately for you, I don't think the client has unreasonable expectations. What failed is the conversation between you and the client that voices those expectations. Most likely the client didn't know what they needed to ask for, which is where your expertise is supposed to come in (as the provider of development services).

I might be wrong but it sounds to me like you may have built the website either from scratch or using some sort of simple template which may have been ok in 1999, but is not fit for purpose given the thousands of different display sizes and densities available today. Most modern web development platforms (frameworks) provide tools and examples to build upon which adapt to the display size. Wordpress with a decent theme is also a great option to get you 80% of the way there with minimal effort.

Even so - just 'making the site responsive' is not a solution in its own right, it's just one of the many tools you can use to provide a solution. See for example '9 basic principles of responsive web design' for a reasonably non-technical visualisation of some of the problems encountered.

You and your client need to have a conversation about what actually happens on smaller or bigger screens. You need to explain the problems and allay her expectations of things looking the 'same but differently sized', and present ideas of what may happen instead. To back that up, of course you need to be confident of being able to provide these solutions, which is why a framework on which to build is likely your best bet.

The client doesn't know what to ask for and you are not a mind reader, so the best advice I can give is: keep the client involved, and keep a conversation going. It helps to avoid unwanted and untimely surprises for both you and the client.

| improve this answer | |
  • Yea it's not so much unreasonable expectations as unclear requirements and too little time to discuss them. She had got a website she wasn't satisfied with from someone else and wanted me to fix it, but looking back now it would've been simpler to start from scratch. – Celeritas Jul 7 '15 at 8:46
3

Your situation is one most designers/developers have gone through once (at least some kind of disagreement with a client). So don’t worry! This is a typical example of what’s so important about good communication between you and your client. Not just to get clear what your client wants, but let them be aware of where their wishes come from and what other/better solutions can solve the problems they are facing. Having the requirements clear and written down in a contract can prevent you from disagreement on the final product.

These days you can expect from your client that they want to see the thing that they invested in to show it (off) on their phone or tablet. It is possible that you have good arguments not to have it scalable for these devices. But just saying that it's stupid is not very convincing, better have it substantiated with results from experiences or research (your own or from renowned sources).

How to solve this conflict? This really depends on what's on paper and how well you can get along with your client. But respect the situation and your client. Try not to be the one who is right, but to work towards a solution.

How to prevent this in the future? I think you have a lot to learn in web design/development. When you say...

squishing 10 links into a smartphone screen is stupid

...you should learn about information architecture or responsive design. EDIT: Because of one of your comments I now have a good sense of what you want to know:

"what questions do I ask the client and how specific must the answers be?"

In your situation first thing I would like to know is if it is relevant to spent another x hours to make it mobile friendly. So ask your client who will use the site, why, how often, where etc. or do some research yourself. Try to get a picture of the audience and what the websites purpose is to them. If it's just an informative site, you might want to find out what the most important information is to find quickly on a mobile device. If your client will benefit from people finding this information while on their way, you have a good stance in advising her to invest a bit more in a mobile version.

Good Luck!

| improve this answer | |
  • Hi JazZRo. The part I'm unclear on is you say to read up on information architecture and responsive design. Is it not the role of the client to have the specifications of what they want? Where is the line drawn between giving the client what they ask for and knowing when to ask if they are sure this is what they really want and taking the initiative and fixing things the way you best see fit? – Celeritas Jul 7 '15 at 20:38
  • Information architecture is not just about what, but also about how. In your question you say it doesn't make sense to have 10 links on small screens. But you can't expect from a client to think of that, not to mention having thought of a solution. She knows her part (the business), you know the technical/UX/accessibility part of IA. Good communication is key to get it right. Responsive design is however mainly your business, it should be obvious that a designer/developer chooses modern techniques and tools to meet the requirements. – jazZRo Jul 7 '15 at 22:01
1

I hate to sound patronising when I respond on StackExchange, but I have to say - you sound too inexperienced to be in this kind of situation with a client. You're asking questions that web developers should know (i.e. the basics of responsiveness). You're including "incorrectly" in a quote as though it's not the case. The fact is, it is incorrect, and yes you should be targetting as many platforms as possible, and testing it on as many resolutions and devices as possible. Is it a ball ache? Of course it is, we web developers now have to respond to arbitrary amount of screen sizes and choose from a plethora of media query and grid solutions, as well as taking into account technical capabilities of the devices in some cases, but it's now entirely necessary, and her expectations are pretty standard.

Going forward, how do you prevent this kind of situation? Learn how to develop responsive sites from the offset. And (most importantly), FORMALISE WHAT YOU AGREE ON! Whether it's a tech spec, or a contract of some sort, there should be a clear understanding (on paper) of what both parties are aware of. Cover your own back.

| improve this answer | |
  • 1
    I hate to sound patronizing on StackExchange to but I am inexperienced as this is the first time I've made a website for someone else. I know it's a ball ache (as you like to say) that websites have to display the same on different platforms, but I'm only a single developer with 1 computer. How can I test it out on Firefox/Chrome/IE/Safari with different screen sizes (serious question)? – Celeritas Jul 7 '15 at 9:42
  • What I'm saying (in a nutshell), is that developing a website (these days) for your screen, is now only half the job. There are many tools available. For starters, look into how each browser's developer tools (press F12) offers device emulation. Then look into device labs maybe, where you can test them physically on many devices in one place. The job of a web developer (and even designer) has changed, embrace the change - because you can guarantee that (as you've seen), clients' requirements will reflect these changes. – JᴀʏMᴇᴇ Jul 7 '15 at 10:52
  • I know what you're getting at as I've worked IT in large companies where the devs would have multiple VMs and the QA team would have multiple physical computers to test the websites on. The thing is this website was a side project (i.e. not full time job) and I was working alone. Even then the clients wouldn't make nebulous comments like "make the website work everywhere", for example Safari was never tested on Windows. I think my initial question was missed by everyone, which is "what questions do I ask the client and how specific must the answers be?" – Celeritas Jul 7 '15 at 20:36

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.