Local testing of web pages

[smedz28]

When I create web pages I am testing them locally on my laptop through my code editor expression web by launching the various browsers I have installed and up until now everything has been fine. I’m working on a new personal page and it tests fine in firefox, chrome and safari but when I run it in IE9 the layout is all over the place. I tried testing via visual studio with webmatrix 3 and the same issue.

I then signed up for a free trial of browserstack and when tested in IE the layout was fine and matched the other browsers I tested locally. Unfortunately I don’t have the funds to upgrade to a full browserstack account at the moment.

is there any tool that I can use to run local tests that can be recommended? I don’t understand why the layout breaks in IE9 but tests ok in the rest so I assume that it renders the page differently in local testing as opposed to running it as a live site. Can anyone help explain why this would happen?

Thanks in advance

[__]

Using actual browsers is the best way to test. Most modern browsers have built-in dev tools. I don’t know how decent IE9’s are. Are you working on plain html pages, or is there a server-side language involved (PHP, for example)? In the former case, you don’t need anything more.

In the latter, you’ll need to actually run a web server locally. There are plenty of pre-bundled software packages that make this easy (e.g., xampp).

[smedz28]

just basic pages, htnl and css only. IE9 seems to render the page differently to all other browsers, paddings and margins are all thrown out making the layout break

[smedz28]

I think i’ve figured the problem out. I am using google fonts to load in the fonts for my main font styles and it looks as though when testing in IE9 the fonts weren’t loading and the fall back font family was breaking the layout. I changed my fall back font to something that better matched and all the alignment is now fine.

Typography is something I know very little about so I assume that the fall back had different base line sizes etc?

[__]

No, the font wouldn’t affect that directly: the CSS stays the same. The visual appearance might change because individual glyphs might have different proportions, and so forth.

[Carol]

Use proxy server app.

[Author]

Posts