記事総覧

検証・共謀罪

組織的犯罪処罰法

2017年6月15日、国会(参議院)で「組織的な犯罪の処罰及び犯罪収益の規制等に関する法律等の一部を改正する法律」(以下、「改正法」)が可決されました。すでに衆議院を通過しているので、この法案は成立し、「組織的な犯罪の処罰及び犯罪収益の規制等に関する法律」(以下、「組織的犯罪処罰法」)が改正されることになります。

組織的犯罪処罰法は、2000年に施行された法律で、2006年と2007年に部分改正がされています。その目的は、第1条で以下のように定義されています。

この法律は、組織的な犯罪が平穏かつ健全な社会生活を著しく害し、及び犯罪による収益がこの種の犯罪を助長するとともに、これを用いた事業活動への干渉が健全な経済活動に重大な悪影響を与えることにかんがみ、組織的に行われた殺人等の行為に対する処罰を強化し、犯罪による収益の隠匿及び収受並びにこれを用いた法人等の事業経営の支配を目的とする行為を処罰するとともに、犯罪による収益に係る没収及び追徴の特例等について定めることを目的とする。

すなわち、「暴力団やテロ組織といった団体が、組織的に行う殺人などの犯罪行為や、それを利用した勢力拡大、そして経済活動を処罰する」法律ということです。この法律に、「共謀罪」を追加しようとしたものが、今回の改正です。

「検証・共謀罪」の続きを読む→

CSS グリッドレイアウト

はじめに

いわゆるCSS3のグリッド レイアウト(CSS Grid Layout Module Level 1)に、Firefox 52が対応しました。Internet Explorer 11とMicrosoft Edgeはベンダー接頭辞付きの旧仕様で対応済みなので、これらのブラウザーでグリッドレイアウトが利用できます。また、仕様も2017年2月9日付で、W3C勧告候補まで昇格していました。

このスタイルシートは、IE10の頃には使えるようになっていたのですが、その他のブラウザーが今日まで対応せず、利用機会が限定されていました。インターネットで「グリッド レイアウト」を検索しても、デザイン技法としての「グリッド レイアウト」を無理やりWebページ上で実現させるような話題ばかりで、「CSS グリッド レイアウト」を解説したものは皆無に近いといえる状態でした。しかし、とりあえず3種類のブラウザーが対応するようになったことで、このスタイルの可能性も広がるかもしれません。

「CSS グリッドレイアウト」の続きを読む→

HTML 5.1

HTML 5.1の仕様が、2016年11月1日付で「W3C勧告」として確定しました。

5.1は、HTML 5の改定版ですが、画像関連ではimg要素のsrcset属性やsizes属性、picture要素が、フォーム関連ではdetails要素、summary要素、menu要素、menuitem要素等が追加されています。

なお、更なる改訂版のHTML 5.2が、既に作業草案として策定が始まっています。

サイト構成の変更

サーバーの移転

先月末に、krzm.jpを設置しているサーバーを変更しました。なぜかというに、元のレンタル・サーバーで使っていたサービス・プランが年内には廃止となり、個人向けのサービスが提供されなくなってしまうためです。

従来は、Windowsサーバー+IISの環境だったのですが、新しいサーバーはよくあるUNIX系+Apacheとなり、その点が残念だったのですが、まあ、これも勉強だということで、乗り換えてみました。

また、昨今はgoogle社が検索インデックスのランク付けにSSLの有無を判断材料にしているということで、SSL化が大盛況のようですが、そうした流れの中でSSLでのサイト運用経験を得ておくことも、またひとつの勉強と考えて、これを導入することとしました。もちろん、独占企業たるgoogleの意向に、手足を縛られるつもりはありません。

よって、当サイトの絶対URLアドレスは、以下のとおりになります。

  • https://krzm.jp/

結果として、思った以上にWordPressの再構築に手間取ってしまいましたが、いちおう、サイトとして通常どおりに動作するようになりました。当サイトに限って言えば、SSL化の恩恵は、WordPress管理画面へのアクセスや、ファイルのアップロードにおいて、それなりに通信が保護されるようになったことにあります。

一般ページの閲覧に関しては、特に送信フォームが設置されているわけでもないので、元々保護が必要とされるほどの通信は、当サイトにはありません。SSLによって通信に負荷がかかるものでもない、というぐらいの“メリット”が、あるといえばある程度でしょう。

