monoのメモ帳

HTMLとCSSを勉強しながらはてなブログをカスタマイズ中です。

はてなブログのテーマでレスポンシブ対応を選んでいるのにスマホで表示されない時の対処法

はてなブログのテーマでレスポンシブ対応のテーマを選んでいるのに、スマホで見るとパソコン画面をただ単に小さくしただけの表示がされてしまうという方をお見掛けしたので対処法を書いておきます。 はてなブログのテーマでレスポンシブ対応を選んでいるのに…

はてなブログのテーマが完成|パソコン・タブレット・スマホのはめ込み画像を作ってみた

自作のテーマ 自作テーマの形ができてきたので、WEBデザイナーさんみたいなことがやりたくて、モックアップというのを作ってみました。 テーマが完成したらパソコン・タブレット・スマホのはめ込み画像を作ってみよう Placeitでモックアップを作ってみたよ P…

よく使うはてなブログのWebアイコンフォント

はてなブログでは、独自のWebアイコンフォントが用意されています。 Webアイコンフォントで有名なのが Font Awesome ですが、アイコンの種類はとても豊富にありますが、サイトが若干重くなってしまいます。はてなブログのWebアイコンフォントは120種類以上あ…

はてなブログテーマ製作|ページャーを作るのに一苦労

はてなブログのテーマを自作テーマにしようと現在奮闘しております。 皆さんこんにちわ、モノトーン好きのmonoです。 さて、タイトルの通り、今日もはてなブログのテーマをちまちまと作っておりますが、今回はページの次へ、前への表示のページャーです。 デ…

はてなブログテーマ製作|レスポンシブデザインflexboxでつまずく

はてなブログのテーマを製作しているのですが、最初から躓いております。 みなさんこんにちわ、モノトーン好きのmonoです。 レスポンシブデザインのテーマを作成したくてCSSの本を購入したのですが、中古のCSSの本を購入したので情報が古くて使えませんでし…

レスポンシブデザインを作るならブレイクポイントをどこにするかを考察

今の時代はスマートフォンやスマホからの流入が多いので、サイトを作る際もモバイルファーストで、モバイルサイトから先に作るWebデザイナーさんも多いのだとか。 私も、はてなブログでテーマを作成するのであれば絶対にレスポンシブデザインがいいと思って…

はてなブログのテーマ作成で一番最初に書いたCSS

HTMLもCSSも勉強したことがない素人が、はてなブログのテーマ製作にチャレンジしています。 一番最初に書いた方がいいと思うのは *, *:before, *:after { box-sizing: border-box } 全ての要素に、box-sizing: border-boxを設定しました。 box-sizing: borde…

はてなブログの自作テーマを作る手順を振り返る

今ご覧いただいているテーマは自分で作ったテーマです。HTMLもCSSもわからない普通の主婦が、本を片手に作ったものなのでまだまだ手直しが必要かもしれませんが、一応形になってきました。 自作のテーマを作るメリットとしては 自分の好きなデザインにできる…

ご挨拶

はじめまして、monoのメモ帳にご訪問いただきありがとうございます。 このブログはHTMLもCSSもわからない超初心者が、はてなブログのテーマを作成していく過程を綴っていくブログです。 専門の学校に通ったこともなく、HTMLとCSSの本を手にしたのは1週間ほど…