WEB」タグアーカイブ

iPhone Safariのフォントサイズ

最近(というか今さらかよと言うか)スマートフォン用のウェブページを作る機会が多くなった。

作っていて縦向きでフォントサイズを合わせると横向きのときフォントサイズが大きくなりすぎる感じだったので固定できないかな?と思った。
「iPhone safari 縦 横 フォントサイズ」で調べてみたらCSSの書き方が見つかったのでメモ。

横向きの時だけちょっとフォントサイズを大きくしたい場合はブラウザの横幅で2種類書き分ける感じになるのかな。

TextWranglerを使ってみる

TextWrangler Icon

MacBookはなるべくシンプルに脱Adobe CS5で使おうと思う。というか、お金を節約する方向で。

一応DreamweaverとFireworksはインストールしたけど登録IDを切ったり入れたりがめんどくさい。

html書くのはやっぱりDWが便利だけど他のエディタにもこの際なので慣れておこうと思う。Macで評判がいいのはTextWranglerみたい。TextWranglerって以前(挫折した)パイソンの学習で使ったことがあった。MiとかJeditXでも良いのだけど、またTextWranglerを使ってみることにした。

あとKompoZerってのもインストールしておいた。これはDWみたいにWYSIWYG画面があるので場合によってはいいかも。ただMacBookだと画面が小さいからな。

TextWranglerにはZen-codingを組み込んだ。遅まきながら先日、職場のDWにZen-codingを入れてみたらいい感じだったのでTextWranglerでも使ってみようと思った。

ちょっと使ってみたらTextWranglerはMiみたいにhtmlファイルをブラウザーでプレビューする機能は付いてないみたい。フォルダのアイコンをブラウザのアイコンにドロップすれば良いのだけど、画面が小さいと面倒くさい。ググってみたらAppleScriptエディタを使ってサファリでプレビューする機能を追加する方法を解説している英語のサイトが見つかった。英語苦手だし、AppleScriptエディタなんか立ち上げた事ないのでどうしたもんかな?と。でもAppleScriptエディタ立ち上げてやってみたらなんか出来た。Miと同じショートカットキーを割当てた。

とりあえず大昔趣味で作ったページ(tableで画像並べるのがまだポピュラーだった)をhtml5に書き換えてみたりしてちょっとずつ慣れてみようかと思う。

横スクロールで背景画像が切れてしまう

こんなこと知らなかった!といまさら感がすごかった。

20130404-170440.jpg

先日、作ったサイトをモニターの小さなネットブックPCでみたら、横スクロールに隠れた部分の背景画像が切れてた。いままで横幅小さめのページばかり作っていたので、たまたま気が付かなかったんだ。

何か釈然としないものの、その時は背景画像のサイズを変更して対応した。

後で落ち着いた時にネットで調べてみたらあっさり対応の方法が見つかった。

CSS 背景 スクロール 切れる」で検索。

世の中はそういうことになってたんだ。