자체 시안

[법률 · 세무] 법률사무소 홈페이지 「법무법인 너른들」

고객 의뢰 없이 직접 기획하고 만든 예시 작업입니다

법률사무소 홈페이지 「법무법인 너른들」
  • PC
  • Mobile

법률사무소 홈페이지 「법무법인 너른들」

사건 진행 조회를 첫 화면에 둔 법률사무소 홈페이지 시안

제작 방식
HTML · CSS · JavaScript (디자인 시안)
작업 기간
2026년 9월
타입
법률사무소 홈페이지 · 상담 신청 · 의뢰인 진행 조회
메인 컬러
#0e1a31#b8924a#f5f6f8
폰트
Noto Serif KR · Pretendard
사이트 보러가기 ↗

시안을 직접 띄워 둔 주소입니다. 눌러 보며 움직임까지 확인하실 수 있습니다.

작업 리포트

법률사무소 홈페이지를 새로 만든다면 어떤 모습이 좋을지 가정하고 직접 기획한 시안입니다. 「법무법인 너른들」과 변호사 · 사례 · 수치는 모두 가상이며, 변호사 사진 대신 이니셜 초상을 그렸습니다. 아래 「사이트 보러가기」에서 실제로 눌러 볼 수 있습니다.

무엇을 중심에 두었나

법률사무소 사이트는 대개 규모와 수치를 앞세웁니다. 하지만 방문자가 정말 궁금한 것은 「맡기면 어떻게 진행되나」입니다. 그래서 첫 화면 오른쪽에 의뢰인 전용 사건 진행 조회 카드를 두어, 수임 뒤에도 진행 상황을 링크로 볼 수 있다는 점을 가장 먼저 보여 줍니다.

  • 전화 · 카톡 · 간단 상담을 히어로 바로 아래 한 줄에 모아, 스크롤 없이 연락할 수 있게
  • 업무분야는 분야마다 한 줄 설명을 붙인 격자로, 해결사례는 결과(무혐의 · 전액 회수 등)를 크게
  • 상담 절차 네 단계에 「안 될 수 있는 부분까지 먼저 말씀드립니다」처럼 신뢰를 주는 문장을 넣었습니다

휴대폰에서

한 페이지가 화면 폭에 맞춰 바뀝니다. 휴대폰에서는 아래에 전화 · 카톡 · 상담 신청 바를 고정하고, 상담 폼은 분야를 버튼으로 골라 입력을 줄였습니다.

실제로 만든다면

변호사 광고 규정에 맞춰 광고책임변호사 표기와 후기 · 사례 문구를 함께 검토합니다. 상담 폼은 사무소 메일 · 문자로 바로 받고, 진행 조회는 이음웍스의 고객 진행 링크처럼 만들 수 있습니다.

  • 첫 화면의 사건 진행 조회

    수치 대신 「맡기면 이렇게 진행된다」를 먼저 보여 줍니다. 단계 막대와 최근 기록 세 줄로 의뢰 뒤의 모습을 그렸습니다.

  • 스크롤 없이 닿는 상담

    히어로 바로 아래 한 줄에 대표 전화 · 카톡 · 간단 상담 폼을 모으고, 오른쪽에는 떠 있는 퀵메뉴를 두었습니다.

  • 휴대폰 하단 상담 바

    전화 · 카톡 · 상담 신청을 화면 아래에 고정하고, 상담 분야는 버튼으로 골라 입력을 줄였습니다.

제공 서비스

  • 홈페이지 기획
  • 웹디자인
  • 반응형 웹
  • 모바일 최적화
  • 검색엔진최적화 (SEO)

메인 전체

모바일