// TECH LOG
本業は、エンジニア。
ここから先は、まる子パパのもうひとつの顔の話。ふだんは受託開発のエンジニアとして働いています。
AI・Web開発・IT業界のこと、そしてキャンプに直結する電源まわりの技術まで、
仕事場の試行錯誤をここに記録しています。キャンプの写真は1枚も出てきません。
朝はコードの話、夕方はAI・業界のニュース。どちらも実際に手を動かした範囲だけを書いています。 うまくいった手順より、動くと思って動かなかった一行のほうが多いです。
分類HTML・CSSほかの分類から選ぶ20
100vhでスマホの下が切れる原因｜トップページの写真の下だけ、いつも指で押さないと見えなかった
トップページの写真をheight:100vhで画面いっぱいにしたら、スマホでだけ下が切れて見えた。 ア…
/tech/879/
position:sticky が効かないときに見る場所｜原因は、半年前に自分で書いた一行だった
目次を画面に残したくて二行書いたのに、そのまま上へ流れていった。 悪いのはCSSではなく、そ…
/tech/831/
スマホでボタンを押したつもりが、隣のリンクが開いた。押せる大きさに決まりがあった
見た目は四十ピクセル四方のボタンなのに、実際に反応するのは真ん中の文字だけだった。 押せる…
/tech/701/
画像が届いた瞬間に、読んでいた行が下へ逃げた。大きさを書き忘れていただけだった
スマホで自分の記事を開いて、一行目を読みはじめたところで文章が下にずれた。 読み込みが遅い…
/tech/632/
配色を変えるたびに、同じ色コードを何十箇所も直していた。CSS変数を知って、その作業がなくなった
サイトのアクセントカラーを一つ変えるだけなのに、CSSファイルを開いて色コードを何十箇所も検…
/tech/599/
スマホでフォームを触ったら、画面が勝手に寄った。犯人は文字の大きさだった
入力欄をタップした瞬間にページが拡大して、そのまま戻らない。 iPhoneでよく起きるあの動きに…
/tech/566/
リンクの下線を消したら、誰も押さなくなった。飾りのつもりで標識まで消していた
文字の色が変わっているだけでは、そこが押せる場所だとは伝わらない。 本文の中のリンクにだけ…
/tech/526/
車の中でスマホから自分のサイトを見て気づいた。ページは幅に合わせて「折り返して」いた
パソコンで直したばかりのページを、キャンプ場の車の中でスマホから開いた。 横に3つ並んでい…
/tech/450/
同じ文章でも、CSSを替えるとサイトは別人になる
HTMLが骨組みなら、CSSは見た目の指示書。 文字の色ひとつで、ページの空気はがらっと変わりま…
/tech/348/
Webページの正体は、ただのテキストファイルだった
このサイトも、世界中のどのサイトも、中身はただのテキスト。 HTMLという札の貼り方を、テント…
/tech/347/
このサイトを動かしているCMS
稼働中の実例
国産CMS「コンテナ」
オートキャンプライフは、私が開発に携わっている国産CMS「コンテナ」で動いています。 記事の投稿だけでなく、4,223件の泊まれる場所のデータベースも、会員機能つきのスタンプラリーも、全部このCMSの上で作りました。 ここに書いている技術の話は、たいていこのCMSを直しながら出てきたものです。
※運営者が開発に携わっているサービスです。このサイト自体が稼働中の実例になっています。