まあ、googleのブラウザーでは、非SSL通信の場合、アドレス欄に「注意マーク」が表示され、まるで注意が必要なサイトであるかのようなレッテル貼りがなされるのですが、それを回避できることも、(まさにgoogleに誘導された)メリットとして挙げられます。

Chromeアドレス欄のマーク
左がhttp(非SSL)、右がhttps(SSL)通信の場合のマーク。SSLがWeb標準として提供されているわけでもない中、googleの商業プロパガンダともいえるだろう

「サイト構成の変更」の続きを読む→

フレキシブルボックス レイアウト 完全解説

基本概念

フレキシブルボックス レイアウトは、W3Cの仕様書「CSS Flexible Box Layout Module Level 1, W3C Candidate Recommendation, 1 March 2016」によって定義されている。従来、floatプロパティ等によって裏技的に行われてきた、段落ボックスを横並びにするといった配置を行うためのスタイルである。その名称どおり、単なる横並びだけでなく、より柔軟に配置を行う手段が用意されている。

仕様書では、以下のとおり、その概要が述べられている。

Flex layout is superficially similar to block layout. It lacks many of the more complex text- or document-centric properties that can be used in block layout, such as floats and columns. In return it gains simple and powerful tools for distributing space and aligning content in ways that web apps and complex web pages often need. The contents of a flex container:

  • can be laid out in any flow direction (leftwards, rightwards, downwards, or even upwards!)
  • can have their display order ‘reversed’ or rearranged at the style layer (i.e., visual order can be independent of source and speech order)
  • can be laid out linearly along a single (main) axis or wrapped into multiple lines along a secondary (cross) axis
  • can “flex” their sizes to respond to the available space
  • can be aligned with respect to their container or each other on the secondary (cross)
  • can be dynamically collapsed or uncollapsed along the main axis while preserving the container’s cross size

構造

フレキシブルボックス レイアウトの構造は、以下の図のごとく定義されている。

図1a

フレキシブルボックス レイアウトを実現する領域を表す要素をフレックス コンテナ、その領域内で実際に配置される要素をフレックス アイテムと呼ぶ。

フレックス アイテム(以下、アイテム)が配置される方向を軸(axis)と呼び、当該言語の文字と行の送りに応じて、文字送りが主軸(main axis)、行送りが交差軸(cross axis)と定義される。日本語横組みのテキスト、すなわち文字が左から右へ、行が上から下へ送られる場合、水平方向が主軸、垂直方向が交差軸となる。一方、日本語縦組みテキストでは主軸が垂直方向、交差軸が水平方向となる。

これらの軸の方向を表すものとして、始点と終点が定義される。日本語横組みテキストの場合、左端が主始点(main start)、右端が主終点(main end)、上端が交差始点(cross start)、下端が交差終点(cross end)である。startとendという概念は、関連プロパティの値に反映されている。

また、主軸方向の”幅”を主サイズ(main size)、交差軸方向の”高さ”を交差サイズ(cross size)と呼ぶ。すなわち、フレックス コンテナ(以下、コンテナ)の幅と高さということである。当然、縦組みテキストにおいては、主サイズが高さ、交差サイズが幅となるのは、自明の理であろう。

コンテナの定義

任意の要素をコンテナとして定義するには、displayプロパティを使用する。この値をflexもしくはinline-flexにすることで、当該要素はコンテナとなる。

  • 例1 display: flex;
  • 例2 display: inline-flex;

displayプロパティそのものは、CSS Level 2以前の太古の昔から存在するが、その値がCSS Flexible Box Layout Module Level 1モジュールにおいて拡張されたことになる。

コンテナとなる要素の態様に目を向けてみるならば、値がflexの場合、当該要素はブロックレベル表示で扱われる。故に、display: blockの場合と同じように、元来インライン表示のa要素に適用し、コンテナ要素自体に幅や高さを指定することが可能になる。

同様に、値がinline-flexの場合はdisplay: inline-blockと同等であり、幅や高さが指定できる段落内文字列としてコンテナ要素が扱われる。

そのうえで、コンテナ要素の直接の子要素に対し、フレキシブルボックスによる配置が適用されるようになる。なお、コンテナの要素内容がテキストだった場合でも、その文字列全体をひとつのアイテムとして、配置が適用される。

