はてなブログの新しいテーマを作りました！ついに完成です！ テーマの概要 全体のデザイン PC（768pxより大きいサイズ） タブレット（768px以下のサイズ） スマホ（680px以下のサイズ） 作成コンセプト デザイン詳細 背景色・背景画像 例 コードが必要なカスタム ヘッダーのメニュー フッターをつくりこむ コピーライトを表示 まとめ テーマの概要 全体のデザイン レスポンシブ対応のテーマ「Naked」を作成しました。 全体のデザインはこのようになっています。 デモブログはこちら theme-naked.hatenablog.jp こちらでは、ブログ全体のデザインが見れるだけでなく、今後のカスタマイズ情報も更新していきます。興味のある方は、ぜひこちらも購読をお願いします。 インストールは、テーマストアからどうぞ（注：インストールをすると、デザインCSSの内容が破棄されます。必ずバックア
サイトをレスポンシブ対応にするには、デバイスごとのスクリーンサイズ、フォントや画像のサイズだけでなく、クリックとタップ、スクロールとスワイプなどの機能性、そして見た目もサイズだけでなく、配置やトリミングなど、さまざまな取り組みがあります。 レスポンシブデザインにすぐに使える制作テクニックのすごいアイデアを紹介します。 Responsive web design: What the Internet looks like in 2016 以下、各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 01. 空白スペースを効果的に使う 02. ロゴの配置を一貫させる 03. 縦置きと横置きを考慮したデザイン 04. 縦長スクロールページの素晴らしいアイデア 05. 指のタップに合わせた形と大きさ 06. レイアウトにレスポンシブ用の微調整 07. 一行
昨年2011年10月に仕事で運営に携わっている大学ウェブサイトでレスポンシブWebデザイン (しかもフル可変グリッドレイアウト) を導入して、はや半年。約6ヶ月間、レスポンシブWebデザイン（RWD）で制作したウェブサイトを運営してみて思ったことをまとめてみました。これからレスポンシブWebデザインを導入したいと考えている方の参考になれば幸いです。 プロジェクトの概要 大学のウェブサイトをリニューアルするにあたり、さまざまな状況や制限などを考慮、また、今後3〜5年を見据えて、レスポンシブWebデザインを取り入れた制作を行いました。大学公式ブログでもリニューアルについて紹介しているので、ぜひそちらもご覧ください。そこで書いたように、以下のような思いもあり、このリニューアルを行いました： 今回、新しい試みを行った背景には、このウェブサイトが「大学のウェブサイト」であることが大きな要因の一つとし
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
