ひとりでWeb制作できた！「知識０から学ぶ」すごいスライドやサイト２７
作成：2013/07/22 更新：2014/11/01 Web制作 > 先日、お客さんのところへ提案にいったところ、「サイトを自分でも作りたいので定期的に講習会を開いて欲しい。Wordしか分からない。」と言われました。とはいっても、自分である程度、継続して勉強しておかないと、受講する人は2回目以降の受講内容を理解出来ないし、教える人も基本知識をしっかり身につけておかないと、質問に答えることもできません。 今回はWeb製作をするなら必ず抑えるべきこと、知識「０」から学ぶ、基本的な知識を習得できるスライド・サービス・サイトをまとめました。ディレクションにもOK。メジャーなもの中心です。とはいえ量が膨大になったので、必要な部分だけピックアップして学びましょう。※スライドがないものに関しては、お役立ちリンクをつけてます。 エンジニア速報は Twitter の@commteで配信しています。 もくじ
さりげなく目立つフッターデザイン
作成：2017/11/20 更新：2017/11/20 Webデザイン > どうすれば一番下にあるフッターを目立たせることができるのか。ありきたりになりがちなフッターを面白くできるのか。今回は似たようなフッターデザインから脱却したいときに参考にしたいレイアウト。 エンジニア速報は Twitter の@commteで配信しています。 フッターに入れるデザイン フッターに入れる情報は大体このあたり。 ナビ ロゴ マップ 会社情報 コンタクト メッセージ ソーシャル コピーライト なのでどうしても似たり寄ったりにはなるのですが、さり気なく目立ちそうなものをピックアップしました。 整列を「ずらす」と目立つ 人間の脳は違和感に反応するようになっています。整列だけなら目立たない要素も、斜めに傾けたり、グリッド線からはみ出したり、秩序を乱すことによって視線を停止させることができます。 昔何かの本で読んだ
WordPressテーマ作成の時に覚えておくと便利なテンプレートタグ - コムテブログ
TL;DR WordPress テーマを作る時に使用頻度の高いテンプレートタグをまとめておきます。 テンプレートタグとは CMS では、html 等の骨組みにデータを流し込んで出力します。 WordPress のテンプレートタグとは、タイトルや画像・サイト URL の絶対パスなどを読み込み出力させるためのものです。テンプレートタグは自動で絶対パスやサイトの設定等を読み込むので、サイトを移行させた時も URL やパスなどを書き換える必要がなくなり便利です。WordPress テーマ作成をする時に必ず使う機能の一つなので是非覚えておきましょう。 トップページ URL 出力 bloginfo('home や template_directory')などは廃止されています。URL は以下のタグを使います。管理画面>設定>サイトアドレスの部分を出力。 <?php echo home_url(); ?
WordPressのfunctions.phpに書いておくと捗ること - コムテブログ
TL;DR WordPress の functions.php に書いておくと捗ることをまとめておきます。 固定ページ判別。body に固定ページのスラッグ名を追加 body に固定ページのスラッグ名を追加。トップページは home のクラス名がつく。固定ページなどは guide about などのスラッグ名を取得しクラス名が付与される。 function pagename_class($classes = ''){ if (is_page()) { $page = get_post();//get_page()は廃止されたので使わない $classes[] = $page->post_name;//スラッグ名取得 } return $classes; } add_filter('body_class', 'pagename_class');
2018年に使いたいWebデザイントレンド ！ファーストビューのアイデア集
作成：2017/09/11 Webデザイン > 「提案されたものの、このレイアウトよく見るんだよなぁ」とクライアントさんに思われないように個性を出したい。今回は2018年も使える「遊び心を加えた」Webデザイントレンド、ファーストビューデザインのアイデアをまとめました。 エンジニア速報は Twitter の@commteで配信しています。 近年増えてきたファーストビューのレイアウトは スプリットスクリーン（分割） シネマグラフ 縦書きのGナビゲーション 画像とテキストを一部だけレイヤー 不規則な配置 アニメーション 鮮やかな配色のグラデーション デュオトーン イラスト ラインアート といった感じなので、今回はこのあたりから少しだけ遊び心があるものをまとめます。 スプリットスクリーン なぜかファーストビューがパッとしない時があります。要因の一つとして写真が抽象的（主張がない）で、フルスクリー
CSSのみで実現、背景を動かす「おしゃれエフェクト」まとめ
作成：2016/11/7 更新：2016/11/07 Web制作 > 404ページやランディングページに今時のおしゃれなエフェクトを付与したい。今回はCSSのみで簡単に実装できる、背景を動かすエフェクトをまとめました。 エンジニア速報は Twitter の@commteで配信しています。 テキスト部分だけの背景を動かす ストライプなど繰り返しの要素を作るrepeating-linear-gradient関数（repeating-linear-gradient - CSS | MDN）を使い、グラデーションの繰り返しを作ります。さらにmix-blend-mode: screen;で、 要素を混合しています。 mix-blend-mode: screen; background-image: repeating-linear-gradient(-45deg, transparent, tran
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