ただし、アイテムが要素ではなく文字列のみの場合は、アイテム側専用のプロパティを、要素内容(文字列)に対して使用することはできない。

「フレキシブルボックス レイアウト 完全解説」の続きを読む→

価値創造を巡る三つの視点

効用(限界効用説)

唐突ですが、経済生活における「物」の価値は、何によって決まるのでしょうか? また、その価値を生み出しているのは、誰なのでしょうか? 初めに、いわゆる「効用」という観点から、これらを考察していきます。

付加された価値

一般に、何らかの商品が、競合商品よりも売れるようにするためには、「付加価値」が必要だと言われます。もしくは、「付加価値」があるからこそ、その商品は他のものよりも売れるとされます。そして、商品開発とは、付加価値を創造することだとされています。

価値の有用性としての効用

付加価値を持つものは、そうでないものよりも多くの有用性があり、人々はその有用性を求めて商品を購入します。もちろん、有用性とは購入者にとって得になるものであり、その効用に対する期待度が、購入動機となります。そして、購入者は効用に対価を支払うことになるので、効用の有無や大小が、経済生活の価値を体現することになります。

また、今日の産業構造において、効用は“物”(=財)に付随するだけでなく、様々なサービスにも含有されています。実際、工業化以降の社会では、サービス業や情報通信業によって、無形の効用が氾濫しているかのように見えているのではないでしょうか。そして、価値の創造者、すなわち「クリエイター」とは、有形よりは無形の付加価値を、より多く生み出せる人々に冠せられた称号だと言えます。

効用による価値表現

高付加価値な商品は、より多くの利益を生む出す可能性がありますが、一方で、世の中には低い価値の商品もたくさん販売されています。例えば、1杯数千円のラーメンが高級店で供される一方で、100円未満のカップ麺をスーパーで買うことができます。

こうした価値の偏差の存在も、効用が説明しようとします。すなわち、ある人が高級ラーメンからは「自分へのご褒美」といったような一過性の効用を得て満足することもあれば、日々の生活レベルに収まる範囲で「毎日ラーメンが食べたい」という効用を得るため、低価格カップ麺も買うといった具合です。そうした効用に適合するのであれば、高額商品も廉価商品も、価値を生むという理屈です。

もちろん、人類全般の社会格差に応じて、金持ちはあらゆるレベルの効用が獲得可能であり、貧乏人は廉価な大量生産品で充足可能な効用が与えられ、経済生活の秩序が成り立っていると捉えることもできるでしょう。

心理現象としての効用

しかし、効用によって説明された「価値」は、実のところ、その配分を説明しているだけであって、それがどのように生み出されているかについては答えてはいません。他の商品に対し、当該商品には付加価値があるという表現は、価値の大きさを比較しているのであって、価値の量について語っているに過ぎません。

では、商品の有用性が価値なのでしょうか? 確かに、物の有用性は、それに対する期待や幻想を含めて、当該商品に人を惹き寄せる要因です。しかし、それは人の心の中で、人それぞれに異なる強さを持って生じる、心理的な現象です。

そうした心の領域に生じるものが、なぜ、商品価格を携えて、市場に現れるのでしょうか? その、物質的な基礎もしくは裏付けは、いったい何なのでしょうか? すなわち、「効用に価値がある」と言っているだけでは、価値そのものが何であるかを語ってはいないのです。

「価値創造を巡る三つの視点」の続きを読む→

テーマ変更

当サイトのWordPress「テーマ」を変更しました。もちろん、既存のテーマを取り換えたのではなく、テンプレートとCSSを作り直しています。

現状では、IE9以下とiOS上でのwebkit系ブラウザーの対策(フレキシブルボックス レイアウト関連)を施していないため、IE11以上もしくは他の最新ブラウザーでの閲覧をお願いします。もちろん、Microsoft Edge(Edge HTML 14.14342)での閲覧が最適です。

CSS3各モジュールの現況(2015年8月)

CSS3モジュール一覧表

またしても半年以上、更新を怠っていた「CSS3モジュール一覧」ですが、今年は9月にCSS3の講義を行うことになったので、夏休み中に仕様の現況をチェックしてみました。すると、新しいモジュールや分類項目が結構増えていたので、一覧表を作り直すことにしました。

