質問サイト「新潟大学 知恵袋」がオープンしました!

ガタログ入るなら知っておきたい!Web基礎知識講座!

こんにちは!ガタログの渡辺と申します。

突然ですがガタログがどんなことをやっているのか/やるのかご存知ですか
4月にできたばかりの団体で、活動内容があまり知られてないのでないかと思うのですよね…。

この記事を通して、ガタログがどんなことやってくのかぼんやり知っていただき、欲を言えばガタログに興味を持っていただけると嬉しいです!

この記事を書いた人
渡辺和希

新大経済
自称美少女

渡辺和希をフォローする

はじめに

冒頭の「ガタログの活動内容は何なのか」に端的に答えると、「ガタログはWeb制作サークルです」となります。

とはいえWebに疎い人からしたらまだ想像がつきにくいことでしょう。
そこで、ガタログのメンバー向けのWeb基礎知識講座を皆さんにもお見せします。

これはSlack(コミュニケーションツール。LINEのようなもの)で、500字ぐらい講座と題しまして、8回に渡って渡辺が1日1つ投稿していたものです。

500字としたのは、500字であれば1分程度で読めるだろうと考えてです

500字ぐらい講座

以下の内容は正確さよりも初学者への分かりやすさを重視して書いたものです。
より正確な情報はググってください。

第1回「UU、PV、直帰率」編

UU…「ユニークユーザー」の略です。
「何人がサイト見た??」を表す数字。
PV…「ページビュー」の略です。
「何回サイト見た??」を表す数字。
特にPVはその記事/サイトがどれくらい人気なのかを示す指標としてよく使われます。

UUの数え方は割とものによる(何分空いたら別の人ってことにする?とか)のでPVの方が指標としてメジャーな気がします。
月間3000PVあれば脱初心者、と言われてたりします。
参考としてガタログの4月の月間PV数は(内部情報につき削除)ぐらい、5月は(内部情報につき削除)ぐらいです。

例1)Aさんが記事①を読んだ。
→そのサイトのUUは1、PVは1になります。
例2)Aさんが記事①を読んだ後に記事②を読んだ。
→そのサイトのUUは1、PVは2になります。
例3)Aさんは記事①と記事②を読んだ。Bさんは記事①を読んだ。
→そのサイトのUUは2、PVは3になります。

さて、例3でAさんは記事①を読んだ後に別の記事も読みました。
一方Bさんは記事①を読んだ後にサイトの閲覧をやめてしまいました。
このBさんのように、一度サイトを開いた後に別のページを見ることなくサイトを閉じてしまう人の割合を直帰率と言います。

直帰率をできるだけ下げ、サイト内をぐるぐる回らせられるとPVを稼げて良いですね。

第2回「ペルソナ」編

マーケティングのお話。
ペルソナとはざっくり言うと「細かいターゲットの指定」です。

例えばガタログで記事を書くとして、それはきっと「新大生」を読者層として想定したものになるでしょう。
では「サークル紹介記事」を書くとしてどんな「新大生」をターゲットにしましょうか。
今回は新大生のうち「サークル情報を欲しがってる新入生」をターゲットにすることになりました。

これを層でなく個人レベルまで掘り下げた架空の人物設定がペルソナです。

例えば「新潟県内出身の自宅生の男子で電車で30分かけて通学してる。高校ではサッカー部で運動は続けたいが忙しいのは嫌だ。家族は両親と2つ年下の弟がいる。好きな食べ物はビビンバ。一週間前に実家近くのコンビニでバイトを始めた。法学部の田中太郎」として、
田中太郎くんに向けてサークル紹介記事を書きましょう、という感じです。

なんでペルソナ設定するのかとかは他の詳しい人に聞いたら良いと思います。
渡辺は普段そんなに細かくやらない(何となく新入生、ぐらい)のですが、ガタログで記事書く時はペルソナの設定もするようなので知っといたら良いですね。

第3回「RGB」編

Web制作系、デザイン系のお話。
RGBとは色の表し方の一つです。

RGBではRed(赤)Green(緑)Blue(青)の3色がどれくらいの強さなのかで色を表します。
それぞれの頭文字を取ってRGBです。

