2023.12.28

CSSを使ったウェブページのデザインを簡素化する

marugotoyoten

cs50のYoutube動画「CSSを使ったウェブページのデザインを簡素化する」について要点と要約をまとめました

３つの要点

要点１
ウェブデザインを簡素化するための集中化されたCSSファイルの作成プロセスの実演
要点２
CSSファイルをHTMLページにリンクする方法とファイルの権限の問題に対処する方法の説明
要点３
集中化されたCSSファイルの利点、管理の容易さやウェブページ間での一貫したスタイリングなどの強調

要約

集中化されたCSSファイルの作成
講演者は、ウェブデザインを簡素化するための集中化されたCSSファイルの作成プロセスを実演します。HTMLファイルからCSSプロパティを抽出し、「search-3.css」という別のファイルに保存することで、CSSコードの管理と再利用が容易になることを説明しています。

CSSファイルをHTMLページにリンクする
講演者は、CSSファイルをHTMLページにリンクする方法を示します。headセクションにリンクタグを使用して、「search-3.css」のハイパーリンクとファイルの関係をスタイルシートとして指定することで、CSSプロパティがHTMLページに適用されます。ただし、講演者は、他のユーザーが読むためにCSSファイルに適切な権限があることを強調しています。

ファイルの権限の修正
講演者は、CSSファイルの権限の問題について取り上げます。ターミナルでchmodコマンドを使用することで、講演者はすべてのユーザーに読み取り権限を付与します。これにより、CSSファイルは誰でもアクセスできるようになり、ウェブページ上のテキストの適切な配置が行われます。

集中化されたCSSの利点
講演者は、集中化されたCSSファイルの利点を強調して結論を述べます。CSSコードをHTMLファイルから分離することで、複数のウェブページでの変更や一貫したスタイリングの適用が容易になります。このアプローチは、より良いデザインの実践を提供し、一つの中心的な場所での再配置や再スタイリングが容易になります。

▼今回の動画