The Stuff You Haven’t Been Told About How To Make Your Website Mobile Friendly

Back in May I wrote a post talking about trying to make my sites mobile friendly. I shared some links in that post where you can check to see if your sites are ready for mobile or if they need some work. I also had a few gripes in that post; that’s because no matter what I was reading, I just couldn’t figure things out.

code101

At least my blogs were all fine, thanks to WP Touch. I use the free version because I don’t need all the bells and whistles that come with it, but it’s a fabulous program that helps WordPress blogs become mobile friendly. If you’re not using this and aren’t mobile friendly, it’s a plugin you need to check out.

For the rest of us… well, it’s basically taken me over 5 months to finally figure out what was going wrong with all that I’d been trying to do to get my sites mobile compliant, and when I finally figured it out, it turns out that the information wasn’t on any of the websites I’d been reading. So, I’m going to address some of what I discovered on my quest; some is on other sites, some isn’t, and some wasn’t explained fully. These won’t be in any particular order, but I’ll number them in case there’s some you already know and some you don’t.

1. Table coding structure

Do you see that code above in the image? All coders know that, except for a couple of enhancements, that’s the basic table coding structure for websites. This particular snippet is the code I use when I put images on my blog posts, whether they’re mine or whether I’m using the Compfight plugin, which finds free images that are allowed to be used via Flickr and Creative Commons.

Anyway, most websites use this structure to put their websites together, whether or not they also use CSS (cascading stylesheets). At least they use it as an initial basis because it’s stable and helps lock many elements into place.

The problem as it concerns mobile comes when you’re designating specific sizes that might be higher than what mobile will allow in general. I’m one of those anal types who usually set my initial tables at 90%, which means that my content would spread out over 90% of the space on someone’s monitor. I’ve always thought that helped things look pretty cool… but it turns out that it ends up fighting anything you try to do with mobile. It’s the reason this code I had found, meta name=viewport content=”width=device-width initial-scale=1″, wouldn’t work on any of my sites; ugh. What I decided to do was take out the width connected with my main tables. That helped a great deal… but there’s more (as always lol).

On some of my sites I was using the Google box ads. To make them format within my content I used the same table code.

On my medical billing site, the size of the menu on the left side and the size of the table in the content made the mobile version too big. I couldn’t shrink the size of the menu, so I had to remove the box code. That brought the pages on that site that I altered into compliance, and instead of fighting to keep the side box I switched to a different code… which I’ll come back to later.

On my main business site, I totally removed all secondary tables and went back to original coding instead, using the main table only and breaking the two columns up by using the

tag. I also altered the size of the two columns by making the width of the first td tag to 15% and the second one to 50%. I needed to go with the 65% because on that site I have two images up against each other, and they wouldn’t show properly if I reduced the size of the columns more.

2. Logo images

If you go to the page that talks about speed, it’ll recommend that you reduce the size of your images so they’ll load faster. What they don’t tell you is that you might need to reduce the width of your images as well for true mobile compliance.

On my medical billing site, the logo was 793 pixels; on my business site the combined size of the two images was around 850 pixels. That’s way bigger than the allowed size for the initial mobile size, thus you’ll never be mobile compliant that way. Although I loved the way the larger images looked, I knew I had to make a change.

Screenshot_2015-11-02-00-41-02

For the medical billing site, I reduced the width of the image to 400 pixels. On my main browser it’s definitely smaller, but still looks pretty cool. On my business site, I went a totally different direction and changed the height to 100 pixels for both images. It reduced the size of them both enough so that they would be compliant. The only problem I have is that if you look at it on the phone lengthwise the first image sits on top of the other one but I can deal with that because one, I doubt many people will be looking it up on their phone (maybe the blog), but two, if they’re like me they’ll probably turn their phone sideways, where they line up properly.

3. Google code

If you read that previous post, you will have seen my little rant that one of the issues turns out to be Google’s own stupid code. The code size that always worked the best was the 728×90 ad, which one normally put at the top of a page. Well, that 728 is way too big for mobile phones, so it looked like Google wasn’t giving us a choice of what to do.

Turns out they had made a relatively recent change that I didn’t know about, that I learned of from Lisa Irby’s YouTube channel, where she was talking about responsive ads and how one of her friends had doubled his income since switching. I don’t know about all that, but what I discovered is that if you use the responsive ad, it alters its size based on where people are viewing it. So, if it’s on their home browser they’ll get a big ad, even bigger than the 728, and if it’s on the phone and people aren’t blocking those ads they’ll show up perfectly for them and as big as they’re allowed.

