적응성 연락처 정보. WordPress에 대한 연락처 양식을 만드는 방법? 레이아웃을 준수합니다

적응 형 레이아웃 사이트에서 웹 페이지는 태블릿 및 스마트 폰의 화면에 자동으로 적응할 수 있습니다. 모바일 인터넷 트래픽은 매년 성장 하고이 트래픽을 효과적으로 처리하고 있으므로 편리한 인터페이스로 사용자에게 적응 사이트를 제공해야합니다.

검색 엔진은 모바일 장치에서 볼 때 사이트의 적응성을 평가하기 위해 여러 가지 기준을 사용합니다. Google은 모바일 장치 사이트에 적용되는 모바일 발급에 명시된 스마트 폰 및 태블릿 소유자에게 인터넷 사용을 단순화하려고 노력합니다. 모바일 친화적 인....에 YANDEX는 모바일 검색에서 사용자를 위해 모바일 / 적응 형 버전으로 사이트를 선호하는 알고리즘을 작동시킵니다.

서비스의 모바일 장치에서 페이지의 표시를 확인할 수 있습니다.

무화과. 1. 모바일 YANDEX 및 Google은 모바일 장치에 사이트의 친절 함을 알 수 있습니다.

적응 형 레이아웃이란 무엇입니까?

적응 형 레이아웃은 부재를 포함합니다 수평 스트립 모든 장치에서 볼 때 스크롤 및 확장 가능한 영역, 읽을 수있는 텍스트 및 클리신 요소의 넓은 영역. 미디어 등록을 사용하면 페이지의 블록의 레이아웃 및 위치를 제어 할 수 있으므로 다른 크기의 장치에 적응할 수 있도록 패턴을 재구성 할 수 있습니다.

적응성 사이트를 만드는 주요 기술 이이 제품에 나와 있습니다. 에 대한 반응이 좋은 디자인 사이트의 주 컨테이너의 너비는 브라우저 창의 폭이 100 %와 같을수록 %로 설정됩니다. 그리드의 열 너비도 %로 설정됩니다. 에 적응 형 디자인 주 컨테이너의 너비와 그리드 열은 PX의 값을 사용하여 고정됩니다.

이 공과에서 고려되는 적응 형 고무 레이아웃은 2 열 패턴으로 완벽하게 작동하여 모바일 장치에서 볼 수 있으며 편리합니다. 템플릿은 페이지의 주요 내용의 다른 레이아웃을 가정합니다.이 단원에서는 마스터 페이지로 해체됩니다.

메인 페이지의 사물함

이 페이지는 상단 바닥 글 (CAP), 주요 내용 및 SageBar의 래퍼 컨테이너 및 바닥 글 (바닥 글)으로 구성됩니다. 디자인 포인트의 전환점으로 768px 및 480px를 취하십시오.

첫 번째 점에서 맨 위 메뉴를 숨기고 컨테이너 아래의 사이드 바를 게시물로 이동하십시오. 두 번째 지점에서 헤더 요소의 위치를 \u200b\u200b변경하고 게시물의 소셜 네트워크 버튼의 위치 지정을 취소하고 페이지 열로 흐름을 취소합니다.


무화과. 2. 적응 형 레이아웃의 예

1. metagelet 및 섹션

1) 섹션에 추가하십시오 필수 파일은 사용 된 글꼴, jQuery 라이브러리뿐만 아니라 jQuery 라이브러리뿐만 아니라 브라우저 접두사의 속성에 대해 쓰지 않기 위해 링크합니다.

적응 형 사이트 레이아웃

2. 페이지 캡

페이지의 헤더에 있습니다

다음 요소를 배치하십시오.
심벌 마크

< div class = "col-md-4" > [클래스 제출 : BTN - 플랫 클래스 : COL - XS - 12 "주문")< / div >

< / div >

