This question has been asked in various guises. However. this is a slightly different take on things. By web application, I mean an ultra lightweight frontend - ideally an HTML page with form and regular buttons, with as little dependence on heavyweight JS libraries like jQuery as possible.
The goal is simple. I want to write a simple forms based application for use accross various mobile devices. I thought going the HTML route would be the simpler route (since browsers get around the whole cross platform issue) but even the browser approach seems problematic because of differing screen sizes on mobiles.
I have two questions:
For a simple form based application like I have in mind (possible 3-4 screens in total), I think the browser based approach gives more bang for my buck - am I missing a trick?
Are there any resources that someone can point me to for:
a useful reference for minimum (i.e. lowest common denominator) window size (I forget the technical term for the visible part of a page)
perhaps an example that will show a simple HTML page that will render correctly accross multiple devices?
The HTML5 mobile boilerplate will probably answer a lot of the questions about how to best get things to work across browsers:
http://html5boilerplate.com/mobile/
They have example markup and template implementations for things like browser/device specific CSS hacks, getting a custom launcher icon across different device styles, and implementing offline digest.
You really need to answer two questions before you pick a platform. First, what mobile devices and/or device capabilities are your lowest common denominator? There are lots of variable capabilities between most of those platforms -- screen size, input method, platform speed and mobile platform to name a few. Second, what is your connection requirement? Completely different issue building something targeting spotty or no connectivity versus a fully connected app.
Then you can start thinking about what tool(s) might get you there. In general, a very, very simple HTML site will look okish on most platforms you list. I wouldn't roll with HTML5 functionality because you've got serious limitations there. And HTML/web apps are kind of moot if you need things to work with limited connectivity.
iOS (webkit), Android (webkit) and BB OS6 (webkit-ish), are fairly easy to develop for.
Windows 7 should be, but who knows? They aren't promising HTML5 support until end of year.
BB OS5 browser sucks if you hope to be doing DOM manipulation or fancy JS event listeners. It's really buggy.
Nokia...it's a crap shoot. Granted, they have about one year left before they ditch their OS anyways.
Screen sizes are an issue, as is the fact you can change the orientation. But that can be gotten around with some careful planning.
HTML5/CSS/JS is definitely the way forward for making cross-platform apps as easy as possible...be it in the browser, or as a compiled app.
Related
We've built an app through Flutter and realising that some of our user behaviour is best created for larger screens, where people are creating best on desktop. I've seen that the codebase is viable for transporting to a web experience. We want to avoid the desktop app and build for a browser.
Has anyone had experience with building for web browsers using Flutter?
What's been your experience? How good is the codebase for creating things such as:
Messengers
Posting and threads
Spaces, like Pinterest folders or Padlet like these - NewHope Crowdsource Space
This is the app on the store if that helps.
I'd greatly appreciate any feedback, thoughts or experiences you've had. I'm wondering whether to invest in Flutter for web browser or whether I need to go back to JS.
Thank you
We're exploring whether to develop the website through a different language and looking for people's experiences if they've attempted this.
The experience is not much different than mobile development, if you're used to it, really I recommend you usage this variant. Only one source code for all platforms.
In addition, the use of libraries is practically the same. The only thing that changes is that it compiles to HTML, CSS, and JavaScript.
I only recommend taking care of the adaptability to different screen sizes, using mediaQuery (height, width) and Expanded Widgets.
The rest stays the same, your HTTP requests (Dio is an excellent option). To work the logic layer also the BLoC design pattern helps a lot.
I need to develop a gwt app that requires support on desktop, mobile, tablet. I need to choose whether to use m-gwt or stick to the approach presented in Google IO 2011
Google IO 2011 approach seems to be -
1) create different views for different screen sizes
2) use deferred binding load only the relevant views according to the user agent
3) same presenter code
IO 2011 approach seems much simpler to me (and not tied with activities and places) but I am not sure if this approach is still popular and will work.
Can someone please let me know the pros and cons of these two approaches ?
Regards,
Sathya
You are mistaken in the assumption that mgwt is tied to Activities & Places, you can use it without using them. If you like using Activities and Places mgwt works of course very well.
The approach presented at Google I/O is actually quite similiar on what mgwt does.
If you are looking into building one application for phone, tablet and desktop from one code base here is an interesting read: http://fahnenbruck.blogspot.de/2014/02/running-on-any-platform-using-java-with.html
I am designing a web app from scratch, which would be a fluid-based layout and the same HTML would render on different screens using the adaptive CSS.
I am going to use adaptive CSS (or responsive design) for this.
I was looking to use a framework like SCSS (http://sass-lang.com/) which would improve my code maintenance efforts. I'll have lots of CSS files (and probably some skin based as well)
Since I am using adaptive layout, I am going to use CSS Media Queries for desktop/tablet/mobile CSS. I could not get an idea how well the SCSS would integrate with media queries and overall speaking , how much flexibility will it offer to me.
Please let me know your suggestions if you have used SASS/SCSS and in general, any other suggestions.
SCSS is essentially an extension to CSS, and is useful (with mixins) to void repetition in your code. It also provides a way to group blocks of CSS in semantically meaningful ways and gives you variables to avoid repeating yourself.
If you are using a framework such as Rails, it is no-brainer.
There are also frameworks which focus on layout such as 960 (and its variants), and Blueprint which also adds code for thing like buttons.
The underlying philosophy behind many of these is DRY (don't repeat yourself). One bonus of using an established framework is that many of the browser issues have been ironed out, so you can be sure that it will work cross-browser.
It is true that perhaps the code is not quite a lean as rolling your own, but with careful editing and making sure you minify the result and send it gzipped, this is not a major issue except on the most high traffic sites.
Personally I have objected to using frameworks in the past because of the small amount of additional redundant code, but after 15 years of hacking around browser issues, I now think they are a Good Thing.
Larry Wall said in Programming Perl, "We will encourage you to develop the three great virtues of a programmer: laziness, impatience, and hubris."
Anything that allows more people to use CSS in a repeatable and reliable way, to build on work done by other, and to try out some of the leading edge features has got be a good thing.
Engineering a site with media queries is still a bit leading edge. There are compromises in each approach and you should read up as much as possible before choosing one. Adapt.js is a good alternative if you don't mind javascript.
You may want to look into the HTML5 Boilerplate. This has some useful defaults, and lots of documentation about the HTML and CSS defaults that have been chosen.
Good luck!
I have not used media queries together with SCSS, but I don't think they conflict with each other. I have used SCSS extensively in my current rails apps, and it helped me to reduce the amount of code, and get a better understanding when to use which styles.
The tricky part will be what to have fluid (changing depending on the medias viewport size), and how to avoid repetition.
Have a look at the nice site Responsive Design with CSS3 Media Queries, to get an idea which parts of your layout may be fluid.
Have a look at 320+Susy (GitHub repo here). It uses the Susy grid framework extension for Compass. All of these tools are based on Sass and make use of media queries.
Are there any major advantages/disadvantages I should take into consideration when developing an app which and deciding whether to creates parts (styled menus, pages with content with complex layout etc.) in HTML/UIWebview or doing it all native?
I would like to hear people's experiences with this.
Personally, I find that I tend to dislike web apps that are (usually) disguised as iOS apps. I tend to notice a lot of inconsistencies between the UI of a web app and a 'native' app, and most of the time, it bothers me (my biggest pet peeve is tapping a button and seeing it highlight with a little translucent black box around it like a link). Now, I don't represent the major user demographic, which probably won't care, but that's my personal opinion.
In terms of programming, I've never written a web app before, but I assume that it's going to be slightly less structured than a native app just because writing HTML, Javascript, and CSS doesn't force you to assume a certain project structure, unlike iPhone apps that have distinct views, controllers, and the like. Depending on what you want to write, this might be liberating, but can also get tangled very quickly.
As middaparka said, you can also use a mixture of the two systems if you'd like. I mean, I'm assuming you're just as good a web developer as you are an iOS developer. If you are stronger in one suit than the other, then I say that you should lean towards heading in that direction. I'd much rather see an excellently written web app than a badly written native app, and vice versa.
I suspect the major advantages/disadvantages relate to the user experience - a "native" UIKit based user interface will feel a lot more natural than manipulating items within a web view. (It'll also mean you can use more "standard" components like navigation controllers, tab bars, etc.)
That said, there's no reason not to use a mix of the two, with the main UI being implemented via the various UIKit objects and the content being provided via a web view.
I would also add that the biggest issue I've found with hybrid frameworks is that you add another dependency to your app.
For example, take a big iOS update. If your chosen framework breaks, your app breaks and you won't be able to fix it until the framework is fixed.
Also, right now there are many frameworks and you have to pray that the one you chose isn't flushed down the toilet or drops support for one of your target platforms.
Another issue is that in a web based app/component you are missing out on platform specific technologies and frameworks like core data, GCD (or any other threading model - which in web you might have do with e.g. Ajax),uitableview with caching etc.
Should you hit a wall when it comes to performance or storage,then you have many more options in the native framework.
By day, I am a front-end web developer but in my off time I dabble with other languages such as C, Objective-C, Python, etc. When I first got into web development the idea of web applications was just getting started.
Since then two amazing frameworks have appeared, SproutIt's SproutCore and 280 North's Cappuccino (+Objective-J). SproutCore is being used by Apple for it's MobileMe application and 280 North released 280 Slides. Both of these applications are amazing and they are a testament to what is possible on the web. So the momentum is shifting. Web applications starting to look and act like desktop applications.
So my question is this: should web based applications follow web standards, separation of markup (content), presentation (design), and behavior (functionality) or no?
I am not sure about SproutCore since I have not look at the source code, but I know that if you go to 280slides.com and turn off the JavaScript everything basically disappears. You are left with some meaningless words.
Let me clarify, I understand that web based applications such as 280 Slides is meant to have JavaScript on and not meant to be functional without it but in my day job my main focus is writing clean markup, separating content, presentation, and behavior so that our site and applications can be used by as many people as possible.
It seems like the other people who have answered so far have no idea what you're talking about.
Like me, you've had it pounded into your head to make your web applications as accessible as possible. That is, they should work without scripting and without stylesheets. JavaScript and CSS should only be used to enhance the experience. They should not be required.
SproutCore and Cappuccino are frameworks for front-end development that require the user to have both JavaScript and CSS enabled. Your question is around how we reconcile this with the dogma of the day.
Unfortunately, I don't have a clear-cut answer. I like the fact that SproutCore and Cappuccino (and probably others) are testing the limits of what's possible within a web browser. I also believe firmly that information and services provided on the web should be available to as many people as possible, given the limitations of the technology.
How you approach your solutions needs to be based on a deep knowledge of your user-base. If you're working on an iPhone app, you don't need to worry about traditional web accessibility because the experience is intensely visual. If you're building a web application for a general audience, these new frameworks are probably a poor choice (if you value the widest possible access to your information and services).
Over time, screen reader software is likely to get better at interpreting JavaScript-heavy interfaces, so perhaps this issue will fade. Thing is, something else is likely to "sprout" up in its place.
Javascript is a Web standard — certainly more so than, say, Flash, which was previously (and still often is) used for rich Web applications. In this regard, SproutCore and Cappuccino are giant improvements in my book.
The question here really seems to be how important accessibility is. And that is largely a personal decision based, as Andrew said, on knowing your users. For some apps, accessibility really doesn't make that much sense — 280 Slides is a good example of this. It's a graphic design app that's largely about visual behaviors. It doesn't make very much sense for it to degrade to plaintext. (At least, a text-based app meant to accomplish what 280 Slides does would be really be a completely different thing.)
Yes. It will be difficult at first, but once the codebase matures you will be thankful you followed those rigorous standards.
Edit: An added benefit will be portability to many web-based platform via CSS profiles and whatnot.
The MVC model can be applied just as easily to desktop applications as it can to web based applications. I don't see much reason to distinguish between the two, especially since the line is more blurred in the case of web applications.
I don't know about these particular frameworks, but a lot of web frameworks these days are structured around the MVC model, such as ASP MVC, CakePHP, Ruby on Rails, etc.
Separate as much as you can and it will pay out in the end. When things get complicated and hairy :)
I think they should. Following that type of MVC design allows for changes to be more easily implemented, provides good separation of concern, and is generally easier to understand for newcomers to a project.