各色0~255の256段階で強さを表します。
例えばRが255でGBが0だと赤、RGが255でBが0だと黄、
3つとも0だと黒、3つとも255だと白、という感じです。

Webの世界だとこのRGBを16進数で表します
16進数では0~9の10文字に加えてアルファベットのa~fを使います。
計算してもらえれば分かりますが、16進数2桁で0~255の数字を表すことができます。
例えば16進数での「ff」は255です。

Webの世界で色を表す時、例えば黒は#000000、白は#ffffff、赤は#ff0000、という感じでシャープに続けて6桁の16進数で表すことが多いです。
最初の2桁がR、次の2桁がG、最後の2桁がBの強さを表しています。

多くの制作ツールでは視覚的に色を選択できるようになっていて直接16進数を打たなければいけないことは少ないでしょうが、覚えておいて損はないでしょう。

第4回「ファイル形式と拡張子」編

パソコン操作全般のお話。
拡張子というのはファイル名の末尾に付いていて、ファイルの形式を表しているものです。

例えばWordでレポートを書いてパソコンに保存すると「レポート.docx」という感じのファイル名で保存されます。
このドットの後ろの「docx」が拡張子で、.docxが付いてるファイルは「Word用のファイルである」ことを表しています。

代表的な拡張子としてテキストファイルの.txt、画像ファイルの.jpgや.png、文書ファイルの.pdf、音声ファイルの.wavや.mp3、動画ファイルの.mp4や.movなどなど…。

記事制作系の人は.jpgと.pngの違いぐらい、Web制作系の人は.htmlと.cssと.jsがそれぞれ何をするファイルなのかぐらい理解できていた方が良いでしょう。

ちなみにWindowsの場合、初期設定では拡張子が表示されなくなっています
エクスプローラーの左上のファイル>オプション>表示>詳細設定から「登録されている拡張子は表示しない」のチェックを外しておくと、セキュリティ的にも良いでしょう。

第5回「zipファイル」編

パソコン基礎知識関連のお話。
zipファイルというのは、フォルダを1つのファイルにまとめたものです。

パソコンを使っているとどちらも同じように表示されたり、両方ダブルクリックで開けたりするので分かりにくいですが「ファイル」と「フォルダ」は全くの別物です。
フォルダはあくまで入れ物に過ぎず、ファイルと同じようには扱うことができません。

例えばLINEで写真を送りたい場合、それが1枚であればそれを選択することでアップロードできます。
ただもしも複数枚あった場合、それらの写真が入っているフォルダを選択してもアップロードすることはできません。
そんな時にその「フォルダ」をzipという1つの「ファイル」にまとめることで、扱えるようにします。

zipにまとめることを「圧縮」、反対にzipからフォルダに戻すことを「解凍」や「展開」と言います。
ちなみに「圧縮」という言葉の通りファイルサイズを小さくする効果もありますが、圧縮が目的であれば他にもっと圧縮率の高い形式があるので、zipを使う時は「複数ファイルを1つにまとめる」という目的がメインの事が多いように思います。

Windowsの標準機能でもzipの圧縮/解凍はできますが、専用ソフトを使った方が良いと思います。
渡辺はLhaplusというフリーソフトを使っています。

第6回「サーバー、ドメイン、IPアドレス、DNS」編

Webサイトのお話。

サーバーというのは、ファイルの置き場所です。
ここに色々なファイルを置くことで、世界中の人がインターネット経由でサイトを見ることができます。

ガタログでは(内部情報につき削除)というレンタルサーバーにファイルを置くことで色んな人が見れるようにしています。
レンタルサーバーを借りることで自分でサーバーを用意しなくてもサイトをネットで公開できます。

場所が用意できても、その場所がどこにあるのか分からないとアクセスできません。
サーバーの位置はIPアドレスというもので表されています
ガタログのサーバーは「183.181.79.132」という位置にあります。