I tried this out on my medical billing site and it works wonders! However, remember earlier when I was talking about using the tables for the ads within my content? For some reason the responsive ads won’t work if confined, and the table made the overall size for the phones being viewed lengthwise that it took them out of compliance. What I’ve done instead is killed that side box and put a second responsive ad at the end of the content. Since I was only running two ads on each page, and hopefully people are reading all the way to the end of those articles… all should be good long term, and I’m still mobile compliant.

4. Viewport code

Remember that viewport code I shared above? I had a couple of pages where I was having trouble with it in that form. The Google insights page kept saying to use the code as given; forget that mess. Most of today’s smartphones will handle a width size of up to 525 pixels, so what I did was alter the code and make the width 500. I had seen this figure altered on a couple of pages I visited while trying to figure things out. However, what none of them did that I did was to leave the second part of that script in there, the initial-scale part. For some reason it helped bring everything together; I can’t explain it but it worked. 🙂

By making all these changes, my pages were suddenly mobile compliant; yay! That doesn’t mean they’re perfect by any means. If I put the code into the insights page, it keeps finding recommendations to make to try to get to 100%. However, the main thing we all want to achieve is compliance, since that’s the thing Google is penalizing some of us for, and these changes overcame that.

To think, it only took me 5 months! lol Hopefully, if you’ve run into any problems this will help you solve some of them. I still have a ways to go to get to all the pages on those two sites, and I have one more site where the coding was so intensive that I’m going to have to do something drastic with it… but at least I now know what needs to be done… and you do also. 😉
 

I Wouldn’t Have Commented If…

I love reading and commenting on other blogs. I know some people think it’s too time consuming to do, but I enjoy reading a lot of different types of things. I also love encouraging bloggers, as well as having an opinion on stuff; hey, look at how many articles I’ve written on all my blogs. 🙂

(64/365) Really really really ow...
Sarah via Compfight

However, I have some rules for blogs I won’t comment on. One, if it takes my having to create some kind of account or having to put in a password or register, I’m not commenting; sometimes I won’t even read those blogs. This means if your blog uses Disqus, Livefyre, or something like that, or if it’s on some website that requires people to join, I’m not going to bother. Yeah, it’s kind of a picky thing, but there’s so many other blogs out there that are enjoyable and easy enough to comment on without having to deal with it. After all, I don’t have unlimited time.

Ah yes, let’s look at this “unlimited time” thing. You know, visiting blogs and leaving comments does take time. When I’m in the mode though, I don’t mind that. However, there’s something I do mind, and a lot of y’all are now doing it.

I hate going to a blog, commenting, and then immediately receiving your stupid email asking me to confirm that I want to subscribe to blog comments. Come on; are you kidding me?

When’s the last time someone left a “real” comment on your blog and didn’t want you, the writer, to respond to it? I’m not talking about those lousy one line comments or those that tell you how great a writer you are but never address the content. I mean real comments, those you know aren’t bad, even if they’re not great.

I know when… never!

When’s the last time someone left a comment on your blog that was pretty good, only for you to discover that they put someone else’s email in it so that, when you responded, you got an angry email from someone saying “Hey, I didn’t comment on your blog”?

I know when… never!

So then… what’s the purpose of this double opt-in process other than to clog up my inbox? Actually, I know it’s a trick by some folks because when I read the email it actually talks about subscribing to receiving a newsletter whenever you post something new; I hate that kind of bait and switch.

For the rest of you though… come on, what’s the point of this? I’m serious; I just don’t get it.

I know what some folks are going to say; don’t click in the box. There’s another little bugaboo I’m going to gripe about.

For most blogs, if you don’t click that little box, you’re not going to be notified if the writer or anyone else responds to your comment. My blog is like that, as I had to add the plugin because my theme is older, and at the time no one was getting notified that I was responding to them.

There are a few blogs where, by clicking in that box, you end up getting that email with the subscription message, but if you don’t click on it you still get notified when someone replies to your comment. That’s not the norm though.

If people actually click on the box, they want to get comments; trust me on this one. If they don’t… well, we never know who clicks on it and who doesn’t (at least I don’t), but if the comment is good enough and you care about your blog and “all” of your readers, you’re going to respond to the comment anyway right? RIGHT?!?!? 🙂

Please, for the love of chocolate, turn off that feature, whether you’re doing it for comments or trying to sneak through a subscription to a newsletter (if you are, you’re being kind of scummy). It’s unneeded… unless someone can give me a really good reason for doing it. Remember though, I’ve been blogging for more than 10 years, so it better be good!
 

