Minimal Green

はてなブログカスタマイズや、HTML、CSS、サイト制作などについて書いています。

ガーリーデザインのための画像を使ったCSSテクニック

最近アメブロカスタマイズのお仕事もご依頼いただくようになってきました。アメブロはサロン経営者の方や女性個人事業主が運営されていることが多く、女性向けの「きれい・かわいい」デザインが求められます。アメブロカスタマイズの紹介は別記事で改めてさ…

トップページカード型のカスタマイズを実装された方は修正して下さい。

前の記事のトップページをカード型にするカスタマイズですが、途中で画像の取得方法を変えたため、スマートフォンやタブレットでの表示が若干おかしくなっていました。 design.syofuso.com 2017年6月4日20:52以前の記事のコードを実装された方はコードを修正…

はてなブログのトップページ一覧形式表示を使ってカード型レイアウトに

※2017年6月4日20:52以前の記事のコードを実装された方はコードを修正したので、カスタマイズを実装された方をもう一度CSSを貼り直して下さい。ついに、はてなブログでトップページの一覧表示機能ができましたね!最近はてなブログはどんどん便利な仕様が追加…

ヘッダー下のおすすめ記事をスマートフォンで横スクロールにするカスタマイズ

ヘッダーの下のおすすめ記事の横並びにするカスタマイズを以前書きました。今回はそれをスマートフォンでは横スクロールで表示するカスタマイズです。 design.syofuso.com スマートフォンで横スクロール HTML CSS 注意点

はてなブログのスマートフォン版をカスタマイズするとき役立つ記事

先日読んだid:codomisu さんの記事が素晴らしかったので、自分も本業ブログのリデザイン、スマホ版のカスタマイズしました。 スマホ版のデザインもPC版とあわせてリニューアルしました。 夏らしさを意識しましたがいかがでしょうか?スマホ版もPC版と同様、c…

Google Adsenseの関連記事ユニット設置のお知らせ

ここ一ヶ月ほどGoogle adsenseを外していました。他の広告ユニットを貼る予定はないのですが、関連記事ユニットのみ記事下に(PR)として貼らせていただきます。 本業ブログと併せてお読みいただけると幸いです。adsense全然貼っていないとGoogleから通知が…

はてなブログのタイトルテキストのみ画像に置換し、スマートフォンでも最適化する方法

はてなブログには標準のタイトル画像アップロード機能がありますが、サイズなど色々制限があり、自由に表現するには少し難しいところもあります。 タイトルまわりの調整 タイトルのみ画像でスマートフォンでも最適化する デザインCSS スマートフォンでピッタ…

はてなブログのトップページをWordPressの固定フロントページっぽくする方法

Twitterでちょろっと書いたのですが、はてなブログでもWordPressの固定フロントページっぽくビジネスサイト風のトップページを作ることができます。 まずはDEMOページをご覧ください。(PC向け) DEMOページ トップページ用の記事を作る トップページからサ…

はてなブログのAMP用CSSを書くときの注意点

はてなブログのAMP版のCSSを記述出来るようになりましたね。おかげで今までAMP対応を見送ってた方も見直してAMP対応始めた方も多いと思います。カスタマイズ依頼案件でもAMP対応を依頼されることが多くなりました。 基本的にはPC版のデザインCSSと同じように…

サイドバーの記事一覧モジュールで、変数を用いた高度なカスタマイズをする方法

先日はてなブログのサイドバーモジュールに新しい機能が追加されましたね。 staff.hatenablog.com 何か出来ないかなあと、カスタマイズを試してみました。色々な表現が出来ると思うのですが、今回は以下の2点を取り入れたデザインを作ります。 サイドバーの…

Nコンの課題曲について思うこと 合唱曲が好きなんだ!

NHK全国学校音楽コンクール、Nコンの2017年の課題曲「願いごとの持ち腐れ」(秋元康作詞)の模範演奏がAKB48の選抜メンバーで放映されてから批判が表に出てきました。 dot.asahi.comこうしたNコンの課題曲に対する批判はJ-POP路線が強くなった10年くらい前か…

はてなブログのサイドバーに画像を貼り付ける方法

最近Adobe CCを導入してIllustratorを使っています。なんだかんだ言って有料のソフトウェアは使いやすいですね。解説もネットに多いですし。 印刷物を作る機会が増えて、無料の画像編集ソフトでは限界がありましたが、Adobe CC導入して良かったです。まだ全…

よく使う.htaccessの書き方まとめ 301リダイレクト

スマートフォンサイトを制作してPCサイトとスマートフォンサイトをデバイスによって振り分けるときや、サイトのURLが変わった時にリダイレクト転送する際などに使う.htaccessの書き方についてまとめました。 よく使うけれど、サーバー周りのことはよくわから…

数字表記におすすめのGoogle Font はてなブログの日付にどうぞ

このブログではブログタイトルと日付にGoogle FontのJosefin Sansを指定しています。全体にWeb Fontを指定すると見出しやタイトルなど一部分にフォント指定すると、デザインのアクセントになりおすすめです。今回は日付の表示、数字の表示に最適なGoogle Fon…

ガーリーデザインに使える無料イラスト素材配布サイトまとめ

ガーリーデザインシリーズです。今回はガーリーデザインに使えるイラスト素材配布サイトをまとめてご紹介します。もう既に有名な素材サイトばかりですが、個人的に使いやすくよく利用しているサイトです。参考として、それぞれの配布サイトの素材を組み合わ…