ただこの数字の羅列だと分かりにくいですね。
なので「gatalog-niigata.com」にアクセスすると見れるようになっています。
この「gatalog-niigata.com」をドメインと呼びます。
「gatalog-niigata.com」と「183.181.79.132」を紐付ける仕組みをDNSと呼びます。

ドメインは基本早いもの勝ちで取れます。
「.com」や「.jp」など、ドットの後ろの部分は決められてる文字しか使えませんが、その前の部分は好きな文字列を指定できます。

第7回「SEO」編

記事制作系のお話。
SEOは「Search Engine Optimization(検索エンジン最適化)」の略です。

例えばGoogleで「新潟大学」と検索した時にガタログのサイトが出てきたら嬉しいですよね。
検索した時にサイトが上の方に表示されるようにすること」をSEO(SEO対策)と言います。

検索サイトにはGoogleの他にYahoo!やBingなんかがありますが、Yahooは内部でGoogleの検索技術を使っているので、実質国内で9割以上のシェアを持っているGoogle対策です。

SEO対策の手段は色々あります。
被リンク数を増やそうとか、ページ表示速度を速めようとか、画像のalt属性は設定しようとか、各ページに適したDescriptionを設定しようとか、サイト構造を整えておこうとか…。

一方で最近の検索エンジンは優秀になっているから、そんな小細工は通用しない、しっかりした内容を作ることに注力すべきだ、みたいな意見もあります。

現在ガタログへの流入はTwitter経由がほとんど(アナリティクスの見方がよく分からなくて自信ないです)ですが、今後コンテンツが増えてきたら過去記事へは検索から入ってきてもらえたら良いかもですね。

第8回「プログラミングそんな難しくないよ」編

今までよりだいぶフワフワした話。
プログラミング的なものに触れたことがない方、プログラミングってなんか難しそうじゃないですか?

今回カレー作りに例えさせてもらいます。
カレー作るの、色んな種類のスパイス混ぜたりして大変そうですよね。何なら米を育てるところからやらなきゃだと、めちゃくちゃ難しそうですよね。
これがみなさんのプログラミングに対して感じる「難しそうさ」なんじゃないかと思います。

カレー作りの世界ではスパイスを自分で混ぜなくとも、食品メーカーさんがカレールーを作ってくれています。米を育てなくても農家さんが育ててくれてます。
なんならレトルトのカレーを温めてサトウのごはんにかければそれはカレーです。

プログラミングの世界でも、色んな人がある程度のところまで作ってくれたものを利用することができます。
それらを「フレームワーク」だとか「ライブラリ」だとか呼びます。
フレームワークは開発の土台となるもの、ライブラリは組み込んで開発を楽に進めるもの、みたいなイメージです。

若干違う話になりますが、ガタログが利用しているWordpressはCMS(大体フレームワークと似たようなもの)と呼ばれるものの一つです。
本来ならWebサイトを作るにはHTML、CSS、Java Script、PHPなんかの知識が必要になりますが、Wordpressにより簡単に作れるようになっています。

そんな感じで、他の人が作ってくれたものを利用してけばプログラミングってそんなに難しいものじゃないのかな~と思います。

まとめ

既に知ってたこと、新しく知ったことはそれぞれどのくらいありましたか??

ガタログではこんな感じのことをあなたに教えたり、あるいは実践することができます!
ちらっとでも興味があれば一緒にガタログで活動してみませんか…?

一方で「こんなん常識だろ」と思ったあなた!
素晴らしい!即戦力!神!天才!1000年に一度の才能!橋本環奈!
今すぐガタログに入って活躍すべきです!

ガタログについてはこちらから

ガタログがどんなことやってるのか?というのは以下の2ページでも紹介されています。

何か質問等があればこちらのお問い合わせページからお寄せ下さい!
例えば個別にガタログの説明会を実施したりなんかもできるんじゃないかと思います。

その上で「ガタログに入る!」と決めていただけるのであればこちらのメンバー応募フォームにご記入下さい!
折り返しメールにてその後の手続き等をご案内致します。

興味を持っていただけたのならガタログに加入を、そうでなくとも「そんなことやってんのか~~~」と温かく見守っていただけたら幸いです!

コメント

タイトルとURLをコピーしました