危険なUSBハブ

カテゴリー: noncategory | コメントは受け付けていません。

このブログにアニメーション(gif画像)を貼れるか

 
 このブログにアニメーションを貼れるのか、とふと思い、やってみようと思った。具体的には、アニメーションのgifなのだけど。さあ、どうだろう。
 

 
 あ、動かないか。本当は、この男性が歩くはずなのに。

 となれば、あそこにリンクを貼る、だな。スケッチーズwww.sketcheese.com)というサイトのトップページで、「歩き続ける男」をご覧ください。
 
 
 

カテゴリー: illustration, noncategory, sketch | コメントは受け付けていません。

「持ち帰り」と「お持ち帰り」

 
 健康診断を受けるため、前日は午後9時頃までに食事を済ませ、朝食を抜き、最寄りの医院へ足を運んだ。検査終了後、空腹に耐えられないと感じ、ドトールで朝食のBセット(パストラミサンドと、ブレンドコーヒーS)を食した。ドリンクは他のものも選べるのだが、今朝は一杯のコーヒーも飲んでいなかったので、迷わずにオーダーした。

 私がカウンターの端のほうでパストラミサンドが出来上がるのを待っていると、あとから入ってきた外国人と思しき男性がドリンクを注文している。

 その男性はメニューを見ながら「アイスコーヒー」と言い、店員の女性が「店内で飲まれますか、お持ち帰りですか」と答えた。すると、男性は「お持ち帰りで」と返事をした。

 男性は日本語がある程度できる様子だったが、「持ち帰りで」と言うのはむずかしかったのだろう。大人の日本人であれば、「お」をつけずに「持ち帰りで」と答えるのが一般的だろう。

 とこういうことを書くと、ねちねちしているみたいに思われるかもしれないが、日本語では自分の行動について話す場合は「お」をつけないのが一般的だろう。

「お持ち帰り」と「持ち帰り」の違いが気になった場面だった。普段は気にとめない、日本語について少しでも考える、良い機会になったかもしれない。
 





 
 

カテゴリー: illustration, noncategory, sketch | コメントは受け付けていません。

「: hover」と「 : hover」の小さいようで大きな違い

『HTML5&CSS3 デザインレシピ集』(狩野祐東 著、技術評論社)という本を見ていたら「105 ボックス全体をリンクにしたい」という項目があり、やってみることにした。下記は例文にコピーの前に、コピー1行目を追加してみたもの。

 HTMLファイルの中身に下記のソースコードを入れ(ファイル名は「index.html」などにして)、
 
<!DOCTYPE html>
<html>
<head>
<meta charset=”utf-8″>
<title>html5&CSS3デザインレシピ集 105 ボックス全体をリンクにしたい</title>
<link rel=”stylesheet” type=”text/css” href=”style.css”>
</head>
<body>
<a href=”contact.html”>
 <div class=”campaign”>
<h1>夏だから理想のボディへ<br>
入会金無料キャンペーン実施中</h1>
<p>資料請求・お問い合わせはこちら</p>
</div>
</a>
</body>
</html>

 CSSファイルの中身に下記を入れ込んだ(ファイル名は「style.css」にして、「index.html」と同じフォルダに入れるなど、PCの同じ階層に配置する)。

a {
text-decoration: none;
}
.campaign {
width: 50%;
margin: 0 auto;
padding: 20px;
background: #389bc2;
color: #ffffff;
text-align: center;
}
.campaign: hover {
background: #ff0033;
}

ところが、画面に現れたボックスにマウスをのせても(マウスオーバーしても)、ボックスの地色(文字の背景色)が変わらないのでなぜだろうと、いろいろチェックしてみたら、cssの最後の

.campaign: hover {
background: #ff0033;
}

.campaign:hover {
background: #ff0033;
}

としていなかったから、であった。

 違いは、hoverの前に空白があるかないかで、つまり正しくは

a {
text-decoration: none;
}
.campaign {
width: 50%;
margin: 0 auto;
padding: 20px;
background: #389bc2;
color: #ffffff;
text-align: center;
}
.campaign:hover {
background: #ff0033;
}

である、と。

