webコーディング技術のトレンドについて

事情があり、約1年半のブランクを経て、web制作の業界に復帰したwebデザイナーです。
1年半の間、一度もデザインもコーディングやデザインをすることなく復帰しました。

web技術ということで、一年半も何もしないでいると、まるで浦島太郎になったかのように、
トレンドが変化し、何から学びなおせばいいかすらわからない状態です。

そこで、現役のweb業界の皆様にお聞きしたいことがあります。

これまで私は下記のような感じで作業をしていました。

・XHTML（HTML5は少し使用する程度）
・CSS2（CSS3はベンダープレフィックスを付けての使用が多かった）
・CSSフレームワークはほぼ使わず、手作業でレスポンシブ対応等
（webアイコンのフレームワークは使用していました。）
・jQueryを使用した動き
・webフォントは使用せず

上記を踏まえて、

・これからコーディングする時はやはりHTML5+CSS3
・FaundationやBoostrapなど進化したフレームワークを使った方がいい
・むしろファイルサイズが大きくなる上記フレームワークを使うより、
CSS3のFlexboxでレイアウトがトレンド
・CSSはSaasを学んだ方がいい
・フロントのデザイン面の動きではjQueryでの動作よりCSS3などで動きを付けるのがトレンド
（jQueryはもう古い？）

という感じになってきているのかな、と思っているのですが、
実際はどうなのでしょうか。
コーディング等は人それぞれ、という部分もあるかと思いますが、
現在のトレンドというか、主な流れを教えていただけたら幸いです。

また、久しぶりにがっつりとFandationフレームワークを使用してみたのですが、
divタグなどへのクラス付与がとんでもないことになってしまっている部分があります。
<div class="columns medium-2 small-4 medium-centered small-centered container">
→このような感じです。
さらにWordPressなどを使うと、元から付随するクラスなどがあり、かなり多いクラス付与になってしまいます。

各種フレームワークを使う場合は、このようになることは普通なのでしょうか？
なんだかソースが見づらい気がしてならないのですが。。。

長くなり申し訳ありませんが、お力をお貸しいただけると幸いです。

よろしくお願いいたします。

No.1 回答者： taigoito 回答日時：2017/05/18 12:00

まずご質問にお応えすると、

>>これからコーディングする時はやはりHTML5+CSS3
>>FaundationやBoostrapなど進化したフレームワークを使った方がいい

この点は仰る通りだと思います。

>>CSSはSaasを学んだ方がいい

SassはSassでもSCSSがトレンドです。

>>フロントのデザイン面の動きではjQueryでの動作よりCSS3などで動きを付けるのがトレンド

jQueryも使いますが、animationメソッドなど、
CSS3に委託できる部分は、なるべくCSS3が良いと思います。
jQueryは、addClassやremoveClassで、
CSS3のanimationやtransitionを定義したクラスを制御する感じです。
これは、アニメーションを少し変えたい場合など、
メンテナンス性の問題かと思います。

この際、非同期通信の並列処理が必要で、Promise/Deferredに関する知識が必要です。
jQueryにも$.Deferredという便利なクラスがあります。

>>クラス名

クラス名の記述は長くなります。7,8個付けるのは普通です。好みはあるかと思います。

フレームワークを重たいと考えるなら、記述を減らしていく方向で。
フレームワークをがっつり活かすなら、記述を足していく方向で。

前者なら例えば、GridSystemだけフレームワーク使って、後は自身で記述するなど。

僕は逆に、それだと、HTMLとCSSを行ったり来たり、ということになりがちなので、
記述が多い分を「拡張性が高い」と解釈し、
SCSSで、足りない凡庸クラスを増やして使っています。
CSSの上書きは、ファーストビューなど重要なところ以外では、あんまり使いません。

******************************

その他、参考までに。

DreamweaverがBootstrap3に対応しているのが、結構気になりますが、
既にBootstrap4のアルファ版が公開されていて、
そっちの方が使い易いと感じます。個人的には。
これのカスタマイズにSCSSが必要です。

SCSSのコンパイルに、Grant、Gulpなどのタスク管理ツールが便利と言われる反面、
変化が激しすぎてついていけないという声もあります。

それから色々プロパティや、単位が増えて楽になりました。
flexboxもそうですし、vw, vh, vminとかも良く使います。

ブラウザも進化していて、
ベンダープレフィックスはそのうち不要になりそうです。

JavaScriptは、React.jsがアツイようですが、僕は詳しく知りません。
個人的には、まだCoffeeScript使っていますが、巷では下火と言われています。

******************************

こちらこそだらだらと長くなり、すみません。
一年半というと、逆に僕が学び始めた頃なので、
質問者さんの方が大先輩ですね！！