다양한 브라우저에서 내 웹 사이트가 어떻게 보이는지 어떻게 알 수 있습니까?


46

다양한 브라우저에서 내 웹 사이트가 어떻게 보이는지 어떻게 알 수 있습니까?

실제로 서로 다른 브라우저 버전이 모두 설치되어 있지 않은 경우 미리보기를 제공 할 수있는 도구 나 서비스가 있습니까?

답변:


38

2
나는 괄호 안의 의견, 좋은 대답을 좋아한다.
Larry Smithmier

32

브라우저 ShotsBrowserLabs 는 내 머리 꼭대기에서 생각할 수있는 것입니다. 내가 사용한 다른 것이 있다고 생각하지만 지금은 그 이름을 기억할 수 없습니다.

편집 : 슬프게도 Adobe는 2013 년 3 월 13 일에 BrowserLab 프로젝트를 종료했습니다 .


1
BrowserShots를 사용하면 모든 항목을 선택 해제 한 다음 IE6와 같이 원하는 항목 만 선택하면됩니다. 도대체 누가 "딜로"를 사용하고 있습니까?!
DisgruntledGoat

10

LitmusApp 는이 분야의 새로운 선수입니다. 현재 주요 부가 가치는 전자 메일 클라이언트 테스트 (모바일을 포함한 33 개 클라이언트)이지만 최대 24 개의 브라우저에서 "클라우드에서"브라우저 테스트를 수행합니다. 실제로 브라우저 테스트는 첫 번째 제품이었으며 Alkaline 도구를 통해 독립적으로 계속 사용할 수 있습니다 .

나는 정기적으로 알칼리를 사용합니다. 꽤 좋습니다.

그것의 가장 좋은 점입니다 : 당신은 자신에하거나 설치하지 않는 모든 테스트 할 브라우저를. 그들은 모든 것을 처리하고 실제 시스템에서 실행중인 브라우저의 스크린 샷을 독립적으로 제공합니다. 나 자신은 끔찍한 sysadmin 사람이 이상적입니다.


예, 그들은 우리의 친구입니다-그들은 또한 바닥 글에있는 doctype.com 을 실행 합니다 (곧 충돌 할 가능성이 있음)
Jeff Atwood


6

내가보기 엔에 IE를 테스트하는 것이 좋습니다 IETester , 가능 여기에 . 가볍고 빠르며 정확하며 5.5 이상에서 모든 IE를 지원합니다.


1
IETester는 IE 브라우저에서 사이트가 어떻게 보이는지에 대한 훌륭한 참고 자료를 제공합니다. 그러나 우리는 IE6의 렌더링이 실제 IE6 렌더링 엔진과 다른 곳에서 발생했습니다.
Rickjaah

5

브라우저를 로컬에두면 유연성이 향상됩니다. 테스트하기 위해 여러 버튼을 클릭해야하는 대화식 웹 사이트가있는 경우 이미지로이를 확인할 수 없습니다.


5

또한 MS는 Expression Toolkit의 일부로 SuperPreview라는 제품을 보유하고 있으며,이를 통해 모든 버전의 IE와 최신 버전의 Firefox에서 대화식 버전의 사이트와 나란히 또는 겹쳐서 작업 할 수 있습니다.

또한 Mac의 Safari에서 사이트가 어떻게 보이는지 보여주는 웹 서비스에 대한 액세스가 포함됩니다. 이렇게하면 출력 이미지가 생성되지만 마크 업의 어느 부분에서 어떤 부분이 생성되었는지 확인할 수있는 메타 데이터 파일도 사용됩니다 이미지의 크기가 여전히 강력합니다.


4

이것이 Apple 컴퓨터에서 개발해야하는 핵심 이유 중 하나입니다. VMWare Fusion 또는 기타 에뮬레이션 소프트웨어를 사용하면 모든 주요 운영 체제를 합법적으로 설치할 수있는 유일한 컴퓨터입니다.

그런 다음 외부 소스에 의존하지 않고 실제 OS에서 실제 브라우저를 테스트하여 더티 작업을 수행 할 수 있습니다. 기본 디버깅 도구를 사용하여 오류를 수정 / 진단 할 수 있습니다.


왜 애플인가? Linux 또는 Windows 에서 virtualbox.org 를 사용할 수도 있습니다 .
mbrochh

1
왜 애플인가? 서비스 약관을 위반하지 않으면 Linux 또는 Windows에 OSX를 설치할 수 없기 때문입니다.
Dan Gayle

1
저에게 약간 어리석은 것처럼 보입니다 .Apple에서 개발 해야하는 핵심 이유 중 하나는 다른 컴퓨터에서 OSX를 사용할 수 없다는 것입니다.

합법적으로 Hackintosh를 실행할 수 있다면 하드웨어 문제는 제쳐두고있을 것입니다. 그러나 다시 한 번 고려해야 할 사항입니다.
Dan Gayle


4

일반적인 디자인에 미리보기를 사용하는 것이 좋지만 사이트의 동작을 테스트하는 것도 잊지 마십시오. 그림에서 볼 수없는 호버, 아약스 또는 자바 스크립트 효과를 많이 사용하는 경우 특히 유용합니다.

가장 중요한 브라우저가 별도로 설치되어있는 다른 가상 머신과 함께 VmWare를 사용합니다.

Windows 7 Ultimate를 사용하는 경우 한 호스트에서 다른 IE 버전을 실행하기위한 솔루션 인 Virtual PC 및 Xp 모드 가 포함 된 자습서를 참조 할 수 있습니다 .



3

MogoTest 는 최신 TechStars 신생 기업입니다. 다른 브라우저와 OS의 스크린 샷을 제공하고 HTML 및 CSS의 유효성도 검사합니다.


당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.