【テンプレ付】「そんなデータどこにもない事故」を未然に防止！WordPressで使うデータを定義しよう！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
【テンプレ付】「そんなデータどこにもない事故」を未然に防止！WordPressで使うデータを定義しよう！ こんにちは。バックエンドエンジニアの皆様。そして WordPress 組み込み職人の皆様。今日も add_rewrite_rule が言うことを聞いてくれませんか？ 分かります。バックエンドエンジニアのまさくにです。 さて 弊社では「 WordPress でサイトを構築して欲しい」というご要望がもっとも多く、効率的にプロジェクトを進めるため、各職能が役割分担を行っています。プロジェクトの規模や各担当の業務量などによって柔軟に進め方は変更されますが、概ね下記のような工程でプロジェクトを進めています。 ディレクターが要件とスケジュールの決定 ディレクターもしくはデザイナーがワイヤーフレームを作成 デザイナーがデザインを作成 フロントエンドがhtmlを作成 バックエンドがWordPressへ
【2018年度版】Google Maps の APIキー を簡単に取得する – ねんでぶろぐ
Googleマップを表示させるには APIキー が必要です。 APIキーを取得する場合は 「Google Cloud Platform」で プロジェクトを作成し、プロジェクト内でAPIキーを作成・請求先アカウントを紐づけるという作業が必要です。 ここでは新しくプロジェクトを作成し、APIキー取得と請求先アカウントの設定方法を紹介します。 「Google Maps Platform の提供を開始 : Google マップのビジネス利用がさらに進化 」 https://developers-jp.googleblog.com/2018/05/google-maps-platform-google.html 「Google Maps Platform」 https://cloud.google.com/maps-platform/ 準備 まず以下のものを用意してください。 ①Googleアカウン
Appleも実践！シンプルだけど魅力的なデザインを実現しているホームページ6つの心得
デザインが非常に洗練されていると評判のAppleは、製品だけでなくホームページも驚くほどシンプルです。 シンプルで印象的な見た目は、時に冗長で複雑な説明をするよりも説得力があります。 ただ、単にいくつかの要素を考えもなしに置くだけでは、シンプルなデザインとは言い難いでしょう。 シンプルとは、余計なものをそぎ落とすだけでなく、本当に大切なものを選りすぐっていった先にこそあるからです。 今回は、シンプルだけど魅力的なデザインのホームページを作成する際に気をつけたい7つの心得をご紹介します。 「シンプルかつ、万人に訴求するようなデザイン」は、どのような考えをベースに作成されているのでしょうか。 ポイントごとに詳しく見てみましょう。 シンプルだけど魅力的なデザインのWebサイトの7つの心得 1. 伝えたい大テーマを１つに絞る １ページにつき伝えたい大テーマを１つに絞っていくことは、シンプルなデザイ
CSS Gridでレイアウトやフレームワークの考え方・作り方が変わる
最近、ようやくCSS Gridを学びはじめてるんですけど、学ぶ課程で「CSS Gridが”普及”するとBootstrap や Foundtion のようなフレームワークの作り方も変わるんだろうなぁ」と考えています。 どう変わるのかというと、まずは： 基本的にレイアウトはCSS Grid（必要に応じてflexbox）でやるようになる コンポーネントはいままでのフレームワークと基本的には同じだけど、CSS Gridに入れ込みやすい設計に変わる もう少し詳しく書くと： Bootstrapなどで採用されているグリッド・システムが必要なくなる 少なくともrowとcol-4、col-md-6のような書き方はなくなる 独自のグリッド・システムで作っていたレイアウトはCSS Gridでやるようになる つまり、HTMLにクラスを記述してHTMLでレイアウトを組むのではなくCSSでレイアウトするようになる（あ
head内に書くべきタグを総まとめ：SEO対策に有効なものは？
HTMLのheadタグとは？ みなさんが普段ネットサーフィンするときに見ているWebページはHTMLにより作られています。HTMLは、大きくheadと、bodyに分けることができます。 head：<head>...</head>ではさまれた部分。訪問者に直接は見えないタグを入れる body：<body>...</body>ではさまれた部分。訪問者に見える部分がここに書かれる 皆さんが今この瞬間に見ているこのページの文字や画像は、bodyタグ内に書かれています。 headタグ内には、検索エンジンやブラウザに情報を提供したり、指示を出したりするためのタグを書きます。調べない限り、訪問者の目には触れません。 headタグ内には主にmetaタグとlinkタグを入れる metaタグと呼ばれるものをheadタグ内に書くことで、文字コードの指定や、ブラウザでの表示のさせ方、検索エンジンへのインデックス（
セオリー(理論)だけでないデザインをみんなでどう学ぶか？｜清水淳子 / @4mimimizu｜note
こんにちは。UXデザイナー/Tokyo Graphic Recorder 清水淳子@4mimimizuです。いよいよ明日から通常営業です。それにしても、お休みモードから、お仕事モードに切り替えるのに、Twitterは本当にちょうどいい空間だと思う。いきなり真面目な本を開くのは辛いけど、Twitterなら、面白情報の中に、リスペクトする同業者たちの思考のカケラが混じってて、いい感じに自分の脳みそをお休みモードから仕事モードへ刺激することができる。 そんな感じで、今日もtwitterを開いた瞬間に、幸運なことに脳みそを刺激するTweetをみつけた。はじまりは、Tomo Tsubota / @tsubotax さんの記事紹介。ここを起点にいろいろ考えたことをまとめてみる。 この記事を書いたのは、フロントエンジニアの@rhirayamaaan さん。フロントエンジニアの立場から、自分の持つスキルで
Adobe XDをデザイン・プロトタイプ制作だけでなく様々な方法・場面で活用してみよう - ろくデブログ
この記事は Adobe XD Advent Calendar 2017 19日目の記事です。2017年10月19日にリリース版になった XD。その魅力について前の記事では “他のデ...
神様が宿る1px はどこに｜ai
『ぐりとぐら展』を見に行った時、展示されている原画に残された、試行錯誤の痕に感激した。 鉛筆による下描き、切り貼りされた紙片、不完全な色合い。完成された絵本には何一つ残っていない軌跡がそこにはあった。 有り体にいうと、凄く、きたなかった。 絵本の原画展にはわりとよく行く方だと思うけれど、あそこまで原画と絵本の絵に差があるものは珍しいと思う。 『ぐりとぐら』の初版当時は、今ほど印刷技術がデジタル化されておらず、原画をそのまま再現するのはコストもかかり、困難だっただろう。 だから作者や編集者は、原画を忠実に再現するのではなく、あくまで原画は原画として、読者が手にする印刷物こそが完成された最終形態だという姿勢で、紙に向かっていたのかもしれない。 あの かすてら は、原画の方が繊細な色をしていたけど、絵本のものの方が美味しそうだった。そうなるように計算して描かれた原画なのだ。 アプリケーションの
面倒な画像のサイズ変更をワンクリックで！リサイズツール7選
ホームページに画像を掲載するとき、画像サイズが合っていないと画像が小さいと粗くなったり、思うような表示にならなかったりします。Illustrator（イラストレーター）やPhotoshop（フォトショップ）のような画像編集ソフトでサイズを変えることもできますが、複数の写真を一度に変換したいときにはあまり適していません。 そのような時に便利なのが、画像リサイズツールですWeb上では、一括で複数の画像サイズが変更できたり、定形サイズに当てはめて手軽に画像加工を行えたりするリサイズツールが公開されています。 今回は、サイズ変換に役立つ7つの画像リサイズツールを紹介します。ホームページを作成する際に画像のサイズがバラバラだと、見た目にも統一感が失われてしまいます。リサイズツールを活用して、統一したサイズで画像の掲載ができるようにしておきましょう。 インストールせずに利用できるブラウザ型の画像リサイ
XDでちょっとだけ楽する作業フロー - beer_outputのブログ
WEBページのプロトタイプでちょっと楽する作業フロー イエェ〜〜〜〜イッッ！！ 初めましての方は初めましてごきげんよう。 今回こちらのアドベントカレンダーに参加させていただきました。 Adobe XD Advent Calendar 2017 Adobe XDにまつわるあれやこれやを楽しく書きましょー。遅刻も気にせず2017年中に埋めるの目標！ 楽しい使い方 他のツールとの比較 事例 (よくわからないけど)思い出とか記録とか なってのがいいのでは。参考Adobe XD Advent Calendar 2016 https://adventar.org/calendars/2145#list-2017-12-03 せっかくの機会。そして最近、業務でXDを使うことがあって四苦八苦したりしたのでそれの所感など！ 公開が遅くなったことをお詫び申し上げます。 この記事で何がわかるの？ ※使用している
駆け出しフリーランスWebデザイナーが持っててよかったスキル・勉強しておくべきだったこと | 自己紹介など | あさぎブログ | あさぎデザイン 名古屋・Web制作
フリーランスのWebデザイナーとして独立開業してから6ヶ月が経ちました。知っていて役に立ったこと、もっと勉強しておけばよかったこと、色々と見えてきたのでブログにまとめます。 このエントリーは「 フリーランスAdvent Calendar 2017 」の10日目の記事です。 「あさぎデザイン」について 名古屋在住のフリーランスWebデザイナーが、ひとりで屋号を立ててやっています。独立までの約3年間はWeb制作会社に新卒で就職し、デザイナーとして働いていました。（学生時代からこまごまと色々な制作会社のお手伝いをしていたので、業界歴はもう少し長め） 持っていてよかったスキル・知識 Webサイト公開までひと通りこぎつけられるだけのスキル 私はデザインに特化したスペシャリストタイプというよりは、設計・デザイン・コーディング・CMS組み込みまで広く（その分、多少の浅さは否めない）こなせるゼネラリストタ
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');
後輩には同じ苦労をさせなくてもいい
デザイン部署に勤務していた頃、「後輩にも同じ苦労をさせたほうがいいのだろうか？」という話を先輩としたことがあった。色々と実践してみて、今は「まったく同じ苦労はさせなくてもいい」と考えている。 環境が変化しているから会社全体で残業規制が行われ、新人も自分たちも定時にきっちり帰らされていた。セキュリティ上、仕事は持ち帰れないので過度な負荷もかけず、ホワイトな環境になったわけだけれど、逆にルーチンワークと化した日々で成長させられているのかを僕らは疑問に思っていた。 業務にかこつけて「ムチャクチャなデザイン研究をやっては腕を上げる」みたいな時間の使い方を会社でやるのが難しくなった。近年は、時間を計画的に捻出しなければならない。過去にやっていたことをそのまま後輩にやらせようとすると無理が生じるので、別の方法を考えて実践した。 より先に進むためにコツを教える僕は、苦労して学んだコツを初っ端から惜しまず
《CSS》デザイナーでも簡単便利、Gridの神な実践機能を少しだけ伝えたい。 - Qiita
CSS Grid Layoutは、とても簡単というはなし。 CSS grid starter kit - JSFiddle はじめに CSS Grid Layoutは複雑なレイアウトの実装をとても簡単にしてくれます。 ただ、機能が豊富だったり考え方が少し複雑なところもあるので、このような素敵な記事もあるんですが、ハードルが高いとかちょっと億劫だったりするデザイナーさんもいるかもしれません。 なので、今回は簡単で実用的なコピペコードとデモを通じて、Gridの素晴らしさを伝えたいと思います🍟 これを作ってみます。 デモはこれです。 => CSS grid starter kit - JSFiddle もしかしたらこれを触ってみるだけで大体理解できるかもしれません。 明示的に名前をつけてグリッドを作れる CSS Gridの素敵なポイントのひとつとしてあげておきたいのが、ここなんです。 自分でグ
テーマチェックのススメという内容で WordBench 岐阜 に参加して話してきました ｜https://wp.yat-net.com/name
2017年 12月 06日 テーマチェックのススメという内容で WordBench 岐阜 に参加して話してきました カテゴリ： WordPress タグ：WordBench 12/2にWordBench 岐阜に参加してお話してきました。WordBenchで登壇するのは結構久しぶりだったのですが、初めて参加したWordBench岐阜のみなさんが暖かく迎え入れてくださって非常に話しやすかったです。 テーマチェックはテーマを作った後で行うことが多いのですが、テーマを作ったことがない人やそもそもテーマが何か分からないという方もおられるかな？と思ったので、軽くテーマが何かというところから簡単に話しました。 WordPress はテーマを切り替えるだけで見た目を変えられること。また、機能面はプラグインの部分として分離されているので、基本的にテーマを変えても機能は残っているので、テーマを自由に変えられる
CSS設計の前にそもそもマークアップはどうやればいいのかという話 - Qiita
Hakusan Mafiaアドベントカレンダー4日目はマスブチです！ 最近の悩みは僕のusernameであるyoshixjの読み方がきまらないことです。カッコイイ読み方募集しています！ 今回の内容ですが、最近RailsでAPIを扱うことが多く、Railsのこと書こうかなぁと思ったんですけど、大体ググれば該当の記事はでてくるんでやめました！>< そこで、何書こーかなぁって中目黒歩いていたら、となりにいたRailsエンジニアがマークアップできる彼女がほしい！！！！と切実に嘆いていたので、マークアップのアルバイト1年間の経験を生かして、マークアップの話でもしようかと思います〜 で、今回は開発中のプロダクトのLP があるのですが、その製作過程をちょいと振り返っていきたいと思います！ 今回の対象となるのは BEMとかしってるけど、そもそもきれいに表示させられない float とかつかえん みたいな、
iPhone X 時代のモバイルナビゲーションアイデアに関する3つの考察
ベゼルが究極的に少なくなったiPhone X が登場したことで、デザイナーは新しい局面を迎えているかもしれません。 全画面であるという前提のないモバイルナビゲーションを再構築する時期が迫ってきました。 しかし、まだ11月上旬に発売したばかりで戸惑っているデザイナーの方も多いのではないでしょうか。 そこで今回は、モックアップ投稿サイトDribbleの投稿を参考にした、iPhone X時代のモバイルナビゲーションアイデアに関する3つの考察をご紹介します。 従来のiPhoneの使い勝手とは違うからこそ考えて欲しいことをまとめてみました。 iPhone X 時代のモバイルナビゲーションアイデア 3つの考察 SamsungのGalaxy S8やAppleのiPhone Xのように、ベゼルレスでスクリーンに没入できるスマートフォンは、今後ますます増えて来るはずです。 WebデザイナーとしてWebコンテ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ごめんなさいね。 - Lopan.jp
MUSUBii
g.o.a.t - 縦書き可能なブログサービス
