CINXE.COM
ユーザーファーストなドロップダウンメニューの実装 - 弁護士ドットコム株式会社 Creators’ blog
<!DOCTYPE html> <html lang="ja" data-admin-domain="//blog.hatena.ne.jp" data-admin-origin="https://blog.hatena.ne.jp" data-author="bengo4" data-avail-langs="ja en" data-blog="bengo4.hatenablog.jp" data-blog-host="bengo4.hatenablog.jp" data-blog-is-public="1" data-blog-name="弁護士ドットコム株式会社 Creators’ blog" data-blog-owner="bengo4" data-blog-show-ads="" data-blog-show-sleeping-ads="" data-blog-uri="https://creators.bengo4.com/" data-blog-uuid="13574176438040458148" data-blogs-uri-base="https://creators.bengo4.com" data-brand="devblog" data-data-layer="{"hatenablog":{"admin":{},"analytics":{"brand_property_id":"","measurement_id":"G-KJB0HLBDNN","non_sampling_property_id":"","property_id":"","separated_property_id":"UA-29716941-25"},"blog":{"blog_id":"13574176438040458148","content_seems_japanese":"true","disable_ads":"custom_domain","enable_ads":"false","enable_keyword_link":"false","entry_show_footer_related_entries":"true","force_pc_view":"true","is_public":"true","is_responsive_view":"true","is_sleeping":"false","lang":"ja","name":"\u5f01\u8b77\u58eb\u30c9\u30c3\u30c8\u30b3\u30e0\u682a\u5f0f\u4f1a\u793e Creators\u2019 blog","owner_name":"bengo4","uri":"https://creators.bengo4.com/"},"brand":"devblog","page_id":"entry","permalink_entry":{"author_name":"saku_238","categories":"CLOUDSIGN\t\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\t\u30a4\u30d9\u30f3\u30c8\u30fb\u30ab\u30f3\u30d5\u30a1\u30ec\u30f3\u30b9","character_count":1383,"date":"2025-01-28","entry_id":"6802418398322894188","first_category":"CLOUDSIGN","hour":"13","title":"\u30e6\u30fc\u30b6\u30fc\u30d5\u30a1\u30fc\u30b9\u30c8\u306a\u30c9\u30ed\u30c3\u30d7\u30c0\u30a6\u30f3\u30e1\u30cb\u30e5\u30fc\u306e\u5b9f\u88c5","uri":"https://creators.bengo4.com/entry/2025/01/28/130000"},"pro":"pro","router_type":"blogs"}}" data-device="pc" data-dont-recommend-pro="false" data-global-domain="https://hatena.blog" data-globalheader-color="b" data-globalheader-type="pc" data-has-touch-view="1" data-help-url="https://help.hatenablog.com" data-hide-header="1" data-no-suggest-touch-view="1" data-page="entry" data-parts-domain="https://hatenablog-parts.com" data-plus-available="1" data-pro="true" data-router-type="blogs" data-sentry-dsn="https://03a33e4781a24cf2885099fed222b56d@sentry.io/1195218" data-sentry-environment="production" data-sentry-sample-rate="0.1" data-static-domain="https://cdn.blog.st-hatena.com" data-version="3302d0c519de548bcb3552ea0bf509" data-initial-state="{}" > <head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# article: http://ogp.me/ns/article#"> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="robots" content="max-image-preview:large" /> <meta charset="utf-8"/> <meta http-equiv="X-UA-Compatible" content="IE=7; IE=9; IE=10; IE=11" /> <title>ユーザーファーストなドロップダウンメニューの実装 - 弁護士ドットコム株式会社 Creators’ blog</title> <link rel="canonical" href="https://creators.bengo4.com/entry/2025/01/28/130000"/> <meta itemprop="name" content="ユーザーファーストなドロップダウンメニューの実装 - 弁護士ドットコム株式会社 Creators’ blog"/> <meta itemprop="image" content="https://cdn.image.st-hatena.com/image/scale/16eade8b0115304c65f54dd66797d7e396d085a6/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fb%2Fbengo4%2F20250128%2F20250128124840.png"/> <meta property="og:title" content="ユーザーファーストなドロップダウンメニューの実装 - 弁護士ドットコム株式会社 Creators’ blog"/> <meta property="og:type" content="article"/> <meta property="og:url" content="https://creators.bengo4.com/entry/2025/01/28/130000"/> <meta property="og:image" content="https://cdn.image.st-hatena.com/image/scale/16eade8b0115304c65f54dd66797d7e396d085a6/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fb%2Fbengo4%2F20250128%2F20250128124840.png"/> <meta property="og:image:alt" content="ユーザーファーストなドロップダウンメニューの実装 - 弁護士ドットコム株式会社 Creators’ blog"/> <meta property="og:description" content="2025年1月27日に開催された合同勉強会「ユーザーファーストを実現するフロントエンドの最前線」では、アクセシビリティを中心にしたフロントエンド開発の取り組みが各社から発表されました。 本記事では、クラウドサイン フロントエンジニアの林さんが発表された「ユーザーファーストなドロップダウンメニューの実装」の内容をお届けします。 onecareer.connpass.com TL;DR 今回のセッションで強調されたのは、「誰でも使えること」が「ユーザーファースト」の真髄であるということでした。特に、以下の点がメインメッセージとして挙げられました。 HTML標準の要素にないUI（例：ドロップダウンメ…" /> <meta property="og:site_name" content="弁護士ドットコム株式会社 Creators’ blog"/> <meta property="article:published_time" content="2025-01-28T04:00:00Z" /> <meta property="article:tag" content="CLOUDSIGN" /> <meta property="article:tag" content="フロントエンド" /> <meta property="article:tag" content="イベント・カンファレンス" /> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:image" content="https://cdn.image.st-hatena.com/image/scale/16eade8b0115304c65f54dd66797d7e396d085a6/backend=imagemagick;version=1;width=1300/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fb%2Fbengo4%2F20250128%2F20250128124840.png" /> <meta name="twitter:title" content="ユーザーファーストなドロップダウンメニューの実装 - 弁護士ドットコム株式会社 Creators’ blog" /> <meta name="twitter:description" content="2025年1月27日に開催された合同勉強会「ユーザーファーストを実現するフロントエンドの最前線」では、アクセシビリティを中心にしたフロントエンド開発の取り組みが各社から発表されました。 本記事では、クラウドサイン フロントエンジニアの林さんが発表された「ユーザーファーストなドロップダウンメニューの実装」の内容をお届けし…" /> <meta name="twitter:app:name:iphone" content="はてなブログアプリ" /> <meta name="twitter:app:id:iphone" content="583299321" /> <meta name="twitter:app:url:iphone" content="hatenablog:///open?uri=https%3A%2F%2Fcreators.bengo4.com%2Fentry%2F2025%2F01%2F28%2F130000" /> <meta name="twitter:site" content="@bengo4_creators" /> <meta name="description" content="2025年1月27日に開催された合同勉強会「ユーザーファーストを実現するフロントエンドの最前線」では、アクセシビリティを中心にしたフロントエンド開発の取り組みが各社から発表されました。 本記事では、クラウドサイン フロントエンジニアの林さんが発表された「ユーザーファーストなドロップダウンメニューの実装」の内容をお届けします。 onecareer.connpass.com TL;DR 今回のセッションで強調されたのは、「誰でも使えること」が「ユーザーファースト」の真髄であるということでした。特に、以下の点がメインメッセージとして挙げられました。 HTML標準の要素にないUI（例：ドロップダウンメ…" /> <script id="embed-gtm-data-layer-loader" data-data-layer-page-specific="{"hatenablog":{"blogs_permalink":{"has_related_entries_with_elasticsearch":"true","entry_afc_issued":"false","is_author_pro":"true","blog_afc_issued":"false","is_blog_sleeping":"false"}}}" > (function() { function loadDataLayer(elem, attrName) { if (!elem) { return {}; } var json = elem.getAttribute(attrName); if (!json) { return {}; } return JSON.parse(json); } var globalVariables = loadDataLayer( document.documentElement, 'data-data-layer' ); var pageSpecificVariables = loadDataLayer( document.getElementById('embed-gtm-data-layer-loader'), 'data-data-layer-page-specific' ); var variables = [globalVariables, pageSpecificVariables]; if (!window.dataLayer) { window.dataLayer = []; } for (var i = 0; i < variables.length; i++) { window.dataLayer.push(variables[i]); } })(); </script> <!-- Google Tag Manager --> <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-P4CXTW');</script> <!-- End Google Tag Manager --> <link rel="shortcut icon" href="https://creators.bengo4.com/icon/favicon"> <link rel="apple-touch-icon" href="https://creators.bengo4.com/icon/touch"> <link rel="icon" sizes="192x192" href="https://creators.bengo4.com/icon/link"> <link rel="alternate" type="application/atom+xml" title="Atom" href="https://creators.bengo4.com/feed"/> <link rel="alternate" type="application/rss+xml" title="RSS2.0" href="https://creators.bengo4.com/rss"/> <link rel="alternate" type="application/json+oembed" href="https://hatena.blog/oembed?url=https%3A%2F%2Fcreators.bengo4.com%2Fentry%2F2025%2F01%2F28%2F130000&format=json" title="oEmbed Profile of ユーザーファーストなドロップダウンメニューの実装"/> <link rel="alternate" type="text/xml+oembed" href="https://hatena.blog/oembed?url=https%3A%2F%2Fcreators.bengo4.com%2Fentry%2F2025%2F01%2F28%2F130000&format=xml" title="oEmbed Profile of ユーザーファーストなドロップダウンメニューの実装"/> <link rel="author" href="http://www.hatena.ne.jp/saku_238/"> <link rel="preload" href="https://cdn-ak.f.st-hatena.com/images/fotolife/b/bengo4/20241011/20241011212321.png" as="image"/> <link rel="stylesheet" type="text/css" href="https://cdn.blog.st-hatena.com/css/blog.css?version=3302d0c519de548bcb3552ea0bf509"/> <link rel="stylesheet" type="text/css" href="https://usercss.blog.st-hatena.com/blog_style/13574176438040458148/73bb2d65226030deafb510f5f3d66ed618a9e48e"/> <script> </script> <style> div#google_afc_user, div.google-afc-user-container, div.google_afc_image, div.google_afc_blocklink { display: block !important; } </style> <script type="application/ld+json">{"@context":"http://schema.org","@type":"Article","dateModified":"2025-01-28T13:07:09+09:00","datePublished":"2025-01-28T13:00:00+09:00","headline":"ユーザーファーストなドロップダウンメニューの実装","image":["https://cdn-ak.f.st-hatena.com/images/fotolife/b/bengo4/20250128/20250128124840.png"]}</script> <!-- Global site tag (gtag.js) - Google Analytics --> <script async src="https://www.googletagmanager.com/gtag/js?id=G-KJB0HLBDNN"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-KJB0HLBDNN'); </script> </head> <body class="page-entry header-image-only enable-bottom-editarea category-CLOUDSIGN category-フロントエンド category-イベント・カンファレンス globalheader-off globalheader-ng-enabled"> <div id="globalheader-container" data-brand="hatenablog" style="display: none" > <iframe id="globalheader" height="37" frameborder="0" allowTransparency="true"></iframe> </div> <div id="container"> <div id="container-inner"> <header id="blog-title" data-brand="hatenablog"> <div id="blog-title-inner" style="background-image: url('https://cdn-ak.f.st-hatena.com/images/fotolife/b/bengo4/20241011/20241011212321.png'); background-position: center 0px;"> <div id="blog-title-content"> <h1 id="title"><a href="https://creators.bengo4.com/">弁護士ドットコム株式会社 Creators’ blog</a></h1> <h2 id="blog-description">弁護士ドットコムがエンジニア・デザイナーのサービス開発事例やデザイン活動を発信する公式ブログです。</h2> </div> </div> </header> <div id="content" class="hfeed" > <div id="content-inner"> <div id="wrapper"> <div id="main"> <div id="main-inner"> <!-- google_ad_section_start --> <!-- rakuten_ad_target_begin --> <article class="entry hentry test-hentry js-entry-article date-first autopagerize_page_element chars-1600 words-100 mode-markdown entry-odd" id="entry-6802418398322894188" data-keyword-campaign="" data-uuid="6802418398322894188" data-publication-type="entry"> <div class="entry-inner"> <header class="entry-header"> <div class="date entry-date first"> <a href="https://creators.bengo4.com/archive/2025/01/28" rel="nofollow"> <time datetime="2025-01-28T04:00:00Z" title="2025-01-28T04:00:00Z"> <span class="date-year">2025</span><span class="hyphen">-</span><span class="date-month">01</span><span class="hyphen">-</span><span class="date-day">28</span> </time> </a> </div> <h1 class="entry-title"> <a href="https://creators.bengo4.com/entry/2025/01/28/130000" class="entry-title-link bookmark">ユーザーファーストなドロップダウンメニューの実装</a> </h1> <div class="entry-categories categories"> <a href="https://creators.bengo4.com/archive/category/CLOUDSIGN" class="entry-category-link category-CLOUDSIGN">CLOUDSIGN</a> <a href="https://creators.bengo4.com/archive/category/%E3%83%95%E3%83%AD%E3%83%B3%E3%83%88%E3%82%A8%E3%83%B3%E3%83%89" class="entry-category-link category-フロントエンド">フロントエンド</a> <a href="https://creators.bengo4.com/archive/category/%E3%82%A4%E3%83%99%E3%83%B3%E3%83%88%E3%83%BB%E3%82%AB%E3%83%B3%E3%83%95%E3%82%A1%E3%83%AC%E3%83%B3%E3%82%B9" class="entry-category-link category-イベント・カンファレンス">イベント・カンファレンス</a> </div> </header> <div class="entry-content hatenablog-entry"> <p>2025年1月27日に開催された合同勉強会「<a href="https://onecareer.connpass.com/event/339385/">ユーザーファーストを実現するフロントエンドの最前線</a>」では、アクセシビリティを中心にしたフロントエンド開発の取り組みが各社から発表されました。 本記事では、クラウドサイン フロントエンジニアの林さんが発表された「ユーザーファーストなドロップダウンメニューの実装」の内容をお届けします。</p> <p><iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fonecareer.connpass.com%2Fevent%2F339385%2F" title="ユーザーファーストを実現するフロントエンドの最前線 (2025/01/27 19:00〜)" class="embed-card embed-webcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 155px; max-width: 500px; margin: 10px 0px;" loading="lazy"></iframe><cite class="hatena-citation"><a href="https://onecareer.connpass.com/event/339385/">onecareer.connpass.com</a></cite></p> <h2 id="TLDR">TL;DR</h2> <p>今回のセッションで強調されたのは、「誰でも使えること」が「ユーザーファースト」の真髄であるということでした。特に、以下の点がメインメッセージとして挙げられました。</p> <ul> <li>HTML標準の要素にないUI（例：ドロップダウンメニュー）をアクセシブルに実装する必要性</li> <li>アクセシビリティを向上させることで、すべてのユーザーにとって使いやすいプロダクトが作れる</li> </ul> <p>特定のユーザー層だけでなく、あらゆる状況下のユーザーに対応することで、真に<em>「ユーザーファースト」</em>な開発が可能になります。</p> <script defer class="speakerdeck-embed" data-id="a214836bef2641c9b6d843add21e71a3" data-ratio="1.7772511848341233" src="//speakerdeck.com/assets/embed.js"></script> <hr /> <h2 id="アクセシビリティチームの活動">アクセシビリティチームの活動</h2> <p>弁護士ドットコムのクラウドサインでは、アクセシビリティをプロダクトに定着させるための取り組みが行われています。具体的には以下の活動が紹介されました。</p> <p>イベント開催レポートブログ <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fcreators.bengo4.com%2Fentry%2F2024%2F11%2F05%2F080000" title="イベント開催レポート：「出張！俺の電子契約」〜クラウドサインをアクセシビリティチェック〜 - 弁護士ドットコム株式会社 Creators’ blog" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;" loading="lazy"></iframe><cite class="hatena-citation"><a href="https://creators.bengo4.com/entry/2024/11/05/080000">creators.bengo4.com</a></cite></p> <ol> <li><p>視覚障害を持つユーザーによるアクセシビリティチェック 実際のユーザー視点での検証を行い、改善ポイントを見つけるプロセスを設けています。</p></li> <li><p>実際のユーザーの声を聞く 「リンクを慎重にフォーカスしないと操作ミスが起きる」など、現場からのフィードバックを開発に反映。</p></li> </ol> <p>アクセシビリティはユーザーファーストに対する1つのアプローチとなっていることがわかります。</p> <h2 id="カスタムコンポーネントとアクセシビリティ">カスタムコンポーネントとアクセシビリティ</h2> <p>次に、アクセシビリティを考慮したカスタムコンポーネントの実装がテーマになりました。林さんは「HTML標準の要素にないUI」について以下の具体例を挙げ、課題と解決策を紹介しました。</p> <h3 id="主な課題">主な課題</h3> <ul> <li>ドロップダウンメニューはキーボード操作のみに対応していない</li> <li>支援技術での知覚・操作が困難</li> </ul> <h3 id="解決策">解決策</h3> <ol> <li>操作可能な要素での<strong>マークアップ</strong> <ul> <li><code><button></code>要素で操作可能な箇所を明示</li> <li><code><ul></code>や<code><li></code>でリスト構造を表現</li> </ul> </li> <li>意味合いや状態を補足する<strong>WAI-ARIA</strong> <ul> <li><code>aria-haspopup</code>でポップアップの存在を明示</li> <li><code>aria-expanded</code>で開閉状態を示す</li> </ul> </li> <li>操作に必要な<strong>挙動</strong>のJavaScirpt <ul> <li>キーボードでの操作性向上</li> <li>メニューアイテムのフォーカス移動を適切に管理</li> </ul> </li> </ol> <p>発表時間の都合で具体的なコード詳細は割愛されておりましたが、ここにブログに記載されていると紹介されました。</p> <p><iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fcreators.bengo4.com%2Fentry%2F2024%2F12%2F02%2F000000" title=" アクセシブルなドロップダウンメニューの構成 - 弁護士ドットコム株式会社 Creators’ blog" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;" loading="lazy"></iframe><cite class="hatena-citation"><a href="https://creators.bengo4.com/entry/2024/12/02/000000">creators.bengo4.com</a></cite></p> <h2 id="まとめ">まとめ</h2> <p>最後に林さんは、以下の結論でセッションを締めくくりました。</p> <ul> <li><strong>カスタムコンポーネント</strong>は意識しないと<strong>アクセシブルにならない</strong></li> <li>適切な<strong>マークアップ、WAI-ARIA、挙動</strong>の実装を通じてアクセシビリティを向上させるべき</li> <li>「<strong>誰でも使えるプロダクト</strong>」を目指すことが、ユーザーファーストにつながる</li> </ul> <p>今回のセッションを通して、アクセシビリティの重要性を再認識するとともに、具体的な実装手法を学ぶことができました。フロントエンドエンジニアにとって、非常に有益な内容だったと感じます。</p> </div> <footer class="entry-footer"> <div class="entry-tags-wrapper"> <div class="entry-tags"> <span class="entry-tag"> <a href="https://d.hatena.ne.jp/keyword/%E3%82%A2%E3%82%AF%E3%82%BB%E3%82%B7%E3%83%93%E3%83%AA%E3%83%86%E3%82%A3" class="entry-tag-link"> <span class="entry-tag-icon">#</span><span class="entry-tag-label">アクセシビリティ</span> </a> </span> <span class="entry-tag"> <a href="https://d.hatena.ne.jp/keyword/%E3%83%A6%E3%83%BC%E3%82%B6%E3%83%BC%E3%83%95%E3%82%A1%E3%83%BC%E3%82%B9%E3%83%88" class="entry-tag-link"> <span class="entry-tag-icon">#</span><span class="entry-tag-label">ユーザーファースト</span> </a> </span> <span class="entry-tag"> <a href="https://d.hatena.ne.jp/keyword/HTML" class="entry-tag-link"> <span class="entry-tag-icon">#</span><span class="entry-tag-label">HTML</span> </a> </span> <span class="entry-tag"> <a href="https://d.hatena.ne.jp/keyword/UIUX" class="entry-tag-link"> <span class="entry-tag-icon">#</span><span class="entry-tag-label">UIUX</span> </a> </span> <span class="entry-tag"> <a href="https://d.hatena.ne.jp/keyword/%E3%83%89%E3%83%AD%E3%83%83%E3%83%97%E3%83%80%E3%82%A6%E3%83%B3%E3%83%A1%E3%83%8B%E3%83%A5%E3%83%BC" class="entry-tag-link"> <span class="entry-tag-icon">#</span><span class="entry-tag-label">ドロップダウンメニュー</span> </a> </span> </div> </div> <p class="entry-footer-section track-inview-by-gtm" data-gtm-track-json="{"area": "finish_reading"}"> <span class="author vcard"><span class="fn" data-load-nickname="1" data-user-name="saku_238" >saku_238</span></span> <span class="entry-footer-time"><a href="https://creators.bengo4.com/entry/2025/01/28/130000"><time data-relative datetime="2025-01-28T04:00:00Z" title="2025-01-28T04:00:00Z" class="updated">2025-01-28 13:00</time></a></span> </p> <div class="hatena-star-container" data-hatena-star-container data-hatena-star-url="https://creators.bengo4.com/entry/2025/01/28/130000" data-hatena-star-title="ユーザーファーストなドロップダウンメニューの実装" data-hatena-star-variant="profile-icon" data-hatena-star-profile-url-template="https://blog.hatena.ne.jp/{username}/" ></div> <div class="social-buttons"> <div class="social-button-item"> <a href="https://b.hatena.ne.jp/entry/s/creators.bengo4.com/entry/2025/01/28/130000" class="hatena-bookmark-button" data-hatena-bookmark-url="https://creators.bengo4.com/entry/2025/01/28/130000" data-hatena-bookmark-layout="vertical-balloon" data-hatena-bookmark-lang="ja" title="この記事をはてなブックマークに追加"><img src="https://b.st-hatena.com/images/entry-button/button-only.gif" alt="この記事をはてなブックマークに追加" width="20" height="20" style="border: none;" /></a> </div> <div class="social-button-item"> <div class="fb-share-button" data-layout="box_count" data-href="https://creators.bengo4.com/entry/2025/01/28/130000"></div> </div> <div class="social-button-item"> <a class="entry-share-button entry-share-button-twitter test-share-button-twitter" href="https://x.com/intent/tweet?hashtags=%E3%82%A2%E3%82%AF%E3%82%BB%E3%82%B7%E3%83%93%E3%83%AA%E3%83%86%E3%82%A3&hashtags=%E3%83%A6%E3%83%BC%E3%82%B6%E3%83%BC%E3%83%95%E3%82%A1%E3%83%BC%E3%82%B9%E3%83%88&hashtags=HTML&hashtags=UIUX&hashtags=%E3%83%89%E3%83%AD%E3%83%83%E3%83%97%E3%83%80%E3%82%A6%E3%83%B3%E3%83%A1%E3%83%8B%E3%83%A5%E3%83%BC&text=%E3%83%A6%E3%83%BC%E3%82%B6%E3%83%BC%E3%83%95%E3%82%A1%E3%83%BC%E3%82%B9%E3%83%88%E3%81%AA%E3%83%89%E3%83%AD%E3%83%83%E3%83%97%E3%83%80%E3%82%A6%E3%83%B3%E3%83%A1%E3%83%8B%E3%83%A5%E3%83%BC%E3%81%AE%E5%AE%9F%E8%A3%85+-+%E5%BC%81%E8%AD%B7%E5%A3%AB%E3%83%89%E3%83%83%E3%83%88%E3%82%B3%E3%83%A0%E6%A0%AA%E5%BC%8F%E4%BC%9A%E7%A4%BE+Creators%E2%80%99+blog&url=https%3A%2F%2Fcreators.bengo4.com%2Fentry%2F2025%2F01%2F28%2F130000" title="X（Twitter）で投稿する" ></a> </div> </div> <div class="customized-footer"> <div class="entry-footer-modules" id="entry-footer-secondary-modules"> <div class="hatena-module hatena-module-related-entries" > <!-- Hatena-Epic-has-related-entries-with-elasticsearch:true --> <div class="hatena-module-title"> 関連記事 </div> <div class="hatena-module-body"> <ul class="related-entries hatena-urllist urllist-with-thumbnails"> <li class="urllist-item related-entries-item"> <div class="urllist-item-inner related-entries-item-inner"> <a class="urllist-image-link related-entries-image-link" href="https://creators.bengo4.com/entry/2024/12/25/190000"> <img alt="弁護士ドットコム Advent Calendar 2024 完走しました！" src="https://cdn.image.st-hatena.com/image/square/7e227b9f95d010c9f73b97f4294258a06a92b081/backend=imagemagick;height=100;version=1;width=100/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fb%2Fbengo4%2F20241231%2F20241231163016.png" class="urllist-image related-entries-image" title="弁護士ドットコム Advent Calendar 2024 完走しました！" width="100" height="100" loading="lazy"> </a> <div class="urllist-date-link related-entries-date-link"> <a href="https://creators.bengo4.com/archive/2024/12/25" rel="nofollow"> <time datetime="2024-12-24T22:30:00Z" title="2024年12月25日"> 2024-12-25 </time> </a> </div> <a href="https://creators.bengo4.com/entry/2024/12/25/190000" class="urllist-title-link related-entries-title-link urllist-title related-entries-title">弁護士ドットコム Advent Calendar 2024 完走しました！</a> <div class="urllist-entry-body related-entries-entry-body">みなさま、こんばんは！技術広報を担当しております sakutaro𝕏@…</div> </div> </li> <li class="urllist-item related-entries-item"> <div class="urllist-item-inner related-entries-item-inner"> <a class="urllist-image-link related-entries-image-link" href="https://creators.bengo4.com/entry/2024/12/23/000000"> <img alt="フロントエンドの技術的負債と向き合っている話" src="https://cdn.image.st-hatena.com/image/square/67f63b4ba89f8f0495b6d6eec03cbb960a822fa6/backend=imagemagick;height=100;version=1;width=100/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fb%2Fbengo4%2F20241223%2F20241223000028.png" class="urllist-image related-entries-image" title="フロントエンドの技術的負債と向き合っている話" width="100" height="100" loading="lazy"> </a> <div class="urllist-date-link related-entries-date-link"> <a href="https://creators.bengo4.com/archive/2024/12/23" rel="nofollow"> <time datetime="2024-12-22T15:00:00Z" title="2024年12月23日"> 2024-12-23 </time> </a> </div> <a href="https://creators.bengo4.com/entry/2024/12/23/000000" class="urllist-title-link related-entries-title-link urllist-title related-entries-title">フロントエンドの技術的負債と向き合っている話</a> <div class="urllist-entry-body related-entries-entry-body">この記事は、弁護士ドットコム Advent Calendar 2024 の 23 日…</div> </div> </li> <li class="urllist-item related-entries-item"> <div class="urllist-item-inner related-entries-item-inner"> <a class="urllist-image-link related-entries-image-link" href="https://creators.bengo4.com/entry/2024/12/19/000000"> <img alt="UIコンポーネントライブラリ「delta-wing-ui」の開発物語" src="https://cdn.image.st-hatena.com/image/square/73bad6660d66c78cb17681a78afd2ccf5b6643ff/backend=imagemagick;height=100;version=1;width=100/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fb%2Fbengo4%2F20241219%2F20241219001100.png" class="urllist-image related-entries-image" title="UIコンポーネントライブラリ「delta-wing-ui」の開発物語" width="100" height="100" loading="lazy"> </a> <div class="urllist-date-link related-entries-date-link"> <a href="https://creators.bengo4.com/archive/2024/12/19" rel="nofollow"> <time datetime="2024-12-18T15:00:00Z" title="2024年12月19日"> 2024-12-19 </time> </a> </div> <a href="https://creators.bengo4.com/entry/2024/12/19/000000" class="urllist-title-link related-entries-title-link urllist-title related-entries-title">UIコンポーネントライブラリ「delta-wing-ui」の開発物語</a> <div class="urllist-entry-body related-entries-entry-body">UIコンポーネントライブラリ「delta-wing-ui」の開発物語 この…</div> </div> </li> <li class="urllist-item related-entries-item"> <div class="urllist-item-inner related-entries-item-inner"> <a class="urllist-image-link related-entries-image-link" href="https://creators.bengo4.com/entry/2024/12/17/000000"> <img alt="弁護士ドットコムサマーインターンシップ2024の狙いと技術要素" src="https://cdn.image.st-hatena.com/image/square/26a651ccce6c49e1ece638173a9e5752ba11bd41/backend=imagemagick;height=100;version=1;width=100/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fb%2Fbengo4%2F20241216%2F20241216170616.png" class="urllist-image related-entries-image" title="弁護士ドットコムサマーインターンシップ2024の狙いと技術要素" width="100" height="100" loading="lazy"> </a> <div class="urllist-date-link related-entries-date-link"> <a href="https://creators.bengo4.com/archive/2024/12/17" rel="nofollow"> <time datetime="2024-12-16T15:00:00Z" title="2024年12月17日"> 2024-12-17 </time> </a> </div> <a href="https://creators.bengo4.com/entry/2024/12/17/000000" class="urllist-title-link related-entries-title-link urllist-title related-entries-title">弁護士ドットコムサマーインターンシップ2024の狙いと技術要素</a> <div class="urllist-entry-body related-entries-entry-body">この記事は弁護士ドットコム Advent Calendar 2024の 17 日目の…</div> </div> </li> <li class="urllist-item related-entries-item"> <div class="urllist-item-inner related-entries-item-inner"> <a class="urllist-image-link related-entries-image-link" href="https://creators.bengo4.com/entry/2024/11/05/080000"> <img alt="イベント開催レポート：「出張！俺の電子契約」〜クラウドサインをアクセシビリティチェック〜" src="https://cdn.image.st-hatena.com/image/square/337345157192e1ddef992a9df627c402ccb389d5/backend=imagemagick;height=100;version=1;width=100/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fb%2Fbengo4%2F20241105%2F20241105080022.png" class="urllist-image related-entries-image" title="イベント開催レポート：「出張！俺の電子契約」〜クラウドサインをアクセシビリティチェック〜" width="100" height="100" loading="lazy"> </a> <div class="urllist-date-link related-entries-date-link"> <a href="https://creators.bengo4.com/archive/2024/11/05" rel="nofollow"> <time datetime="2024-11-04T23:00:00Z" title="2024年11月5日"> 2024-11-05 </time> </a> </div> <a href="https://creators.bengo4.com/entry/2024/11/05/080000" class="urllist-title-link related-entries-title-link urllist-title related-entries-title">イベント開催レポート：「出張！俺の電子契約」〜クラウドサインをアクセシビリティチェック〜</a> <div class="urllist-entry-body related-entries-entry-body">2024年9月11日(水) SmartHRさんと開催した弁護士ドットコム×Sma…</div> </div> </li> </ul> </div> </div> </div> </div> </footer> </div> </article> <!-- rakuten_ad_target_end --> <!-- google_ad_section_end --> <div class="pager pager-permalink permalink"> <span class="pager-prev"> <a href="https://creators.bengo4.com/entry/2025/02/13/070000" rel="prev"> <span class="pager-arrow">« </span> スクリーンリーダーが <footer> 要素を「フッター</footer>… </a> </span> <span class="pager-next"> <a href="https://creators.bengo4.com/entry/2025/01/27/070000" rel="next"> npm audit への立ち向かい方 <span class="pager-arrow"> »</span> </a> </span> </div> </div> </div> <aside id="box1"> <div id="box1-inner"> </div> </aside> </div><!-- #wrapper --> <aside id="box2"> <div id="box2-inner"> <div class="hatena-module hatena-module-profile"> <div class="hatena-module-title"> プロフィール </div> <div class="hatena-module-body"> <a href="https://creators.bengo4.com/about" class="profile-icon-link"> <img src="https://cdn.profile-image.st-hatena.com/users/bengo4/profile.png?1695814907" alt="id:bengo4" class="profile-icon" /> </a> <span class="id"> <a href="https://creators.bengo4.com/about" class="hatena-id-link"><span data-load-nickname="1" data-user-name="bengo4">id:bengo4</span></a> <a href="https://blog.hatena.ne.jp/guide/corporation" title="はてなブログ for DevBlog"><i class="badge-type-devblog">はてなブログ for DevBlog</i></a> </span> <div class="hatena-follow-button-box btn-subscribe js-hatena-follow-button-box" > <a href="#" class="hatena-follow-button js-hatena-follow-button"> <span class="subscribing"> <span class="foreground">読者です</span> <span class="background">読者をやめる</span> </span> <span class="unsubscribing" data-track-name="profile-widget-subscribe-button" data-track-once> <span class="foreground">読者になる</span> <span class="background">読者になる</span> </span> </a> <div class="subscription-count-box js-subscription-count-box"> <i></i> <u></u> <span class="subscription-count js-subscription-count"> </span> </div> </div> <div class="profile-about"> <a href="https://creators.bengo4.com/about">このブログについて</a> </div> </div> </div> <div class="hatena-module hatena-module-search-box"> <div class="hatena-module-title"> 検索 </div> <div class="hatena-module-body"> <form class="search-form" role="search" action="https://creators.bengo4.com/search" method="get"> <input type="text" name="q" class="search-module-input" value="" placeholder="記事を検索" required> <input type="submit" value="検索" class="search-module-button" /> </form> </div> </div> <div class="hatena-module hatena-module-html"> <div class="hatena-module-title">採用情報</div> <div class="hatena-module-body"> <div class="b4-module-banner"> <a class="b4-module-banner-link" href="https://hrmos.co/pages/bengo4/jobs/0009602?utm_source=referral&utm_medium=creatersBlog&utm_campaign=sideBanner" target="_blank"> <img class="b4-module-banner-image--outline" src="https://cdn-ak.f.st-hatena.com/images/fotolife/b/bengo4/20220131/20220131211957.jpg" alt="採用情報"> </a> </div> </div> </div> <div class="hatena-module hatena-module-recent-entries "> <div class="hatena-module-title"> <a href="https://creators.bengo4.com/archive"> 最新記事 </a> </div> <div class="hatena-module-body"> <ul class="recent-entries hatena-urllist "> <li class="urllist-item recent-entries-item"> <div class="urllist-item-inner recent-entries-item-inner"> <div class="b4-module-post"> <a class="b4-module-post-link" href="https://creators.bengo4.com/entry/2025/02/13/070000"> <div class="b4-module-post-head"> <img class="b4-module-post-image" src="https://cdn.image.st-hatena.com/image/square/a85bb869d64f4c452142ac3a69fb75f6e54415b2/backend=imagemagick;height=100;version=1;width=100/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fb%2Fbengo4%2F20250213%2F20250213070011.png"> </div> <div class="b4-module-post-body"> <span class="b4-module-post-date">2025-02-13</span> <span class="b4-module-post-title">スクリーンリーダーが <footer> 要素を「フッター」と読みません！</span> </div> </a> </div> </div> </li> <li class="urllist-item recent-entries-item"> <div class="urllist-item-inner recent-entries-item-inner"> <div class="b4-module-post"> <a class="b4-module-post-link" href="https://creators.bengo4.com/entry/2025/01/28/130000"> <div class="b4-module-post-head"> <img class="b4-module-post-image" src="https://cdn.image.st-hatena.com/image/square/5b73f7671bf91f74db02a5de9f7a0f901b2d84fc/backend=imagemagick;height=100;version=1;width=100/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fb%2Fbengo4%2F20250128%2F20250128124840.png"> </div> <div class="b4-module-post-body"> <span class="b4-module-post-date">2025-01-28</span> <span class="b4-module-post-title">ユーザーファーストなドロップダウンメニューの実装</span> </div> </a> </div> </div> </li> <li class="urllist-item recent-entries-item"> <div class="urllist-item-inner recent-entries-item-inner"> <div class="b4-module-post"> <a class="b4-module-post-link" href="https://creators.bengo4.com/entry/2025/01/27/070000"> <div class="b4-module-post-head"> <img class="b4-module-post-image" src="https://cdn.image.st-hatena.com/image/square/3284958e515709d0af6d0aa50a7e8f4dc347e04e/backend=imagemagick;height=100;version=1;width=100/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fb%2Fbengo4%2F20250127%2F20250127070012.png"> </div> <div class="b4-module-post-body"> <span class="b4-module-post-date">2025-01-27</span> <span class="b4-module-post-title">npm audit への立ち向かい方</span> </div> </a> </div> </div> </li> <li class="urllist-item recent-entries-item"> <div class="urllist-item-inner recent-entries-item-inner"> <div class="b4-module-post"> <a class="b4-module-post-link" href="https://creators.bengo4.com/entry/2024/12/25/190000"> <div class="b4-module-post-head"> <img class="b4-module-post-image" src="https://cdn.image.st-hatena.com/image/square/7e227b9f95d010c9f73b97f4294258a06a92b081/backend=imagemagick;height=100;version=1;width=100/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fb%2Fbengo4%2F20241231%2F20241231163016.png"> </div> <div class="b4-module-post-body"> <span class="b4-module-post-date">2024-12-25</span> <span class="b4-module-post-title">弁護士ドットコム Advent Calendar 2024 完走しました！</span> </div> </a> </div> </div> </li> <li class="urllist-item recent-entries-item"> <div class="urllist-item-inner recent-entries-item-inner"> <div class="b4-module-post"> <a class="b4-module-post-link" href="https://creators.bengo4.com/entry/2024/12/25/000000"> <div class="b4-module-post-head"> <img class="b4-module-post-image" src="https://cdn.image.st-hatena.com/image/square/991c32b4480151a6412cbfa9255dead1de52fffc/backend=imagemagick;height=100;version=1;width=100/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fb%2Fbengo4%2F20241224%2F20241224182306.png"> </div> <div class="b4-module-post-body"> <span class="b4-module-post-date">2024-12-25</span> <span class="b4-module-post-title">弁護士ドットコムの"Legal x AI領域"と他2点が面白い</span> </div> </a> </div> </div> </li> </ul> </div> </div> <div class="hatena-module hatena-module-archive" data-archive-type="default" data-archive-url="https://creators.bengo4.com/archive"> <div class="hatena-module-title"> <a href="https://creators.bengo4.com/archive">月別アーカイブ</a> </div> <div class="hatena-module-body"> <ul class="hatena-urllist"> <li class="archive-module-year archive-module-year-hidden" data-year="2025"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://creators.bengo4.com/archive/2025" class="archive-module-year-title archive-module-year-2025"> 2025 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2025/02" class="archive-module-month-title archive-module-month-2025-2"> 2025 / 2 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2025/01" class="archive-module-month-title archive-module-month-2025-1"> 2025 / 1 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2024"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://creators.bengo4.com/archive/2024" class="archive-module-year-title archive-module-year-2024"> 2024 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2024/12" class="archive-module-month-title archive-module-month-2024-12"> 2024 / 12 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2024/11" class="archive-module-month-title archive-module-month-2024-11"> 2024 / 11 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2024/10" class="archive-module-month-title archive-module-month-2024-10"> 2024 / 10 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2024/09" class="archive-module-month-title archive-module-month-2024-9"> 2024 / 9 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2024/08" class="archive-module-month-title archive-module-month-2024-8"> 2024 / 8 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2024/07" class="archive-module-month-title archive-module-month-2024-7"> 2024 / 7 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2024/05" class="archive-module-month-title archive-module-month-2024-5"> 2024 / 5 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2024/04" class="archive-module-month-title archive-module-month-2024-4"> 2024 / 4 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2024/03" class="archive-module-month-title archive-module-month-2024-3"> 2024 / 3 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2024/02" class="archive-module-month-title archive-module-month-2024-2"> 2024 / 2 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2024/01" class="archive-module-month-title archive-module-month-2024-1"> 2024 / 1 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2023"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://creators.bengo4.com/archive/2023" class="archive-module-year-title archive-module-year-2023"> 2023 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2023/12" class="archive-module-month-title archive-module-month-2023-12"> 2023 / 12 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2023/11" class="archive-module-month-title archive-module-month-2023-11"> 2023 / 11 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2023/10" class="archive-module-month-title archive-module-month-2023-10"> 2023 / 10 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2023/09" class="archive-module-month-title archive-module-month-2023-9"> 2023 / 9 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2023/08" class="archive-module-month-title archive-module-month-2023-8"> 2023 / 8 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2023/07" class="archive-module-month-title archive-module-month-2023-7"> 2023 / 7 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2023/06" class="archive-module-month-title archive-module-month-2023-6"> 2023 / 6 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2023/04" class="archive-module-month-title archive-module-month-2023-4"> 2023 / 4 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2023/03" class="archive-module-month-title archive-module-month-2023-3"> 2023 / 3 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2023/02" class="archive-module-month-title archive-module-month-2023-2"> 2023 / 2 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2023/01" class="archive-module-month-title archive-module-month-2023-1"> 2023 / 1 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2022"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://creators.bengo4.com/archive/2022" class="archive-module-year-title archive-module-year-2022"> 2022 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2022/12" class="archive-module-month-title archive-module-month-2022-12"> 2022 / 12 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2022/11" class="archive-module-month-title archive-module-month-2022-11"> 2022 / 11 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2022/10" class="archive-module-month-title archive-module-month-2022-10"> 2022 / 10 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2022/09" class="archive-module-month-title archive-module-month-2022-9"> 2022 / 9 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2022/08" class="archive-module-month-title archive-module-month-2022-8"> 2022 / 8 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2022/07" class="archive-module-month-title archive-module-month-2022-7"> 2022 / 7 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2022/06" class="archive-module-month-title archive-module-month-2022-6"> 2022 / 6 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2022/05" class="archive-module-month-title archive-module-month-2022-5"> 2022 / 5 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2022/04" class="archive-module-month-title archive-module-month-2022-4"> 2022 / 4 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2022/03" class="archive-module-month-title archive-module-month-2022-3"> 2022 / 3 </a> </li> <li class="archive-module-month"> <a href="https://creators.bengo4.com/archive/2022/02" class="archive-module-month-title archive-module-month-2022-2"> 2022 / 2 </a> </li> </ul> </li> </ul> </div> </div> <div class="hatena-module hatena-module-category"> <div class="hatena-module-title"> カテゴリー </div> <div class="hatena-module-body"> <ul class="hatena-urllist"> <li> <a href="https://creators.bengo4.com/archive/category/LLM%E6%B4%BB%E7%94%A8" class="category-LLM活用"> LLM活用 (1) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E3%83%95%E3%83%AD%E3%83%B3%E3%83%88%E3%82%A8%E3%83%B3%E3%83%89" class="category-フロントエンド"> フロントエンド (17) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/CLOUDSIGN" class="category-CLOUDSIGN"> CLOUDSIGN (52) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E3%82%A4%E3%83%99%E3%83%B3%E3%83%88%E3%83%BB%E3%82%AB%E3%83%B3%E3%83%95%E3%82%A1%E3%83%AC%E3%83%B3%E3%82%B9" class="category-イベント・カンファレンス"> イベント・カンファレンス (21) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E3%82%A8%E3%83%B3%E3%82%B8%E3%83%8B%E3%82%A2%E3%83%AA%E3%83%B3%E3%82%B0" class="category-エンジニアリング"> エンジニアリング (5) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E5%BC%81%E3%82%B3%E3%83%A0%E3%81%AA%E4%BA%BA%E3%80%85" class="category-弁コムな人々"> 弁コムな人々 (24) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E3%82%A2%E3%83%89%E3%83%99%E3%83%B3%E3%83%88%E3%82%AB%E3%83%AC%E3%83%B3%E3%83%80%E3%83%BC" class="category-アドベントカレンダー"> アドベントカレンダー (46) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E5%BC%81%E8%AD%B7%E5%A3%AB%E3%83%89%E3%83%83%E3%83%88%E3%82%B3%E3%83%A0" class="category-弁護士ドットコム"> 弁護士ドットコム (27) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E3%83%90%E3%83%83%E3%82%AF%E3%82%A8%E3%83%B3%E3%83%89" class="category-バックエンド"> バックエンド (3) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E3%83%AA%E3%83%BC%E3%82%AC%E3%83%AB%E3%83%96%E3%83%AC%E3%82%A4%E3%83%B3%E9%96%8B%E7%99%BA" class="category-リーガルブレイン開発"> リーガルブレイン開発 (4) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/AI" class="category-AI"> AI (1) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/SRE" class="category-SRE"> SRE (7) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E6%96%B0%E5%8D%92%E6%8E%A1%E7%94%A8" class="category-新卒採用"> 新卒採用 (4) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E3%82%A2%E3%82%AF%E3%82%BB%E3%82%B7%E3%83%93%E3%83%AA%E3%83%86%E3%82%A3" class="category-アクセシビリティ"> アクセシビリティ (2) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E3%82%A4%E3%83%B3%E3%82%BF%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%83%E3%83%97" class="category-インターンシップ"> インターンシップ (2) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E7%A8%8E%E7%90%86%E5%A3%AB%E3%83%89%E3%83%83%E3%83%88%E3%82%B3%E3%83%A0" class="category-税理士ドットコム"> 税理士ドットコム (3) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/QA" class="category-QA"> QA (2) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/CRE" class="category-CRE"> CRE (2) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E3%83%87%E3%83%BC%E3%82%BF%E3%82%A8%E3%83%B3%E3%82%B8%E3%83%8B%E3%82%A2%E3%83%AA%E3%83%B3%E3%82%B0" class="category-データエンジニアリング"> データエンジニアリング (2) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E9%83%A8%E6%B4%BB%E5%8B%95" class="category-部活動"> 部活動 (2) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E6%83%85%E5%A0%B1%E3%82%AC%E3%83%90%E3%83%8A%E3%83%B3%E3%82%B9%E6%9C%AC%E9%83%A8" class="category-情報ガバナンス本部"> 情報ガバナンス本部 (1) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E4%BA%BA%E4%BA%8B%E6%9C%AC%E9%83%A8" class="category-人事本部"> 人事本部 (1) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/%E3%82%BB%E3%82%AD%E3%83%A5%E3%83%AA%E3%83%86%E3%82%A3" class="category-セキュリティ"> セキュリティ (1) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/BUSINESS%20LAWYERS" class="category-BUSINESS-LAWYERS"> BUSINESS LAWYERS (1) </a> </li> <li> <a href="https://creators.bengo4.com/archive/category/Professional%20Tech%20Lab" class="category-Professional-Tech-Lab"> Professional Tech Lab (1) </a> </li> </ul> </div> </div> <div class="hatena-module hatena-module-html"> <div class="hatena-module-title">リンク</div> <div class="hatena-module-body"> <div class="b4-module-banner"> <p class="b4-module-banner-title">クラウドサイン note ~Inside~</p> <a href="https://note.com/cloudsign/m/md653f118eed4" class="b4-module-banner-link"> <img class="b4-module-banner-image" src="https://cdn-ak.f.st-hatena.com/images/fotolife/b/bengo4/20220407/20220407152735.jpg" alt="20220407152735"> </a> </div> </div> </div> </div> </aside> </div> </div> <div id="bottom-editarea"> <div class="b4-module-footer"> <p class="b4-module-footer-copyright">© Bengo4.com, Inc. 2005</p> </div> </div> </div> </div> <script async src="https://s.hatena.ne.jp/js/widget/star.js"></script> <script> if (typeof window.Hatena === 'undefined') { window.Hatena = {}; } if (!Hatena.hasOwnProperty('Star')) { Hatena.Star = { VERSION: 2, }; } </script> <div id="fb-root"></div> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/ja_JP/sdk.js#xfbml=1&appId=719729204785177&version=v17.0"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script> <div class="quote-box"> <div class="tooltip-quote tooltip-quote-stock"> <i class="blogicon-quote" title="引用をストック"></i> </div> <div class="tooltip-quote tooltip-quote-tweet js-tooltip-quote-tweet"> <a class="js-tweet-quote" target="_blank" data-track-name="quote-tweet" data-track-once> <img src="https://cdn.blog.st-hatena.com/images/admin/quote/quote-x-icon.svg?version=3302d0c519de548bcb3552ea0bf509" title="引用して投稿する" > </a> </div> </div> <div class="quote-stock-panel" id="quote-stock-message-box" style="position: absolute; z-index: 3000"> <div class="message-box" id="quote-stock-succeeded-message" style="display: none"> <p>引用をストックしました</p> <button class="btn btn-primary" id="quote-stock-show-editor-button" data-track-name="curation-quote-edit-button">ストック一覧を見る</button> <button class="btn quote-stock-close-message-button">閉じる</button> </div> <div class="message-box" id="quote-login-required-message" style="display: none"> <p>引用するにはまずログインしてください</p> <button class="btn btn-primary" id="quote-login-button">ログイン</button> <button class="btn quote-stock-close-message-button">閉じる</button> </div> <div class="error-box" id="quote-stock-failed-message" style="display: none"> <p>引用をストックできませんでした。再度お試しください</p> <button class="btn quote-stock-close-message-button">閉じる</button> </div> <div class="error-box" id="unstockable-quote-message-box" style="display: none; position: absolute; z-index: 3000;"> <p>限定公開記事のため引用できません。</p> </div> </div> <script type="x-underscore-template" id="js-requote-button-template"> <div class="requote-button js-requote-button"> <button class="requote-button-btn tipsy-top" title="引用する"><i class="blogicon-quote"></i></button> </div> </script> <div id="hidden-subscribe-button" style="display: none;"> <div class="hatena-follow-button-box btn-subscribe js-hatena-follow-button-box" > <a href="#" class="hatena-follow-button js-hatena-follow-button"> <span class="subscribing"> <span class="foreground">読者です</span> <span class="background">読者をやめる</span> </span> <span class="unsubscribing" data-track-name="profile-widget-subscribe-button" data-track-once> <span class="foreground">読者になる</span> <span class="background">読者になる</span> </span> </a> <div class="subscription-count-box js-subscription-count-box"> <i></i> <u></u> <span class="subscription-count js-subscription-count"> </span> </div> </div> </div> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> <script src="https://b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script> <script type="text/javascript" src="https://cdn.blog.st-hatena.com/js/external/jquery.min.js?v=1.12.4&version=3302d0c519de548bcb3552ea0bf509"></script> <script src="https://cdn.blog.st-hatena.com/js/texts-ja.js?version=3302d0c519de548bcb3552ea0bf509"></script> <script id="vendors-js" data-env="production" src="https://cdn.blog.st-hatena.com/js/vendors.js?version=3302d0c519de548bcb3552ea0bf509" crossorigin="anonymous"></script> <script id="hatenablog-js" data-env="production" src="https://cdn.blog.st-hatena.com/js/hatenablog.js?version=3302d0c519de548bcb3552ea0bf509" crossorigin="anonymous" data-page-id="entry"></script> <script>Hatena.Diary.GlobalHeader.init()</script> </body> </html>