My First Responsive

I've recently made my funny insults (http://www.funny-insults.com/) website responsive. Can anybody please give their opinion on it? Thanks!

 

Actually it looks nice in the responsive result @ the very first look...

 

It looks pretty in a desktop browser, but some stuff isn't quite right, in my view.

<meta name="viewport" content="width=device-width,maximum-scale=1,initial-scale=1,user-scalable=no">

HTML:

Should be:

<meta name="viewport" content="width=device-width; height=device-height; initial-scale=1.0;" />

HTML:

I can't stand it when I can't zoom in on a page on my phone.

There is an excessive amount of JavaScript. Is it actually all needed? Ditch JQuery and do it purely with JavaScript. You will find that your code is smaller.

Try to avoid "web fonts" or whatever you want to call them and instead specify web safe fonts - on most people's systems and don't require extra downloads.

Take a look @deathshadow's www.ewiusb.com as this is a very good example of a responsive site. Also his posts are excellent on web design in general. You will find a lot of good advice for making your site leaner and quicker to load (as it was slow).

By the way, where is the search box when I change the browser window size?

 

Responsive is a matter of view -- IMHO you don't have responsive as you are missing the two steps you should have BEFORE the page is made responsive: Elastic and Semi-fluid design. Your max-width is way too small, which when mated to the absurdly undersized inaccessible fixed metric (px) fonts it's an accessibility wreck. Trying to throw responsive at an accessibility mess is just trying to dump shellac on a pile.

Of course under the hood it's the typical garbage I expect the moment I see an HTML 5 doctype; the worst of 1990's coding practices since 5 doesn't seem to have been made for anyone who embraced any of the improvements in markup methodology of the past sixteen years; on the contrary it's carefully crafted for the folks who continue to piss out HTML 3.2 and until recently were slapping 4 tranny on it... now that same broken bloated methodology gets 5 lip-service at the start for zero net progress.

You've got disastrously invalid and gibberish markup; META inside BODY? Incomplete FORM's (no LABEL or FIELDSET?), pointless code bloat thanks to redundant TITLE attributes? (if TITLE == content of the tag, there's NO reason to put a title on it unless you've got accesskeys!) Javascript-tard href meaning zero scripting off graceful degradation? (unwritten rule of scripting, if you can't make it work without scripting you have no business adding scripting to it!), endless pointless DIV for nothing, gibberish use of numbered headings, static style inlined in the markup so much you might as well go back to using pre-CSS HTML, so on and so forth...

Which is why it wastes 46k of markup to deliver less than 4k of plaintext -- anywhere from three to four times the code such a simple page should need. Of course the megabyte plus page load -- most of which can be blamed on the "JS for nothing" -- is such a disaster my only advice would be to throw the entire mess away and start over from scratch.

... JS for nothing and your scripts for free. That's not working, that's not how you do it. Lemme tell ya, those guys ARE dumb.

 

@ryan_uk, thank you for the suggestion with the viewpoint meta.

Regarding the other things you said and the previous poster - the code has been bastardized by Google PageSpeed Service. I assure you I'm not that much of a douche. That rewriting system is why the code looks crazy. I understand this. However, really, I am enquiring about the look and feel, not necessarily the coding layout. Thanks.

Also, @ryan_uk, regarding the fonts - I must admit that I'm a fan of the CSS3 font functionality, so I think I'll stick with it!

And the search box? It vanished!

@deathshadow, you put way too much negativity in your rants. Just be fair and to the point. We'll agree to disagree on the design aspects, but I can't be bothered to read most of your gibbering rant.

 

Like I mentioned, the search box. Just because the visitor's screen size is smaller for whatever reason, why should they be deprived of a search box? Place it appropriately.

Loading speed is an issue, especially when using a smartphone. I just opened your site on mine and it took far too long. That was with a H+ connection on full bars. So the feel of it is slow and, if it wasn't for the fact you asked for a review, I would have bounced during loading. I just tested some other sites to ensure it wasn't my connection, but they all loaded a lot quicker.

 

Thanks, I'll look into the loading speed of the page. I'll also review my choice to use Google PageSpeed Service, but if anything, that *should* speed up the page with the amount of optimisations it does and local cloud-based delivery of the site

 

To be honest, I don't think you need their service. The optimisations you should be able to do in terms of HTML, CSS, JavaScript and PHP should be more than enough. Set the right .htaccess rules and it will help even further (such as caching files and how long for, etc).

 

Generally speaking such "tools" as Google's PageSpeed service are - and I'm saying this a lot lately little more than polishing a turd; that most of my sites would in fact load roughly the same or even SLOWER using their idiotic "let's throw more code at it to make it 'faster'" approach to development, let's just say that scam doesn't exactly blow my skirt up. Of course that they now claim that increasing cache time is good for mobile -- devices with SO much RAM and reliable high-write permanent storage -- if that's not setting off your BS alarm, I don't know what would. Of course, this whole BS idiocy of dicking around with browser caching models as if their default settings somehow aren't 'good enough' just shows a level of stupidity that religious extremist fundies would go "wow, that's ignorant."

Of course, like a lot of other web development "tools", the moment someone tries to automate it the result is rubbish. The best tool exists between your ears, anything else is bull.

... and your code IS impacting the usability -- that's WHY I bring it up; not only is the entire thing painfully slow loading, the gibberish use of headings means you can't heading navigate it, the lack of semantic markup impacts it's usefulness with screen readers, the px metric fonts leave me diving for the zoom or bouncing. The goofy broken layout with the endless "gee ain't it neat" script-tard bull also would make me not bother with the site. It's an inaccessible mess, and the bad markup and worse practices are responsible for that.

... and trying to blame that on some goofy tool isn't right; though admittedly using such a tool instead of just fixing what's wrong with the page is also broken methodology. Whenever someone says "Let's throw more code at it" your common sense should tingle... EVEN when it's Google saying so. Though honestly, they're coasting on their reputation given what halfwit scam artist bull Analytics, PageSpeed insights and PageSpeed Service are... much less pissing on the accessible search that was responsible for them making every other search engine an "also ran" -- time is ripe for SOMEONE to make a serious go at taking them down! Too bad DuckDuckGo went and ditched their original concept and are now bound and determined to be the next "Ask Jeeves".

 

Nice website, some funny insults really makes you laugh.
Its look like that you have put in hard efforts to find all this insults.

 

The fluid parts of the site worked well in both my browser and android phone. I'm using an Android S4 and the site was easy to navigate. I resize my browser to see all the size changes. I didn't spot any issues like overlap or ads not changing.

 

I'm insulted! As soon as I visited your site, some guy flips me off! lol nah I'm just kidding. The site looks pretty good, but tbh it resembles a flash arcade site in my opinion.

 

Thanks! The website is a has been slowly developed over a period of years since its launch.

Thanks! I did try to make sure that it fits all screens well.

Hahaha. I think off the bat you know that it's not a half-serving. Some of these are funny, some are down right harsh. Even the logo flips you off. Haha.