How to make my website 'mobile ready'?

27 replies
Hi

Hope your having a good Friday!

Can anyone please advise what tools i need or whose best to get in touch with regarding my website being 'mobile ready'? :confused:

My website does load clearly on devices such as a mobile but i would like it to be mobile optimized.

Can this be done by myself and if yes, what tools and how much?

thank you
#make #mobile #mobile advertising #mobile applications #ready #website
  • Profile picture of the author marketinguk
    Willr has an amazing WSO to help you for exactly this question. Please search for Willr in the WF search bar and you will find it.
    Joel
    {{ DiscussionBoard.errors[6558509].message }}
  • Profile picture of the author matt5409
    To be honest, mobile needs to be considered at design stage and throughout the build process, so if your site is more than a couple of years old it's more than likely that you'll need to start again.

    Sure you can convert sites to work on mobiles by restructuring elements and adding break points (using media queries) but on custom designs this can be tricky. If you run Wordpress, there are plugins which will just stack the content for you. This can work, it can also look awful.

    Unfortunately I don't think this is something you can do yourself without putting in a lot of time and effort to learn how content scales on smaller screens.

    Is this for your wills site? The structure looks reasonably simple and it could probably be converted relatively painlessly, but I'd hire a pro personally.
    {{ DiscussionBoard.errors[6558518].message }}
    • Profile picture of the author Litherland
      Originally Posted by matt5409 View Post

      To be honest, mobile needs to be considered at design stage and throughout the build process, so if your site is more than a couple of years old it's more than likely that you'll need to start again.

      Sure you can convert sites to work on mobiles by restructuring elements and adding break points (using media queries) but on custom designs this can be tricky. If you run Wordpress, there are plugins which will just stack the content for you. This can work, it can also look awful.

      Unfortunately I don't think this is something you can do yourself without putting in a lot of time and effort to learn how content scales on smaller screens.

      Is this for your wills site? The structure looks reasonably simple and it could probably be converted relatively painlessly, but I'd hire a pro personally.

      Hi

      Yes for the Will site as we have people approaching our website through their phones so i wanted to make sure it catered for all. I shall look for a professional to do this for me but also do some research


      thank you for your comments.
      Signature
      www.mywillsuk.co.uk UK Will Writing Service
      {{ DiscussionBoard.errors[6558547].message }}
  • Profile picture of the author Juan Jose
    If you want an easy & quick way to make your site mobile ready try dudamobile
    Signature
    {{ DiscussionBoard.errors[6559240].message }}
    • Profile picture of the author Niks24
      Thanks mate for letting me the free tool for making the website Mobile as I was facing a lot of problem for making a website mobile.
      Signature
      Served Over 100 customers and there needs with Web and Mobile Apps Development, if you are looking for one please connect with me with good turnaround.
      {{ DiscussionBoard.errors[6563455].message }}
  • Profile picture of the author nasuryono
    If you are using Wordpress, there is a plugin called WP Mobile (if I'm not mistaken).

    Turn that on and your site will be mobile ready.
    Signature
    ----------------------------------------


    {{ DiscussionBoard.errors[6559264].message }}
    • Profile picture of the author azmanar
      Hi,

      For dual compatibility ( smartphones & PCs ), usually the sort of WP Themes you need to look for are ones having "responsive" features.

      So if you have an old WP Theme, update it to "responsive" themes and do some small adjustments to your content. Not really a big deal.

      Responsive themes checks visitors as they arrive via Javascript at the headers and redirects them to suitable pages.

      There are an increasing number of responsive themes out there but I kind of preferred simple ones which are also highly flexible. Visit : Simple WordPress Themes . There are others.

      Please note. If you plan to have videos on your sites for mobiles, there are generally 2 main devices to cater for : iOS devices ( iPhones & iPads ) and Androids.

      iOS devices do not support Flash, so you need to stream using HTML5 and the video file format in MP4. Androids do support Flash Players ( flowplayer & jwplayer ) on your sites, and the file format can be in MP4 and FLV.

      So if video is an important feature in your sites, then you need also to consider redirecting to video player pages based on devices, again by javascript at the headers.
      Signature
      === >>> Tomorrow Should Be Better Than Today

      {{ DiscussionBoard.errors[6559370].message }}
      • Profile picture of the author TheArticlePros
        Originally Posted by azmanar View Post

        Please note. If you plan to have videos on your sites for mobiles, there are generally 2 main devices to cater for : iOS devices ( iPhones & iPads ) and Androids.

        iOS devices do not support Flash, so you need to stream using HTML5 and the video file format in MP4. Androids do support Flash Players ( flowplayer & jwplayer ) on your sites, and the file format can be in MP4 and FLV.
        Actually...this advice isn't good going forward. Sorry Az, you're normally spot on with stuff, but this hit the news yesterday:

        No Flash for Android 4.1, Jelly Bean, users | ZDNet

        Adobe's dropping Flash from mobile.

        -- j
        Signature

        Posting About Life & Video Games:
        http://www.jarycu.com

        {{ DiscussionBoard.errors[6559795].message }}
        • Profile picture of the author azmanar
          Originally Posted by JaRyCu View Post

          Actually...this advice isn't good going forward. Sorry Az, you're normally spot on with stuff, but this hit the news yesterday:

          No Flash for Android 4.1, Jelly Bean, users | ZDNet

          Adobe's dropping Flash from mobile.

          -- j
          Arrhhh !... this thing is going to happen as of August this year. This is an important info for me as I'm about to role out scores of videos. FLV is out, then.

          Thanks J for the update.

          However, this is also good news and make things much easier now. I'll have to manage only 1 single file format, i.e. MP4, just different reso.

          For PCs, I'll overcome browsers' MP4 compatibility issues with Flowplayer or JWplayer. For androids and iOS, the same 2 players can default to HTML5.

          One thing to note is that, all browsers ( chrome, FF, IE, Opera, Safari ) are shifting native support to dot webm format. If webm quality improves, this format may take over MP4 for online streaming.

          Video formats are evolving too fast. It is an "adaptability" challenge for me.
          Signature
          === >>> Tomorrow Should Be Better Than Today

          {{ DiscussionBoard.errors[6560534].message }}
          • Profile picture of the author radojica
            there is three different ways to handle mobile friendly pages:
            1. redirection to different pages for mobile users...(woudn't recomend since then you are splitting visitors to different pages)
            2. responsive pages...which will require you to rewrite your code since your website is made in table layout...so I wouldn't recomend this to you also
            3. best option for your website is to use script to detect mobile phones and then show different content for mobile users

            I hope this will help you
            {{ DiscussionBoard.errors[6560829].message }}
            • Profile picture of the author Jay Moreno
              Originally Posted by azmanar View Post

              Responsive themes checks visitors as they arrive via Javascript at the headers and redirects them to suitable pages.
              .
              sorry azmanar thats not quite right - a responsive design doesnt redirect the user it simply changes the css styling to suit the screensize and keeps them on the same url... what you are describing is user agent based detect and redirect javascript.

              responsive design for me is a bad solution for mobile devices based on performance - i have explained more in detail here as to why...

              http://www.warriorforum.com/mobile-m...e-website.html


              Originally Posted by azmanar View Post

              However, this is also good news and make things much easier now. I'll have to manage only 1 single file format, i.e. MP4, just different reso.
              Couple of pointers regarding video... whilst MP4 is supported by both Chrome and Safari the native browsers for iOS and Android, if a user switches out their default mobile browser for say mobile firefox the video wont play inside a HTML5 tag as its not currently supported... you will need to either supply an OGG video file for them to fall back to or simply present a link for them to download the MP4. Also dont forget to add a poster img variable too.

              If you want your video to be accessible by the broadest range of mobile devices dont use jplayer... instead use HTML5 video tag with MP4 and OGG video source files and fall back gracefully with a link to a 3GP video that will pretty much cover all your basis. If you are going to do a responsive design so people access your video on a desktop as well this is without a doubt the way to go.


              Originally Posted by radojica View Post

              there is three different ways to handle mobile friendly pages:
              1. redirection to different pages for mobile users...(woudn't recomend since then you are splitting visitors to different pages)
              2. responsive pages...which will require you to rewrite your code since your website is made in table layout...so I wouldn't recomend this to you also
              3. best option for your website is to use script to detect mobile phones and then show different content for mobile users

              I hope this will help you
              There is actually a fourth which is adaptive... which is how WP Touch works, the mobile user does not get redirected but instead based on the user agent of the mobile browser it is served a different HTML structure that is optimized for mobile based all on the same URL.

              Another pointer to make - personally i would recommend you do not use a javascript based redirect the reason being is that the Google Mobile Search Bot for both Smartphones and non Smartphones will not see it and will not properly find your mobile content. Additionally if you where to use screensized based javascript redirection there are known issues of screensizes not always report back as you would expect.

              Regardless of what method you prefer always run your sites through the Google Online Speed Test for Mobile... if your not getting a score of 90% or higher for your mobile site somethings wrong... and if your really brave enough run your site through the mobileOK checker! LMAO

              HTH

              Jay
              Signature
              Sorry, I am too busy helping people to think of a cool signature!
              {{ DiscussionBoard.errors[6562411].message }}
              • Profile picture of the author radojica
                Originally Posted by Jay Moreno View Post


                There is actually a fourth which is adaptive... which is how WP Touch works, the mobile user does not get redirected but instead based on the user agent of the mobile browser it is served a different HTML structure that is optimized for mobile based all on the same URL.


                Jay
                That is actually the same as 3. from my list...

                scrip is detecting mobile devices and different html structure (or even content) is shown on the same page
                {{ DiscussionBoard.errors[6563437].message }}
                • Profile picture of the author Jay Moreno
                  Originally Posted by radojica View Post

                  That is actually the same as 3. from my list...

                  scrip is detecting mobile devices and different html structure (or even content) is shown on the same page
                  sorry for some reason i hadn't read it like that - but yeah thats adaptive design
                  Signature
                  Sorry, I am too busy helping people to think of a cool signature!
                  {{ DiscussionBoard.errors[6564518].message }}
              • Profile picture of the author azmanar
                Originally Posted by Jay Moreno View Post

                sorry azmanar thats not quite right - a responsive design doesnt redirect the user it simply changes the css styling to suit the screensize and keeps them on the same url... what you are describing is user agent based detect and redirect javascript.

                responsive design for me is a bad solution for mobile devices based on performance - i have explained more in detail here as to why...

                http://www.warriorforum.com/mobile-m...e-website.html

                Couple of pointers regarding video... whilst MP4 is supported by both Chrome and Safari the native browsers for iOS and Android, if a user switches out their default mobile browser for say mobile firefox the video wont play inside a HTML5 tag as its not currently supported... you will need to either supply an OGG video file for them to fall back to or simply present a link for them to download the MP4. Also dont forget to add a poster img variable too.

                If you want your video to be accessible by the broadest range of mobile devices dont use jplayer... instead use HTML5 video tag with MP4 and OGG video source files and fall back gracefully with a link to a 3GP video that will pretty much cover all your basis. If you are going to do a responsive design so people access your video on a desktop as well this is without a doubt the way to go.

                There is actually a fourth which is adaptive... which is how WP Touch works, the mobile user does not get redirected but instead based on the user agent of the mobile browser it is served a different HTML structure that is optimized for mobile based all on the same URL.

                Another pointer to make - personally i would recommend you do not use a javascript based redirect the reason being is that the Google Mobile Search Bot for both Smartphones and non Smartphones will not see it and will not properly find your mobile content. Additionally if you where to use screensized based javascript redirection there are known issues of screensizes not always report back as you would expect.

                Regardless of what method you prefer always run your sites through the Google Online Speed Test for Mobile... if your not getting a score of 90% or higher for your mobile site somethings wrong... and if your really brave enough run your site through the mobileOK checker! LMAO

                HTH

                Jay
                Hi Jay,

                Thank you for the corrections. Things get clearer between responsive & adaptive.

                So the safest route for Mobiles would be HTML5 and better stick to MP4.

                How about user agent redirect? Is it using html meta redirect?
                Signature
                === >>> Tomorrow Should Be Better Than Today

                {{ DiscussionBoard.errors[6563664].message }}
                • Profile picture of the author Jay Moreno
                  Originally Posted by azmanar View Post

                  Hi Jay,

                  Thank you for the corrections. Things get clearer between responsive & adaptive.

                  So the safest route for Mobiles would be HTML5 and better stick to MP4.

                  How about user agent redirect? Is it using html meta redirect?
                  hi azamanar, i certainly believe HTML5 is the way forward overall.

                  Check out PHP and headers() and also how to do user agent detection, with that knowledge you can set up any redirects, caching, compression, doc types, character types, etc and server the most appropriate to your visitor you can also use your headers to tell google if the content is for both mobile users and desktop users too.

                  For video i would personally use the HTML5 video tag and provide sources for MP4, OGG Video, and fallback to 3GP or MP4 for those dont support HTML5

                  HTH

                  Jay
                  Signature
                  Sorry, I am too busy helping people to think of a cool signature!
                  {{ DiscussionBoard.errors[6564535].message }}
                  • Profile picture of the author azmanar
                    Originally Posted by Jay Moreno View Post

                    hi azamanar, i certainly believe HTML5 is the way forward overall.

                    Check out PHP and headers() and also how to do user agent detection, with that knowledge you can set up any redirects, caching, compression, doc types, character types, etc and server the most appropriate to your visitor you can also use your headers to tell google if the content is for both mobile users and desktop users too.

                    For video i would personally use the HTML5 video tag and provide sources for MP4, OGG Video, and fallback to 3GP or MP4 for those dont support HTML5

                    HTH

                    Jay
                    Thanks Jay.

                    JWplayer version 5.9 claims to have auto-fallback to HTML5. I guess it is not a good idea for production until further testing.

                    Will follow your tips about using PHP for user agent detection and redirect.
                    Signature
                    === >>> Tomorrow Should Be Better Than Today

                    {{ DiscussionBoard.errors[6566027].message }}
                    • Profile picture of the author Jay Moreno
                      Originally Posted by azmanar View Post

                      Thanks Jay.

                      JWplayer version 5.9 claims to have auto-fallback to HTML5. I guess it is not a good idea for production until further testing.

                      Will follow your tips about using PHP for user agent detection and redirect.
                      Hi Azmanar - yeah for regular desktop sites many of these video players will work well, its just when you move down to mobile where you start having your problems

                      Feel free to PM you if you have any questions.

                      Cheers,

                      Jay
                      Signature
                      Sorry, I am too busy helping people to think of a cool signature!
                      {{ DiscussionBoard.errors[6566269].message }}
  • Profile picture of the author Sillysoft
    I also recommend Dudamobile. I get emails all the time from google adsense program recommending I convert my sites for mobile users and to use Dudamobile as its easy and free.
    Signature
    No more...
    {{ DiscussionBoard.errors[6561092].message }}
  • Profile picture of the author dimitri banks
    WPtouch automatically transforms your WordPress website into an application-like theme, complete with ajax loading articles and effects when viewed from the most popular mobile web browsing devices like the iPhone, iPod touch, Android mobile devices, Palm Pre/Pixi and BlackBerry OS6 mobile devices.

    WordPress › WPtouch « WordPress Plugins

    I am using this on all my WP websites , free and easy to use . Hope this helps
    {{ DiscussionBoard.errors[6561743].message }}
  • Profile picture of the author sriram rajan
    you can use jason fladleins WP mobile pro .. i think it converts your main site to a mobile friendly version with not much to do exceot for finetuning the offer and look / fell which is supposedly easy to do using that theme.
    {{ DiscussionBoard.errors[6562567].message }}
  • Profile picture of the author Randall Magwood
    You can use a program like fiddlefly.
    Signature
    {{ DiscussionBoard.errors[6562630].message }}
  • Profile picture of the author denysapu
    Originally Posted by Litherland View Post

    Hi

    Hope your having a good Friday!

    Can anyone please advise what tools i need or whose best to get in touch with regarding my website being 'mobile ready'? :confused:

    My website does load clearly on devices such as a mobile but i would like it to be mobile optimized.

    Can this be done by myself and if yes, what tools and how much?

    thank you
    That's not a big deal if you are willing to invest (just a few $$$ I think). There a lot people able to do that. Or PM me if you want to know that people ;-)
    Signature

    Don't worry be happy!

    {{ DiscussionBoard.errors[6579456].message }}
  • Profile picture of the author Litherland
    So many great answers thank you. I have some direction now.
    Signature
    www.mywillsuk.co.uk UK Will Writing Service
    {{ DiscussionBoard.errors[6579838].message }}
  • Profile picture of the author Jtraits
    If using WP -WordPress- there are themes that are ready for mobile devices ex: BusinessLite ... it can be modified as you want it to as well
    {{ DiscussionBoard.errors[6580031].message }}
  • Profile picture of the author seether101
    Banned
    if you made your site with weebly, it gets automatically mobile ready
    {{ DiscussionBoard.errors[6580043].message }}
  • Profile picture of the author Chris-
    There are lots of FREE Wordpress themes which automatically fit the screen on whatever devise they are read on. Find a good one of those and customise it to your needs

    Chris
    Signature
    HUGE Affiliate Opportunity! VideoBootstrappingMasterclass: 100% commission (paid in as little as 3 days), ideal for SEO, Video-marketing, MMO/IM audiences. For details:Click here for our Partner JV Page.
    {{ DiscussionBoard.errors[6580140].message }}
  • Profile picture of the author Thomas W
    I see so many complicated responses here. It's actually fairly simple

    Below is your 3 best options

    1. Get Free Wordpress plugin
    2. Dudamobile.com FREE Plan
    3. Get optimized mobile site Design ~$200 is about normal price these days
    Signature

    Established webmaster since 1998. Bought my first domain name for $70 and had to pay $1000 a month for hosting. It was the good life

    Skype: twool9
    Email me at thomasw9 ((((a)))) G mail

    {{ DiscussionBoard.errors[6580271].message }}

Trending Topics