Monthly Archives: August 2017

Update!

Apple: iPhone 発表・発売スケジュール一覧(2017年度版)

新しい iPhone の発表まで1ヶ月を切りましたので、これまでの iPhone 発表、発売スケジュールを一覧にしました。 iPhone の発表・発売日を予想するためにご活用ください。 目次 iPhone 発表・発売スケジュール一覧 まとめ iPhone 発表・発売スケジュール一覧 日時は米国時間、初代 iPhone は日本で未発売、iPhone 3G は予約なしのため、iPhone 3GS からの一覧となります。 年度 機種 告知 発表 予約開始 発売 2009 iPhone 3GS 3/26(木) 6/9(火) 6/23(火) 6/26(金) 2010 iPhone 4 4/28(水) 6/7(月) 6/15(火) 6/24(木) 2011 iPhone 4S 9/27(火) 10/5(水) 10/7(金) 10/14(金) 2012 iPhone 5 9/5(水) 9/12(水) 9/14(金) 9/21(金) 2013 iPhone 5s/5c 9/4(水) 9/10(火) 9/13(金) 9/20(金) 2014 iPhone 6/Plus 8/29(金) 9/9(火) 9/12(金) 9/19(金) 2015 iPhone 6s 8/28(金) 9/9(火) 9/12(土) 9/25(金) 2016 iPhone SE 3/11(金) 3/21(火) 3/24(木) 3/31(金) 2016 iPhone 7 8/30(月) 9/7(木) 9/9(金) 9/16(金) 2017 iPhone 8 8/31(木) 9/12(火) 9/15(金) 9/22(金) 2017 iPhone X 8/31(木) 9/12(火) 10/27(金) 11/3(金) 発表日は週初〜半ば頃、予約開始は発表日の週末金曜日、発売日は予約開始から1週間後、という傾向があることがわかります。 まとめ 近年、新型 iPhone の新しい機能に関する情報のコメント欄の内容の多くは次のようなものです。 ・新機能はいいから安く or 高いので買わない ・バッテリーの容量を増やして欲しい ・Android に乗り変えました… こういったコメントは特に日本国内において顕著ですが、情報の内容に則したディベートが行える、情報リテラシーのあるユーザーが増えれば、iPhone 発表の場は楽しくなるのではないでしょうか。 ちなみに来月発表予定の iPhone は、高価にもかかわらず、かなり売れ年内は品薄続きになると思っています。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。

CSS3: クラス・id 名に特定文字列を含む要素を指定する方法

CSS クラス・id 名に規則性があれば正規表現を利用し、特定文字列を対象としたスタイル指定が有効です。 今回は、クラス・id 名に 特定の文字が含まれる要素を指定 する記述方法を説明したいと思います。 目次 クラス・id 名に特定文字列を含む要素を指定する方法 まとめ クラス・id 名に特定文字列を含む要素を指定する方法 部分一致 クラス名に 「xxx- が含まれる」 「div 要素」 の 「背景色に red」 を指定する記述は以下のようになります。 前方一致 + 部分一致 クラス名の 「先頭が xxx- で始まる」 「div 要素」 の 「背景色に red」 を指定する記述は以下のようになります。 基本的に class^= の 前方一致 により目的は「ほぼ」達成されますが、 div 要素に対し 複数クラスが定義されているケースに対応 するため class*=” xxx-“ の記述(※要先頭半角スペース+文字列)が必須となります。 まとめ クラスや関数の命名規則に関しては、開発者全員がそれなりにコストをかけてしまう部分です。 それなりに場数を踏めば、既存フレームワークが採用するパターンへと近づいていくものですので、CSS においても最適な名称でコーディングをし、できるだけ少ない行数で、意図したスタイル指定ができるよう心がけましょう。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。

HTML5: area-hidden プロパティについて

aria-hidden プロパティ とは、WAI-ARIA の仕様で定義されている、テキスト読み上げの有無を設定する値です。 主にアイコンフォントのタグに指定するケースがほとんどだと思いますが、今回はこの area-hidden プロパティ についてのメモしておきます。 目次 area-hidden プロパティについて area-hidden プロパティについて 今回説明に使用する CSS フレームワークは Bootstrap、アイコンは自家製アイコンフォントの MellowGlyph を例にとって説明したいと思います。 装飾アイコンの場合 機能に関係なく、単なる装飾であるアイコンの場合、aria-hidden=”true” を設定することで、スクリーンリーダーに対して存在しないものと認識させることができる。 表意アイコンの場合 アイコンの意匠そのものに機能的な意味が含まれる場合、aria-hidden=”true” を設定したうえで、代替テキスト を span class=”sr-only” に記述し、スクリーンリーダーに認識させます。 インタラクションアイコンの場合 アイコン自体がリンクになっていて、タッチやマウス等の入力デバイスによるインタラクションが発生する場合、aria-hidden=”true” と title プロパティ 設定したうえで、代替テキスト を span class=”sr-only” に記述し、スクリーンリーダーに認識させます。 まとめ アイコンのアクセシビリティを解決する方法として、タグを使用せずに ::before, ::after といった擬似要素で指定する方法があります。 ただし、この方法をとる場合は、定義された名前空間による直感的なコーディングが困難なため、タグで直接記述し、area-hidden プロパティ を適切に指定する方法が簡単かつ便利かと思います。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。