중요 사항:친애하는 친구,이 예제에서는 적응 형 스타일을 사용하여 WordPress에서 연락처 양식을 만듭니다. 즉, 화면 크기의 형태를 취할 수 있습니다.

오른쪽 상단 모서리에 버튼이 표시됩니다. 이미 확실히 놓치지 않습니다. 🙂.

우리는 이제 다음 단계로 간다.

응용 프로그램 수신 메일 주소 설정

이 단계에서는 편지가 사서함으로 이동하도록 일부 설정을 만들어야합니다. 이것을 달성하는 방법은 아래를 알려줍니다.

큰 탭 "문자"를 클릭해야합니다. 그것은 셰이프 템플릿 다음에 두 번째가 될 것입니다.

처음 볼 때 첫 번째 일은 사용자가 추가 한 태그가 필요합니다. 편지의 편지에 삽입해야하며, 이는 사용자가 양식으로 들어가는 데이터를 대체 할 것입니다. 나는 그것이 이해할 수있는 것을 설명했다고 생각합니다.

이제 필드에 :

  • (응용 프로그램이 전송되는 경우, 내 경우,이 이메일 주소이며, 응용 프로그램을 보내 주시면 여러 주소를 지정할 수 있습니다)
  • (필드가 출발 한 위치에서, 즉 응용 프로그램이 내 스튜디오 사이트에서 오는 값을 대체 할 것입니다)
  • 테마 (응용 프로그램 양식을 결정하는 역할을하는 역할을하는 경우,이 경우 웹 사이트 프로모션의 형태의 응용 프로그램입니다).
  • 추가 헤더 (추가 제목, 그 (것)들을 만지지 마십시오. 양식의 정확성이 필요합니다)
  • 메시지 본문 (메시지 본문, 여기에서 편지에서 왔고, 예를 들어, "에서"보낸 사람 : IVAN ""메일 주소 : vasya @ mail. ru. »)
  • 첨부 파일 (파일에 응용 프로그램, 터치하지 마십시오)

이제 WordPress 연락처 양식에서 성공적이거나 실패한 이메일에 대한 알림을 구성해야합니다.

이들은 양식의 동작에 대한 응답으로 사용자에게 표시 될 메시지가 될 것입니다. 기본적으로 그들은 영어로 이동합니다. 나는 러시아인들에게 가장 필요한 것을 가장 많이 옮겼습니다. 그들은 충분히 그 이상이 될 것이며, 그렇지 않은 경우 번역가 구글이 당신을 도울 수 있습니다. 따라서 진행하십시오.

  • 메시지를 성공적으로 보내는 경우 : "메시지가 성공적으로 전송되었습니다. 감사합니다."
  • 양식에서 메시지를 보내지 못하면 "메시지를 보낼 때 오류가 발생합니다. 나중에 시도하거나 사이트 관리자에게 문의하십시오. "
  • 필링 오류 : "필링 오류. 모든 필드를 확인하고 다시 보내주십시오. "
  • 보낸 데이터는 스팸으로 정의됩니다. "메시지를 보낼 때 오류가 발생했습니다. 나중에 시도하거나 사이트 관리자에게 문의하십시오. "
  • 일부 조건은 다음을 받아 들여야합니다. "계속해서 계속하십시오."
  • 일부 필드는 "필수 입력란을 작성하십시오."
  • 필드의 문자 길이가 초과됩니다. ""너무 많은 데이터가 표시됩니다. "
  • 필드에 기호 길이가 충분하지 않음 : "데이터가 너무 많이 표시됩니다."
  • 잘못된 날짜 형식 : "날짜 형식이 올바르지 않습니다."
  • 최소 한도의 초기 날짜 : "다음 날짜가 표시됩니다."
  • 최대 한도의 늦은 날짜 : "마지막 날짜가 표시됩니다."
  • 실패한 파일로드 : "파일을 업로드하지 못했습니다."
  • 해결되지 않은 파일 형식 : "이 유형의 파일은 허용되지 않습니다."
  • 너무 큰 파일로드 : "이 파일이 너무 큽니다."
  • PHP 오류로 인해 파일로드가 실패했습니다. "파일을 보내지 못했습니다. 오류가 발생했습니다. "
  • 보낸 사람이 도입 한 숫자 형식이 잘못되었습니다. "숫자 형식이 잘못되었습니다."
  • 숫자는 최소 제한보다 작습니다 : "이 번호는 너무 작습니다."
  • 숫자는 최대 한도보다 큽니다. "이 숫자가 너무 큽니다."
  • 발신자가 질문에 대한 정답을 입력하지 않았습니다. "잘못된 대답을 도입했습니다."
  • 보낸 사람이 소개 한 전자 메일 주소가 잘못되었습니다 : "잘못된 전자 메일".
  • 보낸 사람이 도입 된 URL이 잘못되었습니다 : "잘못된 URL"
  • 보낸 사람이 입력 한 전화 번호가 잘못되었습니다. "잘못된 전화 번호"

