Tag Archives: Browser

Mobile or Responsive? How about both

by

This started off as just another reply, before I realized I’m me and I don’t know when to shut up so here’s a reply in post form.

There’s little reason to be either/or in this case though.

I’ve been working on a side-project (a discussion forum basically) and been experimenting with ideas on mobile friendly pages.

It’s far from perfect, but for my purposes, it gets the job done. And I don’t claim to be a design “expert” since that’s not my forte, but I have designed for clients before.  I… er… “borrowed” a few topics from the front page of the WP support forums for the first example before switching to faux latin for the rest. Also stole borrowed the sidebar cues for the “topic” page from the support forums as well (which is running bbPress), but I’m using none of the same CSS. I think I’m done with Version 3.

I’m using just one stylesheet that makes the page adapt to any screen size between a minimum 480px to 1000px+ and the visitor doesn’t need to refresh the page.

I kept the range at that wide because there are still users of older monitors (that they don’t want to change for whatever reason or are unable) that still deserve to participate online and those are usually maxed out in the 800 – 1024 range. Tablets also fit the upper limit of that range these days.

Anyone should be able to resize the browser and see the page change styles. The “mobile” version (on the smallest window size) was designed to give maximum contrast. That’s to make it easy on the eyes since it’s pretty painful to browse a lot of sites with their tiny-weeny text and ridiculous backgrounds on a mobile device.

There’s a drive to create these “mobile specific” pages, if that’s the right term, from a lot of web designers and I totally disagree with the premise. I can understand if it’s a heavy-duty web application where one template can’t serve all platforms, but in most cases, it’s just a corporate site or blog that can just as easily be served with an adaptable stylesheet. I think it’s just narrow thinking for the most part.

It’s absolutely possible to design a site that will adapt gracefully to a mobile device while not depriving the desktop experience. Just a matter of leaving aside the junk, of which there is plenty sadly, being served to the client regardless. I wrote about that too a while ago.

Don’t get me wrong. There are very talented designers out there that go out of their way to make attractive mobile pages, but their focus should be “how much” they send to the client and not just “how pretty”. Data plans aren’t cheap after all and “unlimited” plans aren’t really “unlimited” or available everywhere a lot of times. Also a lot of mobile browsers aren’t capable of the voodoo that desktop browsers are capable of (yes even Safari on iPhone).

Sometimes designers just need to step back from their projects and go “what is it that I’m trying to accomplish here?”

The golden rule of web design always applies. The theme should fit the content, never the other way around.

Well, hopefully all that made sense. I don’t normally comment on web design choices unless they’re keeping me from browsing comfortably (like the Huffington Post which I’ve abandoned as a result), but since I was interested, there ya go.

8:00PM I’m tired and it’s been a long day so I’m off to hit the hay. Night!

No such thing as an obsolete browser or OS IV

by

This is a little update on Steve‘s suggestion. You can view past updates for OSes in 2008, browsers in 2009, OSes and browsers in 2009, and in 2011. And just as before, we still have a few hits from IE 2.0. Though in what seems to be common trend across a lot of sites out there, Safari and Firefox are far ahead of Internet Explorer. Don’t know if this will change with the proliferation of Windows phones and Safari most likely includes a sizable number of iPhones.

On the OS front, Windows is still ahead with XP having the same usage share of Mac OS X. I believe “Windows NT” includes Windows 7/8 and Server 2008.

Browsers visiting eksith.com in September

Operating Systems hitting eksith.com in September

 

WordPress Broken on IE?

by

Update: The TL;DR version of this post is that I’m stupid. Read the bottom.

This started last night, but it seems it hasn’t been resolved yet. I had to make the last post in Firefox because WordPress is suddenly uncooperative in IE. Apparently IE has effectively been cut off from the WP “experience” as of yesterday.

It’s 9.0.8… And it was fine a little while ago.

It’s the same version of IE!

I just tried making this post in IE and it only got saved to drafts. Wouldn’t publish at all. The fonts don’t look all that great either.

Front page on IE

Front page on FF

And the stats page is not opening up either and is stuck on “Loading”. Even the loading screen looks different in IE vs FF.

Stats loading page in IE

Stats loading page in Firefox

I’m hoping this is just a momentary glitch and the WP folks haven’t decided to completely cut off a very large percentage of the web populous.

Update

Thanks to timethief, I found out that I’m not as smart as I think I am. IE’s “Compatibility Mode”, an archaic left over from the days where web designers created sites with only IE 6+ in mind, was on all this time and I didn’t even notice. Not that I’m trying to resuce what’s left of my pride here, but I’m sure I did NOT turn on compatibility mode. IE has a habit of turning it on when visiting sites that are broken and then forgetting to turn it back off.

But in my defense, tell me how easy it is to spot the difference.

Compatibility mode On

Compatibility mode Off

 

Web Minimalism and Sucking at it

by

The original title to this post was “Everything New, Sucks”, but I thought I’d be nicer as to not take a complete 180 considering my last post. My New Year resolution to be less grumpy is looking shakier by the day.

Beyoncé style  = Whitney code?

I’m truly dismayed how some of the seemingly beautiful layouts are actually courtesy of HTML, CSS and JavaScript that look like the residue in a crack pipe. If the front page of your site is drafting more hobbled scripts than the average backend dashboard, then you’ve got problems son. It’s almost like no one really cares how it’s all put together as long as it looks good.

I know minimalism is the new in-thing in web design, almost to the point of being outright confusing or silly, but can we at least extend the sentiment to the scaffolding too? Or else, it kinda seems stupid, you know, hypocritical.

