新人エンジニアのメモ

新人エンジニアの日々学んだことをアップしていきます。最近はQiitaも始めました。https://qiita.com/nacho0707

HTML5

【JavaScript】組み込みオブジェクト(グローバルオブジェクト)

組み込みオブジェクト(グローバルオブジェクト)とは JavaScriptであらかじめ提供されているオブジェクト JavaScriptが動作する環境であればどのような環境でも使用できる 主な組み込みオブジェクト 組み込みオブジェクト 説明 Object 全てのオブジェクトの…

新卒2年目のHTML5プロフェッショナル認定 レベル1合格体験記

はじめに HTML5プロフェッショナル認定 レベル1とは 資格の認定者は、下記のスキルと知識を持つWebプロフェッショナルであることを証明できます。 HTML5を使ってWebコンテンツを制作することができる。 ユーザー体験を考慮したWebコンテンツを設計・制作する…

【JavaScript】URLエンコード

URLエンコードとは URLに使用できない文字が含まれる場合に、使用できる文字に変換する処理のこと。 対して、URLデコードはURLエンコードされた文字を元に戻す処理のこと。 URLエンコード、URLデコードは、データをクエリ文字列としてWebサーバに送信する場…

【JavaScript】Infinity

Infinityとは すべての値より大きい値を表すJavaScript標準のグローバルオブジェクトのプロパティ なお、グローバルオブジェクトのisFinite()を使用すると有限数かどうかを取得できる。 引数がInfinity、-Infinity、NaNの場合はfalseを返す。 isFinite()の使…

【JavaScript】NaN

NaNとは 数値でない(Not a Number)ことを表すグローバルオブジェクトのプロパティ。 ※グローバルオブジェクトとは・・・JavaScriptで常にグローバルスコープ上に存在するオブジェクト 数値では表せない不正な値を表現する場合に使用される。 自分自身および…

【JavaScript】データ型(プリミティブ型とオブジェクト型)

100記事突破しました!! データ型について javaScriptのデータ型はプリミティブ型とオブジェクト型に大きく分けられる プリミティブ型とオブジェクト型の違い プリミティブ型 文字列、数値、真偽値、null、undefined、シンボルの6種類 ◎undefined 値が定義…

【APIの基礎知識】Media Source Extensions(MSE)

MSEとは HLSやMPEG DASHをサポートする技術であり、video要素などをプラグインなしでストリーミング再生可能にする あらかじめ短い時間に区切られたメディアデータを扱うため、動画の合間に広告やそのほかのコンテンツを挿入したり、コンテンツの途中から再…

【APIの基礎知識】ストリーミング技術

ストリーミング技術とは 動画コンテンツなどをダウンロードしながら再生する技術のこと Adaptive Streamingとは ネットワークの状況に応じて動画の再生品質を動的に変更することで、動画のコンテンツのスムーズな再生を可能にする仕様のこと Adaptive Stream…

【APIの基礎知識】メディア関連要素のAPI

HTML5では、JavaScriptを通じてvideo要素、audio要素のコンテンツを制御できる JavaScriptで取得できる主な情報 自動再生の設定 再生メニューの表示/非表示 現在の再生時間 音量 音声のミュート設定 再生速度の設定 メディアの長さ 繰り返し再生の設定 ネッ…

【APIの基礎知識】API

APIとは 「Application Programming Interface」の略称 インタフェースとは接続する部分という意味をもつ言葉であるため、外部のアプリケーションと連携するための機能といえる 活用する理由 APIの活用により、アプリケーションの開発の工数が減り、開発効率…

【レスポンシブWebデザイン】高解像度ディスプレイ対応

高解像度ディスプレイ対応において デバイスピクセルとCSSピクセルを意識する必要がある。 デバイスピクセルとは 端末自体が物理的にサポートするピクセルのこと CSSピクセルとは CSSにおいて理論値として解釈されるピクセルのこと 高解像度ディスプレイでは…

【レスポンシブWebデザイン】defer属性とasync属性

defer属性とasync属性とは スクリプトファイルの非同期処理取得に関する属性 script要素にdefer属性、またはasync属性を指定すると、スクリプトファイルが非同期取得され、ユーザインタフェースのパース(解析)処理が継続される。 ⋄defer属性:HTMLのパース完…

【レスポンシブWebデザイン】メディアクエリ

メディアクエリとは メディアタイプやメディア特性で構成され、使用するデバイスの条件に従ってHTMLに適用されるスタイルを切り替えるもの。 論理演算子を用いることで詳細な条件を記述できる。 ⋄論理積を表す場合はandを使用し、論理和を表す場合はカンマ(…

【レスポンシブWebデザイン】viewport

viewportとは ブラウザの表示領域を設定する機能。 meta要素のcontent属性で設定する。 viewportで設定できるプロパティ 名称 説明 設定できる値 width ビューポートの横幅 数値(pxやvwなど) device-width(画面の幅) initial-scale ビューポートの拡大値の初…

【レスポンシブWebデザイン】レスポンシブWebデザインの概要

レスポンシブWebデザインとは PCやスマートフォン双方に対応した共通のWebページを作成し、画面サイズに応じて最適化されたユーザインタフェースを表示する手法。 PCやスマートフォンなど、複数のデバイスに対応したWebサイトを構築するには、共通のWebペー…

【要素】select要素とoption要素

select要素とは セレクトボックスを作成するために使用する。 option要素とは select要素の子要素であるoption要素は選択項目を作成するために使用する。 記述例 【解説】 size属性:ブラウザに同時に表示される項目数を指定できる。 option要素の中のvalue…

【要素】input要素のtype属性

input要素とは form要素に含まれるように指定し、入力部分を定義するために使用する。 type要素とは 入力部分の種類を指定する。 type属性に指定できる主な値 属性 説明 text テキストボックスを定義 button ボタンを定義 checkbox チェックボックスを定義 r…