トラウマレベルのCSS
FirstUPDATE2021.9.1
@Scribble #Scribble2021 #プログラミング #ネガティブ 単ページ WEB CSS ブラウザ リセットCSS #ソフトウェア #タブレット #Windows #モバイル note

何度もしつこいですが、アタシはプログラマーでもなんでもない、きわめて低レベルな、ちょこちょこっと実用を兼ねた遊びでスクリプトやなんやを書くのが好きなだけです。

だから偉そうに言えることは何ひとつないんだけど、それでもBASICをやりだしてから40年近く。ま、それだけやってれば、自分の技量はよくわかってるし、その技量の範囲でやれる、となったことは何とか実現は出来ているのです。
ましてや今の時代はインターネットなんて便利なものがあるので、やりたいことの<やり方>がわからなくても、検索して、んでコピペするだけで、わりと何とでもなってしまうわけで。

そんなアタシが、もっとも苦戦したのはどの言語ですか?と聞かれたら、いやもう、言語ですらないんだけど、アタシならノー文句で「CSS」と答える。
CSS、Cascading Style Sheetsの略ですが、これは言語というよりも<仕様書>に近いもので、要するにCSSの記述でHTML、つまりウェブページの「見た目」を指定するわけです。
ところがこれがね、もう、何で!っていうくらい、思い通りにならない。おっかしいなぁ。これでこんなふうに表示されるはずなのになぁ、と思って試行錯誤するうちに他のところのデザインも崩れてしまう、なんてことがしょっちゅうなわけでね。

CSSで何より厄介なのは「サポートの範囲があまりにも広すぎる」ことがあります。
普通、プログラミングなんてのはWindowsならWindowsで動けばいいんですよ。もちろんWindowsにもバージョンはあるんだけど、ポイントさえ抑えておけばそこまで挙動は変わらない。
ところがウェブページはあくまでブラウザ経由で見るものです。ブラウザなんてどれくらいあるんだというほどあるし、バージョンによっても挙動が違うのも普通。
さらにもっとも厄介なのがモバイルです。つまりスマホやタブレットで見ることも考慮しなきゃいけない。いや今の時代、むしろスマホで見る前提でパソコンで見ても大丈夫、くらいにするのが普通です。

つまり、どんな端末で見ても、どのブラウザで見ても同じように見えるようにするってのが本当に大変なのです。
ま、同じようにっていうか、スマホに最適化、パソコンに最適化したデザインにした方が見易いわけで、これがまた骨が折れる。
いわゆるレスポンシブデザインってヤツですが、まァ、上手くいかないのこれが。コピペでも上手くいかない。もう何が悪いのかさっぱりわからなくなるし、マジでウンザリなのです。

そもそもアタシの場合、ウェブページを作るのに専用のソフトウェアを使わない。全部テキストエディタでやる。つまりは手打ちです。
もしかしたらソフトを使えばもう少しラクに解決出来るのかもしれないけど、もうソフトを覚えるのが面倒くさい。
結果、CSSファイルは果てしなくグチャグチャになってしまう、というわけで。
とにかくアタシがここ最近で学んだことは

死んでもリセットCSSを入れろ!

ってことです。リセットCSSを入れたらブラウザ毎の違いをかなり吸収してくれるので、ま、完全にではないので結局は微調整してやらないと違いが出てしまうんだけど、それでも作業としてはかなりマシになるな、と。
あとはフォントサイズの指定は「em」でやろう、とかね。ずっと「px」か「%」でやってたのですが、これもメチャクチャになる要因だなってのがようやくわかった。

実は今年の秋に向けて本サイト(http://www.yabunirami.org)のリニューアルを予定しています。
春にやったばかりなのにまたリニューアル?ってことなんですが、要はね、実験は自分のサイトでやるしかないんですよ。仕事で実験はしてられないから。
ま、本サイトは半分仕事の実験の場としても使っているわけでね。つかそこそこ頻繁に更新するようなページで実験しなきゃアラも見えてこないから。

理想は完全無欠のテンプレートを作ることなんだけど、そんなの何時になるやら、なわけで。







Copyright © 2003 yabunira. All rights reserved.