I also come across a lot of designers who quite loudly espouse their work is only meant for “modern” browsers and will actively block access from older browsers rather than encouraging them to upgrade or change them. The excuse is that older browsers “break” their carefully carved patchwork of copypasta.

“Break”?

If it makes your site unusable, go back and fix your work. It’s called pride in workmanship, you misanthropic troglodytes!

I know its fashionable to rag on the browser, but people aren’t going to change their browsers because your work doesn’t work on them. Deal with it.

Can I read the text? Can I see the images? Can I still “use” the site? Does your site have actual “content” that I can still consume? MOST websites will work in older browsers, even HTML 5 ones, once you stop giving it meaningless improvements, and “breaking” is acceptable as long as the content is still accessible. If you absolutely have to use the new functionality for something, then at least use Modernizr to make it usable on older browsers.

Which brings me to…

The HTML 5 Bug

Now slightly more infectious and deadly than H5N1. I’ve got nothing against it, but it seems it’s being abused by the same mindset that made the bad ol’ days of HTML 4 almost as unbearable. The fact that HTML 5 is new and hip doesn’t mean you stick every new tag in your design inappropriately and call it progress. The draft isn’t even finished yet and I’m already seeing designers making ridiculous uses of the footer, header and map tags.

I.E. I’ve  seen <map> still being used being used as a navigation bar instead of… and here’s a shock… the bloody <nav> tag. I’m sorry, is this 1999? Ah, but it’s OK, because the rest of the page is HTML 5.

<map> Is meant to be used for image maps and can designate clickable areas on an image for page interaction like photos identifying people.  I can accept that HTML 5 is here to stay and there’s nothing that can be done about it, but at least learn to use it properly!

I wouldn’t be this upset if it weren’t for the fact that the above abomination was the work of a “professional web designer”. Well, I’m not a professional web designer and even I know this. And if you still can’t get it, well then maybe you should be doing something else… like making soap.

Quit scripting your sites to death

There’s a post by Jim Dalrymple made last month that really puts into perspective how much rubbish is loaded asynchronously after the content itself has arrived. All the extra bloat just bogs down the browser until everything else arrives so even if the content is there, you can’t scroll to read it.

The real kicker is that the biggest load on that list was BGR and that’s a “minimal” layout. “The Biggest Letters in Tech”? Apparently.

And most of these aren’t even useful, but rubbish like Avalanche meant to drive traffic to content devoid of content. The rest are poorly engineered statistics widgets that have better use as browser stress tests than gathering user data on a production site. Or are ad widgets. These scripts are massively inefficient because they’re doing a lot of server-side work client-side in an effort to offload some of the burden on their own infastructure.

JavaScript isn’t C++ so quit treating it like so.

And what’s with designers and content managers not caring about what they include in the HTML sent to the visitor?

I checked the source on CNN.com and found the following buried in an HTML comment around line 200 :

	Last snapshot: 12/12/2011 11:30 AM
	IF auto generated include above stops working, uncomment the html below and manually update at hourly intervals:

<li class="pmNsStory">
    <div class="pmNsHeadline"><a href="http://www.cnn.com/2011/12/11/opinion/graham-debate-romney/index.html">Opinion: How Romney blew it</a></div>
    <div class="pmNsPopularity"><div class="pmNsPopImage" style="width: 98%"></div></div>
</li>
<li class="pmNsStory">
    <div class="pmNsHeadline"><a href="http://www.cnn.com/2011/12/11/sport/ryan-braun-drug/index.html">Spokesman: Braun will be 'exonerated'</a></div>
    <div class="pmNsPopularity"><div class="pmNsPopImage" style="width: 69%"></div></div>
</li>
<li class="pmNsStory">
    <div class="pmNsHeadline"><a href="http://www.cnn.com/2011/12/11/us/pennsylvania-paterno-hospital/index.html">Panama's ex-ruler Noriega returns home</a></div>
    <div class="pmNsPopularity"><div class="pmNsPopImage" style="width: 67%"></div></div>
</li>
<li class="pmNsStory">
    <div class="pmNsHeadline"><a href="http://www.cnn.com/2011/12/12/world/meast/syria-unrest/index.html">Ex-Penn State coach Paterno hospitalized</a></div>
    <div class="pmNsPopularity"><div class="pmNsPopImage" style="width: 59%"></div></div>
</li>

… Really?

And just for kicks, I went to MSNBC.com and discovered the actual “content” starts at line 716 :

And that's not even the real beginning.

Even after turning off word wrap, the first third of the source is nothing but inline JavaScript and CSS and so is a full half of the entire source.

Mind you, both are meant to be “minimal” designs far removed from their older, uglier, “less efficient”, versions.

I haven’t checked the mobile versions of these, but considering most people pay for their data plans by the MB, even if they’re half the size of their desktop counterparts, the designers of these and other bloated sites are doing a huge disservice to the very people who are paying their bills.

Any Browser is Dead. Long live bloat!

When did it become fashionable — respectable even — to design websites so poorly and with so much extra rubbish that it would be unusable? Forget people with special needs, I mean the average Joe with a decent computer, modern browser and a good internet connection would be in imminent danger of a face-full of glass shards or plastic splinters if he even dares to visit some of these sites.

The common excuse is that, well, you have to make sure that the site’s added features need a lot of capabilities that aren’t available on older browsers. I have news for you: The web has been around for longer than some of you designers have been alive and the core use is still the same. To consume content.

The vast majority of effort on any site should be on the backend. The core architecture, the security, the control panel, the security, the database, the security. Sort these out first and you will find yourself spending less time needing to make UI improvements. A good workflow will encourage a good UI.