2019年4月20日（土）、三重県松阪市で開催のウェブ系勉強会WEMIEの登壇資料です。 やっぱり尊敬する方のようなスライドはまだまだ作れないですね。ターゲットが最初は一般の方向けに書いているつもりが途中からどんどん技術的に難しい内容になってきて、最終的にコーダーやマークアップエンジニア向けになってしまいました。 枚数的にも結構頑張って作ったつもりが40枚にしかならないので、これを100枚とか200枚規模のスライドまでにしようと思うとテーマ選定の大切さとか（そもそもテーマによ…
マークアップエンジニアやコーダーと呼ばれている人たちの頭の中はどうなっているのかについてみてみたいと思います。どのようなことを考え、どのようなことにこだわりを持って日々の制作に取り組んでいるのか。マークアップエンジニアやコーダーと呼ばれる人たちは世間一般には理解しがたい存在だと思っていて、何をやっているのか、何のためにやっているのかということがわからない方も多いと思います。 今日は私がマークアップエンジニア／コーダーとしては日々こだわりを持って考えていることについて書いてみた…
最近動画を用いたサイトが劇的に増えていますね。 私が3月にコーディングを担当した案件のうち2案件は動画が含まれる案件ということがその現実を物語っているかのようです。動画も昔から多くありますが、最近ではウェブでの訴求力を高める目的の上では確実に取り入れるべき要素であると考えています。予算に余裕があるならばまずは動画を作ることを主軸に添えていくべきではないかと個人的には思いますね。 今日は動画を埋め込む方法としてmp4などの動画ファイルをvideo要素で埋め込む方法とは違って、Y…
Googleはウェブ上のあらゆるものが意味を持っている「セマンティックWeb」を目指していると言われていますが、実際にセマンティックなウェブサイトを制作する上で何を注意すればいいかについて今日はまとめてみようと思います。僕が普段マークアップエンジニアとして、ウェブサイトのコーディングを担当しているときに意識しているSEOノウハウをある程度盛り込んだ記事にしようと思って書き始めましたので、コーダー・マークアップエンジニアの初心者の方にとって価値のあるページに仕上げたいと考えてい…
SASSを便利に使う方法をいくつかピックアップしてまとめようと思いこの記事の作成を始めました。この記事作成したばかりのタイミングでは、内容がまだまだ少ない状態ですが、制作で必要なものを徐々に追加しながら少しずつ記事を充実させていこうと思います。 MIXIN フォントサイズ フォントサイズを rem 指定しつつ、IE対策でpxも同時に指定。 後からでもベースのフォントサイズを変更すれば全体のフォントサイズを変更することができます。 CS…
Bootstrap4を利用するときにブレイクポイントを変更したいなぁとか、12分割よりももっと細かくカラムを分けることができればと考えたことはないでしょうか？メモ書き程度にどの変数を書き換えればOKかということについて書いてみたいと思います。 用意されている変数 実はBootstrap4はSASSに完全対応していて、SASSのソースコードをダウンロードもできるため、SASSのソースコードからコンパイルする際に特定の変数を書き換えてあげれば簡単に自分…
ここ2週間ほどウェブの制作が立て込んでいて制作ネタの連投が続いております。ホントはもっと企業の担当者の方の役に立つネタのブログ書きたいんだけど、忙しくさせて頂いているのはありがたいということで、とりあえず制作のインスピレーションが頭の中にあるうちに制作ネタのブログを書き綴り続けております。集客や人材採用など、研究を続けて方法論を樹立できるように考えを進めておりますので、ウェブの技術との掛け合わせで地域の企業様のお力になれるように努力の日々です。 さて、今日は j…
最近は制作に時間をずいぶん使っているので制作ネタばかりの投稿になってしまっていますがあまり気にせずブログ投稿をがんばって続けていこうかと思います。 さて、今日はCSSを利用した簡単なアニメーションの実装についてご説明したいと思います。 基本的なアニメーションを実装するに当たってよく利用するライブラリとして Animate.css というものがありまして、今日はそちらを利用したアニメーションの実装について簡単にご説明出来ればと思います。 …
今日は所属している合唱団の演奏会だったので、この土日の2日間は三重県の津市の市役所にある津リージョンプラザお城ホールに詰めておりました。 津市と四日市市の道中は最近いつも混んでいて遅刻しそうになるので早めに自宅を出たら、リージョンプラザに大分早くついたので、図書館の学習室で稽古前の空いた時間を利用してザクッと「CSS設計の教科書」を読んでしまいました。図表が多く理解しやすさ重視なので、内容自体のボリュームはそこまで多くありませんが基本的なことに絞ってわかりやすく解説されていま…
