Chrononglyph

#7243

CSSを学び直すのも面白いかも

今日の出来事web制作CSS

自分のweb技術の習得遍歴は、一番最初が2005年のHTMLで少し遅れてCSS、
そしてWordPressをいじるようになってからようやくPHPに触れるようになり、
最近はjavascript(ES2015)といった感じになっています。
HTMLとCSSの間に少し時間差があり、最初期の特設サイトはHTMLのみで書きました。
HTMLの属性で直接スタイルを指定していたような時代です。
その後、CSSというスタイル指定専用の技術があると知り随分と感動した思い出。
HTMLは単にページ構造をルールに沿って書くだけですが、
CSSはクラス名を定義して別ファイルでその内容を記述していくというところが
HTMLと違ってプログラミングっぽいと思ったものです。
ある意味自分にとってのwebエンジニアとしての原点と言えるかもしれません。


そのCSS、長らく基礎だけで凌いできましたが最近になって再学習の必要性を感じています。
というのも、CSS3過渡期だった当時と違って最近のCSSはめちゃくちゃ進化している!
CSS単独で変数(ver)を扱えるようになっていたり、アニメーションの実装ができたり、
さらに直近ではスクロールドリブンアニメーションと言って、
スクロールの状態に応じて要素をアニメーション変化させることもできるんだとか。
最近の凝ったサイトでよく見る、スクロール連動で動くやつもおそらくCSSで実装するのでしょう。
CSSを再学習すればよりインタラクティブなデザインができるようになるという期待があり、
そういう意味でも最近の変化点を追う意義はありそう。
もちろん、既存プロジェクトにそれを適用する意味があるかどうかは別の問題ですが。


ピクチャレ大会をきっかけに知った「Styled-Component」もとても面白い技術で、
これはjavascriptの中にヒアドキュメントとしてCSSを記述することで柔軟性を持たせつつ、
コンポーネントを上書きする形で簡単にスタイルを適用できるため、
クラス名をいちいち定義せずともコンポーネントごとにスタイルを記述できるというものです。
Next.jsではとりあえずこれをマスターすれば困らなさそうな感じがしていますが、
これに最新のCSS技術を組み合わせたらもっと面白いことになりそう。


こうした新技術に対する偽りなき好奇心はwebクリエイターの大きな原動力になると思います。
少なくとも自分に関しては、
そうした好奇心のおかげでここまで来ていると言っても過言ではないと思います。
その好奇心を満たすためにも、技術領域の最新ニュースを取得することは今後も続けていこうかと。
まあ、基本的にはGoogleアプリ辺りが自動的に配信してくれるんですけどね。
本当に便利な世の中になったと思います。



