We want to be able to implement cross-browser compatibility by overriding markup, scripts and styles only where necessary. We want to avoid forking everything sent to the browser, as has been done in the past!This has led me to a directory structure with one folder per page, with master markup, script and style files, and their respective overrides, one per browser. The file names, both master and overrides, would be the same from folder to folder, and the code linking them all together can be shared (all the relevant resources can be pulled in with relative urls). MyPage(folder)|--Index.aspx|--Markup.xsl|--Markup_ie11.xsl|--Scripts.js|--Scripts_ie11.js|--Styles.css|--Styles_ie11.jsAnotherPage|--Index.aspx|--Markup.xsl|--Markup_ie11.xsl|--Scripts.js|--Scripts_ie11.js|--Styles.css|--Styles_ie11.jsI have a test project with all this working nicely, but I'm very nervous about so many same-named files, and the file name on its own giving no clue to it's purpose. Nevertheless, compared to our old organisation based on filetype, some advantages jump out: the files you're likely to work on together are stored together. The folder tree is flat. The folder names are much more meaningful, and I have less need to search. There are 1/8th the number of hardcoded paths in the application (scripts, styles and markup are pulled in with relative links).Can anyone think of a reason not to do this ???
How should I structure my web app for browser compatibility?
project structure;directory structure