それに伴い、表の「状況」欄には、前バージョンの仕様書と比較した状態を記してあります。初出のものが「新規」、策定レベルが同じで更新されたものが「改訂」、策定レベルが変更されたものが「昇格」もしくは「降格」です。また、作業草案段階の「Level 1」と「Level 4」は、いわゆる「Level 3」とは分けてあります。

「CSS3各モジュールの現況(2015年8月)」の続きを読む→

アラブ・ユダヤ問題の歴史的背景

「アラブ・ユダヤ問題の歴史的背景」の続きを読む→

CSSモジュール一覧更新(2014年11月)

前回の2014年3月20日以来、ずっと確認を怠ってきたのですが、例年のCSS3講義が近づいてきたので、8か月ぶりにCSSモジュールの更新状況をチェックしてみました。さすがに、半年以上も経過すると多くの変更点が存在するため、以下の表にまとめてみました。また、「CSS3モジュール一覧」ページの表も、更新してあります。

「CSSモジュール一覧更新(2014年11月)」の続きを読む→

HTML5の技術的考察

はじめに

2014年10月末、HTMLの最新版である「HTML5」が、遂にというか、やっとというか、正式な仕様として確定されました。HTML5に対しては、4年ぐらい前から関心を持ち、その技術を試してみる目的で、2010年10月に「音の無いアルバム」というWebサイトを制作しました。また、その制作過程で得た知識を基に、同サイトに「HTML5の技術・政治的考察」という記事も掲載しました。それから4年経ち、HTML5の仕様も部分的に改訂されながら策定が進んだため、以前の記事に加筆・修正し、2014年版として作り直してみました。それが、本記事です。

HTML5がやっと日の目を見るに至ったとはいえ、2010年と比べ現在は、せっかく政治の表舞台から掃き捨てられたと思っていた安倍晋三が首相に返り咲き、また中国・韓国を念頭に民族主義や排外主義を振りかざす連中が厚顔無恥にも闊歩する、見るも無残な時代状況に陥っていますが、当然、本記事の読者としては、そういった輩を想定してはいません。いかなる科学技術も、政治に対して中立であることはなく、何らかの形で政治を媒介するものである以上、主要にはWeb技術を扱っている本記事も、何らかの政治的傾向の下にあることは間違いありません。なんて、回りくどいことを言わずとも、本記事は左翼が書いたのだから、もしも保守や右翼が(ついでにスターリニストも)本記事を利用するなんてことがあるとしたら、そうした連中の価値観からしても、恥知らずの誹りを免れないでしょう。というわけで、民族だの国益だののくだらなさ、そして金儲けの卑劣さや恥ずかしさ(←記事本文の中では、ここにだけstrong要素を使っています)を知っている、そんな心の美しい方々に向けて、本記事は幅広く技術的門戸を開いています。

なお、演習用として利用可能なHTMLや画像ファイルは、「krzm_html5.zip」にまとめてアップロードしてあります。この記事で紹介しているコーディング内容は、krzm_html5.zip内のchapter02_test.htmもしくはcanvas.htmファイルで試すことができます。

「HTML5の技術的考察」の続きを読む→

HTML5

HTML5の仕様が、「W3C勧告」として確定しました。

HTML5
A vocabulary and associated APIs for HTML and XHTML
W3C Recommendation 28 October 2014

CorelDRAW X7 Update 2 提供開始

概要

CorelDRAW Graphics Suite X7 Update 2の提供が開始されています。現時点で、日本語版でもアプリケーション終了時にアップデートの告知とダウンロード/インストールが表示されるほか、Corel本社サイトからダウンロードすることも可能です。

前回の X7 Update 1は、VBAの拡張以外はプログラムの修正が中心でしたが、今回は新機能が追加されています。なお、このアップデートでバージョンは17.2.0.688(CONNECTは4.2.0.688)となります。

「CorelDRAW X7 Update 2 提供開始」の続きを読む→

昆虫イラスト集

カマキリ

CorelDRAW X7もしくはそれ以前のバージョンで描いた、昆虫(蜘蛛を含む)のイラスト集です。

カマキリのイラスト
CorelDRAW X7で再編集したカマキリのイラスト
カマキリ アップ
カマキリ顔面のアップ

このイラストは、元はCorelDRAW X3で作成したのですが、X7の楕円形グラデーションパターンを利用して、表面の質感を作り直してみました。

