xhml・html

各ブラウザでの見え方チェック

2013年01月09日
以前にも利用していたことがあるのですが、各ブラウザでの見え方を表示してくれるサイトを再調査してみました。
2つのサイトが浮かび上がってきました。

Browsershots
Adobe BrowserLab
です。

Browsershotsを試しに使ってみました。
どうやら1日にチェックできる上限があるようです。それ以上はユーザー登録が必要なようです(英語オンリーなので、断言できない自分が悲しい・・・)。
チェックできるブラウザの種類が膨大です。本当に必要なもだけチェックすることをお勧めします。でないと時間もかかるし、簡単に上限を超えます。自分が使用していないOSのブラウザだけで十分でしょう。

チェックしたいURLを入力すると、画像を作成してくれます。

いやぁ、便利なサイトを作ってくれる方が世の中にはいらっしゃるんですね。感謝、感謝。

実は、今使っているOSがWindowsXPなので、そろそろWindows7(Windows8ではないんだな)にアップしたいと考えています。
MacOSの上にWindowsが載せられると聞いたので、Macの購入も考えていました。
でも、見え方のチェックのためだけにわざわざMacっていうのもねぇ。高くつくし。
高い分だけの価値があるかどうかってことです。
チェックするのは、始めとスタイルを変更したときだけです。おそらくチェックするのは数回だけです。プラス3万円(おそらくそれ以上高くなるでしょう)かかるとして・・・馬鹿馬鹿しいです。

私には、Browsershotsで十分過ぎます。
Mac購入は見送りです。

xhml・html

URL中のhtml特殊文字

2012年10月12日
Another HTML-lint gatewayでhtmlの文法チェックをやっていて、URLにクエリがある場合の書き方について気が付きました。
ブラウザに表示する場合、クエリ中の【&】は【&】と書かなければいけないそうです。
実体参照について


【<】や【>】は【&lt;】や【&gt;】と書くことは知っていましたが、URL部分には特別に実体参照を用いなくても良いのだと思ってました。
ああ、とんだ勘違い。まぁ大抵のブラウザで動くから、実際にはあまり問題にはならないのですが。間違っていても、動くように書いてくださっているのでしょう。

ツールやサイトを少しずつ直すことにします。

フォーム中のテキストやテキストエリアに【&amp;】と表示したい場合は、【&amp;amp;】と書きます。これちょっとはまってしまいました。


また、URL中に【[】や【]】を使っていたのもひっかかりました。
使えない文字
【%5B】や【%5D】と書かなければいけなかったようです。

以前会社でPHPのコーディングしていたとき、ちゃんと書いている人、いなかったような・・・

xhml・html

迷惑なブラウザIE

2009年03月18日
IEというより、マイクロソフトの製品ってよく使うけど迷惑を被ることも多い製品です。

Webページを作っていただいて、それをxml化したら、表示が崩れました。

ちょっと前にIEのバージョンを6から7へ上げたら、ページのレイアウトが崩れました。
IEのバージョンによってcssの解釈が違うのです。

デザイナーさんからあがってきたページの先頭に
<?xml version="1.0" encoding="euc-jp"?>
というxmlの宣言文を追加しただけで、IE6でのレイアウトが崩れました。
なんでxmlで??
ほかのブラウザでは全く問題ないので、IEの問題。
やっぱりわからん。MicroSoftは。

調べると、IE6はcss関係のバグだらけだそうです。
全く困った会社です。

もっと性質が悪いのは、複数のバージョンを1つのPCにインストールできないこと。

ああ、最悪なソフト。


で、なにか手はないか探していたら、複数のIEのバージョンでの表示のされ方を見られるソフトを発見。
IETester

英語圏のソフトですが、【IETester】で検索したら、インストール方法とか、使い方とか、日本語で出てくるはずです。

xhml・html

商用OK、加工OKの使えるフリー素材

2008年07月03日
ビジネスサイトのリニューアルをしています。

タイトルやヘッダにちょっとしたアクセントをおきたいので、商用OK、加工OKの素材を探してみました。

できるだけ安く上げたいので、まずはフリーの素材を探します。もしいいのがなければ、有料の素材を探すことにします。


ありました! サイトの雰囲気に合う素材を使わせてもらってます。
0円のweb素材屋さん
招テン
Design Warehouse
デザイン素材.com
ホームページ素材@ImageLife
News&Days
blue-green

