{"id":14467,"date":"2026-06-04T15:03:12","date_gmt":"2026-06-04T06:03:12","guid":{"rendered":"https:\/\/rakkokeyword.com\/techo\/?p=14467"},"modified":"2026-06-04T15:03:12","modified_gmt":"2026-06-04T06:03:12","slug":"tool-source-viewer","status":"publish","type":"post","link":"https:\/\/rakkokeyword.com\/techo\/tool-source-viewer\/","title":{"rendered":"\u30bd\u30fc\u30b9\u30b3\u30fc\u30c9\u8868\u793a\u30c4\u30fc\u30eb"},"content":{"rendered":"<div id=\"sgb-css-id-1\">\n<style>\n\/* \u30d7\u30ec\u30d5\u30a3\u30c3\u30af\u30b9: scv_ (Source Code Viewer) *\/\n.scv_container { width: 100%; box-sizing: border-box; color: #333; font-family: sans-serif; font-size: 14px; line-height: 1.6; }\n.scv_input_group { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 10px; }\n.scv_input { flex-grow: 1; padding: 10px; font-size: 16px; min-width: 200px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px; }\n.scv_btn { height: 40px; padding: 0 20px; font-size: 14px; font-weight: bold; border: none; cursor: pointer; border-radius: 4px; box-sizing: border-box; transition: background-color 0.2s; }\n.scv_btn_primary { background-color: #13284B; color: #fff; }\n.scv_btn_primary:hover { background-color: #0e1d38; }\n.scv_btn_default { background-color: #e0e0e0; color: #333; }\n.scv_btn_default:hover { background-color: #ccc; }\n.scv_error { color: #d32f2f; font-weight: bold; margin-bottom: 10px; display: none; }\n.scv_loader { display: none; margin: 15px 0; font-weight: bold; color: #13284B; }\n\n.scv_result_area { display: none; margin-top: 20px; }\n.scv_table { width: 100%; border-collapse: collapse; margin-bottom: 20px; font-size: 13px; }\n.scv_table th, .scv_table td { border: 1px solid #ccc; padding: 8px; text-align: left; word-break: break-all; }\n.scv_table th { background-color: #f5f5f5; width: 30%; }\n\n.scv_tabs { \n    display: flex; \n    border-bottom: 1px solid #ccc; \n    margin-bottom: 15px; \n    overflow-x: auto; \n    overflow-y: hidden;\n    white-space: nowrap; \n    scrollbar-width: none;\n    -ms-overflow-style: none;\n}\n.scv_tabs::-webkit-scrollbar {\n    display: none;\n}\n.scv_tab { padding: 10px 15px; cursor: pointer; background: #f9f9f9; border: 1px solid transparent; margin-right: 2px; }\n.scv_tab.scv_active { background: #fff; border-top: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc; border-bottom: 1px solid #fff; margin-bottom: -1px; font-weight: bold; }\n.scv_tab_content { display: none; }\n.scv_tab_content.scv_active { display: block; }\n\n.scv_actions { display: flex; gap: 10px; margin-bottom: 10px; align-items: center; flex-wrap: wrap; }\n.scv_toggle_label { display: flex; align-items: center; cursor: pointer; font-weight: bold; font-size: 13px; }\n.scv_toggle_input { margin-right: 5px; }\n\n\/* \u30bd\u30fc\u30b9\u30b3\u30fc\u30c9\u30a8\u30ea\u30a2\uff1a\u80cc\u666f\u3092\u767d\u7cfb\u306b\u5909\u66f4\u3057\u3001\u6587\u5b57\u8272\u3092\u6697\u304f\u3057\u3066\u30b3\u30f3\u30c8\u30e9\u30b9\u30c8\u3092\u78ba\u4fdd *\/\n.scv_code_wrapper { background-color: #f9f9f9; border: 1px solid #ccc; padding: 15px 0; border-radius: 4px; max-height: 600px; overflow-y: auto; overflow-x: auto; }\n.scv_code { font-family: Consolas, Monaco, monospace; margin: 0; white-space: pre; font-size: 13px; line-height: 1.5; counter-reset: scv-line; color: #333333 !important; }\n.scv_line { display: block; padding-left: 10px; padding-right: 10px; }\n.scv_line::before { counter-increment: scv-line; content: counter(scv-line); display: inline-block; width: 45px; margin-right: 15px; color: #999999; text-align: right; user-select: none; border-right: 1px solid #ddd; padding-right: 10px; }\n\/* \u767d\u80cc\u666f\u7528\u30e9\u30a4\u30c8\u30c6\u30fc\u30de\u306e\u30b7\u30f3\u30bf\u30c3\u30af\u30b9\u30cf\u30a4\u30e9\u30a4\u30c8 *\/\n.scv_tag { color: #0000ff !important; } \/* \u9752\u8272 *\/\n.scv_attr { color: #ff0000 !important; } \/* \u8d64\u8272 *\/\n.scv_val { color: #a31515 !important; } \/* \u6fc3\u3044\u8d64\u30fb\u8336\u8272 *\/\n.scv_code_plain { padding: 10px 20px; color: #333333 !important; }\n\n.scv_list_table { width: 100%; border-collapse: collapse; font-size: 13px; }\n.scv_list_table th, .scv_list_table td { border: 1px solid #ccc; padding: 8px; text-align: left; word-break: break-all; }\n.scv_list_table th { background-color: #f5f5f5; }\n.scv_link { color: #13284B; text-decoration: underline; }\n\n.scv_toast { position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); background: #333; color: #fff; padding: 10px 20px; border-radius: 4px; display: none; z-index: 1000; font-weight: bold; box-shadow: 0 4px 6px rgba(0,0,0,0.3); }\n<\/style>\n\n<div class=\"scv_container\">\n    <div class=\"scv_input_group\">\n        <input type=\"text\" id=\"scv_url_input\" class=\"scv_input\" placeholder=\"https:\/\/example.com\">\n        <button type=\"button\" id=\"scv_btn_submit\" class=\"scv_btn scv_btn_primary\">\u30bd\u30fc\u30b9\u3092\u53d6\u5f97<\/button>\n        <button type=\"button\" id=\"scv_btn_reset\" class=\"scv_btn scv_btn_default\">\u30ea\u30bb\u30c3\u30c8<\/button>\n    <\/div>\n    \n    <p id=\"scv_error_msg\" class=\"scv_error\"><\/p>\n    <p id=\"scv_loader\" class=\"scv_loader\">\u53d6\u5f97\u4e2d\u2026 \u3057\u3070\u3089\u304f\u304a\u5f85\u3061\u304f\u3060\u3055\u3044\u3002<\/p>\n    \n    <div id=\"scv_result_area\" class=\"scv_result_area\">\n        <table class=\"scv_table\">\n            <tbody>\n                <tr><th>\u53d6\u5f97URL<\/th><td id=\"scv_info_url\"><\/td><\/tr>\n                <tr><th>\u7dcf\u6587\u5b57\u6570<\/th><td id=\"scv_info_chars\"><\/td><\/tr>\n                <tr><th>\u884c\u6570<\/th><td id=\"scv_info_lines\"><\/td><\/tr>\n                <tr><th>\u30c7\u30fc\u30bf\u30b5\u30a4\u30ba<\/th><td id=\"scv_info_size\"><\/td><\/tr>\n            <\/tbody>\n        <\/table>\n\n        <div class=\"scv_tabs\">\n            <div class=\"scv_tab scv_active\" data-target=\"scv_tab_code\">HTML\u30b3\u30fc\u30c9<\/div>\n            <div class=\"scv_tab\" data-target=\"scv_tab_seo\">SEO\u60c5\u5831<\/div>\n            <div class=\"scv_tab\" data-target=\"scv_tab_assets\">\u5916\u90e8\u30ea\u30bd\u30fc\u30b9 (CSS\/JS)<\/div>\n            <div class=\"scv_tab\" data-target=\"scv_tab_links\">\u30ea\u30f3\u30af\u4e00\u89a7<\/div>\n        <\/div>\n\n        <div id=\"scv_tab_code\" class=\"scv_tab_content scv_active\">\n            <div class=\"scv_actions\">\n                <label class=\"scv_toggle_label\">\n                    <input type=\"checkbox\" id=\"scv_toggle_format\" class=\"scv_toggle_input\"> \u30b3\u30fc\u30c9\u3092\u6574\u5f62\u3059\u308b (\u203b\u9577\u6587\u6642\u306f\u7121\u52b9\u5316)\n                <\/label>\n                <button type=\"button\" id=\"scv_btn_copy\" class=\"scv_btn scv_btn_default\">\u30b3\u30fc\u30c9\u3092\u30b3\u30d4\u30fc<\/button>\n                <button type=\"button\" id=\"scv_btn_download\" class=\"scv_btn scv_btn_default\">\u4fdd\u5b58 (.html)<\/button>\n            <\/div>\n            <div class=\"scv_code_wrapper\">\n                <code id=\"scv_code_display\" class=\"scv_code\"><\/code>\n            <\/div>\n        <\/div>\n\n        <div id=\"scv_tab_seo\" class=\"scv_tab_content\">\n            <table class=\"scv_list_table\">\n                <tbody id=\"scv_seo_body\"><\/tbody>\n            <\/table>\n        <\/div>\n\n        <div id=\"scv_tab_assets\" class=\"scv_tab_content\">\n            <table class=\"scv_list_table\">\n                <thead><tr><th style=\"width:20%;\">\u7a2e\u985e<\/th><th>URL<\/th><\/tr><\/thead>\n                <tbody id=\"scv_assets_body\"><\/tbody>\n            <\/table>\n        <\/div>\n\n        <div id=\"scv_tab_links\" class=\"scv_tab_content\">\n            <table class=\"scv_list_table\">\n                <thead><tr><th>\u30ea\u30f3\u30af\u5148URL (href)<\/th><\/tr><\/thead>\n                <tbody id=\"scv_links_body\"><\/tbody>\n            <\/table>\n        <\/div>\n    <\/div>\n<\/div>\n\n<div id=\"scv_toast\" class=\"scv_toast\">\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f<\/div>\n\n<script>\ndocument.addEventListener('DOMContentLoaded', function() {\n    const API_URL = 'https:\/\/media-api.qcdgv19414.rakkoserver.net\/source_code_viewer.php';\n    const MAX_HIGHLIGHT_LENGTH = 200000;\n    let currentHtmlRaw = '';\n    let currentUrl = '';\n    \n    const domUrlInput = document.getElementById('scv_url_input');\n    const domBtnSubmit = document.getElementById('scv_btn_submit');\n    const domBtnReset = document.getElementById('scv_btn_reset');\n    const domErrorMsg = document.getElementById('scv_error_msg');\n    const domLoader = document.getElementById('scv_loader');\n    const domResultArea = document.getElementById('scv_result_area');\n    \n    const domInfoUrl = document.getElementById('scv_info_url');\n    const domInfoChars = document.getElementById('scv_info_chars');\n    const domInfoLines = document.getElementById('scv_info_lines');\n    const domInfoSize = document.getElementById('scv_info_size');\n    \n    const domTabs = document.querySelectorAll('.scv_tab');\n    const domTabContents = document.querySelectorAll('.scv_tab_content');\n    \n    const domCodeDisplay = document.getElementById('scv_code_display');\n    const domToggleFormat = document.getElementById('scv_toggle_format');\n    const domBtnCopy = document.getElementById('scv_btn_copy');\n    const domBtnDownload = document.getElementById('scv_btn_download');\n    \n    const domSeoBody = document.getElementById('scv_seo_body');\n    const domAssetsBody = document.getElementById('scv_assets_body');\n    const domLinksBody = document.getElementById('scv_links_body');\n    const domToast = document.getElementById('scv_toast');\n\n    function escapeHtml(str) {\n        if (!str) return '';\n        return str.replace(\/&\/g, '&' + 'amp;')\n                  .replace(\/<\/g, '&#038;' + 'lt;')\n                  .replace(\/>\/g, '&' + 'gt;')\n                  .replace(\/\"\/g, '&' + 'quot;')\n                  .replace(\/'\/g, '&' + '#39;');\n    }\n\n    function showToast(msg) {\n        domToast.textContent = msg;\n        domToast.style.display = 'block';\n        setTimeout(function() {\n            domToast.style.display = 'none';\n        }, 2500);\n    }\n\n    function formatBytes(bytes) {\n        if (bytes === 0) return '0 Bytes';\n        const k = 1024;\n        const sizes = ['Bytes', 'KB', 'MB'];\n        const i = Math.floor(Math.log(bytes) \/ Math.log(k));\n        return parseFloat((bytes \/ Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];\n    }\n\n    function getAbsoluteUrl(urlStr, baseStr) {\n        try {\n            return new URL(urlStr, baseStr).href;\n        } catch (e) {\n            return urlStr;\n        }\n    }\n\n    function formatHTML(html) {\n        let formatted = '';\n        let indentLevel = 0;\n        const tokens = html.replace(\/>\\s*<\/g, '>\\n<').split('\\n');\n        \n        for (let i = 0; i < tokens.length; i++) {\n            let token = tokens[i].trim();\n            if (!token) continue;\n            \n            if (token.match(\/^<\\\/[a-zA-Z0-9\\-:]+\/)) {\n                indentLevel = Math.max(0, indentLevel - 1);\n            }\n            formatted += '  '.repeat(indentLevel) + token + '\\n';\n            \n            if (token.match(\/^<[a-zA-Z0-9\\-:]+[^>]*[^\\\/]>$\/) && !token.match(\/<(link|meta|img|br|hr|input)\/i)) {\n                indentLevel++;\n            }\n        }\n        return formatted;\n    }\n\n    function renderCode(htmlStr, shouldFormat) {\n        domCodeDisplay.innerHTML = '';\n        domCodeDisplay.className = 'scv_code';\n        \n        let targetHtml = htmlStr;\n        \n        if (targetHtml.length > MAX_HIGHLIGHT_LENGTH) {\n            domToggleFormat.disabled = true;\n            domCodeDisplay.classList.add('scv_code_plain');\n            domCodeDisplay.textContent = targetHtml;\n            return;\n        }\n        \n        domToggleFormat.disabled = false;\n        \n        if (shouldFormat) {\n            targetHtml = formatHTML(targetHtml);\n        }\n\n        let highlighted = escapeHtml(targetHtml)\n            .replace(\/(&lt;\\\/?[a-zA-Z0-9\\-:]+)(.*?)(\\\/?&gt;)\/g, function(match, p1, p2, p3) {\n                let attrs = p2.replace(\/([a-zA-Z0-9\\-:]+)=(&quot;[^&]*&quot;|&#39;[^&]*&#39;|[^\\s&]+)\/g, '<span class=\"scv_attr\">$1<\/span>=<span class=\"scv_val\">$2<\/span>');\n                return '<span class=\"scv_tag\">' + p1 + '<\/span>' + attrs + '<span class=\"scv_tag\">' + p3 + '<\/span>';\n            });\n\n        const lines = highlighted.split('\\n');\n        let finalHtml = '';\n        for(let i=0; i<lines.length; i++) {\n            finalHtml += '<span class=\"scv_line\">' + (lines[i] || ' ') + '<\/span>';\n        }\n        domCodeDisplay.innerHTML = finalHtml;\n    }\n\n    function parseAndExtract(htmlStr, baseUrl) {\n        const parser = new DOMParser();\n        let doc;\n        try {\n            doc = parser.parseFromString(htmlStr, 'text\/html');\n        } catch (e) {\n            return;\n        }\n\n        domSeoBody.innerHTML = '';\n        const appendRow = (label, text) => {\n            if (!text) return;\n            const tr = document.createElement('tr');\n            const th = document.createElement('th');\n            th.textContent = label;\n            const td = document.createElement('td');\n            td.textContent = text;\n            tr.appendChild(th);\n            tr.appendChild(td);\n            domSeoBody.appendChild(tr);\n        };\n        \n        const title = doc.querySelector('title');\n        appendRow('<title>', title ? title.textContent.trim() : '\u306a\u3057');\n        \n        const metaDesc = doc.querySelector('meta[name=\"description\"]');\n        appendRow('<meta description>', metaDesc ? metaDesc.getAttribute('content') : '\u306a\u3057');\n        \n        ['h1', 'h2', 'h3'].forEach(tag => {\n            const elements = doc.querySelectorAll(tag);\n            elements.forEach((el, index) => {\n                appendRow(`<${tag}> [${index + 1}]`, el.textContent.trim().replace(\/\\s+\/g, ' '));\n            });\n        });\n\n        domAssetsBody.innerHTML = '';\n        const appendAsset = (type, url) => {\n            if (!url) return;\n            const absUrl = getAbsoluteUrl(url, baseUrl);\n            const tr = document.createElement('tr');\n            const tdType = document.createElement('td');\n            tdType.textContent = type;\n            const tdUrl = document.createElement('td');\n            const a = document.createElement('a');\n            a.href = absUrl;\n            a.textContent = absUrl;\n            a.className = 'scv_link';\n            a.target = '_blank';\n            a.rel = 'noopener noreferrer';\n            tdUrl.appendChild(a);\n            tr.appendChild(tdType);\n            tr.appendChild(tdUrl);\n            domAssetsBody.appendChild(tr);\n        };\n\n        doc.querySelectorAll('link[rel=\"stylesheet\"]').forEach(el => appendAsset('CSS', el.getAttribute('href')));\n        doc.querySelectorAll('script[src]').forEach(el => appendAsset('JS', el.getAttribute('src')));\n\n        domLinksBody.innerHTML = '';\n        const links = Array.from(doc.querySelectorAll('a[href]'));\n        const uniqueLinks = new Set();\n        links.forEach(el => {\n            const href = el.getAttribute('href');\n            if (href && !href.startsWith('javascript:') && !href.startsWith('mailto:')) {\n                uniqueLinks.add(getAbsoluteUrl(href, baseUrl));\n            }\n        });\n        uniqueLinks.forEach(url => {\n            const tr = document.createElement('tr');\n            const td = document.createElement('td');\n            const a = document.createElement('a');\n            a.href = url;\n            a.textContent = url;\n            a.className = 'scv_link';\n            a.target = '_blank';\n            a.rel = 'noopener noreferrer';\n            td.appendChild(a);\n            tr.appendChild(td);\n            domLinksBody.appendChild(tr);\n        });\n    }\n\n    domTabs.forEach(tab => {\n        tab.addEventListener('click', function() {\n            domTabs.forEach(t => t.classList.remove('scv_active'));\n            domTabContents.forEach(c => c.classList.remove('scv_active'));\n            \n            this.classList.add('scv_active');\n            const targetId = this.getAttribute('data-target');\n            document.getElementById(targetId).classList.add('scv_active');\n        });\n    });\n\n    domToggleFormat.addEventListener('change', function() {\n        if (!currentHtmlRaw) return;\n        renderCode(currentHtmlRaw, this.checked);\n    });\n\n    domBtnCopy.addEventListener('click', function() {\n        if (!currentHtmlRaw) return;\n        let textToCopy = currentHtmlRaw;\n        if (domToggleFormat.checked && currentHtmlRaw.length <= MAX_HIGHLIGHT_LENGTH) {\n            textToCopy = formatHTML(currentHtmlRaw);\n        }\n        navigator.clipboard.writeText(textToCopy).then(() => {\n            showToast('\u30bd\u30fc\u30b9\u30b3\u30fc\u30c9\u3092\u30b3\u30d4\u30fc\u3057\u307e\u3057\u305f');\n        }).catch(err => {\n            alert('\u30b3\u30d4\u30fc\u306b\u5931\u6557\u3057\u307e\u3057\u305f\u3002');\n        });\n    });\n\n    domBtnDownload.addEventListener('click', function() {\n        if (!currentHtmlRaw) return;\n        let textToDownload = currentHtmlRaw;\n        if (domToggleFormat.checked && currentHtmlRaw.length <= MAX_HIGHLIGHT_LENGTH) {\n            textToDownload = formatHTML(currentHtmlRaw);\n        }\n        const blob = new Blob([textToDownload], { type: 'text\/html' });\n        const url = URL.createObjectURL(blob);\n        const a = document.createElement('a');\n        a.href = url;\n        let host = 'source';\n        try { host = new URL(currentUrl).hostname; } catch(e) {}\n        a.download = host + '.html';\n        document.body.appendChild(a);\n        a.click();\n        document.body.removeChild(a);\n        URL.revokeObjectURL(url);\n    });\n\n    domBtnReset.addEventListener('click', function() {\n        domUrlInput.value = '';\n        domErrorMsg.style.display = 'none';\n        domResultArea.style.display = 'none';\n        currentHtmlRaw = '';\n        currentUrl = '';\n        domToggleFormat.checked = false;\n    });\n\n    domBtnSubmit.addEventListener('click', function() {\n        const urlVal = domUrlInput.value.trim();\n        domErrorMsg.style.display = 'none';\n        domResultArea.style.display = 'none';\n        \n        if (!urlVal) {\n            domErrorMsg.textContent = 'URL\u3092\u5165\u529b\u3057\u3066\u304f\u3060\u3055\u3044\u3002';\n            domErrorMsg.style.display = 'block';\n            return;\n        }\n        \n        if (!\/^https?:\\\/\\\/\/i.test(urlVal)) {\n            domErrorMsg.textContent = 'URL\u306f http:\/\/ \u307e\u305f\u306f https:\/\/ \u304b\u3089\u59cb\u3081\u3066\u304f\u3060\u3055\u3044\u3002';\n            domErrorMsg.style.display = 'block';\n            return;\n        }\n\n        currentUrl = urlVal;\n        domLoader.style.display = 'block';\n        domBtnSubmit.disabled = true;\n\n        fetch(API_URL, {\n            method: 'POST',\n            headers: { 'Content-Type': 'application\/json' },\n            body: JSON.stringify({ url: urlVal })\n        })\n        .then(response => {\n            if (response.status === 429) {\n                throw new Error('\u30ea\u30af\u30a8\u30b9\u30c8\u304c\u591a\u3059\u304e\u307e\u3059\u3002\u5c11\u3057\u5f85\u3063\u3066\u304b\u3089\u518d\u5ea6\u304a\u8a66\u3057\u304f\u3060\u3055\u3044\u3002');\n            }\n            return response.json();\n        })\n        .then(data => {\n            domLoader.style.display = 'none';\n            domBtnSubmit.disabled = false;\n\n            if (data.error) {\n                domErrorMsg.textContent = data.error;\n                domErrorMsg.style.display = 'block';\n                return;\n            }\n\n            if (!data.html) {\n                domErrorMsg.textContent = '\u30bd\u30fc\u30b9\u30b3\u30fc\u30c9\u304c\u53d6\u5f97\u3067\u304d\u307e\u305b\u3093\u3067\u3057\u305f\u3002\u30a2\u30af\u30bb\u30b9\u5236\u9650\u3084\u52d5\u7684\u751f\u6210\u30da\u30fc\u30b8\u3067\u3042\u308b\u53ef\u80fd\u6027\u304c\u3042\u308a\u307e\u3059\u3002';\n                domErrorMsg.style.display = 'block';\n                return;\n            }\n\n            currentHtmlRaw = data.html;\n            \n            domInfoUrl.textContent = currentUrl;\n            domInfoChars.textContent = currentHtmlRaw.length.toLocaleString() + ' \u6587\u5b57';\n            domInfoLines.textContent = currentHtmlRaw.split('\\n').length.toLocaleString() + ' \u884c';\n            domInfoSize.textContent = formatBytes(data.size);\n\n            domToggleFormat.checked = false;\n            renderCode(currentHtmlRaw, false);\n\n            parseAndExtract(currentHtmlRaw, currentUrl);\n\n            domResultArea.style.display = 'block';\n            domTabs[0].click();\n        })\n        .catch(error => {\n            domLoader.style.display = 'none';\n            domBtnSubmit.disabled = false;\n            domErrorMsg.textContent = '\u901a\u4fe1\u30a8\u30e9\u30fc\u304c\u767a\u751f\u3057\u307e\u3057\u305f: ' + error.message;\n            domErrorMsg.style.display = 'block';\n        });\n    });\n});\n<\/script>\n<\/div>\n\n\n<p>URL\u3092\u5165\u529b\u3059\u308b\u3060\u3051\u3067\u3001Web\u30da\u30fc\u30b8\u306e\u30bd\u30fc\u30b9\u30b3\u30fc\u30c9\u3092\u898b\u3084\u3059\u304f\u8868\u793a\u3067\u304d\u308b\u7121\u6599\u30c4\u30fc\u30eb\u3067\u3059\u3002\u30b3\u30fc\u30c9\u306e\u30a4\u30f3\u30c7\u30f3\u30c8\u3092\u63c3\u3048\u308b\u6a5f\u80fd\u3084\u30ea\u30f3\u30af\u306e\u81ea\u52d5\u62bd\u51fa\u6a5f\u80fd\u304c\u3042\u308a\u3001\u30d6\u30e9\u30a6\u30b6\u306e\u7279\u6b8a\u306a\u64cd\u4f5c\u4e0d\u8981\u3067HTML\u3092\u78ba\u8a8d\u3067\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"i-0\">\u3053\u306e\u30c4\u30fc\u30eb\u306e\u4f7f\u3044\u65b9<\/h2>\n\n\n\n<p>\u4f7f\u3044\u65b9\u306f\u975e\u5e38\u306b\u30b7\u30f3\u30d7\u30eb\u3067\u3059\u3002\u8907\u96d1\u306a\u30e1\u30cb\u30e5\u30fc\u64cd\u4f5c\u306f\u5fc5\u8981\u3042\u308a\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<ol start=\"1\" class=\"wp-block-list\">\n<li><strong>URL\u3092\u5165\u529b\u3059\u308b<\/strong>: \u753b\u9762\u4e0a\u90e8\u306e\u5165\u529b\u6b04\u306b\u3001\u30bd\u30fc\u30b9\u30b3\u30fc\u30c9\u3092\u78ba\u8a8d\u3057\u305f\u3044\u30a6\u30a7\u30d6\u30da\u30fc\u30b8\u306eURL\uff08<code>http:\/\/<\/code> \u307e\u305f\u306f <code>https:\/\/<\/code> \u304b\u3089\u59cb\u307e\u308b\u3082\u306e\uff09\u3092\u5165\u529b\u3057\u3001\u300c\u30bd\u30fc\u30b9\u3092\u53d6\u5f97\u300d\u30dc\u30bf\u30f3\u3092\u62bc\u3057\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>\u7d50\u679c\u3092\u78ba\u8a8d\u3059\u308b<\/strong>: \u30da\u30fc\u30b8\u306e\u8aad\u307f\u8fbc\u307f\u304c\u5b8c\u4e86\u3059\u308b\u3068\u3001\u53d6\u5f97\u3057\u305f\u30c7\u30fc\u30bf\u304c\u4ee5\u4e0b\u306e4\u3064\u306e\u30bf\u30d6\u306b\u5206\u304b\u308c\u3066\u8868\u793a\u3055\u308c\u307e\u3059\u3002\n<ul class=\"wp-block-list\">\n<li><strong>HTML\u30b3\u30fc\u30c9<\/strong>: \u30da\u30fc\u30b8\u306e\u30bd\u30fc\u30b9\u30b3\u30fc\u30c9\u5168\u4f53\u3092\u78ba\u8a8d\u3067\u304d\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>SEO\u60c5\u5831<\/strong>: \u30bf\u30a4\u30c8\u30eb\u3084\u898b\u51fa\u3057\u306a\u3069\u3001SEO\u306b\u95a2\u308f\u308b\u91cd\u8981\u306a\u30bf\u30b0\u3092\u4e00\u89a7\u8868\u793a\u3057\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>\u5916\u90e8\u30ea\u30bd\u30fc\u30b9<\/strong>: \u30da\u30fc\u30b8\u5185\u3067\u8aad\u307f\u8fbc\u307e\u308c\u3066\u3044\u308bCSS\u3084JavaScript\u306eURL\u3092\u78ba\u8a8d\u3067\u304d\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>\u30ea\u30f3\u30af\u4e00\u89a7<\/strong>: \u30da\u30fc\u30b8\u5185\u306b\u8a2d\u7f6e\u3055\u308c\u3066\u3044\u308b\u3059\u3079\u3066\u306e\u30ea\u30f3\u30af\u5148URL\u3092\u30ea\u30b9\u30c8\u5316\u3057\u307e\u3059\u3002<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li><strong>\u30b3\u30d4\u30fc\u30fb\u4fdd\u5b58\u3059\u308b<\/strong>: \u300cHTML\u30b3\u30fc\u30c9\u300d\u30bf\u30d6\u5185\u306b\u3042\u308b\u30dc\u30bf\u30f3\u304b\u3089\u3001\u53d6\u5f97\u3057\u305f\u30bd\u30fc\u30b9\u30b3\u30fc\u30c9\u5168\u4f53\u3092\u30af\u30ea\u30c3\u30d7\u30dc\u30fc\u30c9\u306b\u30b3\u30d4\u30fc\u3057\u305f\u308a\u3001HTML\u30d5\u30a1\u30a4\u30eb\uff08<code>.html<\/code>\uff09\u3068\u3057\u3066\u30d1\u30bd\u30b3\u30f3\u7b49\u306b\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u4fdd\u5b58\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/li>\n<\/ol>\n\n\n\n<p><em>\u203b\u30bd\u30fc\u30b9\u30b3\u30fc\u30c9\u304c\u9577\u5927\uff0820\u4e07\u6587\u5b57\u4ee5\u4e0a\uff09\u306a\u5834\u5408\u306f\u3001\u30d6\u30e9\u30a6\u30b6\u306e\u52d5\u4f5c\u3092\u8efd\u304f\u3059\u308b\u305f\u3081\u300c\u30b3\u30fc\u30c9\u3092\u6574\u5f62\u3059\u308b\u300d\u6a5f\u80fd\u304c\u81ea\u52d5\u7684\u306b\u7121\u52b9\u5316\u3055\u308c\u307e\u3059\u3002<\/em><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"i-1\">\u3053\u306e\u30c4\u30fc\u30eb\u3067\u3067\u304d\u308b\u3053\u3068<\/h2>\n\n\n\n<p>\u672c\u30c4\u30fc\u30eb\u306f\u3001\u305f\u3060HTML\u3092\u8868\u793a\u3059\u308b\u3060\u3051\u3067\u306a\u304f\u3001\u60c5\u5831\u53ce\u96c6\u3092\u52b9\u7387\u5316\u3059\u308b\u305f\u3081\u306e\u4fbf\u5229\u6a5f\u80fd\u3092\u642d\u8f09\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>\u30b3\u30fc\u30c9\u306e\u30cf\u30a4\u30e9\u30a4\u30c8\u3068\u81ea\u52d5\u6574\u5f62<\/strong>: \u30bf\u30b0\u3084\u5c5e\u6027\u3092\u81ea\u52d5\u3067\u8272\u5206\u3051\u3057\u3001\u884c\u756a\u53f7\u3092\u4ed8\u4e0e\u3057\u3066\u8868\u793a\u3057\u307e\u3059\u3002\u300c\u30b3\u30fc\u30c9\u3092\u6574\u5f62\u3059\u308b\u300d\u306b\u30c1\u30a7\u30c3\u30af\u3092\u5165\u308c\u308b\u3068\u3001\u6539\u884c\u3084\u30a4\u30f3\u30c7\u30f3\u30c8\uff08\u7a7a\u767d\uff09\u304c\u6700\u9069\u5316\u3055\u308c\u3001\u521d\u5fc3\u8005\u3067\u3082\u8aad\u307f\u3084\u3059\u3044\u968e\u5c64\u69cb\u9020\u306b\u5909\u63db\u3055\u308c\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>SEO\u91cd\u8981\u30bf\u30b0\u306e\u4e00\u767a\u62bd\u51fa<\/strong>: \u6570\u4e07\u6587\u5b57\u306e\u30b3\u30fc\u30c9\u306e\u4e2d\u304b\u3089\u3001SEO\u5bfe\u7b56\u3067\u91cd\u8981\u306a<code>&lt;title&gt;<\/code>\u3001<code>&lt;meta description&gt;<\/code>\u3001\u304a\u3088\u3073\u898b\u51fa\u3057\u30bf\u30b0\uff08<code>&lt;h1&gt;<\/code>\u301c<code>&lt;h3&gt;<\/code>\uff09\u3060\u3051\u3092\u81ea\u52d5\u3067\u63a2\u3057\u51fa\u3057\u3001\u9806\u756a\u306b\u6574\u7406\u3057\u3066\u8868\u793a\u3057\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>\u30ea\u30bd\u30fc\u30b9\u3068\u30ea\u30f3\u30af\u306e\u30ea\u30b9\u30c8\u5316<\/strong>: CSS\u30d5\u30a1\u30a4\u30eb\u3001JavaScript\u30d5\u30a1\u30a4\u30eb\u3001\u30da\u30fc\u30b8\u5185\u5916\u3078\u306e\u30ea\u30f3\u30af\uff08<code>&lt;a&gt;<\/code>\u30bf\u30b0\uff09\u3092\u81ea\u52d5\u62bd\u51fa\u3057\u3001\u30af\u30ea\u30c3\u30af\u53ef\u80fd\u306a\u30ea\u30b9\u30c8\u3068\u3057\u3066\u4e00\u89a7\u8868\u793a\u3057\u307e\u3059\u3002<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"i-2\">\u3053\u306e\u30c4\u30fc\u30eb\u3067\u53d6\u5f97\u3059\u308b\u60c5\u5831\u306e\u57fa\u790e\u77e5\u8b58<\/h2>\n\n\n\n<p>\u30bd\u30fc\u30b9\u30b3\u30fc\u30c9\u8868\u793a\u30c4\u30fc\u30eb\u3067\u8868\u793a\u3055\u308c\u308b\u5404\u9805\u76ee\u306e\u610f\u5473\u3092\u77e5\u3063\u3066\u304a\u304f\u3068\u3001\u30b5\u30a4\u30c8\u5206\u6790\u304c\u3088\u308a\u30b9\u30e0\u30fc\u30ba\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>HTML\u30bd\u30fc\u30b9\u30b3\u30fc\u30c9\u3068\u306f<\/strong>: \u30a6\u30a7\u30d6\u30da\u30fc\u30b8\u3092\u8868\u793a\u3059\u308b\u305f\u3081\u306b\u66f8\u304b\u308c\u305f\u3001\u8a2d\u8a08\u56f3\u306e\u3088\u3046\u306a\u30c6\u30ad\u30b9\u30c8\u30c7\u30fc\u30bf\u3067\u3059\u3002\u6587\u5b57\u306e\u5927\u304d\u3055\u3001\u753b\u50cf\u306e\u4f4d\u7f6e\u3001\u30ea\u30f3\u30af\u5148\u306a\u3069\u304c\u5c02\u7528\u306e\u300c\u30bf\u30b0\u300d\u3092\u4f7f\u3063\u3066\u8a18\u8ff0\u3055\u308c\u3066\u3044\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>SEO\u60c5\u5831\uff08\u30bf\u30a4\u30c8\u30eb\u30fb\u898b\u51fa\u3057\uff09\u3068\u306f<\/strong>: Google\u306a\u3069\u306e\u691c\u7d22\u30a8\u30f3\u30b8\u30f3\u306b\u5bfe\u3057\u300c\u3053\u306e\u30da\u30fc\u30b8\u306b\u306f\u4f55\u304c\u66f8\u304b\u308c\u3066\u3044\u308b\u304b\u300d\u3092\u6b63\u3057\u304f\u4f1d\u3048\u308b\u305f\u3081\u306e\u91cd\u8981\u306a\u60c5\u5831\u3067\u3059\u3002\u898b\u51fa\u3057\u30bf\u30b0\uff08h1\u301ch3\uff09\u306f\u3001\u672c\u306e\u76ee\u6b21\u306e\u3088\u3046\u306b\u30da\u30fc\u30b8\u306e\u968e\u5c64\u69cb\u9020\u3092\u8868\u3057\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>\u5916\u90e8\u30ea\u30bd\u30fc\u30b9\uff08CSS\u30fbJS\uff09\u3068\u306f<\/strong>: CSS\u306f\u30da\u30fc\u30b8\u306e\u30c7\u30b6\u30a4\u30f3\uff08\u8272\u3084\u30ec\u30a4\u30a2\u30a6\u30c8\uff09\u3092\u6574\u3048\u308b\u305f\u3081\u306e\u30d5\u30a1\u30a4\u30eb\u3001JavaScript\uff08JS\uff09\u306f\u30da\u30fc\u30b8\u306b\u52d5\u304d\uff08\u30b9\u30e9\u30a4\u30c9\u30b7\u30e7\u30fc\u3084\u30dd\u30c3\u30d7\u30a2\u30c3\u30d7\u306a\u3069\uff09\u3092\u3064\u3051\u308b\u305f\u3081\u306e\u30d5\u30a1\u30a4\u30eb\u3067\u3059\u3002<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"i-3\">\u3053\u306e\u30c4\u30fc\u30eb\u304c\u5f79\u7acb\u3064\u3068\u304d\u306f\u3069\u3093\u306a\u3068\u304d\uff1f\u3000\u30e6\u30fc\u30b9\u30b1\u30fc\u30b9\u306f\uff1f<\/h2>\n\n\n\n<p>\u4ee5\u4e0b\u306e\u3088\u3046\u306a\u5834\u9762\u3067\u3001\u672c\u30c4\u30fc\u30eb\u3092\u4fbf\u5229\u306b\u3054\u6d3b\u7528\u3044\u305f\u3060\u3051\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>SEO\u5bfe\u7b56\u306e\u305f\u3081\u306e\u7af6\u5408\u8abf\u67fb<\/strong>: \u691c\u7d22\u4e0a\u4f4d\u306b\u3044\u308b\u30e9\u30a4\u30d0\u30eb\u30b5\u30a4\u30c8\u304c\u3001\u3069\u306e\u3088\u3046\u306a\u30bf\u30a4\u30c8\u30eb\uff08title\uff09\u3084\u898b\u51fa\u3057\u69cb\u6210\uff08h1\u301ch3\uff09\u3092\u8a2d\u5b9a\u3057\u3066\u3044\u308b\u304b\u3092\u3001\u5225\u30bf\u30d6\u3067\u77ac\u6642\u306b\u30ea\u30b9\u30c8\u30a2\u30c3\u30d7\u3057\u3066\u5206\u6790\u3057\u305f\u3044\u3068\u304d\u3002<\/li>\n\n\n\n<li><strong>Web\u30c7\u30b6\u30a4\u30f3\u30fb\u30b3\u30fc\u30c7\u30a3\u30f3\u30b0\u306e\u5b66\u7fd2<\/strong>: \u300c\u3053\u306e\u304a\u3057\u3083\u308c\u306a\u30b5\u30a4\u30c8\u306f\u3069\u3093\u306a\u69cb\u9020\u3067\u4f5c\u3089\u308c\u3066\u3044\u308b\u3093\u3060\u308d\u3046\uff1f\u300d\u3068\u6c17\u306b\u306a\u3063\u305f\u3068\u304d\u3002\u30b3\u30fc\u30c9\u306e\u81ea\u52d5\u6574\u5f62\u6a5f\u80fd\u3092\u4f7f\u3048\u3070\u3001\u719f\u7df4\u306e\u30a8\u30f3\u30b8\u30cb\u30a2\u304c\u66f8\u3044\u305f\u30b3\u30fc\u30c9\u306e\u69cb\u9020\uff08\u30bf\u30b0\u306e\u898b\u65b9\uff09\u3092\u304d\u308c\u3044\u306b\u8aad\u307f\u89e3\u304f\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002<\/li>\n\n\n\n<li><strong>\u30b5\u30a4\u30c8\u306e\u4fdd\u5b88\u30fb\u52d5\u4f5c\u78ba\u8a8d<\/strong>: \u81ea\u793e\u30b5\u30a4\u30c8\u306e\u30e1\u30bf\u30c7\u30a3\u30b9\u30af\u30ea\u30d7\u30b7\u30e7\u30f3\u304c\u6b63\u3057\u304f\u51fa\u529b\u3055\u308c\u3066\u3044\u308b\u304b\u3001\u610f\u56f3\u3057\u306a\u3044\u5916\u90e8\u30b9\u30af\u30ea\u30d7\u30c8\u304c\u8aad\u307f\u8fbc\u307e\u308c\u3066\u3044\u306a\u3044\u304b\u3001\u30ea\u30f3\u30af\u5207\u308c\u306e\u30c1\u30a7\u30c3\u30af\u7528\u306bURL\u306e\u4e00\u89a7\u3092\u53d6\u308a\u51fa\u3057\u305f\u3044\u3068\u304d\u3002<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"i-4\">\u3010\u88dc\u8db3\u3011\u30d1\u30bd\u30b3\u30f3\u3084\u30b9\u30de\u30db\u6a19\u6e96\u306e\u6a5f\u80fd\u3067\u30bd\u30fc\u30b9\u30b3\u30fc\u30c9\u3092\u8868\u793a\u3059\u308b\u65b9\u6cd5<\/h2>\n\n\n\n<p>\u672c\u30c4\u30fc\u30eb\u3092\u4f7f\u308f\u305a\u306b\u3001\u666e\u6bb5\u304a\u4f7f\u3044\u306e\u30a6\u30a7\u30d6\u30d6\u30e9\u30a6\u30b6\uff08Chrome\u3084Edge\u306a\u3069\uff09\u306e\u6a19\u6e96\u6a5f\u80fd\u3092\u5229\u7528\u3057\u3066HTML\u30bd\u30fc\u30b9\u3092\u898b\u308b\u65b9\u6cd5\u3082\u3042\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>\u30d1\u30bd\u30b3\u30f3\uff08Windows\/Mac\uff09\u306e\u5834\u5408<\/strong>: \u30a6\u30a7\u30d6\u30da\u30fc\u30b8\u4e0a\u306e\u4f55\u3082\u306a\u3044\u3068\u3053\u308d\u3092\u53f3\u30af\u30ea\u30c3\u30af\u3057\u3001\u300c\u30da\u30fc\u30b8\u306e\u30bd\u30fc\u30b9\u3092\u8868\u793a\u300d\u3092\u9078\u629e\u3057\u307e\u3059\u3002\u307e\u305f\u306f\u3001\u30ad\u30fc\u30dc\u30fc\u30c9\u306e\u30b7\u30e7\u30fc\u30c8\u30ab\u30c3\u30c8\uff08Windows\u306f <code>Ctrl + U<\/code>\u3001Mac\u306f <code>Option + Command + U<\/code>\uff09\u3092\u62bc\u3059\u3053\u3068\u3067\u3082\u8868\u793a\u53ef\u80fd\u3067\u3059\u3002<\/li>\n\n\n\n<li><strong>\u30b9\u30de\u30db\uff08iPhone\/Android\uff09\u306e\u5834\u5408<\/strong>: \u30d6\u30e9\u30a6\u30b6\u306e\u30a2\u30c9\u30ec\u30b9\u30d0\u30fc\u306b\u8868\u793a\u3055\u308c\u3066\u3044\u308bURL\u306e\u5148\u982d\u306b <code>view-source:<\/code> \u3068\u5165\u529b\uff08\u4f8b\uff1a<code>view-source:https:\/\/example.com<\/code>\uff09\u3057\u3066\u518d\u8aad\u307f\u8fbc\u307f\u3059\u308b\u3068\u3001\u7c21\u6613\u7684\u306b\u30bd\u30fc\u30b9\u30b3\u30fc\u30c9\u3092\u78ba\u8a8d\u3067\u304d\u307e\u3059\u3002<\/li>\n<\/ul>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u30bd\u30fc\u30b9\u3092\u53d6\u5f97 \u30ea\u30bb\u30c3\u30c8 \u53d6\u5f97\u4e2d\u2026 \u3057\u3070\u3089\u304f\u304a\u5f85\u3061\u304f\u3060\u3055\u3044\u3002 \u53d6\u5f97URL \u7dcf\u6587\u5b57\u6570 \u884c\u6570 \u30c7\u30fc\u30bf\u30b5\u30a4\u30ba HTML\u30b3\u30fc\u30c9 SEO\u60c5\u5831 \u5916\u90e8\u30ea\u30bd\u30fc\u30b9 (CSS\/JS) \u30ea\u30f3\u30af\u4e00\u89a7 \u30b3\u30fc\u30c9\u3092\u6574\u5f62\u3059\u308b (\u203b\u9577\u6587\u6642\u306f\u7121\u52b9\u5316) \u30b3\u30fc\u30c9 &#8230; <\/p>\n","protected":false},"author":4,"featured_media":14468,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[13,59],"tags":[],"class_list":{"0":"post-14467","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-tool","8":"category-web-design","9":"entry"},"_links":{"self":[{"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/posts\/14467","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/comments?post=14467"}],"version-history":[{"count":5,"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/posts\/14467\/revisions"}],"predecessor-version":[{"id":14478,"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/posts\/14467\/revisions\/14478"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/media\/14468"}],"wp:attachment":[{"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/media?parent=14467"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/categories?post=14467"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rakkokeyword.com\/techo\/wp-json\/wp\/v2\/tags?post=14467"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}