아주 좋아. 양식 설정을 통해 완성 된 이제 사이트에 삽입해야합니다. 이를 위해 이미 알려진 기술은 기존 페이지로 가거나 새 것을 만들어 보겠습니다. 예제에서는 WordPress 사이트 페이지에서 기존 양식의 예를 보여 드리겠습니다.

우리 양식은 웹 사이트 프로모션을위한 응용 프로그램을 수집하기 때문에 비슷한 페이지로 가자.

연락처 양식을 삽입하려면 복사하여 플러그인, 단축 코드로 할당해야합니다. 그것은 당신의 양식이라고 불립니다.

우리의 페이지에 복사하여 삽입하십시오. 텍스트 에디터 (비주지가 아님). 아래 스크린 샷에 제시 :

우리의 페이지를 저장하고 브라우저에서 끝에서 일어난 일을 확인하십시오.

감독자! 이제 폼을 채우지 않고 양식을 보내려고합니다. 그리고 그것은 우리가 보게 될 것입니다.

사용자가 필드에 필요한 데이터를 지정하지 않으므로 양식에서 송신 오류가 발생했습니다. 이제 올바른 데이터를 입력 하고이 경우에 성공한 것을 확인합시다.

우리는 보내기를 클릭하고 이것이 우리의 양식이 쓰는 것입니다.

이제 우리의 응용 프로그램이 어떻게 생겼는지 보자. 그들은 나에게서 Milovskaya 메일로 왔습니다. 납품 확인 :

인코딩과 모든 데이터가 올바른지 확인하려면 안으로 들어가 봅시다.

모든 것이 괜찮아. 양식은 잘 작동하고 데이터를 보냅니다. 이제 우리가 지역 홍보에 대해 이야기하면 할 때 당신에게 오는 응용 프로그램을 수집 할 수 있습니다.

그래서 우리는 사이트 페이지에서 WordPress에서 연락처 양식을 만드는 방법을 알려줍니다. 이제는 어떻게 해야할지 말할 것입니다 팝업 적응 형 피드백 양식 플러그인 접촉 양식 7을 사용합니다.

우리는 WordPress에서 팝업 적응 피드백 연락처 양식을 만듭니다.

우리의 양식이 적응력이 있으므로, I.E.e. 고무, 우리는 다른 플러그인을 연결해야하며, 더 정확하게 접촉 양식 7에 추가 첨가되어야합니다. 설정은 그와 함께 할 필요가 없습니다. 설치 및 잊어 버렸습니다.

다음 단계에서는 우리의 양식이 팝업되고 적응력이 있도록 어떤 변화가 필요한지 알려 드리겠습니다. 나는 그런 실현을했다 메인 페이지 그의 스튜디오 사이트의 이렇게하려면 "외장 편집기"섹션에있는 index.php 템플릿으로 돌아갑니다. 우리는 수동으로 코드로만 작동합니다.