Promoting Ourselves, Our Content, Our Videos… Everything!

You know, I’m good at giving advice. Sometimes people don’t take it. Sometimes they do, and when they do, things always seem to work out well for them. Not that I’m perfect or a know-it-all, but I’m pretty good at analyzing other people’s habits and troubles and helping to find a solution that helps. After all, I am a consultant. lol

me as Peanuts character

Kind of me lol

Often, people follow my advice… after someone else tells them what I’ve told them. I’ve recommended to some people to start blogs. I’ve recommended to some people that they should be doing videos. I’ve recommended to some people that they should be doing interviews, even podcasts. Eventually they all do it… after someone else tells them after I’ve said it.
Continue reading Promoting Ourselves, Our Content, Our Videos… Everything!

How To Write Review Posts

If you ever run out of ideas of what to blog about, something you might consider doing is reviewing a top website that’s in your industry or on the fringe of an industry you’re a part of. I’ve just written and published a review on one of the top medical information websites in the United States on my Medical Billing Answers blog and I thought I’d share the process I used for writing the review without necessarily talking about the review. Of course, if you decide you want to read it & learn what I had to say… it’s all good. 🙂

120602-N-GL340-020
U.S. Pacific Fleet via Compfight

First, you have to decide what your intention is in wanting to write a review, other than the fact that maybe you couldn’t think of anything else to write about. In my case, my website takes on not only medical billing issues but health topics as well. I was already pretty familiar with the site I decided to review and it seemed to be a perfect fit since I’ve visited it many times over the years. This way, I could see whether it fit my standards or not by looking at it deeper than I had previously.

Second, you have to set up your general criteria for what and how you’re going to review a site. In my case, what I decided to do was come up with 5 questions that I thought a lot of people might search for, but not necessarily the top questions that everyone would search for. For instance, there’s probably a lot of people who go looking for more information on how much water they should be drinking. Instead of going with the norm, I decided to look for information on how much water is too much water to drink daily.

I also decided for some of them to write them up as a question, the way many people do today when searching for information on the internet. I don’t know anyone who would put in “drinking water” expecting to find out how much water is too little or too much so it made sense to do it that way. However, a person who’s been given a new prescription might put in the name of the pharmaceutical and nothing else when wanting to get more information on it; I did that as well.

Third, if you really want to be fair you should look around a bit if you don’t find what you’re looking for immediately. I did that and, unfortunately for the site, a couple of times I couldn’t find the information I was looking for; quite disappointing. That’s the kind of gripe I used to have when I was trying to fix things on my blogs in the past and, when I’d find a site, be disappointed because the articles would leave out a lot of things in the middle, assuming we would already know all the other stuff.

In this case, when I didn’t find the answer on the site I went to the search engine and looked up the information to see if it was elsewhere… and it was. To me, that’s a major fail. However, the extra research helps make the review that much stronger.

Fourth, try not to go in with unfair expectations or personal feelings. Whereas I always thought this site was top quality (it was also one of the earliest sites on the internet covering this kind of information), it’s never been an exclusive site for me to go to. Therefore, though I knew of it, I had no real expectations one way or the other. I wasn’t harder or softer in reviewing it than I might have been if I knew any of the people who put the site up; it’s always good to be neutral before reviewing something.

Fifth, set up a way to grade the sites and then explain it. I decided on the American school grade system of A-F because I figured most people would be familiar with it, though I could have gone with the stars. I felt the letters gave me more flexibility because of the added “+” or “-“… one of which I used in my review.

Those are the steps I took, and I got a post of nearly 1,400 words out of it. I have to admit that I toyed with the idea of adding that sites logo to the post as my image but in the end decided to go with something totally different; that’s all I’m saying about it unless you decide to visit the post. lol

There you are; now, what will you review?
 

I Am A Professional

I am a professional. That might look like a bold statement until you have an understanding of the definition of a professional.

Agnes and me
Agnes and me

A professional is someone who gets paid for work that they do. If you cut down trees for a friend and they pay you, that might not make you a professional. If you cut down trees for a few people and they pay you for it, you can call yourself a professional tree cutter. It doesn’t mean that’s your entire career, but if you can make money doing something more than once, you should consider yourself a professional at it. It doesn’t mean you’re an expert; it just means you’re a professional.
Continue reading I Am A Professional

Blogging, Social Media, Writing, Motivation and General Stuff