.campaign: hover {

.campaign:hover {

の違いは小さいようで、大違いなのですね。

 このところプログラミングを勉強中で、『リーダブルコード より良いコードを書くためのシンプルで実践的なテクニック』(Dustin Boswell・Trevor Foucher 著、角征典 訳、オライリー・ジャパン)という本もちらちら見たりしていて、書けないながらもコードの読みやすさ、見やすさも少しは気にしているつもり。

 とはいえ、この場合の

.campaign: hover {

とhoverの前に少しアキをつくるのは、(私は読みやすいのでは、と思ったが)それは自分勝手な考え方だったのだろう。
 
 
 色を指定する部分のCSSは、

background: #ff0033;

でも

background:#ff0033;

でも同じように作用する(効く)のになんだかなぁ、と思うのは、たんに私があまりわかってないからなのだろうか。

 

 

 
 
 

カテゴリー: book, html5, noncategory | コメントは受け付けていません。

HTML5のセクション名はシンプルでいい感じ

プログラミングをできると言ってみたものの、ほぼ独学で、大したレベルでないことは自覚している。

で、そんなレベルの私にとって、気になっていることのひとつが、ウェブサイトのデザインにおけるCSSの指定だ。で、そのCSSの指定をするために、HTMLの各要素にどのような名前をつけておくといいのか、というのが気にかかっている。CSSのクラスだ、やれIDだ、というのも気になるが、その前に整理しておくことがあるよねと思いつつ、ネットで調べていたら、「HTMLクイックリファレンス」に行き着いた。

いや、行き着いたというのは違うな。これまでの何度も見たことがあるウェブサイトなのだが、今回、私が注目したのは下記の内容である。「HTMLクイックリファレンス」中の「HTML5リファレンス」のうち、紺色の帯に白抜き文字で「セクション Sections」と書かれている部分がわかりやすい。

セクション Sections
<body>…… 文書の本体を表す
<section>…… 一つのセクションであることを示すHTML5から追加
<nav>…… ナビゲーションであることを示すHTML5から追加
<article>…… 記事であることを示すHTML5から追加
<aside>…… 余談・補足情報のセクションであることを示すHTML5から追加
<h1><h6> …… 見出しを付ける
<hgroup> …… セクションの見出しを表す、見出しをまとめる【廃止予定】
<header> ……ヘッダであることを示すHTML5から追加
<footer> …… フッタであることを示すHTML5から追加
<address> …… 連絡先・問合せ先を表す

※本当は( )でなく、< >というヤマカッコでくくりたかったのだが、このブログが表示された画面を確認すると、うまく表示できていなかったので、( )で表示させていただいた。まあ、きょうのところはお許しください。

(この部分、あとから書き込んだ)ヤマカッコが表示できなくて困っていたのだが、『HTML5&CSS3 デザインレシピ集』(狩野祐東 著、技術評論社)という書籍のP.100(042 HTMLで使用できない記号を表示したい)を見て方法がわかったので修正した。他にもいろいろ役立ちそうなので、同書については下記にリンクを貼っておこうと思う。

簡単な個人のサイトなら、まずはというか、立ち上げ時期くらいなら、上のセクション名を使えば、各セクションの名前はほぼ、ことたりるのではないだろうか。「HTMLクイックリファレンス」のここ(HTML5のページ)に出ているので、私のようなレベル、つまりウェブサイトのアップロードの手順くらいはわかっていても、初心者のレベルから中級者のレベルになかなか進めない人は見てみてもいいだろう。

ウェブサイトのトップページということに限定するなら、作りにもよるけど、プライベートなウェブサイトのようなもので、最低限のシンプルな構成でよし、とするなら

・ヘッダ(header)
・ナビゲータ(nav)
・セクション(section)
・アーティクル(article)
・アサイド(aside)
・フッタ(footer)
・アドレス(address)

くらいで、最初のうちはいいのではないだろうか。具体例があったほうがわかりやすいだろうから、自分のサイトなどを何かを例に挙げながら、そのうち、この続きを書いてみようと思う。
 
 

 
 
 

カテゴリー: book, html5, noncategory, programming | コメントは受け付けていません。

AIは人間を目指すのか、人間を超えるのか

 
 清水亮さんのブログを読んでいて考えたのが、「AIは人間をめざすのか、人間を超えるのか」ということ。

 最近、AI(人工知能)が話題になっていることを私も感じている。AI(人工知能)が人間を超えるシンギュラリティは、2045年に起こるともいわれている。

 では、このときの人間を超えるとはどういうことか。いや、その前に超えるためには、どこまでも近づかないといけないだろう。マラソンだって、前を走っている選手を追い越そうと思ったら、まずはその選手に追いつかないといけない。

 そもそも、人間とは超えなければいけないものなのか、という気もする。人間は不完全だし、物忘れもするし、うっかりミスもするし、年をとると体力や気力、記憶力などが衰える(人が多い)。

 では、まず人間的なAI(人工知能)をめざすには、そのような「年をとると衰える」機能を盛り込むのか。その必要があるのか。そうしたほうが、たしかに「人間的」なのかもしれない。

 だとすれば、人間に近づくとはミスをしたり、忘れたり、うっかりしたりすることなのだろうか。そういったことが(自然に)できるようになったAI(人工知能)があったとしたら、人は「人間らしいAI(人工知能)だな」と言うのだろうか。仮に言ったとしても、それはホメ言葉なのだろうか。「ダメなAI(人工知能)」というレッテルを貼られるようなものなのか。

「人間を超える」ことを目指すとしても、では、その場合の「人間の定義」は何か、どういった存在で、どういったことができて、どういったことができないのを人間というのか。

 そのようなことから考えないといけないのではないか。もちろん、そのようなことを考えてAI(人工知能)の開発に取り組んでいる研究者やプログラマーなどもいるのだろう。まずは、そういったことを調べてみる必要がありそうだ。

 そして、まだ調べたわけでもないが、人間を超えるとは、もしかしたら究極的には神に近づくということなのか。仮にすだとすると、深層学習(ディープラーニング)によって進化し続けたAI(人口知能)とは、新しい神のことなのか。New God

 いや、そうとは思えないし(今のところ)、私の考えはどこかで間違っているのかもしれない。こう書いていたら、深層学習(ディープラーニング)によって、AI(人口知能)はどこを目指すのか、大いに気になってきた。

 ボブ・ディランの名曲「風に吹かれて(Blowin’ in the Wind)」ではないけれど、答えは風の中なのか。

 その答えを、AI(人口知能)に聞いてみるべきなのか。
 
 
 

カテゴリー: noncategory, thinking | コメントは受け付けていません。

ヒアリにヒヤリ

 
 ヒアリにヒヤリ。なんて、だじゃれを言ってる場合ではない。南米原産のアリ「ヒアリ」が、神戸港のコンテナヤード(コンテナの受け渡し、集積、保管をする場所)のアスファルト舗装にできた亀裂で、約100匹見つかった。ヒアリは猛毒で持った針で何度も刺すほど攻撃的で、人が刺されると死に至ることもあるという。

カテゴリー: noncategory | コメントは受け付けていません。

走ることでより健康に

 
 午前中、血液検査の結果を聞き、医師からジョギングをすすめられ、3kmほどだがひさしぶりに走った。それ以外は問題ないということだったので、ときどき、時間をつくって走ろうと思う。医師いわく、「走れるときに30分から1時間。距離やタイム、スピードなどを特に気にしなくてもけっこうですが、少し息が上がるくらいの走り方で」とのことだった。ジョギングの体重、67.6kg。BMI指数22を理想とすれば、目指すは、59.1kgとなる。
 
 
 

カテゴリー: noncategory, sports | コメントは受け付けていません。

イライラよ、さようなら

 
 イライラすることがあって、早朝からナチュラルローソンへ。マウンテンバイクを漕ぎ、隅田川を眺めるうちに、かなりイライラは解消された。人間というのは単純なものだ。いや、私が単純なだけか。
 ローソンのマチカフェ・コーヒーを飲みながら、トブラローネ ミルクを食べる。Audibleで石田衣良さんの「フォーティ」を聴く。
 かなり面白く、次へ次へ、と気になるが、あまりのんびりしてはいられない。パソコンを開いて、仕事を進めることにする。
 

 
 

カテゴリー: book, noncategory | コメントは受け付けていません。

WordPressブログの写真サイズ変更

 
 前回の投稿から、写真のサイズを変えてみた。というのも、前々からもうちょっと画像を大きく表示したいと思っていたのだが、方法が分からなかったのである。
 いや、その方法について考えていなかった、というべきか。
 
 で、今回やってみたのが、単純に画像のサイズを、HTMLソース上で大きくする方法。僕が使っているワードプレスのブログではもともと、

 width-“300” “heght=”225”

となっているのだが、それがこちら(下記)。

 
 で、もう少し大きくしたい、1行の文章の左右幅に画像の幅をできるだけ合わせたいと思い、そうするために、「投稿の編集」のページを見て、画像サイズをそれぞれ1.8倍の

 width-“480” “heght=”405”

にしてみた。つまり、
幅300px(ピクセル)から420pxへ、高さ225pxから405pxへ拡大、というわけだ。

 で、その1.8倍拡大した画像がこちら(下記)。
 

 
 WordPressの画像サイズについて、一度アップしたブログの画像(写真やイラストなど)を後から変更することもできるので、興味のある人はやってみてはいかがですか。
 
 
 

カテゴリー: illustration, noncategory, photo, sketch | コメントは受け付けていません。