- 追加された行はこの色です。
- 削除された行はこの色です。
*変更点 [#y80b9128]
(もと) 11x11 &ref(http://300000.jp/image/external_link_00old.gif,nolink); …… Google画像検索で拾ってきた画像(透過gif形式)
↓ 色を濃くした。色は黒,濃いグレー,薄いグレーと,透過色。(これ以降は透過png形式)
(00) 11x11 &ref(http://300000.jp/image/external_link_00.png,nolink);
↓ 左側に "LINK" の文字パーツ(文字の上下には罫線)を追加。
(01) 40x13 &ref(http://300000.jp/image/external_link_01.png,nolink);
↓ 右側のアイコンを少し大きく。
(02) 42x15 &ref(http://300000.jp/image/external_link_02.png,nolink);
↓ 左右に罫線を加えて,2つのパーツを一体化。
(03) 46x15 &ref(http://300000.jp/image/external_link_03.png,nolink);
↓ 文字の高さを低く。正方形の枠を消去。矢印の形を変更。
(04) 40x15 &ref(http://300000.jp/image/external_link_04.png,nolink);
↓ 文字囲みの形を変更。
↓ 矢印の形の修正を試みるも,中止。(失敗作05a)
(05) 40x15 &ref(http://300000.jp/image/external_link_05.png,nolink); (失敗作05a) &ref(http://300000.jp/image/external_link_05a.png,nolink);
↓ グラデーションにしてみた。
(06) 40x15 &ref(http://300000.jp/image/external_link_06.png,nolink);
↓ ここで,スマホの小さい画面ではLINKの文字がとても読みにくいことに気付いたため,
↓ (06)で施した文字囲み内のグラデーションを取り消し,(04)で低くした文字の高さを戻した。
(07) 40x15 &ref(http://300000.jp/image/external_link_07.png,nolink);
↓ 小文字に。("LINK"→"Link")
↓ 文字囲みの幅を変更しようと試みたが,中止。(失敗作08a,08b)
(08) 40x15 &ref(http://300000.jp/image/external_link.png,nolink); &color(#ff0000){← 現在使用中}; (失敗作08a) &ref(http://300000.jp/image/external_link_08a.png,nolink); (失敗作08b) &ref(http://300000.jp/image/external_link_08b.png,nolink);