カマキリ 元画像
カマキリのイラスト 元画像

上図は、元になったイラストのSVG画像です。

「昆虫イラスト集」の続きを読む→

サーバー障害

昨晩から本日未明まで、当サイトはデータベースエラーにより、表示できない状態に陥っていました。これは、レンタルサーバーのハードウェア障害が原因で、現在は復旧していますが、データベースが特定の時点のバックアップから復元されたため、最新の記事が消えてしまいました。

当サイトは更新を(私の怠惰により)頻繁には行っていないので、無くなってしまったのは「夏休み自由研究: タブレットの表示」の1つだけです。この記事の原稿はパソコンに残っていて、またRSSとして配信した記事も受信していたので、復元は容易だったのですが、怠惰が身を救うこともあるわけですね。

とはいえ、運が悪ければ、相当数の記事もしくはすべての記事を失っていたかもしれません。当サイトはWordPressで構築しているので、投稿記事はMySQLデータベースにすべて格納されているわけですが、データベース自体のバックアップを頻繁に取っておくことも大事だと、痛感した次第です。

夏休み自由研究: タブレットの表示

はじめに

近頃は、Webサイト閲覧に使用する機器が、従来のパソコン一辺倒から、タブレットやスマートフォンへと多様化しています。私は、パソコン派なのですが、HTML/CSSを人様に教える身である以上、他の機器でもどのように表示されるか、やはり気になってきました。

用意したタブレット

もちろん、様々な意味でプライバシーを侵害する機器であるスマートフォン(や携帯電話)を持つ気にはなれないので、とりあえずはタブレットを探求してみることにしました。昨年、記念すべきMicrosoft純正ハードウェアとして登場したSurface Proを皮切りに、この夏までに計3台のタブレットを購入。以下の表が、その概要です。

「夏休み自由研究: タブレットの表示」の続きを読む→

IE11と縦組み・ルビ・組数字

概要

Microsoft社が、Internet Explorerの開発者向けに情報提供を行っている「IEBlog」によると、2014年6月のInternet Explorer 11(以下IE11)に対するアップデートで、縦組みテキストに対する改良が行われたそうです。
Vertical writing mode improvements in IE11

また、その効果を確認するデモが、IE Test Driveサイトにも設けられています。
Vertical Writing Mode Improvements

これらの情報を頼りに、私もIE11で縦組み、ルビ、そして組数字(縦中横)を実際のサンプルで試してみました。この記事内に、そのサンプルテキストを6つ掲載していますが、これらを期待どおりに表示させるには、当然ながら、2014年6月のアップデートが適用されたIE11が必要です。また、テキストにはWindows 8.1でOSに添付されるようになった、游ゴシック/游明朝フォントを使用しているので、Windows 8.1以降での閲覧を推奨します。

なお、縦組み・ルビ・組数字にFirefoxは全く対応していないので、このブラウザーでは全くお話になりません。

「IE11と縦組み・ルビ・組数字」の続きを読む→

Welcomeスクリーンのフォント変更

Welcome スクリーンのフォント表示

CorelDRAWやPHOTO-PAINTの日本語版インターフェイスでは、タイトルバーやコマンド名の表記はメイリオ(Meiryo UI)フォントで表示されるものの、ダイアログ内のテキスト等はMSゴシック(MS UI Gothic)のままでした。それが、X7では全面的にメイリオに変更され、可読性が向上しています。

しかし、X7でも唯一、(通常は)MSゴシックで表示されるインターフェイスがあります。そう、X7で大幅に改良された、「Welcome スクリーン」です。X7では、ドキュメントの表示にタブ インターフェイスが用いられるようになりましたが、「Welcome スクリーン」はそのタブの一つとして、起動時に表示されます。そして、この”ドキュメント”のテキストでは、日本語全角文字のフォントにMS Pゴシックが使用されています。

ほとんどのインターフェイスがメイリオの中で、ここだけ古臭い印象を受けるほか、半角英数字は欧文サンセリフ書体(たぶんArial)なので、やや違和感もあります。一定の文字サイズまで、MS Pゴシックはビットマップフォントで表示される点も、こうした印象を後押ししています。

「Welcomeスクリーンのフォント変更」の続きを読む→

CorelDRAW X7 Update 1提供開始

機能の拡張

