Beefy Boxes and Bandwidth Generously Provided by pair Networks
Pathologically Eclectic Rubbish Lister
 
PerlMonks  

Quick and dirty mobile fix

by Bod (Hermit)
on Nov 22, 2020 at 16:51 UTC ( #11124025=monkdiscuss: print w/replies, xml ) Need Help??

In several places I have mentioned my surprise at how archaic this site looks and feels - I know that for those of us who value the content, the connection with other Perl people and the discussion, the look and feel is worth the effort. But what about those outside The Monastery? Perl is considered old-fashioned, irrelevant and redundant to many people...right or wrong that is the way it is. Having one of the primary recourses for the language looking outdated does nothing to promote Perl's rightful place as a meaningful part of today's technology.

In no way do I mean to question the amazing work that has been done bringing this community into being or the fabulous contributions that continue to be made.

In another thread marto suggested it was more than trivial to convert the site to being mobile friendly - IMHO, the first stage of converting a legacy website to something more modern. So I thought I'd take a look at what was really needed to make a change...for a bit of fun and to, perhaps, generate some useful discussion.

I went back a decade to a node, sv_upgrade error that was being discussed in November 2010 for no other reason than 10 years is a nice round number! I copied the HTML source, changed the existing image and script paths from relative to absolute, added a little CSS and a little Javascript and produced a quick and dirty mockup which is pretty much identical on desktop but behaves marginally better on mobile. Note that it's not a truly responsive page as it doesn't properly transition from narrow to wide screen width unless it is reloaded.

I made the minimum changes I could which involved:

  • Adding a viewport meta tag
  • Converting a couple of deprecated HTML attributes (width mainly) to CSS
  • Adding a block of CSS and a single Javascript function
  • Adding a table cell containing a hamburger menu image to use on mobile
Less than a couple of hours in total to make what I consider a very slightly better mobile display.

Clearly this is just a conceptual idea - as The Monastery is built on a framework I have no idea what is involved in changing the source code that framework spits out and it would need much more then just a quick fix. However, from the comments I have seen scattered around, I'm not the only one who feels that this site no longer showcases Perl in the best way and any change in the right direction is probably a good thing.

If there is a move towards creating a responsive site, I am happy to contribute where I can although I am very much aware that my coding skills are very inferior to many others here. But I am eager to learn and to help.

Replies are listed 'Best First'.
Re: Quick and dirty mobile fix
by jdporter (Canon) on Nov 23, 2020 at 15:53 UTC
    Gentlemen, you can't fight in here! This is the War Room!

    It is possible to make everybody happy. As I mentioned previously, we can have different domain names for different UX facades of the site. This has been demonstrated already: visit css.perlmonks.org.

    I reckon we are the only monastery ever to have a dungeon stuffed with 16,000 zombies.
Re: Quick and dirty mobile fix
by choroba (Archbishop) on Nov 22, 2020 at 20:50 UTC

      I hadn't...but I have now :)
      Looks interesting and I shall read properly.

      Thanks for pointing me in the right direction.

      But...and it's a big but...people should be able to visit www.perlmonks.org and see a modern, mobile friendly, responsive website. The content is already amazing, but the delivery is poor. I return to my point that, if Perl is not to be considered as a outdated language, the resources people find when they look for or at Perl need to be contemporary.

      'Messing around' copying javascript into nodelets is all well and good only for those who are already here...

        The content is already amazing, but the delivery is poor.

        Both assertions are subjective. I happen to agree with the former and disagree with the latter. This site is one of the very few content-driven sites I use which is fast, reliable and bandwidth-lean. I wish more were like it.


        🦛

        Personally, the "old school" look of the site is what I initially found so appealing. The great help I've received so far has just been icing on the cake. However, I do know that people in the wild are sometimes turned off by the site's presentation, which is a shame given the great content here. I just came across this recently in a Mastodon conversation I was having with someone espousing the friendly Perl community and this site in particular. So maybe giving the site a slight face lift to attract new people may be a good idea.

Re: Quick and dirty mobile fix
by jcb (Vicar) on Nov 23, 2020 at 03:13 UTC

    The single biggest concern: does the page still work correctly (as in still render usably) on desktop with JavaScript disabled after the change?

    There are many people who rightly disable JavaScript for security reasons; I am one of them. Idiot hipster web designers who just say "enable JavaScript" are, well, idiots who deserve the ransomware they will someday get from a drive-by JavaScript exploit. Any site that relies on JavaScript to load the actual page content goes straight into my "do-not-visit" list of trash sites.

    Please do not put PerlMonks into the garbage bin.

Re: Quick and dirty mobile fix
by harangzsolt33 (Friar) on Nov 23, 2020 at 05:11 UTC
    Whatever you do to the site, just don't make it unusable. I can read the content pretty well on my phone which is a Motorola Moto G7. If I need to zoom in, I can zoom in. If I need to zoom out, I can zoom out.

    One bad example is our power company's website. It was recently redesigned, and it's full of bugs. First of all, it was not responding to clicks. I clicked on NEXT, and nothing happened. A few weeks later I tried again, and it was working. Okay, so everybody was assigned a new account number. We all have to log on and create a new online account. In the process of doing that, I got rejected because my name is too long. Then somehow it let me past that point, but then it rejected me because my email was associated with another account already. That is impossible! Oh, perhaps that's because they remembered that my old account used the same email. Apparently they didn't delete my old account. They just disabled it or hid it. Anyway, they won't let me sign up with the same email I always use. So lame! I gave them a different email address, and then it said that my account number is not found. At that point, I gave up! I'll just send my payment in the mail.

    ((Of course, that's just the technical side of it. In their billing department, there are huge problems as well. Many people are complaining that they get overcharged. Some people get no paper bills for months. Then all of a sudden they get one $1000 bill threatening to disconnect power unless they pay it immediately. It's one thing when a company has a bad website, but when their other departments are having equally bad problems, then that's a truly bad company. And since this is a power company, there is no competition. :P ))

    I just hope that whatever is done to PerlMonks website, it won't become like my power company's website. Save us from a ton of misery, please. Don't make some major change that everybody regrets later.

Re: Quick and dirty mobile fix
by Ratazong (Monsignor) on Nov 23, 2020 at 07:34 UTC

    Hello Bod

    You write:

    ...to convert the site to being mobile friendly - IMHO, the first stage of converting a legacy website to something more modern...

    Here I disagree with you: for me, having a mobile version of a website giving help on programming is no real use-case. My main use-case is to copy-and-paste code-fragments to try them out and to modify them ... not to type them in by hand, using my mobile as source...

    However if you want to add a frontend to perlmonks that makes it look better in your eyes: go ahead. As long as the original layout remains (so the user can choose)(and as long it works without javascript).

    Rata

      Fair comments Ratazong

      For me, I read content here far more than I paste code and probably 85% of that reading and commenting is done on a mobile device - I just don't use my laptop unless necessary. I am not alone in that.

      But...my point is not about usability for people already here.
      It is about showcasing the Perl language in the best possible light as a modern, capable and worthy language. It is about young, up and coming programmers see this site and other upholders of the language and thinking "I want to be involved in this technology" and not thinking "how old-fashioned".

      Almost all reads and most of my posts here are from mobile.

      Cheers Rolf
      (addicted to the Perl Programming Language :)
      Wikisyntax for the Monastery

        I'm pretty much the complete opposite. Veeerry infrequently I might peek from a mobile browser but 97+% of the time I'll be interacting from Safari or Chrome; in fact I can't think of a time I've actually made a post from my iPad (and wouldn't unless I had the bluetooth keyboard going in which case I'm halfway to laptop).

        Might be interesting (and someone's probably done so in the past) to look at the user agent info and see what people are actually using rather than anecdotal self reporting.

        The cake is a lie.
        The cake is a lie.
        The cake is a lie.

Log In?
Username:
Password:

What's my password?
Create A New User
Node Status?
node history
Node Type: monkdiscuss [id://11124025]
Approved by davies
help
Chatterbox?
and the web crawler heard nothing...

How do I use this? | Other CB clients
Other Users?
Others contemplating the Monastery: (4)
As of 2021-01-26 23:17 GMT
Sections?
Information?
Find Nodes?
Leftovers?
    Voting Booth?
    Notices?