おかげで、ネットビジネス便利ツールが少しスタイリッシュになりました。
といっても、デザインはアマチュアの私が作っているので、プロにはかないませんが。


さて、次はセールスページだ。内容も書き換えるので、気合と時間がかかるけど頑張ろう!

xhml・html

サイトリニューアル完了

2008年06月30日
早朝にサイトを止めて、リニューアルしました。3時間はかからないだろうと予想し、4時から7時まで止めるアナウンスをしていたのですが、実際には7時半くらいまでかかってしまいました。
ネットビジネス便利ツール


朝の4時から作業をしたので、眠かったです。

睡魔との闘いです。眠いとミスもおきやすいので、注意しながら、気持ちを落ち着けて、ゆっくり作業しました。



サイトを止めていたので、気持ちには余裕ができ、焦らず作業できました。


一応リニューアル完成です。まだ修正は少しずつやっています。


内部リニューアルが終わったら、見た目と文章のリニューアルをする予定です。

xhml・html

サイトリニューアルに向け

2008年06月29日
PHPで作っているネットビジネス便利ツールですが、少しずつ裏でソースを修正していました。


今日というか、明日の早朝、入れ替えようと思います。サイトを何時間が止めて一気に入れ替えるつもりです。とは言っても、見た目は全く変わりません。


表と裏のソースがごっそり入れ替わります。テストもしないといけないので、安心してできるようにサイトを止めるのです。


変わるのは、ステップメールの部分です。貧乏なので(笑)買わずに、自分で作っています。ここを、もっと簡潔に、使いやすく変更しました。

テストサイトでは動いていますが、本サイトに適用して、きちんと動くよう設定します。


自動実行cronの設定などやることは山のようにあります。


どきどきしますね。

xhml・html

月ごとに自動で変化するWeb画面

2008年04月01日
今日から本当に派遣先から無罪放免です。さて、新しい世界に踏み出しましょう。ちょうど4月だし。

手始めに(?)、サイトの画像と配色を月ごとに自動で変更するソースを作ってみました。
できることから コツコツと


月ごとの画像を用意します。
top01.jpg
top02.jpg
 ・
 ・
 ・


月ごとに配色と配置も変わるので、それぞれのスタイルシートを用意します。共通の部分はstyle.cssに残し、月ごとに変わる部分をそれぞれのスタイルシートに移します。
style01.css
style02.css
 ・
 ・
 ・


このスタイルシートに、配色と配置、表示する画像を設定します。


アクセスがあったとき表示するファイル(例えばindex.phpなど)では、月を読み取り適用するスタイルシートを決めます。
1月ならstyle.cssとstyle01.css、2月ならstyle.cssとstyle02.css ・・・ です。


スタイルシートは複数設定できます。htmlのヘッダに、
<link href="style/style.css" type="text/css" rel="stylesheet" />
<link href="style/style01.css" type="text/css" rel="stylesheet" />
とします。

あるいは、
style-all.css ファイルには、
@import url(style/style.css);
@import url(style/style01.css);
のように、設定するスタイルシートを列挙し、
本体のhtmlのヘッダには、style-all.cssを設定します。
<link href="style-all.css" type="text/css" rel="stylesheet" />


これで月ごとに別々の画像とスタイルを表示できます。

xhml・html

htmlエディタ(タグ挿入エディタ)

2007年05月03日
いいエディタはないかとネットを探した結果、2つのエディタにいきつきました。

ez-HTML
TTT Editor

です。試用してみることにしました。

あくまでも自分が使う場合の観点で次のことをチェックしました。
・タグは小文字指定ができるか
・タグを登録できるか
・タグの色分けはできるか
・複数のファイルが編集できるか
・ファイルをツリー構造にできるか(できればプロジェクトがつくれれば・・・)
・文字コードの種類
・属性の各順番が指定できるか

-------------------------------------------------------------------------------------------------
チェック項目             TTTEditor           ez-HTML
=================================================================
タグ小文字               ○                ○
-------------------------------------------------------------------------------------------------
タグ登録                ○              見つからず
-------------------------------------------------------------------------------------------------
タグ色分け               ○                ○
-------------------------------------------------------------------------------------------------
複数ファイル編集            ○                ○
-------------------------------------------------------------------------------------------------
ツリー構造               ○                ○
-------------------------------------------------------------------------------------------------
文字コード            S-JIS JIS EUC     S-JIS JIS EUC Unicode
                                 UTF-8 UTF-8N
