How to present the blog mobile?

Random stuff about serendipity. Discussion, Questions, Paraphernalia.
User avatar
rj
Regular
Posts: 477
Joined: Sun Sep 10, 2006 2:53 pm

How to present the blog mobile?

Post by rj » Fri Nov 12, 2010 7:42 pm

This is a brand new issue for me, know nothing about it.
My kids tell me to "take the blog MOBILE dad!"
Is it a plugin? A third party app? I need some direction please!
Thanx
RJ

Thanx to Super Garvin I got Serendipity running fine on the new dedicated server!

User avatar
yellowled
Regular
Posts: 7110
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Re: How to present the blog mobile?

Post by yellowled » Fri Nov 12, 2010 7:54 pm

rj wrote:My kids tell me to "take the blog MOBILE dad!" Is it a plugin? A third party app? I need some direction please!
First of all, it's kind of hard to answer in one sentence since it is a rather complex topic. :)

Experts predict that within a few months or years, web use on mobile devices (cell phones like the iPhone, tablets like the iPad, netbooks and the likes) will be higher than on "classic" desktop computers. This results in different requirements in website design since these mobile devices use different screen resolution -- for instance a blog might look fine on a desktop computer with a 1280x1024 pixels screen but be barely readable on a typical iPhone3 resolution of 320x480 pixels. Also, most of the modern mobile devices, especially cell phones and tablets use two different orientations for screen resolution since you can turn the thingy to portrait or orientation/vertical or horizontal.

This requires very modern and frankly: complicated layouts for a site which aims to serve any screen resolution the proper layout. an alternative, of course, is to redirect mobile devices to special "versions" of the site optimized for mobile use (i.e. somebody viewing a site on a mobile device might be interested in different info than somebody viewing it at home on a desktop pc; however, this is more suitable for online shops etc. than blogs).

There is a mobile output plugin for s9y, but as far as I know, it is more or less optimized for the iPhone. Personally, I think this is wrong. To my knowledge, there is no template for S9y so far which has mobile layouts included. (Yes, I am working on something for this, but it will take more time.)

If you want to get more info on this, just google "mobile web design" or "media queries". You'll get plenty results. :)

YL
amazon Wishlist - Serendipity-Podcast (German only, sorry)

francisco1844
Regular
Posts: 30
Joined: Mon Oct 25, 2010 12:35 am

Re: How to present the blog mobile?

Post by francisco1844 » Sat Nov 13, 2010 3:54 am

... thinking out loud...
Would it be a viable option to have two blogs point to the same DB so that one could be optimized for mobile while the other would be for devices with larger screens (mobile or not).

Would this be doable? What, if anything, would break by pointing two blogs to the same DB?

User avatar
yellowled
Regular
Posts: 7110
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Re: How to present the blog mobile?

Post by yellowled » Sat Nov 13, 2010 12:07 pm

francisco1844 wrote:Would it be a viable option to have two blogs point to the same DB so that one could be optimized for mobile while the other would be for devices with larger screens (mobile or not).
No idea whether it's possible technically, but it doesn't make sense in my humble opinion.

It's all about the question "Do mobile users need the same content desktop users do?" - if so, use a fluid layout enhanced by CSS3 media queries to serve every resolution a working layout. If not, offer different content for mobile user with a mobile-only layout. (Of course, your mileage may vary. I certainly don't have the ultimate knowledge about this. No one does, since it's a rather new and undiscovered field of web development.)

Another 2 cents on this: users willing to read a blog on a mobile device could always opt for the RSS feed to save bandwidth.

YL
amazon Wishlist - Serendipity-Podcast (German only, sorry)

User avatar
blog.brockha.us
Regular
Posts: 695
Joined: Tue Jul 03, 2007 3:34 am
Location: Berlin, Germany
Contact:

Re: How to present the blog mobile?

Post by blog.brockha.us » Tue Nov 30, 2010 12:07 pm

At the moment I am adding some changes to the Serenditpity "mobile output plugin" and I discussed some aspects of this topic in my blog with yellowled already.

