Cross-Browser/Platform Website Building

[ITL]

I'm thinking about building a website (one day, maybe, possibly) to showcase any music that I write (one day, maybe, possibly). I'm reasonably proficient in basic HTML and CSS, but I'd like to make sure it works on as many browsers and platforms as possible.

I've been a-Googling for info on making websites compatible with mobile devices/smartphones, and it's a bit bewildering to say the least. So many incompatibilities. For a start, I'd need to avoid using a Flash based music player, as iPhones/iPads don't use it.

HTML5 and CSS3 can be used to make music players, but there's still compatibility issues with some browsers and devices, apparently. So I'm not sure where to start...

Maybe a WordPress blog/site would be better - many audio and mobile device plugins available. Alternatively, I could just join a music community site and let them do all the work - but from what I've seen, they're all crap anyway. Too many limitations, usually.

But if possible, I'd rather build my own site. Does anyone have experience of making websites compatible with as many browsers/platforms as possible? Care to share the wisdom?

 

[Kataaran]

I'm afraid there's no shortcut, it is to be honest a right bitch. If you want to support IE8 and below (XP users) you can't use much in the way of CSS3 or HTML5. Also you would need to consider what level of support you'd want to run to: looks good in everything or gracefully degrades, i.e. looks like poo in IE6.

If I were you I would look at a WordPress.com account or something similar, I think they offer paid for addons that allow for media uploads.

 

[ITL]

Bloody IE ruining it for the rest of us! hehehe.

Actually, I have seen an HTML5/CSS3 media player that degrades to Flash if it needs to, so that's one option - and I think there are free WordPress plugins that may do the trick. TBH, I'm leaning towards WordPress more and more. Still, it won't be for a while yet. Plenty of time to think about it.

 

[Mr. B]

Follow web standards, don't use absolute values in your CSS, write valid code, fix for IE later. It's not terribly difficult.

 

[Encifer]

My site has always looked exactly how I wanted it to look in Internet Explorer, it's Firefox that always messes everything up. A specific problem that I remember is that Firefox reads table borders differently. It's super frustrating because I get everything looking perfect and then I open up Firefox and everything is misaligned and wrong. I guess that's just the way it is though. It's near impossible to get it right the first time. The only problem I have now is out of date versions of Internet Explorer. I don't know why people are still using really old versions of IE, but they are and they see a broken version of my site. I haven't found a solution yet

 

[Mr. B]

Use DIVs instead?

 

[Robert Maxwell]

Are tables even valid HTML anymore? I thought they were deprecated.

 

[Mr. B]

Tables are still valid but most inline values are not. There are occasions when you want actual tabular data... their intended purpose. Of course everyone including myself used them to arrange whole websites.

 

[YellowSubmarine]

Follow web standards, don't use absolute values in your CSS, write valid code, fix for IE later. It's not terribly difficult.

And don't use Flash, please. As a proprietary technology it's completely non-standard, and some of us don't want to have it installed and/or enabled, especially after the numerous security issues in it that have tended to pop up.

To contrast with all the things that you can blame Apple for, not supporting Flash on iPhone/iPad was a huge service to the Internet.

 

[Kataaran]

^ Yep, most Flash bits on websites could be done just as well with jQuery and well formatted HTML. Accessible, smaller files sizes, and can accommodate various screens/devices.

 

[Mr. B]

To contrast with all the things that you can blame Apple for, not supporting Flash on iPhone/iPad was a huge service to the Internet.

Let's not pretend one of Steve's temper tantrums was some noble service to the public. Flash is still in wide use in many applications outside of entire web interfaces... would be nice if they'd work on my phone.