HTML
セマンティックHTMLの使用
適切なHTMLタグを用いることで、サイトの構造を正確に表現し、アクセシビリティとSEOの最適化を実現できるように心がけています。
また、検索エンジンのクローラーがウェブサイトを構造的に理解しやすくなり、サイトの検索順位の向上を狙っています。
画像の適切な代替テキストの記述
すべての画像に alt 属性を使用し、その内容を説明するテキストを加えています。
これにより、視覚障害があるユーザーや画像が表示されない場合でも、情報が正しく伝わるようにしています。
キーボードによるサイト操作の対応
マウスだけでなく、キーボードだけを使用してもサイトを操作できるようにしています。
すべての機能やリンクにキーボードショートカットやフォーカス制御を適切に設定し、すべてのユーザーがアクセスしやすいWebサイトづくりを意識しています。
CSS(Pure CSS, SCSS)
最新のCSSの導入
全てのモダンブラウザでサポートされていることを踏まえた上で、できる限り最新のCSSを積極的に取り入れるよう心がけています。
元々SCSSを使用していましたが、CSSカスタムプロパティの便利性や保守性の良さからPure CSSに移行しつつあります。
レスポンシブデザイン対応
リキッドレイアウトやソリッドレイアウトなど、デザインに応じた様々なレイアウトスタイルを適切に実装できるよう、スタイルを柔軟に使い分けています。
クロスブラウザ互換性
クロスブラウザテストを行い、すべての主要なブラウザで一貫した表示と機能を確保しています。
アクセシビリティの確保
キーボードナビゲーションやフォーカススタイルの適切な管理を行い、すべてのユーザーがサイトを効率的に使用できるようにしています。
JavaScript (Vanilla JS)
コンポーネントベースでのコーディング
できる限り再利用が可能なコードの記述を心がけています。
それぞれコンポーネント化することで、独立して機能するようにして、異なるプロジェクトやページ間での共有ができるようにしています。
webpackの導入
JavaScriptをコンポーネント化して管理し、また複数のJavaScriptファイルを1つにまとめることで、ページロード時間の短縮を図っています。
Vanilla JSの採用
ページの読み込み速度を高める、依存関係を減らす、より細かいコントロールが可能という点から採用しています。
またJavaScriptを理解した上で、徐々にTypeScriptへ移行していきたいという個人的な希望もあります。
PHP (WordPressのテーマ開発)
コンポーネントベースでのコーディング
JavaScriptと同様に心がけており、ページやセクション間で見た目や機能が統一されるよう意識しています。
カスタムフィールドとカスタムポストタイプの活用
カスタムフィールドとポストタイプを駆使して、管理しやすく拡張性の高いWordPressサイトを構築するよう心がけています。
