Webに関する用語集
Webとは
=World Wide Web ワールド・ワイド・ウェブ
=世界的に広がる蜘蛛の巣
英語で蜘蛛巣状のもの、の意味。
wwwはCERN(欧州原子核研究機構)により
1989年に開発され、1991年にデビュー
HTMLとは
=HyperText Markup Language
ハイパーテキストマークアップランゲージ
プログラミング言語
文書や画像、見栄、体裁を記述することができる
UIとは
= User Interface ユーザインターフェイス
ユーザー(利用者)と製品やサービスとのインターフェース(接点)すべてのこと
サイトの見た目や、使いやすさのこと
PCやスマホなどの表示、操作などの仕組み
「使いやすさ」や「使い勝手」「見やすさ」などが求められる。
UXとは
=User Experience ユーザーエクスペリエンス
ユーザーが製品やサービスを通じて得られる体験
サービスを利用するユーザーが質の良い『体験(UX)』をするためには、質の高い『見た目や操作性(UI)』が必要
パンくずリストとは
Webサイトを訪れたユーザが
今どこにいるかを視覚的にわかりやすくした誘導表示。
Webページの上部箇所に表示されているケースが多い。
名前の由来
パンくずリストという語源は、
童話「ヘンゼルとグレーテル」の話の中に主人公の兄弟が
森に入るときに、迷子にならないように
自分たちが通ってきた道にパンくずを置いていったエピソードが由来となっています。
Webサイトでも同じように、
ユーザ自身の現在位置と辿ってきたルートを示す役割を担っていることから
「パンくずリスト」と呼ばれるようになりました。
ユーザビリティだけでなくSEOにおいてもその効果を期待できる。
OGPとは
=Open Graph Protcol オープングラフプロトコル
FacebookやTwitterなどのSNSでシェアした際に、
設定したWEBページのタイトルやイメージ画像、
詳細などを正しく伝えるためのhtml要素。
設定しておくと、SNS上でURLが共有された際にタイトルや画像、
説明文などが表示されるようになり、
ユーザーに対してページの内容を詳しく伝えることができる。
OGPの構成
OGPを設定するためには
以下のようなタグをサイトに埋め込む必要があります。
<head prefix=”og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# website: http://ogp.me/ns/website#”>
<meta property=”og:type” content=”ページの種類”>
<meta property=”og:url” content=”ページのURL”>
<meta property=”og:image” content=”ページの画像URL”>
<meta property=”og:title” content=”ページのタイトル”>
<meta property=”og:description” content=”ページの説明”>
<meta property=”og:locale” content=”言語の指定”>
プロトコルとは
お約束事。
「通信する上でのお約束事」を意味する
「通信プロトコル」の省略表現。
コンピュータでデータをやりとりするために定められた
手順や規約、信号の電気的規則、通信における送受信の手順
などを定めた規格。
異なるメーカーのソフトウエアやハードウエア同士でも、
共通のプロトコルに従うことによって、正しい通信が可能になります。
サーバーとは
サーバーとはインターネットなどのネットワークを通じて
利用者にサービスを提供するコンピュータのこと。
サーバーとは、英語で書くと「Server」となり
「サービス(Service)を提供する側」
ドメインとは
ドメインはインターネット上の住所。Domain。
DNSとは
Domain Name System ドメイン ネーム システム
インターネット上で ドメイン名 を管理・運用するために開発されたシステム。
IPアドレスを教える役割を果たしています。
「192.41.192.129」といった数字をピリオドでつないだIPアドレスで
通信相手を特定しているが、
数字の羅列は人間が識別するのは非常に困難であるため、
人間が覚えやすいように「nic.ad.jp」といった文字列からなる
ドメイン名を利用し、 変換していること。
IPアドレスとは
Internet Protcol Adress インターネットプロトコルアドレス
インターネットの約束事の住所。「192.41.192.129」といった数字。
このドメイン名とIPアドレスを対応づけるしくみがDomain Name System (DNS)であり、 「インターネットの住所録」にあたります。
meta descriptionとは
メタディスクリプションとは、
記事内容を100文字程度のテキストで表現した「概要」のこと。
検索結果画面に表示され、クリック率に影響する。
Retina対応とは
Retina Displayは、Apple製品のうち、
100〜160ppi程度であった従来のディスプレイ解像度の、
およそ倍の解像度、高画素密度のディスプレイを指す名称。
「Retina」(レティナ)は英語で「網膜」
ということから命名された。
それまでの他のディスプレイでは画像などを
等倍(ドットバイドット)で表現していましたが、
Retinaディスプレイでは例えば
4つのピクセルで1つのドットを表現する
といったスケーリングという技術を使用することで
高精細ディスプレイを実現しています
1枚高解像度の写真を使えばいいじゃんと思うかもしれませんが、
Windowsユーザーがまだまだ多い世の中、
Windowsで見ても違いが分からないのに、
わざわざ2倍の重い画像を読み込ませるのは不親切です。
Webデザイナーがやること
▼SPデザイン
優先する機種が会社によって違いますが、最優先機種の横幅×2倍でデザインすれば問題ないと思います。
例えばiPhoneXが基準の場合、375px×2の750pxでデザインすることになります。
Gitとは
プログラミングなどを用いた現場でよく使われている「バージョン管理システム」
Gitの用語
リポジトリ=貯蔵庫
1.リモートリポジトリ
2.ローカルリポジトリ
ブランチ 枝
プル
pull
プッシュ
マージン
チェックアウト
ステージング
コミット
デベロップ=開発環境
develop
テスト環境
マスター=本番環境
master
GitHubとは
Gitの仕組みを利用して、世界中の人々が
自分の作品(プログラムコードやデザインデータなど)を保存、
公開できるようにした「ウェブサービスの名称」。
Gitのハブ(拠点・中心・集まり)
AWS とは
AW=Amazon Web Services アマゾン ウェブ サービス、略称:AWS
Amazon.comにより提供されているクラウドコンピューティングサービス
レンダリングとは
Rendering
コンピュータプログラムを用い、
もととなる数値データを計算し表示を行うこと
例えば、WebサイトのHTMLファイルなどをもとに、
ユーザーが閲覧できるページに表示することもレンダリングとなります。
表示用のデータをもとに、内容を整形して表示すること
マークアップとは
文書構造(テキスト)や視覚表現(装飾)などの情報を、
コンピューターが正しく認識できるように、
タイトルや見出しなどの各構成要素に「タグ」と呼ばれる識別のための目印を使い、
意味付けを行っていくことを意味します。
コンピューターに文書を理解させるために、ルールに従ったタグを記述していくこと、
これを「マークアップする」と呼びます。
コーディングとは、プログラミング言語やマークアップ言語によって
コンピューターが処理可能なソースコード(プログラム)を入力していく作業。
モバイルフレンドリーテストとは
Googleが提供するツール。モバイルに対応しているサイトかチェックしてくれる。
誰でも無料で確認することができる。
テストしたいページのURL全体を入力するだけ。
通常、テストは1分もかからずに行われます。
テスト実施後は2つの結果が表示されます。
1つは、ページがモバイル端末でどのように表示されているのかを示すスクリーンショットで、
もう1つはモバイルフレンドリーに対応していない箇所の一覧です。
サイトがすでにモバイル対応していて問題がない場合は、
緑色の文字で「このページはモバイルフレンドリーです」と表示されます。
rel=”prev”と”next”とは
複数のページ間の関係をGoogleに正しく伝えるためのタグ。
2011年12月2日にGoogleのウェブマスター向け公式ブログにて発表されたもので、
ページネーションされたコンテンツに対してページ間の関係を正しく伝える
という意味を持ちます。
タップでコールとは
スマートフォンの画面に表示された電話番号にあらかじめリンクがつけられ、電話番号をタップするだけで自動的に電話をかけられる機能のこと。