도움말:디자인/환경 대응 - 편집 역사

삼쩌모: 삼쩌모님이 도움말:디자인/다크 모드 대응 문서를 넘겨주기를 만들지 않고 도움말:디자인/환경 대응 문서로 이동했습니다

2026-01-28T08:15:30Z

삼쩌모님이 도움말:디자인/다크 모드 대응 문서를 넘겨주기를 만들지 않고 도움말:디자인/환경 대응 문서로 이동했습니다

← 이전 판		2026년 1월 28일 (수) 17:15 판
(차이 없음)

2026년 1월 28일 (수) 08:15에 삼쩌모님의 편집

2026-01-28T08:15:14Z

← 이전 판		2026년 1월 28일 (수) 17:15 판
1번째 줄:		1번째 줄:
	{{DISPLAYTITLE:<span class="mw-page-title-namespace">도움말</span>:디자인<span style="display: block">{{부제\| ~~다크 모드~~ 대응}}</span>}}		{{DISPLAYTITLE:<span class="mw-page-title-namespace">도움말</span>:디자인<span style="display: block">{{부제\| 환경 대응}}</span>}}
	{{분류\|도움말}}		{{분류\|도움말}}
	{{상위문서\|도움말:디자인}}		{{상위문서\|도움말:디자인}}
