Google Fonts에 추가된 일본어 글꼴을 사용해 보았습니다.

우란 대야 축제 기간 웹 글꼴'구글 폰츠'의 일본어 글꼴에 새로운 글꼴이 추가돼 바로 사용해 보았다.
https://fonts.google.com/?subset=japanese

사용법

(1)
사용할 글꼴 이름의 오른쪽 위 모서리에 있는 "+"를 클릭합니다.
[예] M PLUS1p
(2)
화면 아래에는'1 Family Selected'라고 적힌 검은색 띠가 표시되고, 클릭하면 창이 열린다.

(3)
EMBED와 CUSTOMIZE의 링크를 표시하고 일본어를 추가하기 위해 먼저 CUSTOMIZE로 이동합니다.
↓
Languages 아래에 있는 Japannese(Supported by M PLUS1p) 확인란을 확인합니다.

(4)
EMBED로 돌아가면 필요한 정보가 표시됩니다.
• HTML 헤드에 추가

<link href="https://fonts.googleapis.com/css?family=M+PLUS+1p&amp;subset=japanese" rel="stylesheet">

• CSS도 설정

.wf-mplus1p { font-family: 'M PLUS 1p', sans-serif; }

(완성!)
　

객체 글꼴

M PLUS1p/M+(weight:7종)

M PLUS Rounded 1c/Rounded M+(weight: 7종)

Sawarrabi Mincho/명나라 접촉(weight:1종)

Sawarrabi Gothic/접촉 Gothic(weight:1종)

Kosuigi/삼나무 Gothic(weight:1종)

코스키마/스쿠알고딕(weight:1종)

※'M PLUS'와'사와라비'4개 서체는'구글 폰트+일본어 조기 방문'에서도 흔합니다.(똑같은지는 검증되지 않았지만, 크게 다르지 않은 것 같다.)
※'코수기'는 원래'모토야엘시티 W3 모노'(motoyalCeder W3 mono·motoya L sida 3 등폭),'코수기마루'는 원래'모토야엘 마루 W3 모노'(motoyal Marber 3 등폭)로 판매된 글씨체입니다.
※'코수기'는 일본어 정식 명칭이 불분명하기 때문에 임시로 쓰는 방법입니다.
[참조]
Google Fonts + 일본어 조기 액세스를 시도했습니다.
http://qiita.com/umeume66/items/29c60534367b50252c88

샘플 보기

① 예문 ※ 청공문고"나는 고양이다."
② 숫자, 알파벳 기호
③ 개발 중이나 비대응 한자가 많은'JIS 제 2 수준의 한자'의 예를 포함한다.(평소 경극하언의 초밥집 예문을 좋아한다)
지원되지 않는 문자의 배경색을 설정합니다.
　
※ 모두 커머셜 사이트에서 OK.
※ 고딕계에는'산스세리프'가 설정돼 있고, 명나라계에도'세리프'가 설정되어 있습니다.
(글꼴에 맞지 않는 문자는 "sans-serif"또는 "serif"로 표시됩니다.)
※ 행 간격은 따로 설정하지 않았습니다.(브라우저 기본값)

M PLUS 1p / M+

M PLUS Rounded 1c / Rounded M+

Sawarrabi Mincho

Sawarrabi Gothic/접촉 고딕

삼나무 고딕 양식

소삼환 고딕 양식

예제 표시(7가지 두께 비교)

위쪽부터 다음 순서대로 설정합니다.

Thin(font-weight: 100;)

Light(font-weight: 300;)

Regular(font-weight: 400;)

Medium(font-weight: 500;)

Bold(font-weight: 700;)

Extrabold(font-weight: 800;)

Black(font-weight: 900;)

M PLUS 1p / M+

M PLUS Rounded 1c / Rounded M+

눈여겨본 일

· 'M PLUS' 와' Sawarrabi '네 글자가 대응하지 않는 문자는' Google Fonts + 일본어 초기 접근 '과 같습니다.
·'코수기'는 행간이 타이트하니 조금 더 넓게 설정하는 게 좋다.귀여운 분위기에서 사용하기 편하지만 평가명, 영화 가명, 영문 문자 간의 차이에 조금 신경을 쓴다.내 생각엔(행간이 좀 더 넓으면 신경 안 쓸 것 같은데?)
•'사와라비 민초'(ぶ明朝)'는 포토샵으로 세로로 쓰면 무너질 수 있다.

추기 (2018.09.03)

사내에서 댓글을 달며 조정된 기사를 많이 올렸다.
https://www.tam-tam.co.jp/tipsnote/html_css/post16293.html
'명나라'를 가로로 쓰면 포토샵이든 인터넷이든 무너진다.
※ 특히 한자 숫자와 문장부호에 문제가 있어 글자 사이에 겹치기 때문에 문장은 거의 읽지 않습니다.("Gothic 접촉"에는 문제가 없습니다.)
좋은 처리 방법을 찾았으면 좋겠다...・゜・(つД｀)・゜・
또'질문'이나'탑으로 돌아가기'같은 짧은 글이라면 문제 없겠지?그러나 브라우저에 따라 표시 위치는 1글자 정도의 편차가 있고 오프셋 부분의 문자는 중간에 끊긴다.
분명히 얻기 어려운 명조체인데 세로로 쓰려면 열심히 하지 않으면 어렵다.
검증을 계속합니다.

추기 (2018.09.05)

노트 글꼴도'Google Fonts'부터 사용한다고 합니다!
와!!오래 기다렸어!!!
● Noto Sans JP(weight: 6종)
https://fonts.google.com/specimen/Noto+Sans+JP
- Thin
- Light
- Regular
- Medium
- Bold
- Black
● Noto Serif JP(weight: 7종)
https://fonts.google.com/specimen/Noto+Serif+JP
- Extra-Light
- Light
- Regular
- Medium
- Semi-Bold
- Bold
- Black