우리의 팝업 양식은 다음과 같이 모달 대화 상자에 표시됩니다.

이 결과를 얻으려면 다음 코드가 필요합니다. 저는 스 니펫에서 완전히 상상할 것입니다.

주문하려면

< a href = "#" class = "btn btn-primary btn-flat" data - toggle = "modal" data - target = "#modal2" > 주문하려면< / a >

< ! -- Modal -- >

< div class = "modal contact-modal fade" tabindex = "-1" id = "modal2" role = "dialog" aria - labelledby = "myModalLabel" aria - hidden = "true" >

< div class = "modal-dialog" >

< div class = "modal-content" >

< div class = "modal-header" >

< button type = "button" class = "close" data - dismiss = "modal" > < span aria - hidden = "true" > & 시간;< / span > < span class = "sr-only" > 닫기< / span > < / button >

< h4 class = "modal-title black" id = "myModalLabel" > 신청서를 제출하십시오< / h4 >

< / div >

저자로부터 : 좋은 연락처 페이지는 방문자와의 관계를 유지하는 데 매우 중요합니다. 우리가 전자 상거래, 잡지, 개인 웹 사이트, 온라인 서비스 - 사용자와의 통신을위한 첫 번째 도구로서 사용자와의 통신을위한 첫 번째 도구로 연락처 페이지를 찾고 있습니다. 그것은 이상하지만 많은 웹 디자이너가 겸손한 연락처 페이지를 무시하고 웹 사이트의 가장 중요한 측면 중 하나를 고려합니다. 그것을 고치자.

좋은 연락처의 값입니다

연락처 페이지는 종종보기에서 종종 놓쳤습니다. 제품이나 서비스에 대한 불평을 불평하고 질문을하거나 질문을하는 웹 사이트는 몇 개입니까? 그리고 얼마나 자주 연락처 양식과 싸워야 했습니까?

좋은 연락처 페이지는 어떤 유형의 비즈니스에 도움이됩니다. 그녀는 고객 만족도를 높일 수있어 문제를 해결하는 데 도움이됩니다. 또한 귀중한 검토를위한 넓은 방법을 보장하여 제품 및 서비스를 개선하는 데 도움이 될 수 있습니다.

직접 사용자를 취소 할 때 다른 채널이 제한 될 수 있습니다. 텔레비전, 라디오, 잡지, 신문 ... 모든 것은 일방적 인 의사 소통의 한 형태입니다. 온라인 커뮤니케이션은 양면 거리 여야합니다. 비즈니스 및 방문자 간의 대화. 이것으로부터의 호토는 양의 양단이며, 여기에 연락처의 좋은 페이지가 너무 중요한 이유는 다음과 같습니다.

위치

첫 번째 단계 : 연락처 정보의 배치 장소. 방문자가 찾을 수없는 경우 세계에서 최고의 연락처를 갖는 것이 아닙니다. 설계자 전통을 고수하면 도움이 될 수 있습니다.

일반적으로 연락처 정보는 두 곳에서 위치 할 수 있습니다.

주요 탐색 - 연락처 페이지에 연결할 수있는 완벽한 장소. 방문객들은 대개 오른쪽의 연락처 페이지를 찾고 있습니다. 이는 보조 값의 요소가 볼 수 있기 때문입니다. 따라서 연락처 페이지에 대한 링크가 최신 사이트 탐색 항목 중 하나로 간단히 표시됩니다.

우리는 화면의 오른쪽 상단 모서리에 덜 서브 니지를 볼 수 있습니다. 이것은 또한 연락처 페이지의 유용한 위치입니다. 그건 그렇고, 스킵하기 쉽기 때문에 드롭 다운 메뉴에서 연락처 페이지 배치를 피하는 것이 좋습니다.

보행인 또한 연락처 정보를위한 인기있는 대상입니다. 연락처 페이지에 대한 링크가 포함될 수 있습니다.

... 또는 가장 중요한 연락처 정보 :

