I need to develop a website that will be used on mobile devices. So I was thinking should I use Media Queries to target just the mobile devices, or since it’s specifically focused on mobile platforms, maybe there are more suitable ways to do this? Enlighten me!
It depends on what you need from the site. Media Queries adjust the layout but not the content, so it becomes a cosmetic change. Some people/companies want different functionality for their mobile web site than their desktop website, and sometimes they require different content to reflect that.
You just need to figure out whether or not the mobile site will be a layout cosmetically designed for mobile, or whether or not you have CONTENT that will be different. If you have important differences in functionality and content from a desktop site, you would probably be better served in creating a mobile site distinct from a desktop site.
Well precisely what you mentioned “creating a mobile site distinct from a desktop site.” The website is not going to be viewed on desktop platforms, just on mobile platforms. I’ve never developed a specific mobile website, so I don’t know what technologies are available out there for that particular need? I’m thinking do I need to know more besides HTML5/CSS3, or I just need a different mindset when creating the User Experience?
By the way, I’m probably going to design just the UI, and maybe some front-end coding. The back-end development falls on the developers.
If you’re supporting lower-end mobile devices, they don’t always support the full CSS2.1 specs, never mind CSS3. This may help: http://www.w3.org/TR/mobile-bp/#ddc There is also a W3C “MobileOK” checker.
You should not build it in HTML 5, as the spec is not complete and could change, thereby causing problems that you would need to fix later. Maybe there are technologies I do not know about that could solve this next problem, and I will leave that to those who would know to comment.
But it seems to me that you are describing an app, not necessarily a website. If the site is not meant to be viewed by desktop browsers, but has a URL accessible to them, what will the site look like to desktop browsers who do happen upon the site? A mobile web app on a huge screen with no “desktop version” link available? Something to think about.
There is a lot to be said when it comes to using responsive design or creating a completely separate site – one that better represents the user intentions on a mobile site. It really comes down to the level of interactivity involved by the user. Sites that merely serve content, with very little user control generally tread toward the responsive route. On the other hand, heavily interactive sites such as; facebook go toward creating a dedicated mobile presence that aligns with the users intention and space availability on a mobile device. It is a question of whether or not the structure of the site should change based on the device which it is being presented. Ask yourself whether providing a more native application like experience will enhance the user experience. If so than you should probably be developing a dedicated mobile site.
Thanks a lot, really solid explanations. I’m still not sure, and you made me question myself is it going to be a mobile website or a mobile application? If it’s the former, then a “mobile first” approach would do it, along with the HTML5 Media Queries capabilities, but if it’s the latter I definitely need to make some research of what the variety of mobile devices out there support in terms of front-end technologies.
Again, the thing to keep in mind is that both responsive sites, and dedicated mobile sites, like Facebook, include desktop versions, not excluding them. So, I am not sure if that issue, of excluding desktop users is worked out technically already (is this some kind of intranet for mobile users etc?) but if not, you should think about what desktop users will experience if they are able to access the site.
What you would want to avoid is something like “This site is best viewed on a mobile device” with sniffing etc. That’s a return to the dark past of “this site is best viewed in Netscape Navigator” etc. If desktop users are able to view the URL, you should serve them something.
You should also remember that in some areas, mobile coverage is poor and download speeds very slow.
Not really something you can do much about if your site is heavily dependent on information obtained from a database, real time. Even the tapatalk native app timeouts sometime, it is just the nature of the beast. The best thing you can do is provide a graceful error message and have the user try again. You may say reduce the size of data being requested but honestly the biggest problem has to do with latency not file size on mobile device… well at least contemporary ones.
No, but my point was really that if you can do something about it, you should be aware of the issues. If one of your site visitors waits ages for a page to load, then loses their signal just before it completes, they’re not very likely to have a positive opinion of your site. It may not be your fault, but unless you’re dealing with a tech-savvy audience, that’s sure as heck how some of your visitors will see it.
@sdt76: I totally get your point. That was a major question I was asking myself too. I will get more information soon which will lead me to the technical choices I need to make. I’m just thinking forward here. The “Mobile Web Best Practices” at w3c explains things really well. Definitely my reading material for getting to know about this better.
if you want to develope a mobile website the best choice would be joomla.