I have a different kind of view on this topic. While yellowled's view is client orientated, I am sure, it has to be a mixture of both: client and server orientated.

You have to use special CSS/JS stuff to optimize the blog design for mobile and "normal" devices. But I also think that the content should change, when viewed from a mobile device. I don't mean different articles, when saying this. When looking on my blog from a standard device like a desktop pc, I want to show some extra information (like sidebar plugins). For mobile devices I want to show articles only, in order to save bandwidth and to give easy mobile access to my blog.

This could be done using a CSS only solution, too, but that would transfer *all* blog data (including site bars) to the mobile device and letting the mobile device "hide" unused stuff inside the template.

The IMHO better way is not to deliver the content, that is not meant for mobile devices, but that can't be done using CSS/JS only, as these are client side techniques.

The mobile output plugin is a template switcher. It detects mobile devices and if found it switches to a mobile version template. In a template we are able to define what should be delivered and what not.

Yellowled is right by saying, that the disadvantage of this technique is, that the template switcher has to know about mobile devices, while his technique only has to know about screen resolutions of the device. But IMHO this is not that hard to achieve, as the template switcher only has to detect platforms at the moment, not special devices.

As I told yellowled, too: RSS is an option but not for all scenarios. Think of a mobile twitter client pointing via an URL to a blog article. In this case RSS is simply not called.

My updates to the mobile output plugin of Pelle Boese are ready and working nicely on my blog, but at the moment I can't release them, because I have no clever idea how to handle some downward compatibility issues. After having the time to solve this problems I will release an update, meanwhile you can use the (very iphone specific) version of the plugin found in Spartacus.
- Grischa Brockhaus - http://blog.brockha.us
- Want to make me happy? http://wishes.brockha.us/

User avatar
yellowled
Regular
Posts: 7110
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Re: How to present the blog mobile?

Post by yellowled » Tue Nov 30, 2010 1:22 pm

Just some additional thoughts. :)
blog.brockha.us wrote:I have a different kind of view on this topic. While yellowled's view is client orientated, I am sure, it has to be a mixture of both: client and server orientated.
Actually, I don't really care whether it's client- or server-side. :) I can't do server-side stuff, it's just not my cup of tea. I can do client-side stuff and it's working perfectly fine for me. However, I really do see the advantages possible by adding server-side techniques to it, especially if you give visitors the choice to switch between desktop and optimized layout.

To me, this is the bottom line: visitors should have a choice.
blog.brockha.us wrote:You have to use special CSS/JS stuff to optimize the blog design for mobile and "normal" devices.
You know, that "special" stuff is gonna be pretty normal in a few months. :)
blog.brockha.us wrote:But I also think that the content should change, when viewed from a mobile device. I don't mean different articles, when saying this. When looking on my blog from a standard device like a desktop pc, I want to show some extra information (like sidebar plugins). For mobile devices I want to show articles only, in order to save bandwidth and to give easy mobile access to my blog.
This is what I mean by giving the visitors a choice. Yes, in many cases a mobile device user will in fact be mobile, i.e. on a small bandwidth. A lot of those user also have teeny, tiny displays.

But.

A lot of people also use their mobile devices at home, usually conntecting to a broadband landline connection via wifi in that case. Also, the screen resolutions (hello, buzzword! :wink:) keep getting bigger on those devices. Just think iPhone4 retina display or Samsung Amoled displays here.

blog.brockha.us wrote:The IMHO better way is not to deliver the content, that is not meant for mobile devices, but that can't be done using CSS/JS only, as these are client side techniques.
I agree. If you have the possibility to use client-side scripting, great. If you don't, because there is no plugin for that and you don't know PHP yourself, a CSS/JS solution is better than nothing. Just try using some of the sites not using a mobile-friendly layout on my Nokia -- it's not exactly comfortable.
blog.brockha.us wrote:Yellowled is right by saying, that the disadvantage of this technique is, that the template switcher has to know about mobile devices, while his technique only has to know about screen resolutions of the device.
It is not only a question of work and code you'd have to put into the plugin, it's also much more future-proof because the screen resolution is completely unrelated to the platform or client. Also, don't forget mobile device which are not a cell phone -- just think about the iPad.

