PENNY PAGE
CASE 27마블전자2026.08

부품 바이어를 위한
한·영 기업소개 10페이지

대전의 통신모듈 제조·전자부품 유통 기업 마블전자의 국문/영문 기업소개 사이트입니다. 주문 당일 사이트와 로고, 회사 메일까지 오픈했습니다.

업종
전자부품 제조·유통 (대전)
형태
국문/영문 기업소개 멀티페이지 + 로고·회사 메일
기간
주문 당일 오픈
구성
사업분야 · 취급품목 · 회사소개
글로벌 브랜드 · 문의 (국문/영문)
기술 스택
Cloudflare Pages · Cloudflare Email Routing · IBM Plex Sans KR · JSON-LD · 반응형 HTML/CSS
호스팅
Cloudflare Pages + Email Routing, 자체 도메인
마블전자 데스크탑·모바일 화면
PENNYPAGE WORKS · CASE 27marvel-elec.co.kr

01과제

무엇을 받았고, 무엇을 했나

부품 바이어는 취급 품목과 제조 역량을 빠르게 확인하고 싶어 합니다. 그래서 사업분야·취급품목을 국문/영문 10페이지로 구성하고, 취급품목은 sticky 미디어 패널이 스크롤에 맞춰 바뀌는 쇼케이스로 만들었습니다.

육각 칩 엠블럼 로고를 새로 만들고, Cloudflare Email Routing(SPF·DKIM·DMARC)으로 회사 도메인 메일을 Gmail에서 받도록 연결해 완성했습니다.

핵심 — 품목이 먼저 보이는 회사바이어가 찾는 취급 품목과 제조 역량을 국문·영문 양쪽에서 같은 구조로 보여 줍니다.

02화면

히어로가 아니라 실제로 일하는 구간

사업분야 — 통신모듈 제작·전자부품 유통
01사업분야 — 통신모듈 제작·전자부품 유통
취급품목 — 카테고리별 부품 안내
02취급품목 — 카테고리별 부품 안내
회사 소개 — 품질과 신뢰
03회사 소개 — 품질과 신뢰
글로벌 브랜드 — 취급 제조사 15곳
04글로벌 브랜드 — 취급 제조사 15곳

03구성

이 사이트에 들어간 것

  • 01
    국문/영문 10페이지언어별 동일 구조
  • 02
    취급품목 스크롤 쇼케이스sticky 미디어 패널
  • 03
    육각 칩 엠블럼 로고로고 신규 제작
  • 04
    회사 도메인 메일Cloudflare Email Routing, SPF·DKIM·DMARC
  • 05
    전화 확인 모달발신 전 확인 단계
  • 06
    글로벌 브랜드 마퀴취급 제조사 흐름 배치
  • 07
    reduced-motion·no-js 폴백접근성 대응
마블전자 모바일 전체 화면

모바일 · 스크롤해서 보기

실제 사이트에서 확인하세요.

지금도 운영 중인 사이트입니다.