同じタグを含む記事(web制作
同じタグを含む記事(CSS
前後の記事
#7198宿命』(2023/09/01
ブログの価値アニバーサリー記念記事今日の出来事
#7199熱中できるものがある人には良い時代』(2023/09/02
ネット文化今日の出来事
#7200財布を落とした』(2023/09/03
一人暮らしのトラブル今日の出来事
#7201スマホのホーム画面を戻した』(2023/09/04
スマートフォンアプリ今日の出来事
#7202インターネットはスパムだらけ』(2023/09/05
ネット文化今日の出来事
#7203ブロックチェーンゲームの現状』(2023/09/06
ブロックチェーンゲーム今日の出来事
#7204キャリア面談まとめ』(2023/09/07
キャリアプラン今日の出来事
#7205持ち家か賃貸か』(2023/09/08
一人暮らし今日の出来事
#7206ブログの新執筆ルール』(2023/09/09
ブログの執筆方針今日の出来事
#7207iPadが映像入力に対応』(2023/09/10
ipad今日の出来事
#7208ルート構築に見る価値観の変化』(2023/09/11
ピクミン4こだわり今日の出来事
#7209やりたい仕事をするのは理想なのか?』(2023/09/12
社会参加の問題今日の出来事
#7210iPhone 15シリーズ発表』(2023/09/13
iphone今日の出来事
#7211Nintendo Direct 2023.9.14』(2023/09/14
nintendo-direct今日の出来事
#7212副業の許可が下りる』(2023/09/15
クラウドソーシング今日の出来事
#7213表現規制と生成AI』(2023/09/16
stable-diffusion今日の出来事
#7214一人暮らしのコスト』(2023/09/17
金銭関係今日の出来事
#7215肋間神経痛』(2023/09/18
体調不良今日の出来事
#7216Twitter完全有料化の噂』(2023/09/19
twitter今日の出来事
#7217新しい媒体を買う優先度』(2023/09/20
携帯機種変今日の出来事
#7218ゆとり教育は成功していた?』(2023/09/21
教育論今日の出来事
#7219インターネット依存の危険性』(2023/09/22
情報収集の問題今日の出来事
#7220浦沢直樹「20世紀少年」感想』(2023/09/23
漫画今日の出来事
#7221朝食をおにぎりに』(2023/09/24
食事今日の出来事
#7222理想のSNSを考えてみる』(2023/09/25
sns今日の出来事
#7223未決済建玉に頼った取引』(2023/09/26
暗号資産今日の出来事
#7224コミュニティ発展の課題』(2023/09/27
ピクミン界隈今日の出来事
#7225音楽再生数統計は時代遅れか』(2023/09/28
音楽再生数統計今日の出来事
#7226銀座の歴史』(2023/09/29
銀座今日の出来事
#7227深刻な悩みは余裕を奪う』(2023/09/30
暗号資産今日の出来事
#7228スイカゲームの進撃』(2023/10/01
スイカゲーム今日の出来事
#7229マウントを取られやすい人の問題点』(2023/10/02
自尊心の問題今日の出来事
#7230涙もろくなった』(2023/10/03
いきもの今日の出来事
#7231匿名掲示板の終焉』(2023/10/04
匿名掲示板今日の出来事
#72322024年計画素案』(2023/10/05
年間計画今日の出来事
#7233Dropboxによる上り通信規制』(2023/10/06
一人暮らしのトラブル今日の出来事
#7234金銭的困窮の総括』(2023/10/07
金銭の問題準非公開の記事今日の出来事
#7235ポケモンGO復帰』(2023/10/08
ポケモンgo今日の出来事
#7236副業について動き出した』(2023/10/09
副業今日の出来事
#7237コンビニコーヒーの謎』(2023/10/10
コンビニ今日の出来事
#7238Apple Musicは音楽ライブラリを救うか』(2023/10/11
音楽配信サービス今日の出来事
#7239ブログ低迷の原因はネタ管理?』(2023/10/12
ブログ執筆今日の出来事
#7240ファミコンロボットへの興味』(2023/10/13
ファミコン今日の出来事
#7241新宿駅のエスカレーター』(2023/10/14
公共のマナー今日の出来事
#7242スクエニの凋落』(2023/10/15
ゲーム業界今日の出来事
#7243CSSを学び直すのも面白いかも』(2023/10/16
web制作CSS今日の出来事
#7244久々に風邪を引いた』(2023/10/17
体調不良今日の出来事
#7245メカニカルキーボードにリベンジしたい』(2023/10/18
キーボード今日の出来事
#7246音ゲー趣味の完全終了』(2023/10/19
音楽ゲーム今日の出来事
#7247メルカリは近年最大の成功サービス』(2023/10/20
ネットフリマ今日の出来事
#7248いじめは非極端なケースが厄介』(2023/10/21
いじめの問題今日の出来事
#7249Apex Legendsのレベル問題』(2023/10/22
apex-legends今日の出来事
#7250スマホで生成AI』(2023/10/23
stable-diffusion今日の出来事
#7251ゲーム購入遍歴における重複問題』(2023/10/24
ゲームプレイ遍歴今日の出来事
#7252結婚相手の条件を再考する』(2023/10/25
恋愛観今日の出来事
#7253久々の飲み会』(2023/10/26
飲み会今日の出来事
#725412kmタマゴに見るポケモンGOの楽しみ方』(2023/10/27
ポケモンgo今日の出来事
#7255友人関係はむしろ少ないほど良い?』(2023/10/28
人間関係今日の出来事
#7256サブスク整理』(2023/10/29
スマートフォンアプリ今日の出来事
#7257クラウドソーシングの難しさ』(2023/10/30
副業今日の出来事
#7258あと払い決済を試してみた』(2023/10/31
決済手段今日の出来事