[インデックス 16063] ファイルの概要

このコミットは、Go言語の公式ドキュメントにおける「Getting Started」ページ、具体的にはdoc/install.htmlとdoc/style.cssに対する変更を記録しています。主な目的は、Goのダウンロードボタンをより目立つように配置し、ページの導入部分の冗長な説明を削除することで、ユーザーエクスペリエンスを向上させることです。

コミット

commit 062a86b07d590c0aa711c83c0e7cb875d3552b37
Author: Andrew Gerrand <adg@golang.org>
Date:   Wed Apr 3 15:59:17 2013 +1100

    doc: add prominent download button to getting started page
    
    Also remove the introduction, which says what the rest of the
    page says anyway.
    
    Fixes #5182.
    
    R=golang-dev, kamil.kisiel, r
    CC=golang-dev
    https://golang.org/cl/8281044

GitHub上でのコミットページへのリンク

https://github.com/golang/go/commit/062a86b07d590c0aa711c83c0e7cb875d3552b37

元コミット内容

このコミットは、Go言語のドキュメントにおける以下の変更を行っています。

ダウンロードボタンの追加と強調: 「Getting Started」ページ（doc/install.html）に、Goのダウンロードページへのリンクをより目立つボタンとして追加しました。
導入部の削除: ページの冒頭にあった「Introduction」セクションを削除しました。このセクションの内容が、ページの他の部分で既に説明されているため、冗長であると判断されました。
CSSの調整: 新しいダウンロードボタンのスタイルを定義するために、doc/style.cssに新しいCSSルールを追加しました。

この変更は、Goのインストール手順をより分かりやすく、ユーザーが迅速にダウンロードページにアクセスできるようにすることを目的としています。

変更の背景

このコミットの背景には、Go言語の「Getting Started」ページにおけるユーザーエクスペリエンスの改善という明確な意図があります。

ダウンロードへの導線の強化: ユーザーがGo言語を使い始める上で最も重要なステップの一つは、Goのバイナリディストリビューションをダウンロードすることです。以前のページ構成では、ダウンロードへのリンクが目立たず、ユーザーが目的の情報を探しにくい可能性がありました。このコミットでは、ページの上部に大きく目立つダウンロードボタンを配置することで、新規ユーザーが迷うことなくダウンロードページへアクセスできるように改善しています。
情報の冗長性の排除: ページの冒頭にあった「Introduction」セクションは、Goの概要やコンパイラの種類について説明していましたが、これらの情報はページの他のセクションでより詳細に説明されていました。重複する情報を削除することで、ページの全体的な簡潔さを保ち、ユーザーが本当に必要な情報に集中できるようにしています。これは、ドキュメントの品質向上とユーザーの読解負担軽減に寄与します。
Issue #5182の解決: コミットメッセージに「Fixes #5182」とあることから、この変更は特定の課題（Issue 5182）を解決するために行われたことがわかります。残念ながら、Goの主要なリポジトリの公開Issueトラッカーではこの番号のIssueは見つかりませんでしたが、これは内部的なトラッカーのIssueであるか、非常に古いIssueである可能性があります。いずれにせよ、ユーザーからのフィードバックや内部的な検討に基づいて、ダウンロードプロセスを改善する必要性が認識されていたことを示唆しています。

これらの変更は、Go言語の普及を促進し、新規ユーザーがスムーズに開発環境を構築できるようにするための、細やかながらも重要な改善策と言えます。

前提知識の解説

このコミットの変更内容を理解するためには、以下の前提知識があると役立ちます。

HTML (HyperText Markup Language): ウェブページの構造を定義するためのマークアップ言語です。このコミットでは、doc/install.htmlファイルが変更されており、<h2>（見出し）、<p>（段落）、<a>（ハイパーリンク）、<span>（汎用インラインコンテナ）などのHTML要素が使用されています。特に、新しいダウンロードボタンは<a>タグと<span>タグを組み合わせて作成されています。
CSS (Cascading Style Sheets): ウェブページの見た目（スタイル）を定義するためのスタイルシート言語です。このコミットでは、doc/style.cssファイルが変更されており、.downloadというクラスセレクタに対してwidthプロパティが設定されています。これにより、HTML要素に適用されたクラスに基づいて、その要素の表示が制御されます。
Go言語のドキュメント構造: Go言語の公式ドキュメントは、ウェブサイトとして提供されており、HTMLファイルとCSSファイルで構成されています。doc/install.htmlはGoのインストール手順に関するページであり、doc/style.cssはサイト全体のスタイルを定義するCSSファイルです。
バージョン管理システム (Git): このコミットはGitというバージョン管理システムによって記録されています。diffコマンドの出力は、Gitがファイルの変更履歴をどのように追跡しているかを示しています。+で始まる行は追加された行、-で始まる行は削除された行を示します。
ユーザーエクスペリエンス (UX): ユーザーが製品やサービスを利用する際に得られる体験全般を指します。このコミットは、GoのインストールページにおけるUXを改善することを目的としています。具体的には、情報の見つけやすさ（発見性）と操作のしやすさ（ユーザビリティ）の向上を目指しています。