As far as I know (and please correct me if I'm wrong!), a client-side solution based on sniffing the user agent would detect an iPad as an iPhone since they both use mobileSafari on iOS -- however, an iPad has a resolution of 768x1024 px, while an iPhone3 comes with 320x480 px. I don't think it's adequate to give the iPad users the same mobile layout. Also, think netbooks. Think people with small screen resolutions on old laptops.

(I actually got feedback just the other day from someone using a non-maximized Safari on a 1280x800 macbook display. Back then, he got a mobile layout at one site because the site "thought" his 700px wide Safari was an iPad. So there's disadvantages to "my" technique -- not actually mine -- as well if you don't use it carefully.)
blog.brockha.us wrote:My updates to the mobile output plugin of Pelle Boese are ready and working nicely on my blog, but at the moment I can't release them, because I have no clever idea how to handle some downward compatibility issues.
What are these? I still think that combining client- and server-side here might be the best solution, so if I can help you with this, just say the word. :)

YL
amazon Wishlist - Serendipity-Podcast (German only, sorry)

User avatar
blog.brockha.us
Regular
Posts: 695
Joined: Tue Jul 03, 2007 3:34 am
Location: Berlin, Germany
Contact:

Re: How to present the blog mobile?

Post by blog.brockha.us » Tue Nov 30, 2010 1:56 pm

Okay, Matthias, you get a Full-ACK from me on your article.. :D

Some small "but's", but in general I totally agree.
yellowled wrote:
blog.brockha.us wrote:My updates to the mobile output plugin of Pelle Boese are ready and working nicely on my blog, but at the moment I can't release them, because I have no clever idea how to handle some downward compatibility issues.
What are these? I still think that combining client- and server-side here might be the best solution, so if I can help you with this, just say the word. :)
This is a very technical problem. Pelle's version of the plugin doesn't support body and extended body, the plugin was just putting them together into "body". This doesn't give the opportunity to separate these two parts inside of the template.

I changed this in my version. Now, if I put an update into Spartacus, the blog owner *has* to fix the old templates after updating the plugin (or only body and not the extended part will be displayed). There is no support for "upgrading themes" in Spartacus / S9Y, so I have to find a clever way to check out whether the actually used template supports body / extended or only body.

I could do this by adding some "feature" entries to the info.txt, but this is somewhat nasty, as the info.txt is (AFAIK) not parsed as metainfo for templates, so I have to search the disk on my own and do parsing stuff. It would be cleaner, if S9Y would have some kind of build in support for handling template metainfos.

I have to think about it a little more, I guess.

Ah.. And help: Well.. My android template is working nicely, but I am no CSS / templating expert, so the "look" is somewhat rudimentary. :D If you have the time and fun to do it, I am happy to hand it over to you in order to apply some ideas of you for a nice mobile interface. My template is optimized with the "fluid images" and has big areas / buttons in order to be "thumb navigable" ;), but it is far away from being optimal. It's more a starting point.
- Grischa Brockhaus - http://blog.brockha.us
- Want to make me happy? http://wishes.brockha.us/

User avatar
yellowled
Regular
Posts: 7110
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Re: How to present the blog mobile?

Post by yellowled » Tue Nov 30, 2010 4:27 pm

blog.brockha.us wrote:Okay, Matthias, you get a Full-ACK from me on your article.. :D
Just what I was going for! So, you didn't really read it, right? :wink:

