webtoranomakiへようこそ
このサイトは、ウェブサイトの企画・デザイン・コーディングの仕事に携わる管理人による、ディレクター、デザイナー、フロントエンジニア向けのあんちょこ(別名:虎の巻)サイトです。というか、それら業務に従事する自分のための備忘録でもあり。光の速さで進む技術、星の誕生ほど日々生まれる様々な情報、生もののように足の速い情報の鮮度。これらを整理し、アップデートしながら、ウェブサイトをいかに「早く」「質を落とさず」に制作、運用するか。そんなことを目的としたサイトです。

企画・仕様・設計

デバイス (端末)別 ユーザーの利用環境調査

ユーザーの利用端末の傾向とOS/ブラウザの確認。

【PC/モバイル】国内のブラウザシェア率
(対象期間: 2020年08月~2020年10月)

PCとスマートフォンでどんなブラウザがどの程度使われているか?

【モバイル】国内のメーカーシェア率
(対象期間: 2020年08月~2020年10月)

モバイルメーカーのシェア率。

【モバイル】OSシェア率、リリース日

モバイルで使われているOSバージョンのシェア率とリリース日。

集客(SEO)

ニーズのあるキーワードやコンテンツの設計。検索結果上位施策、検索結果最適化施策による集客設計。
コンテンツの選定
ニーズがあるコンテンツ、サイトに必要なコンテンツの設計。
フレーズの選定
自動でキャッチコピーを生成してくれるサービス。
Googleマイビジネスの利用
検索結果に表示されるGoogleの無料サービス。

集客(SNS)

SNS、ウェブサービスを利用した手法。
SNS投稿設計
SNSでどんな投稿をしたらいいのか。

デザイン

デザイン考察

国内サイトデザイン

国内サイトのデザインギャラリーをチェック。

海外デザイン

海外サイトのデザインギャラリーをチェック。

書体

ウェブサイトで採用する欧文・日本語書体(フォント)の選定。
欧文書体(フォント)
WEBデザインで定番・人気の欧文書体(フォント)に関して。
日本語書体(フォント)
WEBデザインで定番・人気の日本語書体(フォント)に関して。
ウェブアイコン
ウェブアイコンを使う際の定番どころを。

サーバー

セッティング・設定

サーバーの設定。
.htaccess
SSL化、ドメイン変更、IP制限、デバイス制御などの各種リダイレクト設定。

コーディング

CSS

ウェブサイト制作で採用するCSS3のプロパティが対象ブラウザで利用できるかなど。
暫定ガイドライン:【ガイドライン】CSSの基本設計
プロパティ
最近のウェブ製作でよく使うCSS3プロパティや今後主流となりそうなプロパティののメモ。どのブラウザに対応しているか、どのベンダープレフィックスが必要か、などの確認用。
CSSフレームワーク
WEB制作の品質維持、汎用性・更新性・拡張性の確保、制作コストの削減用に。

テスト・検証

通信

ウェブサイトの動作確認、通信ネットワークの検証、など。
送信テスト
ファイルやメールの送信等に関するテスト。

その他

思考・取り組み方

仕事への取り組み方、意識、企画や設計を行う際の視点などのヒントに。