これらの知識があれば、コミットがHTMLとCSSのどの部分をどのように変更し、それがユーザーにどのような影響を与えるかをより深く理解できます。

技術的詳細

このコミットにおける技術的な変更は、主にHTML構造の再編成と、それに対応するCSSスタイルの追加に集約されます。

`doc/install.html`の変更

導入セクションの削除:
- <h2 id="introduction">Introduction</h2>とその直後の<p>タグで囲まれた複数の段落が完全に削除されました。これにより、Goの概要やコンパイラに関する冗長な説明がページから取り除かれました。
ダウンロードセクションの再配置と強化:
- 以前はページの途中にあった<h2 id="download">Download the Go tools</h2>が、ページの冒頭に移動し、IDがdownloadに変更されました。
- この見出しの直下に、新しいダウンロードボタンのHTML構造が追加されました。
```
<a href="http://code.google.com/p/go/downloads" id="start" class="download" target="_blank">
<span class="big">Download Go</span>
<span class="desc">Click here to visit the downloads page</span>
</a>
```
  - <a>タグはハイパーリンクを定義し、href属性でGoのダウンロードページへのURLを指定しています。
  - id="start"とclass="download"が付与されており、CSSによるスタイリングのターゲットとなります。
  - target="_blank"は、リンクが新しいタブまたはウィンドウで開かれることを意味します。
  - 内部の<span>タグは、ボタンのテキストを「Download Go」と「Click here to visit the downloads page」の2行に分け、それぞれbigとdescというクラスを付与することで、CSSによる個別のスタイリングを可能にしています。
- ダウンロードボタンの直後には、ダウンロードページへのリンクを再度テキストで示す段落が追加され、その後の段落では公式バイナリディストリビューションが利用可能なOSとアーキテクチャについて説明されています。
- 以前のダウンロードセクションにあった、ソースからのインストールやgccgoに関する言及は、新しいダウンロードボタンの下に移動され、より適切な文脈で配置されました。

`doc/style.css`の変更

.downloadクラスの追加:
- 新しいCSSルールが追加されました。
```
.download {
	width: 150px;
}
```
- このルールは、class="download"を持つHTML要素（この場合は新しいダウンロードボタンの<a>タグ）に対して、幅を150ピクセルに設定します。これにより、ボタンの視覚的なサイズが固定され、レイアウトの一貫性が保たれます。

これらの変更により、Goのインストールページは、ユーザーが最も必要とする情報（ダウンロードリンク）をより迅速に見つけられるように再設計され、同時に冗長な情報が削除されることで、全体的な情報の密度と明瞭さが向上しています。

コアとなるコードの変更箇所

このコミットにおけるコアとなるコードの変更箇所は、以下の2つのファイルに集中しています。

doc/install.html: Goのインストール手順を記述したHTMLファイル。

削除された箇所:

--- a/doc/install.html
+++ b/doc/install.html
@@ -3,25 +3,34 @@
 	"Path":  "/doc/install"
 }-->
 
-<h2 id="introduction">Introduction</h2>
+<h2 id="download">Download the Go distribution</h2>
 
 <p>
-Go is an open source project with a BSD-style license.
-There are two official Go compiler toolchains: the <code>gc</code> Go compiler
-and the <code>gccgo</code> compiler that is part of the GNU C Compiler (GCC).
+<a href="http://code.google.com/p/go/downloads" id="start" class="download" target="_blank">
+<span class="big">Download Go</span>
+<span class="desc">Click here to visit the downloads page</span>
+</a>
 </p>
 
 <p>
-The <code>gc</code> compiler is the more mature and well-tested of the two.
-This page is about installing a binary distribution of the <code>gc</code>
-compiler.
+Click the link above to visit the
+<a href="http://code.google.com/p/go/downloads">Go project's downloads page</a>
+and select the binary distribution that matches your operating system and
+processor architecture.
 </p>
 
 <p>
-For information about installing the <code>gc</code> compiler from source, see
-<a href="/doc/install/source">Installing Go from source</a>.
-For information about installing <code>gccgo</code>, see
-<a href="/doc/install/gccgo">Setting up and using gccgo</a>.
+Official binary distributions are available for the FreeBSD, Linux, Mac OS X
+(Snow Leopard, Lion, and Mountain Lion), NetBSD, and Windows operating systems
+and the 32-bit (<code>386</code>) and 64-bit (<code>amd64</code>) x86 processor
+architectures.
+</p>
+
+<p>
+If a binary distribution is not available for your combination of operating
+system and architecture you may want to try
+<a href="/doc/install/source">installing from source</a> or
+<a href="/doc/install/gccgo">installing gccgo instead of gc</a>.
 </p>
 
 <h2 id="requirements">System requirements</h2>
@@ -56,29 +65,6 @@ installed Xcode 4.3+, you can install it from the Components tab of the
 Downloads preferences panel.
 </p>
 
