s13y

独身27歳の中卒ニートが人生に危機感を覚えながら書くブログ

オリジナルテーマ

オリジナルテーマを初めて作成する初心者にありがちなこと

自分だけのオリジナルテーマを作成するとなればあれもこれもと取り入れてゴテゴテに飾り立てたくなると思います。様々なプロパティをふんだんに使い、本当にそれは必要なのか?と思うアニメーションなんか入れちゃったりして。 サイト全体の配色が派手 ベー…

はてなブログのサンプルテーマ「boilerplate」をカスタマイズしてオリジナルテーマを作る準備

カスタマイズに適した土台選び 実際に「オリジナルテーマ作成」に向けた「カスタマイズ」を行う場合ははてなブログ側が用意している「boilerplate」を利用するのがいいでしょう。0から作り始めてもHTML構造は変わりませんので結局は「boilerplate」を通過し…

はてなブログで使われているdivのセレクタ(idやclass)を確認して全体を視認する

オリジナルテーマ作成に向けて全体図を視認する もっとわかりやすく<div>タグで作られている「コンテナ」を視認するために作ってみました。全体像を把握しているとデザインがし易いので、0からサイトを作る時はこのような設計図を作っておくと便利です。 はてなブ</div>…

はてなブログのサンプルテーマ「Boilerplate」に使われているCSSのプロパティを確認する

サンプルテーマ「Boilerplate」は学びの宝庫 記述されている値を適宜変えるだけでも「使えるテーマ」としてカスタマイズが出来るので、CSSプロパティの使い方を学んでしまえば「1から作る必要はないな」という結論に至ってしまう方もおられるでしょう。はて…

はてなブログのサンプルテーマ「Boilerplate」を見る

はてなブログのサンプルテーマ はてなブログがデザインCSSをカスタマイズする土台に適した「Boilerplate」というサンプルテーマをCSSファイルで配布しています。はてなブログでブログを表示する最低限の設定がなされています。カスタマイズを始めようと思う…

CSSの適応方法と書き方など初歩的なこと

HTMLへCSSを適応するには CSSを適応する方法は複数あります。はてなブログをカスタマイズすることに絞れば最終的にCSSファイルに記述していくことになります。学ぶ段階でCSSファイルを作成して用意する必要はありません。HTMLタグと同じ様にブログの編集画面…

HTMLタグの書き方と覚えておきたい初歩的なこと

編集モードを利用して「タグ」の使い方を学ぶ せっかくはてなブログを利用して書いているのですから、これを活用しない手はないでしょう。はてなブログの編集モードを「HTML」に変更するか「Markdown」で書かれている方はそのままで構いません。本文を記述す…

はてなブログ全体のHTML構造を俯瞰してみる【はてなブログ・HTML構造その3】

はてなブログの全容 HTMLのソースコードは大きく変化することも無いと思います。把握しているだけでもはてなブログのカスタマイズのし易さが違ってきますので全体を見てみましょう。全体が見えれば「こんなものか」と達観することが出来ます。見えない敵に挑…

`<head></head>`の中身はカオスで溢れている【はてなブログのHTML構造その2】

HTMLページは様々なタグで成り立つ「属性」と「値」の意味を把握しなければソースは読めない とはいうものの、最初から全て事細かに教えることに意味はありません「あ、やっぱりね」と後から気付く方が吸収は早いはずです。テーマを作るだけだったり、ブログ…

はてなブログのオリジナルテーマ作成には必要のないマークアップを把握する【はてなブログのHTML構造その1】

はてなブログでオリジナルテーマを作るだけならば不要の知識 はてなブログはその仕様上、HTMLが弄れないことは別の記事で説明しました。つまり自分でHTMLを書いてサイトを一から作るという場合でも無い限り、<body>とに囲まれた中身以外に使用するタグは予備知識程</body>…

HTML4とHTML5の違いとHTMLの基本的なマークアップ

はじめに 現在でもHTML4で解説しているサイトがあるようですのでこの記事を作成しました。「おや?書き方が違うぞ?」と混乱されないようにご注意ください。HTMLに種類があることを前回触れましたがHTML4とHTML5の間には大きな変化があるのです。この違いに…

はてなブログでテーマのカスタマイズを始める前に知っておきたい基本的なこと

はてなブログを自由にカスタマイズする 一ヶ月も使ってない現状ですが私個人としては既にWordPressに移行したいと考えています。しかし最長の二年コースを選択してしまったことから今後もはてなブログを利用しなければなりません。せっかくなのではてなブロ…