BLOG自分の経験をシェアしたい。Webデザインのテクニック&効率化。知識もスキルもまだまだなのですが、いくつか作ってみて、困ったことの解決方法です。LINKJavascriptを使った場合の端末ごとの処理レスポンシブWebデザインでは、Javascriptの処理がはいると途端に面倒になると感じました。PCの場合のみJavascriptでアニメーションが必要でタブレット、スマホで必要ない場合がありました。画面サイズかユーザーエージェントで振り分ける方法を考えました。今のところ、メディアクエリーでCSSをわけているので、それにあわせてjQueryでウィンドウサイズを取得し、Javascriptを「使用する」「使用しない」を対応しています。Memorandum個人的にはPCで閲覧しているのに、スマホとPCのサイズにブラウザを可変するたびにJavascriptの処理を分岐させるはやり過ぎかな?と思いました。通常のユーザーがスマホで閲覧した人がPCの画面サイズで見ることはないでしょうし、PCで見た人がスマホのサイズで閲覧することは稀でしょう。他のクオリティを上げるなど時間管理が必要だと思いました。実機で確認するとかなり見栄えが変わります。見栄えの違いは、デザイナーにとってはかなり気になるところです。予算の都合上使うことができませんでした。英文字はGoogleのWebフォントを使い、タイトルなどは、PCの場合→画像をCSSで背景して対応スマホの場合→テキストで表示で対応しました。WindowsとMacでのフォントのが違いなどがありますし、フォントはデザインの重要な要素なので、そのうち日本語のWebフォントを使用してデザインしてみたいです。Beeworks画像内の文字が見づらいメイン画像やボタンの画像内の文字など、スマホで見ると縮小されて見づらくなります。コピーを読ませたい場合がありますし、グラフィック的にスマホに最適な見せ方をする必要があります。画像を用意し振り分けるようにしました。Archive端末の違いによる処理スピードこれは私のスキル不足によるのですが、レスポンシブに対応できるスライドショーが必要でしたが、ライブラリでは、望むものがなかったので自作しました。検証機のAndroidでは、動作が鈍くカクカクした動きになりました。jQueryでのクリック動作も動かない場合があるなどの不具合がありました。動きを変更せざるをえませんでした。手元にない機種で不具合が発生した場合に対応が難しくなると思いました。・ライブラリなどすでにあるものの使用を前提にするなど、ある程度スムーズに制作できる方法を考えておく必要があると思いました。2」のものが使いやすかったです。実際にコーディングするとうまく行かないことがありました。レスポンシブに関しては、やはり「デザインとコーディングを同時に行う」フローを前提に進めた方がいいようです。実制作時に困らないように少なくとも、簡単に組むくらいはしておいた方がいいと思いました。・レスポンシブのパターンを多く覚える・可能、不可能の判断ができるようにテストしておく・コーディングのスピードを上げるなどが、今後の課題かなと思っています。まとめ技術的な進歩や許容範囲の増減、認知度の向上など時間が解決することもあると思いますので、あまり完璧を求めすぎないことも必要かと思います。更新などのメンテナンスの工数が上がるのも問題があります。レスポンシブはあくまでも手段ですので、クリエイティブ部分に制限がつくこともさけねばなりません。レスポンシブがいいのか、スマホ用のサイトを別に作る方がいいかは十分判断せねばなりません。知識・経験が必要ですが、レスポンシブはパズルみたいで楽しいです。更新などのメンテナンスの工数が上がるのも問題があります。コメントをキャンセルメールアドレスが公開されることはありません。簡単に見えて以外と奥が深いのがHTML/CSSのコーディング。...100種類以上のGoogleのアイコンがつかえる。iconsアイコンを作成するのは大変ですよね。大量になると、時間も手間もかかります。...【新人向け】簡単にできた!Webサイトでよくみる技術のまとめ4月から新たにデザイナーになる人も多いのではないかと思います。...Webデザイナーで、転職がうまくいかない場合のひとつの方法として運よく憧れのWebデザイナーになれても、残業続きで条件面も悪く、すぐに退職。最近のWeb業界は人手不足で経験者を積極採用しているケースが多いです。多岐のジャンルのWebサイトを数百件制作。広範囲な知識・技術・経験を活かした素早い制作が得意。WACA上級ウェブ解析士。地方でもマルチデバイス対応を求められることが多くなってきました。優しくナチュラルな雰囲気を出したい場合は手書き風のデザインは相性がいいです。1分くらいで簡単に文字を「手書き風」にすることができるテクニックです。使うこのギザギザの丸(円)。BLOG自分の経験をシェアしたい。Webデザインのテクニック&効率化。