6번째 줄:		6번째 줄:
	{{목차}}		{{목차}}
	== 개요 ==		== 개요 ==
	이 문서는 자신의 문서가 ~~다크 모드 대응인지~~ 확인할 수 있는 체크리스트 형태의 '''도움말'''입니다. 강제성이 주어지지는 않지만, 문서의 가독성을 위해서 따르면 좋습니다.		이 문서는 자신의 문서가 여러 환경에 대응되는지 확인할 수 있는 체크리스트 형태의 '''도움말'''입니다. 강제성이 주어지지는 않지만, 문서의 가독성을 위해서 따르면 좋습니다.

	가장 확실한 방법은 다크 ~~모드로~~ 직접 전환해서 문제가 되는 부분을 고치는 것이지만, 대부분 아래의 경우에 ~~해당합니다~~.		가장 확실한 방법은 다크 모드와 작은 화면으로 직접 전환해서 문제가 되는 부분을 고치는 것이지만, 대부분 아래의 경우에 해당하니 귀찮은 작업을 줄일 수 있습니다.

	== 상세 ==		== 다크 모드 ==
	* '''투명 배경에 기본 글씨 색(<code>var(--text)</code>)이 아닌 검은색(<code>#000000</code>, <code>black</code>, <code>#000</code>) 텍스트를 설정했는지'''		* '''투명 배경에 기본 글씨 색(<code>var(--text)</code>)이 아닌 검은색(<code>#000000</code>, <code>black</code>, <code>#000</code>) 텍스트를 설정했는지'''
	** 표나 틀에서 많이 등장합니다. 틀을 제작할 때 자연스럽게 검은색을 적용하지 않았는지 확인하면 좋습니다.		** 표나 틀에서 많이 등장합니다. 틀을 제작할 때 자연스럽게 검은색을 적용하지 않았는지 확인하면 좋습니다.
			* '''그림자 등에서 반투명(<code>{{반투명\|#ff0000\|8%}}</code>, <code>#ff000010</code>)이 아닌 고명도(<code>#ffdddd</code>)를 설정했는지'''
			* '''.jpg 확장자 등으로 인해 투명하지 않은 이미지가 불가피하게 들어갔는지'''
			** iOS와 같은 경우 사진첩에 투명한 이미지가 저장되지 않기도 합니다. 파일 앱을 통해 업로드하심을 추천합니다.
	* 투명 배경에 어두운 글씨 색을 설정했지만 다크모드 대응 틀이 적용되지 않았는지		* 투명 배경에 어두운 글씨 색을 설정했지만 다크모드 대응 틀이 적용되지 않았는지
	** <style> 안에서는 <code><nowiki>{{adt\|#000000}}</nowiki></code>으로 사용할 수 있고, <nowiki>{{style}}</nowiki> 안에서는 <code>##000000</code>로 사용합니다.		** <style> 안에서는 <code><nowiki>{{adt\|#000000}}</nowiki></code>으로 사용할 수 있고, <nowiki>{{style}}</nowiki> 안에서는 <code>##000000</code>로 사용합니다.
	** 적용하면 자동으로 다크 모드에서 높은 명도로 표시합니다.		** 적용하면 자동으로 다크 모드에서 높은 명도로 표시합니다.
	* '''~~그림자 등에서 반투명~~(<code>~~{{반투명\|#ff0000\|8%}}~~</code>, <code>~~#ff000010~~</code>)~~이 아닌 고명도~~(<code>~~#ffdddd~~</code>)를 ~~설정했는지'''~~
	* '''.~~jpg 확장자 등으로 인해 투명하지 않은 이미지가 불가피하게 들어갔는지'''~~		== 모바일 ==
			* '''표나 틀의 폭(<code>width</code>, <code>w</code>)에 350px 이상의 값을 적용했는지'''
			** 작은 화면에서 화면을 초과하기도 합니다. 따라서 <code>width</code>(<code>w</code>)는 <code>100%</code>로 설정하고 <code>max-width</code>(<code>maxw</code>)를 <code>500px</code>과 같이 설정하면 모바일에서는 화면을 꽉 채우고 PC에서는 정해진 규격으로 표시됩니다.

삼쩌모: 새 문서: {{DISPLAYTITLE:도움말:디자인{{부제| 다크 모드 대응}}}} {{분류|도움말}} {{상위문서|도움말:디자인}} {{도움말}} {{목차}} == 개요 == 이 문서는 자신의 문서가 다크 모드 대응인지 확인할 수 있는 체크리스트 형태의 '''도움말'''입니다. 강제성이 주어지지는 않지만, 문서의 가독성을 위해서 따르면 좋습니다. 가...

2026-01-28T08:08:35Z

새 문서: {{DISPLAYTITLE:도움말:디자인{{부제| 다크 모드 대응}}}} {{분류|도움말}} {{상위문서|도움말:디자인}} {{도움말}} {{목차}} == 개요 == 이 문서는 자신의 문서가 다크 모드 대응인지 확인할 수 있는 체크리스트 형태의 '''도움말'''입니다. 강제성이 주어지지는 않지만, 문서의 가독성을 위해서 따르면 좋습니다. 가...

새 문서

{{DISPLAYTITLE:도움말:디자인{{부제| 다크 모드 대응}}}}
{{분류|도움말}}
{{상위문서|도움말:디자인}}
{{도움말}}

{{목차}}
== 개요 ==
이 문서는 자신의 문서가 다크 모드 대응인지 확인할 수 있는 체크리스트 형태의 '''도움말'''입니다. 강제성이 주어지지는 않지만, 문서의 가독성을 위해서 따르면 좋습니다.

가장 확실한 방법은 다크 모드로 직접 전환해서 문제가 되는 부분을 고치는 것이지만, 대부분 아래의 경우에 해당합니다.

== 상세 ==
* '''투명 배경에 기본 글씨 색(<code>var(--text)</code>)이 아닌 검은색(<code>#000000</code>, <code>black</code>, <code>#000</code>) 텍스트를 설정했는지'''
** 표나 틀에서 많이 등장합니다. 틀을 제작할 때 자연스럽게 검은색을 적용하지 않았는지 확인하면 좋습니다.
* 투명 배경에 어두운 글씨 색을 설정했지만 다크모드 대응 틀이 적용되지 않았는지
** <style> 안에서는 <code><nowiki>{{adt|#000000}}</nowiki></code>으로 사용할 수 있고, <nowiki>{{style}}</nowiki> 안에서는 <code>##000000</code>로 사용합니다.
** 적용하면 자동으로 다크 모드에서 높은 명도로 표시합니다.
* '''그림자 등에서 반투명(<code>{{반투명|#ff0000|8%}}</code>, <code>#ff000010</code>)이 아닌 고명도(<code>#ffdddd</code>)를 설정했는지'''
* '''.jpg 확장자 등으로 인해 투명하지 않은 이미지가 불가피하게 들어갔는지'''