サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
体力トレーニング
design.all-connect.jp
– React!前回までは – Reactという謎の単語を目にし、意気揚々と調査に乗り込む。 そこで見たものは英語と専門用語に溢れた参考記事の数々…。 そんな中、どうにか自力でプログラムの入り口「Hello!World!」の出力に半日かけてようやく成功し、その勢いでバリデーション付きフォームの作成にとりかかったのであった…。 前回の記事:React.jsって?初心者から始めるReact導入! ということで今回はグッと実用レベルまで難易度を上げて、React.jsだけを使用したバリデーション付きフォームの作り方を解説します! ちなみに今回ここまでたどり着くのに約20時間近くダラダラとかかってしまいました…。ぐぬぬ、侮れないぞReact.js。 Reactでの値の受け渡しpropsとstateまずReactを使う上で決して避けては通れないプロパティがこのpropsとstateです。 これらはど
Reactってなんぞや?社内でReactって単語を目にして色々と調べてみました。 React.jsはFacebookが作っていて、いわゆるMVCフレームワークでいうところのViewの部分をコンポーネントとして作っていくためのライブラリ 引用元:React.jsとは – Qiita 既に公開されている記事を読み漁ったところ、コンポーネントやフレームワークやMVCと専門用語が飛び交ってましたが、 要約するとUI(ユーザーインターフェース)を構成するパーツを作るためのライブラリということだそうです。 では実際どうやって使うのかやってみましょう! Reactを使ってみよう!今回は新しいプログラムを始めるときの定番である「Hello!World!」の出力してCSSを適用するところまでを解説します。 まずは先に結果を見てみましょう。 See the Pen React導入 by くりはら (@kuri
これまでのSEOとは何だったのかGoogleを代表とする検索エンジンが提供している、あるいは提供すべき価値とは何なのかというと、当然「検索キーワードに対して最適なコンテンツを提供する」ことだと思います。 ですから当然、ウェブで集客したい人たちは頑張って「私たちが最適なコンテンツですよー!」とアピールを欠かさないわけですよね。黒いものや白いもの、色々ありますが、時にはHTMLのマークアップを工夫したり、ライティングにおけるキーワードの配分を調整してみたり、小手先の技術の集合体を「SEO」と呼んで、専門性の高い技術として長らく扱ってきました。 検索結果の”リアルさ”Googleは使わない、SEO対策しているから——Instagram有名人のGENKINGが語った10代の「リアル」 「一昔前ならGoogleで検索して化粧品のランキングを見ていたが、いまは見ません。結果にウソが多いのも若い子は知っ
Webデザインにおいて情報設計とライティングは、Webページの『質』を左右する大きな要素です。『よしデザインするぞ!』と意気込んでも、質の良い情報・文章がなければ、デザインの作り手が情報引き出す・補完してデザインを行っていかなければいけません。今回は情報の出し手側が、どのように情報設計をし、ライティングを考えれば良いかを解説します。 今回はトップコピーについて解説していきます。 Webデザインにおける、情報の構成要素Webデザインの要素を大きく分解したときに下記のような要素に分解することができます。 トップコピーボディコピークロージング各要素の特徴を踏まえることで、効果的な情報設計をすることができます。 トップコピーの特徴トップコピーはWebページにおける最も重要な要素です。Webサイトを訪れたユーザーが一番最初に見るのがトップコピーになります。このトップコピーで対象のページがどのような
ついに、満を持してGoogleがAMP HTMLの検索結果への表示を開始しましたね! 社内でも早速プロジェクトを立ち上げてAMP版のページを作成しました。 その時に、GoogleAnalytics上でAMP経由で来たユーザーとそうでないユーザーをセグメントしたかったので、カスタムディメンションに対応させてみました。 まずは、GoogleAnalyticsの管理画面からカスタムディメンションを用意しましょう。 Googleの公式ドキュメントがあるので、そちらを参照してください。本記事では割愛します。 今回は、仮に1番目のインデックスにカスタムディメンションを作ったとして進めます。 管理画面側でカスタムディメンションが用意できたら、GoogleAnalyticsをAMP版ページに導入しましょう。 設置のために必要なことは以下の3つです。 AMP版GoogleAnalyticsのライブラリの読み
このページを最初にブックマークしてみませんか?
『ACC – 株式会社ALL CONNECTのデザイン部のデザイナー、エンジニア、ディレクター、...』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く