방문자의 흐름을 연락처 페이지로 예측하기가 어렵 기 때문에 적어도 두 개의 언급 된 장소에서 적어도 참조 배치는 안전하게 당신을 강요합니다.

연락처에서 가장 중요한 일입니다

이제 당신은 진정 - 방문자는 연락처 페이지의 경로를 찾을 수 있으며 실제 콘텐츠에 대해 생각할 시간입니다. 주를 시작하고 표현 해야하는 정보를 고려해 봅시다.

이메일 이메일 / 연락처 양식

이메일 주소는 비즈니스에서 온라인 비즈니스에서 가장 쉬운 방법입니다. 또는 이메일을 참조하는 연락처 양식을 사용할 수 있습니다. 양식을 통해 내용을 더 많이 제어 할 수 있습니다 (필드를 채우기 위해 필요한 경우)이므로 스팸으로 방지 할 수 있습니다. 아래이 기사에서 연락처 양식에 대해 알려 드리겠습니다.

주소

전통 가게가있는 사업은 귀하의 주소를 언급하는 것을 잊지 마십시오. 많은 상점이있는 경우, 각각의 개별 페이지를 만드는 것이 가장 좋습니다. 이 상점, 근무 시간, 여행 계획 등의 별도의 연락처 정보로 채우십시오. 방문자뿐만 아니라 로컬 검색 쿼리에서 사이트를 도울 필요가 있습니다.

전화

전화 번호의 디스플레이는 자신감이 발생합니다. 이것은 종종 실제 기존 회사의 표시로 간주되며 실제로 온라인 상점을 돕습니다.

많은 웹 사이트가 소셜 네트워크의 버튼을 연락처 페이지에 추가하기 시작했습니다. 아마도 모든 사이트에 도움이되지는 않지만 일부 방문자는 추가적인 의미...에 특히 점점 더 많은 회사가 트위터를 통해 고객 지원을 제공하므로 (때로는 시계가 있고 일 없이도 없음).

또한

좋은 연락처 페이지에 대한 범용 솔루션은 없습니다. 모든 웹 사이트 또는 비즈니스는 다른 사이트에서 불필요 할 수있는 특정 요소가 필요합니다.

연락처 페이지에서 유용 할 추가 정보 또는 속성이 많이 있습니다. 전통적인 상점의 경우 좋은 생각은 언급하는 것입니다. 대기업은 라이브 채팅에 대한 참조를 만들 수 있으며 전자 상거래 사이트는 VAT 번호를 호버하는 사용자 자신감을 통합 할 수 있습니다.

편안한 정보

정보 사용의 용이성은 방문자가 귀하의 방문자가 귀하의 방문자를 보호합니다.
이미지 대신 HTML 텍스트의 형식으로 정보를 활성화하십시오. HTML 텍스트 방문자가 연락처 데이터를 저장할 수 있도록 복사하여 붙여 넣을 수 있습니다.

이메일 주소는 MailTo 링크를 사용해야합니다. 이렇게하면 방문자가 배달 주소를 복사하고 배달 주소를 복사 할 필요없이 메시지를 보내는 기회를 제공합니다. 메일 클라이언트...에 그러나이 기술을 사용하면 Spambots의 얼굴에 MailTo와 관련된 전자 메일 주소를 수집하는 데 문제가있을 수 있습니다. 따라서 MailtoEncoder.com과 같은 서비스를 사용하여 먼저 혼동을 결정할 수 있습니다.

배경 참고 : 전화 번호도 대화식이어야합니다. 작년에 클릭에 민감한 전화 번호를 만드는 방법에 대한 작은 팁을 게시했습니다. 작은 코드의 작은 조각 덕분에 스마트 폰은 전화 번호를 식별하고 전화를 걸 수 있습니다. 모바일 사용자에게는 정말 편리합니다.