-<h2 id="download">Download the Go tools</h2>
-
-<p>
-Visit the
-<a href="http://code.google.com/p/go/downloads">Go project's downloads page</a>
-and select the binary distribution that matches
-your operating system and processor architecture.
-</p>
-
-<p>
-Official binary distributions are available
-for the FreeBSD, Linux, Mac OS X (Snow Leopard/Lion), NetBSD, and Windows operating systems
-and the 32-bit (<code>386</code>) and 64-bit (<code>amd64</code>)
-x86 processor architectures.
-</p>
-
-<p>
-If a binary distribution is not available for your
-OS/arch combination you may want to try
-<a href="/doc/install/source">installing from source</a> or
-<a href="/doc/install/gccgo">installing gccgo instead of gc</a>.
-</p>
-
 <h2 id="install">Install the Go tools</h2>
 
 <p>

この差分では、<h2 id="introduction">Introduction</h2>セクションとその内容が削除され、代わりに新しいダウンロードボタンのHTML構造が追加されています。また、以前の<h2 id="download">Download the Go tools</h2>セクションも削除され、その内容の一部が新しいダウンロードセクションに統合されています。

doc/style.css: Goドキュメントのスタイルを定義したCSSファイル。
- 追加された箇所:
```
--- a/doc/style.css
+++ b/doc/style.css
@@ -198,6 +198,9 @@ div#blog .read a {
 	border: 1px solid #375EAB;
 	background: #E0EBF5;
 }\n+.download {\n+\twidth: 150px;\n+}\n \n div#menu {
 	float: right;
 }
```
  この差分では、.downloadクラスに対するCSSルールが追加され、width: 150px;が設定されています。

コアとなるコードの解説

`doc/install.html`の変更点

導入部の削除: ページの冒頭にあった「Introduction」セクション（<h2 id="introduction">で始まる部分）が完全に削除されました。これは、Goの基本的な説明がページの他の場所で既に提供されており、この導入部が冗長であったためです。これにより、ユーザーはより早く本題のインストール手順にたどり着けるようになります。
ダウンロードボタンの追加と再配置:
- 以前はページの途中にあった「Download the Go tools」の見出し（<h2 id="download">）が、ページの最上部に移動し、IDがdownloadに変更されました。これは、ユーザーがGoのインストールページにアクセスした際に、まずダウンロードへの導線が目に入るようにするためです。
- この新しい見出しの直下に、Goのダウンロードページへのリンクを視覚的に強調するための新しいHTML構造が追加されました。
```
<a href="http://code.google.com/p/go/downloads" id="start" class="download" target="_blank">
<span class="big">Download Go</span>
<span class="desc">Click here to visit the downloads page</span>
</a>
```
  この<a>タグは、id="start"とclass="download"を持つことで、CSSによるスタイリングの対象となります。内部の2つの<span>タグは、ボタンのテキストを「Download Go」（大きく表示される部分）と「Click here to visit the downloads page」（補足説明）に分割し、それぞれbigとdescというクラスを付与することで、異なるフォントサイズやスタイルを適用できるように設計されています。target="_blank"属性により、このリンクは新しいタブで開かれ、ユーザーが現在のドキュメントページから離れることなくダウンロードページにアクセスできます。
情報の整理: 以前のダウンロードセクションにあった、Goのバイナリディストリビューションが利用可能なOSとアーキテクチャに関する情報や、ソースからのインストール、gccgoに関する情報は、新しいダウンロードボタンの下に移動され、より論理的な流れで配置されました。これにより、情報の重複が解消され、ページ全体の構成が改善されています。

`doc/style.css`の変更点

.downloadクラスの定義:
```
.download {
	width: 150px;
}
```
このCSSルールは、doc/install.htmlで新しく追加されたダウンロードボタン（class="download"を持つ<a>タグ）の幅を150ピクセルに固定します。これにより、ボタンのサイズが統一され、ウェブサイト全体のデザインの一貫性が保たれます。このシンプルなスタイル定義は、ボタンの基本的なレイアウトを確立し、さらなる視覚的な調整（例: パディング、ボーダー、背景色など）のための基盤となります。

これらの変更は、Goの公式ドキュメントのユーザビリティを向上させ、新規ユーザーがGoのダウンロードとインストールをよりスムーズに行えるようにするためのものです。

参考にした情報源リンク

Git Diffの読み方: Gitのdiffコマンドの出力形式に関する一般的な知識。
HTML5の基本: <a>, <h2>, <p>, <span>などのHTML要素の役割と使い方。
CSSの基本: クラスセレクタ(.class)とwidthプロパティの基本的な使い方。
ユーザーエクスペリエンス (UX) の原則: ウェブサイトのユーザビリティと情報の発見性に関する一般的な概念。
Go言語の公式ドキュメント構造: GoのウェブサイトがどのようにHTMLとCSSで構成されているかについての理解。
Google検索: Go issue 5182 の検索（結果として直接的なIssueは見つからず、関連する情報のみが得られました）。
コミットメッセージの解析: コミットメッセージから変更の意図、関連するIssue、レビュー担当者などの情報を抽出する一般的な方法。

comemo