I have made a website in simple HTML and CSS (no JS).

I hope it would be compatible with as many browsers as possible.

Is there a free and open source solution that can test and reveal the oldest version of each browser compatible with my site? I want to be able to say something like: This site is compatible with FF v60, Chromium v50, Safari vxx, etc.

Or make a compatibility table so users can know that this was tested.

  • JRaccoon@discuss.tchncs.de
    link
    fedilink
    arrow-up
    10
    ·
    2 days ago

    Most browser compatibility issues come from JavaScript, not HTML/CSS. Unless you want to support ancient/dead browsers (like Internet Explorer or non-HTML5 browsers), it’s very likely there won’t be any issues.

    MDN has a compatibility table for every HTML tag and CSS property. For a simple static site I would just manually check there.

  • VerPoilu@sopuli.xyz
    link
    fedilink
    arrow-up
    5
    ·
    3 days ago

    There is this tool if you use stylelint for linting: https://github.com/RJWadley/stylelint-no-unsupported-browser-features

    Given that your website is very simple, I assume it would be a pretty big rabbit-hole to dig into.

    It wouldn’t reveal the oldest version of each browser compatible with your website, but it would check your css against a predefined list, and alert you if you use something that is not compatible.

    Otherwise, if you are ok with checking manually, check out BrowserStack: https://www.browserstack.com/ It’s neither free or open source, but it simplifies testing on many browsers. There is a free plan as well.

  • PiraHxCx@lemmy.dbzer0.com
    link
    fedilink
    English
    arrow-up
    1
    ·
    edit-2
    2 days ago

    Hmm, I have a blink and a gecko browser on desktop and mobile, and open the site on both to check how it’s being displayed :S

    I hear a lot of people complaining about sites breaking on Firefox, but I never experienced that, only on secure forks that removed canvas, webgl and webgpu.

    I have a few static sites as well and I use JS. The only thing I noticed changing, that can push elements weirdly, is scroll bars, buttons, the default audio player… but you can edit those with css to look similar on both browsers.