๊ตฌ๊ธํ์ด์ง ์คํผ๋์์ ์ค๋ฅ ์ฌ์ดํธ, ๋ธ๋ก๊ทธ ์ ๊ทผ์ฑ ๊ฐ์ ๋ฐฉ๋ฒ
์์ดํ๋ ์ ์์์ ์ ๋ชฉ์ด ์์ ์ค๋ฅ
๊ฒ์ ์ต์ ํ ์์
์ค ์์ดํ๋ ์์ ์์์ ์ ๋ชฉ์ด ์์์ ์ ๊ทผ์ฑ ๊ฐ์ ์์ฒญ ์ฌํญ์ด ์์ต๋๋ค. ์ด ๋ฌธ์ ๋ ์น ์ ๊ทผ์ฑ์ ๋ํ ๋ฌธ์ ์
๋๋ค. ์น ์ ๊ทผ์ฑ์ ์๊ฐ์ ์ฒญ๊ฐ์ ์ฅ์ ๋ฅผ ๊ฐ์ง ์ฌ์ฉ์๋ค์๊ฒ ์ ๋ณด๋ฅผ ์ ๊ณตํ๋ ๋ฐ ์์ด ์ค์ํ ์์์
๋๋ค. ๋ธ๋ก๊ทธ๋ฅผ ์ด์ํ๋ค ๋ณด๋ฉด iframe
์์์ ์ ๋ชฉ(title
) ์์ฑ ๋๋ฝ ๋ฌธ์ ๊ฐ ๋ฐ์ํ ์ ์์ต๋๋ค. ์ด๋ ์ ๊ทผ์ฑ ํ๊ฐ ๋๊ตฌ์์ ๊ฐ์ ์ด ํ์ํ๋ค๋ ๊ฒฝ๊ณ ๋ก ๋ํ๋๊ธฐ๋ ํ๋ฉฐ, ๋ค์๊ณผ ๊ฐ์ ๋ฐฉ์์ผ๋ก ์ผ๋ถ ํด๊ฒฐํ ์ ์์ต๋๋ค.
์์ดํ๋ ์ ์์์ ์ ๋ชฉ์ด ์์ ์์ ๋ฐฉ๋ฒ
iframe
์์์ title
์์ฑ์ ์ ๊ทผ์ฑ ์ธก๋ฉด์์ ๋งค์ฐ ์ค์ํ๊ณ , ์คํฌ๋ฆฐ ๋ฆฌ๋๋ฅผ ์ฌ์ฉํ๋ ์ฌ์ฉ์๋ค์๊ฒ ํด๋น ํ๋ ์์ ๋ด์ฉ์ ์ค๋ช
ํด์ฃผ๋ ๋ฐ ํ์์ ์
๋๋ค. ๊ทธ๋ฌ๋ ๋์ ์ผ๋ก ์ฝํ
์ธ ๋ฅผ ์์ฑํ๋ ๊ฒฝ์ฐ๋ ๋ฌธ์ ๋ฅผ ํด๊ฒฐํ๊ธฐ ํ๋ญ๋๋ค.
๋์ ์ฝ๋์ ํด๊ฒฐ์ ๋ฌธ์ ์
- ์๋ ์์ฑ๋ ์ฝ๋ ์์ ์ ์ด๋ ค์:
iframe
์ด ๋์ ์ผ๋ก ์ฝ์ ๋๊ธฐ ๋๋ฌธ์ HTML ํ์ผ์์ ์ง์ ์์ ์ ์๋ํด๋ ์ ์ฉ๋์ง ์์ ์ ์์ต๋๋ค. - pagespeed ์ ๊ทผ์ฑ ๊ฒฝ๊ณ :
div#wrap > header#header > div.inner > a
๊ฒฝ๋ก์iframe
์ด ํฌํจ๋ ๊ฒฝ์ฐ,title
์์ฑ์ด ๋๋ฝ๋์๋ค๋ ๊ฒฝ๊ณ ๊ฐ ๋ํ๋ ์ ์์ต๋๋ค. - ์ฝ๋ฉ์ ๋ณต์ก์ฑ: ์ฝ๋ ์์ ์์ ์ ์ผ๋ฐ ์ฌ์ฉ์์๊ฒ ๋ถ๋ด์ด ๋ ์ ์์ต๋๋ค.
๋์ ์์ดํ๋ ์ title ์์ ์ถ๊ฐ ํ๊ธฐ
HTML ํ์ด์ง์์ title ์์ฑ์ ์ ๊ทผ์ฑ์ ์ค์ํ ์ญํ ์ ํฉ๋๋ค. ์๊ฐ ์ฅ์ ์ธ ๋ฑ ์ฅ์ ๊ฐ ์๋ ์ฌ์ฉ์๊ฐ ์น ํ์ด์ง๋ฅผ ํ์ํ ๋ ํ์ํ ๊ธฐ๋ฅ์ผ๋ก์จ ์ ๊ทผ์ฑ ๊ฐ์ ์ฌํญ ์ค ํ๋์ ๋๋ค. ์ง์ ์ฝ๋ฉ์ ํ ๋๋ ๋๋ฝ์ ๋ณธ์ธ์ด ์ง์ ์์ ํ๋ฉด ๋์ง๋ง ๋์ ์ผ๋ก ์์ฑ๋๊ฑฐ๋ ๋ณ๊ฒฝ๋๋ ์ฝ๋๋ ์ง์ ์์ ์ด ์ฝ์ง ์์ต๋๋ค.
์ฝ๋์ ๋ํ ์ ๋ฌธ์ ์ธ ์ง์๋ ํ์ํ๊ณ ์ฝ๋ฉ ์์ ๋ ํด์ผ ํฉ๋๋ค.
๊ทธ๋์ ๊ฐ๋จํ๊ฒ javaScript๋ฅผ ์ฌ์ฉํด์ ์งํํ๊ธฐ๋ ํฉ๋๋ค. ์ฃผ๋ก ๋ง์ด ์ฌ์ฉํ๋ ๋ฐฉ๋ฒ์ด ํ๋๋ก DOMContentLoaded ์ฝ๋๋ฅผ ์ด์ฉํด์ ํ๊ธฐ๋ ํฉ๋๋ค.
JavaScript๋ก ๋์ ์์
์ด๋ฌํ ๋ฌธ์ ๋ JavaScript๋ฅผ ํ์ฉํด ๊ฐ๋จํ ํด๊ฒฐํ ์ ์์ต๋๋ค. ํนํ, ๋ธ๋ผ์ฐ์ ๊ฐ HTML ๋ฌธ์๋ฅผ ๋ถ์ํ๊ณ DOM ํธ๋ฆฌ๋ฅผ ์์ฑํ ํ ์ํ๋ ์์๋ฅผ ์์ ํ ์ ์๋ DOMContentLoaded ์ด๋ฒคํธ๋ฅผ ์ฌ์ฉํ๋ฉด ํจ๊ณผ์ ์ ๋๋ค.
DOMContentLoaded๋?
DOMContentLoaded
๋ ๋ธ๋ผ์ฐ์ ๊ฐ HTML ๋ฌธ์๋ฅผ ์ฝ๊ณ DOM ํธ๋ฆฌ๋ฅผ ์์ฑํ์ ๋ ๋ฐ์ํ๋ ์ด๋ฒคํธ์
๋๋ค. ์ด ์์ ์ ํ์ฉํ๋ฉด HTML ์์๊ฐ ๋ชจ๋ ๋ก๋๋ ํ ํ์ํ ์์ฑ์ ์ถ๊ฐํ๊ฑฐ๋ ์์ ํ ์ ์์ต๋๋ค.
๋ธ๋ผ์ฐ์ ๊ฐ HTML ๋ฌธ์๋ฅผ ์ฝ๊ณ DOM(Document Object Model) ํธ๋ฆฌ ํํ๋ก ๋ณํ์ ํ๋๋ฐ ๊ทธ๋ HTML๋ฌธ์์ ์์ฑ,์์,ํ๊ทธ๋ฑ์ ๋ถ์ํด์ ํธ๋ฆฌํํ์ ๊ตฌ์กฐ๋ฅผ ํ์ฑํ๊ฒ ๋ฉ๋๋ค. ์ด๋ JavaScript๋ CSS์ ๊ฐ์ ์คํฌ๋ฆฝํธ์ ์คํ์ผ์ ์ ์ฉํ๊ฒ ๋ฉ๋๋ค. ๊ทธ๋ ์ํ๋์ฝ๋๋ฅผ ํ์ด์ง ๋ ๋๋ง ํ ๋ ํ์ํ ์์๋ฅผ ์ฝ์ ํ๋ ๋ฐฉ๋ฒ์ ๋๋ค.
์คํฌ๋ฆฝํธ ์ฝ๋
์๋๋ iframe์ ๋๋ฝ๋ title ์์ฑ์ ์ถ๊ฐํ๋ JavaScript ์ฝ๋์ ๋๋ค. ์ด ์ฝ๋๋ฅผ ํ์ด์ง ๋ด๋ถ์ ์ฝ์ ํ๋ฉด ์๋์ผ๋ก ์ ์ฉ๋ฉ๋๋ค.
<script>
window.addEventListener('DOMContentLoaded', function() {
var iframe = document.getElementById('editEntry');
if (iframe) {
iframe.setAttribute('title', 'ํฐ์คํ ๋ฆฌ๋ธ๋ก๊ทธ');
}
});
</script>
์์ ์ฝ๋๋ฅผ HEAD ์ฌ์ด์ ์ถ๊ฐํ์๊ฒ ๋๋ฉด ์๋์ผ๋ก ํ์ํ ์์ TITLE ์์ฑ์ ์ถ๊ฐํ๋ฏ๋ก ๋๋ฝ๋ ์ฝ๋๋ฅผ ๋์ฒํ ์์๋ ๊ฐ๋จํ ๋ฐฉ๋ฒ์ ๋๋ค. ๋ณธ์ธ์ ๋ง๊ฒ ์์ ํด์ ์ฌ์ฉํ์ ๋ ๋๊ณ , ๋ง์ฝ ์๋์ ๊ฐ์ด ๋๊ฐ์ ๋ฌธ์ ๊ฐ ๋ฐ๊ฒฌ๋๋ค๋ฉด ํ์ดํ ์์ฑ๋ง ๋ณธ์ธ์ด ์ํ๋ ํ์ดํ๋ก ์์ ํด์ ๊ทธ๋๋ก ์ฌ์ฉํ์๋ฉด ๋ฉ๋๋ค.