-------------------------------------------------------------------------------------------------
属性位置             見つからず           imgタグ○
-------------------------------------------------------------------------------------------------
でした。


全くの私見ですが、
 TTTEditor
  初心者、あるいは逆によくわかっている上級者がタグ挿入を補助的に使うのに適している。
 ez-HTML
  とにかく高機能なので、初心者は迷うかも。


自分が使うときのみを考えて、気になった点は、
 TTTEditor
  属性の出力順が指定できないので、少し不便(imgタグの順番を指定したい)。
  ファイルのツリー構造が少々使いにくい。
 ez-HTML
  タグを登録できそうにないのですが、どうやらhtml・xhml仕様に完全対応しているらしい。
  文法チェックが走るので、間違った文法で警告がでる。あえてそのような編集をしているときは邪魔になる。(切ることもできるのですが、宣言部分のないファイルでは切れない)


ほぅ!と思った点は、
 ez-HTML
  xhmlにも対応している。

いずれにしても、どちらも使いやすそうです。後は、用途、好みでしょう。

どちらのソフトもレジストリを汚さないので、気軽に試用できます。

xhml・html

サイト再構築 xhtmlへの変更

2007年05月02日
htmlからxhtmlへの変更は、タグをきちんと書いていれば、思っていたより簡単です。タグを直していたら、自然とxhtmlへ対応できるようになったので、この機に変更します。

htmlとxhtmlの大きな違いは、
・もちろん宣言部分が違います
<?xml version="1.0" encoding="文字コード"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">

・エレメントのないタグ(<タグ> 内容 </タグ> の【内容 </タグ>】ないタグ。例えば、metaとかimg)の終了は、【半角スペース+/>】とする

・タグ、属性は宣言以外小文字で書く
etc・・・

です。HTML Made Easyが参考になります。

使っていたhtmlエディタが、大文字でタグを入れるので、この変更が大変でした。どこを見ても、小文字に設定するところがないので、今後はエディタを変更しようと思ってます。いいエディタが見つかったらこのブログに書き込みます。

タグの変更が終わったら、テストサイトにULして、文法チェッカーでチェックします。
Another HTML-lint gateway

文法に間違いがなくなるまで変更していきます。

これでxhtmlへの変更が終わりました。もう少しテストサイトで動かしてから本番へULです。

xhml・html

サイト再構築

2007年05月01日
GWを利用して(?)ネットビジネス便利ツールの再構築をしています。最低限のSEO、タグチェックはしていますが、もう少しちゃんと書き直しています。

購読しているメルマガでちょうどSEO対策に強いプロのホームページ制作ツール「賢威2.0」が紹介されていました。GW中のみサンプルがダウンロードできます。改めてへぇと思うことが書かれています。お薦めです。サンプルをDLしたら、製品が欲しくなってしまうかもしれません。


いずれはxhmlへ変更するつもりですが、そのときなるべくスムーズに移行できるタグの書き方もわかりました。

いままで、インターネットからDLしたテンプレートを使用していたのですが、hタグの使い方を少し変えたいと思っていました。今回変更しようと思います。

そして、なによりコンテンツの充実を考えなくてはいけませんね。
2017年12月
        1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31
先月
来月
カテゴリ
検索
関連サイト
プロフィール
【ネットネーム】
みゅー

キャラクター by ツカエルサイト


【趣味】
・プログラミング
・写真
・楽器演奏
・手芸
・日曜大工
・家の中の不便を便利に
・考える
・自然科学
・猫と戯れる
・ジグソーパズル

【仕事】
・派遣社員でSE・PGやっていました。次の良い仕事がみつからないので、ビジネスへ注力しようと思っています。
・経験言語:VB6、VB.NET、PHP、Perl、JAVA、Oracle、SQLServer、PostgreSQL



【名前】
アン(足)

2014年4月22日生まれ 女の子
あだ名は くノ一
普段は普通にしゃべりますが、興奮すると『ニャ』を連発します

【趣味】
・狩
・ご飯を食べる
・ママのお手伝い

【仕事】
ママのビジネスの看板招き猫
ママの代わりにPC入力
仕事中のママの右腕を温める
ママに心配をかける
いろんな事をしでかしてママを退屈させない

RSSフィード