전통적인 상점에 크게 의존하는 비즈니스는 종종 대화 형 카드로 인해 많은 혜택을 얻으므로 사용자에게 판매점의 경로를 신속하게 찾을 수있는 기회를 제공합니다. 상점 주소를 잘 표시하고 인터랙티브 카드를 더 좋습니다.

감사 구글지도. 삽입하십시오 유용한 재산 파이처럼 쉽습니다. Google지도에 주소를 입력하고 측면 열의 링크 아이콘을 클릭하십시오. 거기에서 삽입 코드가 있습니다.

카드를 자신에게 적응할 수 있음을 알고 있었습니까? 카드의 색상을 편집하고지도에 사용자 정의 포인터를 추가하고 범례를 만듭니다. developers.google.com에서 이것에 대해 더 자세히 알아볼 수 있습니다. 오히려 매력적인 Mapbox와 같은 대체 서비스의 사용을 생각할 수도 있습니다.

검색 엔진 최적화를 잊지 마십시오

방문자는 연락처 페이지에서 즉시 주소를 인식합니다. 검색 엔진그러나 다양한 요소를 인식 할 때 작은 도움이 필요합니다.

연락처 양식

대부분의 웹 사이트는 페이지에 연락처 양식을 적용합니다. 그러나 일부 양식은 불필요하게 사용자에게 복잡하고 비우호적입니다.

어떤 단순한 연락처 양식이 얼마나 간단한 지에 관계없이 여러 구성 요소의 조합입니다. 그들은 모두 사용자의 최상의 인상을 보장하기 위해 함께 일해야합니다.

입력 필드

텍스트 필드와 같은 입력 필드, 옵션 선택 옵션 (라디오 풀), 확인란 등을 사용자가 필요한 정보를 만들 수 있습니다.

웹 사이트 방문자는 노력이 적므로 짧은 양식을 채울 수 있습니다. 입력 필드의 수는 사용자의 인상과 비즈니스 요구 사항간에 균형을 이루고 있습니다. 허브 스폿은 40,000 개 이상의 양식을 분석하고 입력 필드 수를 증가시키는 효과를 고려했습니다. 연구 결과로 인해 양식 분야의 일부로 사용되어야하며 복잡한 텍스트 영역 및 드롭 다운 목록에서 특히주의해야합니다.

방문자가 필드를 채우는 데 도움이되므로 올바른 형식을 지정하십시오. 전화 번호와 날짜는 특히 외국 방문객을위한 함정이 될 수 있습니다. HTML5 자리 표시 자 속성이 도움이됩니다.

그런 다음 필드를 채우기 위해 필요한 필드를 할당해야합니다 (그들은 전통적으로 별표 *를 사용하여 격리됩니다). 필드를 채우기 위해 필수적이고 선택 사항을 분명히 나타내는 것입니다.
마지막으로 활성 필드를 강조 표시하는 것이 유용합니다. 원하는대로 거의 또는 매우 밝게 지정할 수 있습니다.

아래는 Jim Nielsen Jim의 연락처 양식의 예입니다. 필드를 채우려면 필수 필드를 채우는 데 빨간색 스프로킷을 사용하고 형식에 대한 조언을 제공하고 활성 필드를 강조 표시합니다.

양식의 유효성 검사

내부 검증은 또한 접촉 양식의 일부 질병을 방지 할 수 있습니다. 잘못된 데이터 또는 데이터가 잘못된 형식으로 도입되어 양식을 보내고 전송할 필요가 매우 짜증나는 것입니다. 이미 여기에 언급했듯이, 필요한 형식 (예 : 날짜, 전화 번호 ...)을 보여줌으로써 방문객을 돕는 것이 가장 좋습니다.

단추

