制作のおさらい

動かす際によく使用されている言語

2018-11-20

Java Script

jQuery
ParticleJS
Pixi.js
three.js
CreateJS

【パララックス効果】
・Skrollr
・FadeThis
・ScrollMe
・ScrollReveal.js
・wow.js

CSS

transform
transition
animation

HTML5

Canvas

SVG

WebGL

3D表現
例:java+canvas+WebGL

CSSについて

CSSトランジション

再生時間とタイミング程度の設定(transitionプロパティを使う)
主にロールオーバー効果(クリックすると何かが起きる)

CSSアニメーション

いつ何をどう変化させるか、という情報(キーフレーム)ををまとめた進行表のようなものを作る
例:開始0% 終了100%

検索結果について

2018-11-20

検索結果は人によって違う。人それぞれ。

仮に、希望するキーワードで検索結果が1位でも、アクセス数が伸びるわけではない。
そのためキーワードは幅広く狙うのが基本になってきている。

パーソナライズ検索
ユーザーの興味や関心があることに合わせて検索結果をGoogleがカスタマイズしている。

シークレットモードで検索してみよう

パーソナライズされてない状態で検索してみる。

IE Control+Shift+P
Google chorome Control+Shift+N
Fire Fox Control+Shift+P
opera Control+Shift+N
Mac ControlをCommandにする

多くの人がそれぞれパーソナライズされた検索結果を見ていると考えられます。
そうなりますと、どれくらいの人が本当の順位を見ているのでしょうか?

実際のところ、狙うキーワードで順位を意識していればいいという時代はかなり前に終わっているといわれています。

なので、キーワードは幅広く狙って、キーワードを盛り込んだ積み重ねの記事、とどのつまりコンテンツ作成が大切です。

①WEB基礎知識

2018-11-12

Linux

コンピューターのOSはMacかWindows
サーバーコンピューターOS(基本ソフト)はオープンソースで開発された無料のLinux

サーバーを構築するにはLinuxOS上に必要なソフトをウエアをインストールする。
・ページを表示するための「Webサーバー」代表的なものは「Apache」
・データを管理するための「データベース」
・それらをコントロールするための「言語」
・メールサーバー

一般的にはこのような「Linux」にいろいろなものがインストールされた状態を一言で「サーバー」と呼んでいます。
「Apache」はクライアント(URL)からリクエストが来た時に、それにしたがってwebページを返す(表示する)のが仕事です。
このURLに書かれた文字列こそがApacheに対する命令になっているのだと覚えておく。

ブラウザとレンダリングエンジン

レンダリングエンジンによって、HTMLやCSSの解釈が異なる部分があるため、表示の結果が少しずつ異なる。
・Microsoft Internet Explorer→Trident
・Fire Fox →Gecko→ Servo?
・Google Chrome →Blink(基本的にwebkitに似た動き)→Webkit
・Safari →Webkit
・Opera →Blink→Webkit
IE10より
・Edge

http://www

【html】はプロコトル(規格)
  これはwebブラウザがHTTPというプロコトルに従って通信していることを示しています。
【www】はworld wide web
【FTP】はFile Transfer Protocol
【SMTP】はSimple Mail Transfer Protocol

HTML

webブラウザに対する指示
HTML・・・大文字・小文字問わない。 「P H1」
XHTML・・・小文字で記述することが定義されている。「p h1」

緩いルールのまま改定を重ねたHTML。もう一度ルールをしっかり定め直そうという動きによって策定されたのがXHTML
突然厳しいルールで作り変えるのは難しいと、利用されないのを予想して、段階をふむために3つの種類が準備された
・strict/ルールに忠実に
・Transition/HTMLの緩いルールが残った状態でもOK
・Frameset/XHTMLでは廃止された「フレーム」という要素を利用する

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

HTML5

HTML5はHTML4の後継バージョンであるため、タグの記述ルールなどは幻覚ではない。
たとえば、閉じタグを省略したり、単独タグにスラッシュが不要だったりなど、XHTMLで定義されていたルールは撤廃されている。

しかし、HTML5であってもXHTMLで定められたルールに沿って記述することが好ましい。

これを「XHTMLに準拠したHTML5」or「XHTML5」とよばれることもある。

②HTMLファイル記述の順番

2018-11-13

head内

※タイトルの前に文字コード設定
・CSSの↓にjavascript
 CSSもjavascriptも、後に書いた方が上書きするカタチになる。

①meta要素(文字コードの設定のみ)
②title
③meta要素
④link要素
⑤rel属性
・stylesheet
・shortcut icon
・canonical
・alternate
などなど
⑥script要素
⑦style要素
⑧object
➈その他

<!DOCTYPE html>
<html lang="ja">
<head>
<meta chareset="UTF=8">
<title>~</title>
<linl rel="stylesheet・・・>
</head>
<body>
</body>
</html>

« Older Entries Newer Entries »

PAGE TOP