Oh, BTW: I barely get anything you wrote about the technical plugin stuff, sorry. :D
blog.brockha.us wrote:My android template is working nicely, but I am no CSS / templating expert, so the "look" is somewhat rudimentary. :D If you have the time and fun to do it, I am happy to hand it over to you in order to apply some ideas of you for a nice mobile interface. My template is optimized with the "fluid images" and has big areas / buttons in order to be "thumb navigable" ;), but it is far away from being optimal. It's more a starting point.
Phew. Right now, I'm kind of caught in the usual pre-X-mas webworking frenzy. I am, however, on X-mas break starting 12/20, and I'll be on a long train ride on that day, so if you just email me a download link for it a few days earlier, I'd be happy to at least take a look at it. :)

YL
amazon Wishlist - Serendipity-Podcast (German only, sorry)

User avatar
Don Chambers
Regular
Posts: 3638
Joined: Mon Feb 13, 2006 2:40 am
Location: Chicago, IL, USA
Contact:

Re: How to present the blog mobile?

Post by Don Chambers » Tue Nov 30, 2010 6:13 pm

I am trying to understand what you guys are doing. Are you saying extended body is NOT supported?

User avatar
yellowled
Regular
Posts: 7110
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Re: How to present the blog mobile?

Post by yellowled » Tue Nov 30, 2010 9:24 pm

Don Chambers wrote:I am trying to understand what you guys are doing. Are you saying extended body is NOT supported?
As far as I understand Grischa (never used the plugin myself), the current version of the plugin (i.e. the one on spartacus) merges entry body and extended entry body into just one entry body.

YL
amazon Wishlist - Serendipity-Podcast (German only, sorry)

User avatar
Don Chambers
Regular
Posts: 3638
Joined: Mon Feb 13, 2006 2:40 am
Location: Chicago, IL, USA
Contact:

Re: How to present the blog mobile?

Post by Don Chambers » Tue Nov 30, 2010 10:43 pm

Well, that's pretty silly IMHO, especially if we are presenting an alternate view/template in the name of bandwidth savings. I'm a believer in keeping those two separate, using body as an introduction, or teaser, and extended body as the meat of the entry.

User avatar
yellowled
Regular
Posts: 7110
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Re: How to present the blog mobile?

Post by yellowled » Tue Nov 30, 2010 11:17 pm

Don Chambers wrote:Well, that's pretty silly IMHO, especially if we are presenting an alternate view/template in the name of bandwidth savings. I'm a believer in keeping those two separate, using body as an introduction, or teaser, and extended body as the meat of the entry.
It really doesn't make much sense in the iPhone "view", though. However, it doesn't make much sense to merge them, either.

YL
amazon Wishlist - Serendipity-Podcast (German only, sorry)

User avatar
Don Chambers
Regular
Posts: 3638
Joined: Mon Feb 13, 2006 2:40 am
Location: Chicago, IL, USA
Contact:

Re: How to present the blog mobile?

Post by Don Chambers » Tue Nov 30, 2010 11:21 pm

I have an iPhone 4, so perhaps I will install the plugin on one of my sites and see what you guys are talking about.

User avatar
blog.brockha.us
Regular
Posts: 695
Joined: Tue Jul 03, 2007 3:34 am
Location: Berlin, Germany
Contact:

Re: How to present the blog mobile?

Post by blog.brockha.us » Wed Dec 01, 2010 12:37 pm

Yes, yellowled get me right: The actual version of the plugin found in spartacus merged body and extended body into one: body. So body holds a stripped down version of body + extended and extended is left as it was.

I separated them in my newer version again.

The actual plugin has it's main focus in an iphone template and there it is not realy needed to have them seprated. But my android template needs this, as I want to have a article preview in the article list (the iphone template shows titles only in the article overview page).
- Grischa Brockhaus - http://blog.brockha.us
- Want to make me happy? http://wishes.brockha.us/

User avatar
yellowled
Regular
Posts: 7110
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Re: How to present the blog mobile?

Post by yellowled » Wed Dec 01, 2010 3:37 pm

blog.brockha.us wrote:(the iphone template shows titles only in the article overview page).
It might be nice to simply give people a friggin' choice if they want to display titles only in the overview page(s), although I realize it might make the plugin way more complicated. :)

YL
amazon Wishlist - Serendipity-Podcast (German only, sorry)

Post Reply