보내기 버튼이 없으면 연락처 양식이 없습니다. 그것은 끝에 있어야합니다. 버튼의 텍스트로서 "보내기"대신 "메시지 보내기"를 사용하여 고객에게 고객에게 알려줍니다.
작년부터 일반 표준은 "재설정"또는 "명확한 모양"버튼을 활성화하는 것입니다. 그거 하지마. 무작위로 그것을 누를 것입니다. 잘 생각한 자세한 메시지를 인쇄하고 "재설정"버튼으로 인해 손실 된 것보다 더 나쁜 것은 없습니다.

응답

방문객은 연락처 정보를 작성하고 메시지를 작성하고 "보내기"버튼을 누릅니다. 이제 뭐? 메시지를 했습니까?

적절한 메시지를 표시하여 메시지가 성공적으로 전송되었음을 방문자에게 ANSURES합니다. 확인할 전자 메일 메시지도 적용합니다.

동일한 조언은 오류에 관한 것입니다. 메시지를 보내는 것으로 실패한 경우 오류가 표시됩니다. 많은 미래 분쟁을 방지 할 수있는 필요성이 필요합니다. 오류 메시지는 친숙해야하므로 경보 오류 코드를 표시하지 마십시오.

연락처 페이지 디자인

많은 사람들이 연락처의 디자인에 적용됩니다 기술 요구 사항그러나 그 중 하나를 잊지 마십시오 가장 중요한 포인트: 시각적 스타일.

연락처 양식을 사용하는 경우 필드를 크고 친숙하고 장착 한 채로 만듭니다. 공백과 들여 쓰기는 당신에게 좋은 서비스를 제공합니다.

웹 사이트 방문자는 웹 페이지를 시청할 때 문자 F의 형태로 템플릿을 따르므로 마크 업을 만들 때 기억하십시오. 연락처 양식의 경우, 다른 필드를 다른 필드를 다른 분야에 배치하는 것이 가장 좋습니다. 따라서 양식이 작성되면 필요한 방문자의 뷰 이동이 줄어 듭니다.

연락처 페이지는 사이트의 시각적 기능과 결합되어야합니다. 시퀀스는 완벽의 열쇠입니다. 예를 들어, 엽서로 작성된이 연락처 페이지에서보십시오.

대부분의 웹 디자인 작업의 경우와 마찬가지로; 크리 에이 티브 접근 방식은 완벽하게 지불됩니다. Neil Petel (Neil Patel)은 infographics의 형태로 연락처 페이지를 만들어 연락처 요청 수를 3 배로 만들었습니다.

접촉 양식의 예

좋은 연락처 양식에 대해 말하면,이 예제에 대한 영감을 보시려 봅시다 (이미지를 클릭하여 해당 사이트를 방문하십시오) :

결론

연락처 페이지 디자인을 만들기 전에 방문자가 찾을 수 있는지 확인하십시오. 메인 탐색 또는 바닥 글에서 참조를 참조하십시오. 대부분의 사람들이 화면의 오른쪽에있는 연락처 정보를 찾고 있습니다.

어떤 정보를 활성화 해야하는지 생각해보십시오. 이메일이나 접촉 양식을 통해 메시지를 보낼 수있는 가능성은 긴급히 중요합니다. 주소와 전화 번호가 유용 할 수도 있습니다. 추가 정보, 예를 들어 프로파일의 링크와 같은 소셜 네트워크 일부 유형의 비즈니스의 영업 시간도 필요합니다.

상호 작용은 중요합니다. 전자 메일 주소 및 TEL 속성에 대한 mailto 속성을 적용하십시오. 전화 번호 (모바일 장치 방문객에게 매우 유용합니다). Google지도와 같은 대화 형지도를 삽입 할 수 있지만 성능에 효과를 고려할 수 있습니다.

유용성 연락처 양식은 연락처 페이지를 만들거나 삭제할 수 있습니다. 가장 필요한 정보 만 요청하십시오. 두통을 피하고 입력 필드의 올바른 형식을 나타내고 내부 유효성 검사를 적용 할 수 있습니다. 양식을 보낼 때 메시지를 성공적으로 보내는 것을 잊어 버리십시오.

공유