diff options
Diffstat (limited to 'files/ko/orphaned/mdn/editor/links/index.html')
-rw-r--r-- | files/ko/orphaned/mdn/editor/links/index.html | 181 |
1 files changed, 181 insertions, 0 deletions
diff --git a/files/ko/orphaned/mdn/editor/links/index.html b/files/ko/orphaned/mdn/editor/links/index.html new file mode 100644 index 0000000000..f6217db92c --- /dev/null +++ b/files/ko/orphaned/mdn/editor/links/index.html @@ -0,0 +1,181 @@ +--- +title: Links +slug: MDN/Editor/Links +tags: + - MDN + - 가이드 + - 문서화 + - 에디터 +translation_of: MDN/Editor/Links +--- +<div>{{MDNSidebar}}</div> + +<p id="Creating_and_editing_links"><span class="seoSummary">링크는 어떤 위키에서나 가장 중요한 요소입니다. 그 중요성은 많은 문서간에서 뿐만 아니라, 단일 문서에서도 동일합니다. MDN 또한 링크에 크게 의존하고 있습니다. 다행스럽게도, 링크는 만들 수있는 방법이 많으면서도, 매우 만들기 쉽습니다!</span></p> + +<div class="note"> +<p><strong>주목할 점:</strong> 특별히 <a href="/ko/docs/MDN/Contribute/Guidelines/Writing_style_guide#링크">링크시에 선호되는 작성방법</a>이 있습니다; <a href="/ko/docs/MDN/Contribute/Guidelines/Writing_style_guide">MDN 작성 스타일 가이드</a>에 설명되어 있습니다.</p> +</div> + +<h2 id="툴바_사용하기">툴바 사용하기</h2> + +<p>링크를 만드는 가장 확실한 방법은 툴바의 "link" 버튼을 클릭하거나, <kbd>Ctl</kbd>+<kbd>K</kbd> (맥에서는 <kbd>Command</kbd>-<kbd>K</kbd> )를 누르는 것입니다. 링크 버튼은 이렇게 생겼습니다: <img alt="The link button (as of 2015-12-04)" src="https://mdn.mozillademos.org/files/12003/link-button.png" style="height: 16px; width: 16px;">. 문자열 선택없이 링크 작성시에, 혹은 기존에 있는 문자열을 선택하여 링크 작성시에 이 기능을 이용할 수 있습니다.</p> + +<h3 id="문자열_선택없이_링크_작성하기">문자열 선택없이 링크 작성하기</h3> + +<p>일단 링크 버튼을 클릭하면, 아래에 보이는 링크 에디터 다이얼로그로 진입합니다:</p> + +<p><img alt="Screenshot of the Link dialog box, showing the Link Info tab" src="https://mdn.mozillademos.org/files/15289/link-info.png" style="border-style: solid; border-width: 1px; height: 320px; width: 335px;"></p> + +<p>여기서 새로운 링크를 구성할 수 있습니다. 이 다이얼로그의 콘트롤은 다음과 같습니다:</p> + +<dl> + <dt>링크 종류</dt> + <dd>생성중인 링크의 종류입니다. URL의 기본값은, MDN이든 오프사이트이든, 웹상 어딘가에 있는 URL입니다. 텍스트내의 앵커 (anchor)또는 "이메일"을 선택할 수도 있습니다. 앵커 링크 옵션은 툴바의 <strong>Anchor</strong> 버튼 으로 이전에 삽입된 anchor로의 링크를, 목록에서 골라서 생성할 수 있도록 합니다. 이메일 옵션은 받는사람의 이메일 주소와 제목 기본 메시지 콘텐츠를 입력하여 <code>mailto:</code> URL 이 구성되도록 합니다. 대부분의 경우 URL optin을 사용하게 될 겁니다.</dd> + <dt>문서 제목 찾기 / 링크 텍스트</dt> + <dd>이 필드는 두가지 목적을 수행합니다: 첫째는, 링크 대상으로 사용할 텍스트를 지정할 수 있습니다 (또는 대화 상자를 열기 전에 텍스트를 선택한 경우, 해당 텍스트가 이곳에 링크 대상으로 표시됩니다). 두번째로, 이 곳에 입력된 텍스트를 MDN내 등록된 문서와 대조하여 가능한 목적지 페이지를 찾아내는데 사용됩니다. 예를 들어, 이 박스안에 "Array"라고 타이핑하면, 아래와 같은 상황을 볼 수 있습니다:<br> + <img alt='Screenshot of the Link dialog box, showing a lookup menu for the text "Array"' src="https://mdn.mozillademos.org/files/15291/link%20dialog%20with%20lookup%20menu.png" style="border-style: solid; border-width: 1px; height: 388px; width: 496px;"></dd> +</dl> + +<dl> + <dd>Here, you can see a list of all the pages on MDN whose titles include the text you've typed. You can then scroll through the list and select one of those pages, or keep typing to narrow down the list. Note that the items in the list display their locale ("[en-US]" in this case). That text is not used in the link target text; it is there to help you ensure that you are linking to an article in the same locale as the one you are editing.</dd> + <dt>Attachments</dt> + <dd>Alternatively, you may make the link be a link to one of the files attached to the current page by selecting the attachment from this list. This is a great way to offer links to download code samples and the like.</dd> + <dt>URL</dt> + <dd>Finally, the URL field lets you actually directly enter the URL; it also shows the URL of whatever you've selected in either the <strong>Article Title Lookup</strong> or <strong>Attachments</strong> menus, if you've used those. A common practice is to paste URLs to pages you're working on elsewhere on MDN. If you link to another article on MDN, remove the domain name ("https://developer.mozilla.org") from the beginning of the URL, since that's implied.</dd> +</dl> + +<p>Once the link is configured, click the <strong>OK</strong> button to insert it.</p> + +<div class="note"> +<p>If you're paying attention, you'll see that there's a second tab—<strong>Advanced</strong>—in the link editor dialog. There are no options there that we advise you to use on a regular basis, at least at this time. It's possible that in the future there will be alternate styles for links, but we will likely add new toolbar widgets to use those features when they're available.</p> +</div> + +<h3 id="기존_텍스트에_링크_생성하기">기존 텍스트에 링크 생성하기</h3> + +<p>If you have existing text that you'd like to turn into a link, you can simplify the process somewhat. Highlight the text you'd like to turn into a link before opening the link editor; this will pre-populate the <strong>Article Title/Lookup Text</strong> field with the selected text. For example, let's say we have the following text:</p> + +<blockquote> +<p>You may find it useful to use JavaScript arrays when working on this project.</p> +</blockquote> + +<p>We'd like to turn "arrays" into a link to the appropriate content. Just highlight that word and invoke the link editor; you'll get a pre-populated dialog similar to the previous case. By "hovering" your mouse over a suggested article, you can see its relative slug (its URL relative to <code>developer.mozilla.org</code>), which can give you a better idea of where it is located and what type of article it is.</p> + +<p><img alt="Screenshot of the Link dialog box, showing a lookup menu and a URL tooltip" src="https://mdn.mozillademos.org/files/15293/Rollover%20of%20lookup%20menu.png" style="border-style: solid; border-width: 1px; height: 387px; width: 493px;"></p> + +<p>Here, of the articles suggested as possible matches. "Arrays" looks like a good choice, so we can choose that. This automatically fills in the URL field, so you can just click <strong>OK</strong> and the text gets turned into a link, like this:</p> + +<blockquote> +<p>You may find it useful to use JavaScript <a href="/en-US/docs/Learn/JavaScript/First_steps/Arrays">arrays</a> when working on this project.</p> +</blockquote> + +<h2 id="링크_매크로_사용하기">링크 매크로 사용하기</h2> + +<p>MDN은, 선택된 용어에 적절한 콘텐츠로의 링크가 자동적으로 생성되는 동시에 스타일 가이드에 맞게 링크가 생성되도록 하는 작업을 <a href="/ko/docs/Project:MDN/Contributing/Editor_guide#Using_macros">매크로</a>에 크게 의존합니다. 이 예를 보세요: 우리의 스타일 가이드는 API 용어 이름, HTML 요소와 속성, CSS 속성, 함수 이름등이 {{HTMLElement("code")}} 형식을 권장한다( 사실상 그대로 되어야 합니다)라고 되어있습니다. 그것들은 또한 MDN상의 적절한 페이지로 링크가 연결되어있어야 합니다.</p> + +<p>매크로를 이용하여 이런 링크들을 만드는 것은 익숙해지기에 약간 시간이 걸리지만 많은 장점이 있습니다:</p> + +<ul> + <li>당신이 의도한 알맞은 스타일이 적용됩니다.</li> + <li>링크는 당신을 위해 생성되며 - 미래에 MDN 구성이 변경되더라도 미래 환경에 적응됩니다.</li> + <li>역시 당신에게 알맞은 툴팁이 생성될 수 있습니다.</li> +</ul> + +<p>이런 종류의 매크로가 많이 있으며, 여기서 모든 매크로를 다 보지는 않을 겁니다. 대신, 가장 일반적인 몇가지 특별한 예를 살펴볼 것입니다. 더 완벽한 목록은 <a href="/en-US/docs/Project:MDN/Contributing/Custom_macros">MDN 커스텀 매크로 </a>가이드의 "<a href="/en-US/docs/Project:MDN/Contributing/Custom_macros#Creating_hyperlinks">하이퍼링크 생성하기</a>" 섹션을 보세요. 모든 매크로에 대해서 <a href="/ko/docs/Project:Introduction_to_KumaScript">KumaScript</a> 소스 코드를 확인할 수 있다는 점은 주목할만 합니다. 대부분의 경우 소스코드 상단에 작동 방식과 다양한 매개변수가 무엏인지 설명하는 주석이 있습니다.</p> + +<h3 id="API_문서에_링크걸기">API 문서에 링크걸기</h3> + +<p>We have a number of extremely helpful macros for creating styled links to APIs. Here are a few of the most useful ones; in each case, there may be added parameters available to give you more control over the output (such as suppressing the automatic addition of the <code><code></code> styling). Each macro name below can be clicked upon to read the macro code itself; they all have comments at the top explaining what they do and all of their parameters.</p> + +<dl> + <dt>{{TemplateLink("HTMLElement")}}</dt> + <dd>Inserts an HTML element's name, properly styled and linked. For example: <code>\{{HTMLElement("table")}}</code> yields {{HTMLElement("table")}}.</dd> + <dt>{{TemplateLink("cssxref")}}</dt> + <dd>Inserts a CSS property, at-rule, or selector's documentation in the CSS reference. For example: <code>\{{cssxref("background-color")}}</code> results in {{cssxref("background-color")}}.</dd> + <dt>{{TemplateLink("domxref")}}</dt> + <dd>Inserts a link into the Web API Reference for a given API term. For example: <code>\{{domxref("window")}}</code> yields {{domxref("window")}} and <code>\{{domxref("window.scrollBy()")}}</code> inserts {{domxref("window.scrollBy()")}}. You can also supply an additional parameter to override the text: <code>\{{domxref("window.scrollBy", "scrollBy()")}}</code> results in {{domxref("window.scrollBy", "scrollBy()")}}.</dd> + <dt>{{TemplateLink("SVGElement")}}</dt> + <dd>Inserts an SVG element's name, properly styled and linked. For example: <code>\{{SVGElement("circle")}}</code> yields {{SVGElement("circle")}}.</dd> +</dl> + +<h3 id="동일_문서내_섹션에_링크걸기">동일 문서내 섹션에 링크걸기</h3> + +<p>To link to a section within the same article, you can use the {{TemplateLink("anch")}} macro. The syntax is straightforward: <code>\{{anch("Name of destination section")}}</code>. By default, the displayed link text is the title of that section, but you can add a second, optional, parameter indicating alternate text to use instead. Some examples:</p> + +<ul> + <li><code>\{{anch("Using the toolbar")}}</code> looks like this: {{anch("Using the toolbar")}}</li> + <li><code>\{{anch("Using the toolbar", "earlier in this article")}}</code> looks like this: {{anch("Using the toolbar", "earlier in this article")}}</li> +</ul> + +<h3 id="버그에_링크걸기">버그에 링크걸기</h3> + +<p>You can link to a bug in Mozilla's Bugzilla database with the {{TemplateLink("bug")}} macro. This macro accepts a single parameter: the bug number to link to. For example, <code>\{{bug(765642)}}</code> looks like this: {{bug(765642)}}.</p> + +<p>Similarly, you can create links to bugs in other browsers and Web engines:</p> + +<dl> + <dt>WebKit (Safari, etc.)</dt> + <dd>{{TemplateLink("WebkitBug")}}: <code>\{{webkitbug(31277)}}</code> yields {{webkitbug(31277)}}.</dd> +</dl> + +<h3 id="RFCs_에_링크걸기">RFCs 에 링크걸기</h3> + +<p>Much of the way the Internet works at a core level is documented in RFCs. You can easily reference RFCs using the {{TemplateLink("RFC")}} macro. For example, \{{RFC(2616)}} becomes {{RFC(2616)}}. You can, optionally, also provide alternate link text to use instead of a selected piece of text from the article or and/or the section number within the specification to which to link.</p> + +<h3 id="XPCOM_인터페이스_정보에_링크걸기">XPCOM 인터페이스 정보에 링크걸기 </h3> + +<div class="note"> +<p>The MDN staff no longer actively maintains the XPCOM documentation, but volunteer contributions are welcomel</p> +</div> + +<p>If you're documenting Mozilla internals, being able to easily create links to XPCOM interface documentation is helpful. There are a few macros used for this.</p> + +<p>The syntax for linking to the documentation for an XPCOM interface as a whole is just: <code>\{{interface("interfacename")}}</code>. For example, you might write:</p> + +<blockquote> +<p>When you need to parse or create URIs, the \{{interface("nsIIOService")}} interface can help.</p> +</blockquote> + +<p>The result looks like this:</p> + +<blockquote> +<p>When you need to parse or create URIs, the {{interface("nsIIOService")}} interface can help.</p> +</blockquote> + +<p>If you need to link to information about a specific method or attribute on an XPCOM interface, the {{TemplateLink("ifmethod")}} and {{TemplateLink("ifattribute")}} macros are for you. These accept as parameters the name of the interface and the name of the method or attribute to which you wish to reference. The {{TemplateLink("ifmethod")}} macro is particularly interesting, since it does some special formatting by adding the style guide-mandated parentheses after the method's name. For example, <code>\{{ifmethod("nsIIOService", "newURI")}}</code> results in {{ifmethod("nsIIOService", "newURI")}}. That's a case where you're being protected against possible changes in the style guide in the future!</p> + +<h3 id="Mozilla_설정_문서에_링크걸기">Mozilla 설정 문서에 링크걸기</h3> + +<p>To insert the name of a Mozilla preference and make it link to the corresponding page in the <a href="/en-US/docs/Mozilla/Preferences/Preference_reference">Preference reference</a>, use the {{TemplateLink("pref")}} macro. This accepts one parameter: the full name of the preference you wish to link to. For example, you can use <code>\{{pref("javascript.options.showInConsole")}}</code> to create this: {{pref("javascript.options.showInConsole")}}.</p> + +<h3 id="Mozilla_소스_파일에_링크걸기">Mozilla 소스 파일에 링크걸기</h3> + +<p>You can link to files in Mozilla's source tree (although you probably won't do this often) using the {{TemplateLink("source")}} macro. Instead of specifying the full URL of the file, you can simply specify the path relative to the <code>/source/</code> directory. For example: \{{source("browser/Makefile.in")}} creates this link: {{source("browser/Makefile.in")}}.</p> + +<p>You may also, optionally, specify alternative text to use for the link. For example, you can use \{{source("browser/Makefile.in", "the browser's makefile")}} to get the result: {{source("browser/Makefile.in", "the browser's makefile")}}.</p> + +<div class="note"> +<p>Please look at the {{anch("Using macros")}} documentation if you're interested in learning more about using macros, and check out our <a href="/en-US/docs/Project:MDN/Kuma/KumaScript_guide">KumaScript</a> documentation to learn more about the macro system itself.</p> +</div> + +<h2 id="추천_콘텐츠에_링크걸기">추천 콘텐츠에 링크걸기</h2> + +<p>If you wish to create a list of related pages, or other recommended reading material, you should do so by creating a quicklinks box in the sidebar; this mechanism is replacing our old "See also" headings at the end of articles. For details on how to create quicklinks boxes, see <a href="/en-US/docs/MDN/Contribute/Structures/Quicklinks">Quicklinks</a>.</p> + +<h2 id="URL_정책">URL 정책</h2> + +<p>For security reasons, you should only create links that use the following schemes:</p> + +<ul> + <li><code>http://</code></li> + <li><code>https://</code></li> + <li><code>ftp://</code></li> + <li><code>mailto:</code></li> +</ul> + +<p>Others may or may not work, but are not supported and will probably be removed by editorial staff.</p> + +<div class="note"> +<p>Special URL schemes such as <code>about:</code> and <code>chrome:</code> are used by Firefox, Google Chrome, and some other browsers to provide access to special content such as preferences, debugging information, and so forth. These links do not work from article content, so please do not try to create links using these schemes within MDN articles. The same applies to the <code>javascript:</code> and <code>jar:</code> schemes, which are blocked by most modern browsers as a security precaution.</p> +</div> + +<p>{{EditorGuideQuicklinks}}</p> |