クモのようにコツコツと

フロントエンドエンジニア イイダリョウの技術ブログ。略称「クモコツ」

video要素はfigure要素で囲った方がセマンティック的にもスタイル的にもいいよ、というお話

HTML5で新たに追加されたfigure要素とvideo要素。なんとなく画像はfigure要素、動画はvideo要素というイメージを持っていたが、figure要素はもっと広い用途に当てはまり、video要素も内包する要素でした。そして、HTMLのセマンティック(文書構造)的にもCSS…

ブラウザ上だけでお手軽GitHub体験(リポジトリの作成と変更)

ソフトウェア開発プラットフォーム「GitHub」。バージョン管理システム(Git)によって複数人数での開発ができます。「黒い画面」を叩いて開発するイメージがありますが「SourceTree」というGUIツールもありますよ。さらになんと!GitHubはローカル環境と連…

黒い画面だけでWebページを作成-後編:viエディタでコーディング!

「前編」の続きです。前編ではフォルダ作成(mkdir)、ファイル作成(touch)・複製(cp)・移動(mv)・削除(rm)を行いました。後編ではいよいよテキストエディタを使わず、黒い画面だけでコーディングを行います。ターミナルの中に内蔵されているviエデ…

黒い画面だけでWebページを作成する - 前編:ファイル、フォルダの作成

「初めての黒い画面」以降、ちょいちょい黒い画面(ターミナル)に触れてきましてだんだんと慣れてきています。ここらで新たな試みをしてみます。そう、私は感じたのです。もしかしてだけど、もしかしてだけど、黒い画面だけで、テキストエディタ使わずにWeb…

初めてのNode.js:インストール確認、REPL、Hello worldまで

「黒い画面」叩いて初体験シリーズ!前々回「Python」、前回「Ruby」に続きまして、今回は「Node.js」にトライ。いや〜Node.js。サーバサイドJSですよ、ハイ。これも前々から気になっておりましたよ。でもどうやって初めたらいいのかわからなかった。黒い画…

初めてのRuby:インストール確認、REPL、Hello worldまで

前回、データ分析をしたくなってPythonに挑戦しました。同時にこれまで苦手だった「黒い画面」(ターミナル)にも触れることができました。そしたらなんと、これまでよくわからなかった黒い画面系の記事がなんとなくわかるようになってきました。「サーバサ…

初めてのPython(インストール〜Hello world)と初めての黒い画面

このところ、データサイエンティストによるデータ分析記事が様々な切り口で興味深々です。どうやら皆さんPythonでプログラミングをしているようです。私もやってみたくなってきました。そこで、PythonのインストールからHello worldまでやってみました。なお…

【Googleアナリティクス】ユーザー分析の基本(ユーザー、セッション、PV)

Webサイトは作って終わりじゃない!作ったあとの分析も大事。アクセス解析=Googleアナリティクス(GA)といっても過言ではない必須ツールですが、最初は膨大な数字の山に戸惑いますよね。 今回はWebサイトの目的、GAの導入、そして大事な3つの数字「ユーザ…

Chromeデベロッパーツール事始め!HTML、CSS、JSを直感的に修正しよう

Webサイト制作で欠かせないChrome「デベロッパーツール」 。でも、なんだか英語メニューがたくさんで、一体どこをどう触ればいいの? まずはHTML、CSS、JSのリアルタイム修正から入るのがおすすめ。ブラウザ上で直接修正が反映されて、大変直感的ですよ!

デザインも配色も「メリハリ」が9割!基本を身につける学習方法

タイトルの「9割」は言い過ぎかもしれないが、「メリハリ」はとても大事な考え方と思っています。ポイントは「主役」と「脇役」をハッキリさせることです。美術系の学校を出ていない文系雑草独学デザイナーの私が試行錯誤しながら身につけた学習方法をご紹介…