Corel社より、CorelDRAW Graphics Suite X7 Update 1の提供が開始されました。
Update 1で拡張された機能は、以下の3点です。

  1. ウインドウの枠色変更
  2. ステータスバーの上部表示
  3. VBA オブジェクトモデルの拡張

ウインドウの枠色

X7では、アプリケーションやダイアログ ウインドウやの枠色が、白色に固定されていました。それを、「オプション」ダイアログの「カスタマイズ」-「ウィンドウの枠」カラーボックスで指定できるように変更されています。このボックスをクリックするとカラーパネルが表示され、色を選択できるほか、スポイトツールでWindowsデスクトップから色を拾ってくることも可能です。

ただし、ここで指定した色は、各ウインドウ枠に常に表示され、非アクティブ ウインドウも同じ色になります。また、設定した色は、すべての作業環境に反映されます。さらに、「オプション」ダイアログで「コントラスト」の項目を変更すると、「ウィンドウの枠」は白色に戻ってしまうので、操作順序には注意が必要です。

ステータスバーの上部表示

従来(X6まで)、CorelDRAWやPHOTO-PAINTでは、ステータスバーをアプリケーション ウインドウの下辺だけでなく、上辺にも表示させることが可能でした。X7では、そのオプションが無くなっていたのですが、Update 1で復活したということです。

具体的には、ステータスバーを右クリック→コンテキストメニューの「カスタマイズ」-「ステータスバー」に「位置」項目が復活し、「上端」もしくは「下端」が選択できるようになっています。

VBA オブジェクトモデルの拡張

これは、VBAを利用したCorelDRAWのアドオンプログラムの作成をより容易にするため、新しいAPIセットを追加したというものです。


以上のように、今回のアップデートでの本質的な機能拡張はVBA関連で、他の2つはオマケのようなものです。私自身には、VBAプログラミングを行う技量は無いので、今回のアップデートはウインドウ枠の色を変えて楽しむ程度のものでした。なお、プレミアムメンバーシップの特典である「新機能の早期追加」は、今年後半に予定されているUpdate 2で行われることになります。

「CorelDRAW X7 Update 1提供開始」の続きを読む→

Internet Explorerの脆弱性騒動

はじめに

4月26日、Microsoftのインターネット閲覧ソフト、Internet Explorer(IE)の事実上すべてのバージョンである6~11に、脆弱性(いわゆる欠陥)があることが発表されました。その時点では、修正プログラムはまだ用意されず、一方でこの脆弱性を悪用した、いわゆるゼロディ攻撃が既に見つかっていることも報告されていました(なお、5月2日に修正プログラムの提供は始まっています)。

異様な騒動と結論の中で

その2日後、アメリカの国土安全保障省がIEの使用停止と他のブラウザーへの切り替えを警告し、すると、日米同盟がお題目の日本政府も、それに追従する形で4月30日に政府機関や地方自治体に対し、同様の警告や注意喚起を行いました。こうした政府機関からの警告により、企業等でも対策、というより波紋や混乱が広がったようです。 「Internet Explorerの脆弱性騒動」の続きを読む→

いわゆる「所謂」

語彙としての「所謂」

所謂
読み: いわゆる
意味: よくいわれる世間一般で言われる俗に言う、ところの何かを表すために前に置く、いわゆる「連体」

「いわゆる「所謂」」の続きを読む→

  1. 検証・共謀罪
  2. CSS グリッドレイアウト
  3. HTML 5.1
  4. サイト構成の変更
  5. フレキシブルボックス レイアウト 完全解説
  6. 価値創造を巡る三つの視点
  7. テーマ変更
  8. CSS3各モジュールの現況(2015年8月)
  9. アラブ・ユダヤ問題の歴史的背景
  10. CSSモジュール一覧更新(2014年11月)
  11. HTML5の技術的考察
  12. HTML5
  13. CorelDRAW X7 Update 2 提供開始
  14. 昆虫イラスト集
  15. サーバー障害
  16. 夏休み自由研究: タブレットの表示
  17. IE11と縦組み・ルビ・組数字
  18. Welcomeスクリーンのフォント変更
  19. CorelDRAW X7 Update 1提供開始
  20. Internet Explorerの脆弱性騒動
  21. いわゆる「所謂」

krzm.jp:not(so-called mobile friendly)