サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
やる気の出し方
zuvuyalink.net
Webデザイナーをやっていると避けて通れない作業の1つに「コーディング」があります。 私はコーディング作業にはDreamweaverを使っています。 (Visual Studio Codeなど用途によって他のエディタも使いますが…) いまは色々と便利なエディタがあるため、Dreamweaverをメインで利用してる人も少なくなってきた感じがあって、最近も「なんで今だにDreamweaver使ってるの?」と聞かれたんですけど。 DreamweaverCCになってから、Photoshopでデザインカンプを作成する場合はコーディング作業の助けになるなーと思った便利機能があるので、その辺りのメモです。 DreamweaverCCの「Extract」パネルが便利な件 Web業界でデザインカンプを作成する場合、Photoshopを使う人が多いかと思います。 Webサイトの場合は、出来上がったデザインをパ
前回「Microsoft Azure AppService WebAppのステージング機能を使ってA/Bテストを試してみました」という記事を書いたのですが、トラフィックの配分を行うテスト方法については試してませんでした。 Azureの「プレビューポータル」に「トラフィックルーティング」という機能が追加になっており、これを使うことで「トラフィックの配分を行うテストが簡単に行えるようになった」とのこと! 実際に試してみました~。 プレビューポータルとは 「プレビューポータル」は見た目が完全に変わります。 ちなみに今までの管理画面は「クラシックポータル」。 今後高機能なサービスについては「プレビューポータル」のみ適用されるようになるそうです。 まずはよく使うwebサイトをホームに「ピン留め」する クラシックポータルでは左メニューに全サービスが表示されていたのですが、プレビューポータルは「すべて参
現在、このブログ「nrjlog」では外部SMTPサーバーとしてクラウドメールサービス「SendGrid」を使っています。 ▼Microsoft Azure Websitesでお問い合わせフォーム(Contact Form 7と外部SMTPサーバ)の設定 https://zuvuyalink.net/nrjlog/archives/1543 そういうご縁もあり、中の人である@nakansukeさんに「Googleアナリティクスと連携できるよ」と教えていただきました。 @nori790822 マーケティングメール使えばまとめて簡単に統計情報見れるのと、AppsからGoogleアナリティクスを有効にしたら使えますぞよ。むしろ使ってブログプリーズw — Kansuke (@nakansuke) 2015, 6月 8 というわけで、SendGridがメール配信の機能を強化するために提供している色々な
ゴールデンウィークの自分的宿題ですw WordPressサイトを構築する場合に「Azure BLOBストレージに画像や動画を置くと便利」と説明させてもらった時、「Azure BLOBストレージとAzure WebAppsの違いがよくつかめない」と指摘されたことがありました。 というわけで、Azure BLOBストレージについて再度まとめつつ、「デモ環境で構築したWordPressサイトを一瞬で本番環境に移行」できるステージングについても、自分的にもう少し考えてみよう、的な記事です。 Azure WebAppsとAzure BLOBストレージの違い 図にするとこんなイメージ。 Web的に考えてみて、Aaure WebAppsとAzure BLOBストレージで一番気になる違いは「データのアップロード・ダウンロード時に使うソフトの種類」じゃないかなぁと感じました。(これさえ気をつければ、特に難し
前回Azure WebSitesのステージング(スロット)の記事を書いた時に「WordPressはうまくいかなかった」と書いたのですが、スロット機能をうまく使えばWordPressでサイト構築をした場合の本公開作業がかなり楽になると思って諦めきれなかったので @kazumihirose さんに相談して方法を教えてもらいました。 というわけで、WordPressにちょっと仕掛けをすることで「ステージング環境と本番環境を一瞬で入れ替えできる」ように! 「一般的なコーポレートサイトの構築例」を使って実務に近い状況を作って検証してみました。 このサイト例がいいなと思うのは「WordPressでサイト構築時に使うと思う要素がほぼ網羅されていること」です。 書籍からの変更点として、「MySQL」を採用するようになっていますが今回は「SQLite」を採用しました。 投稿用のデータのインポートはもちろん、
WordPressにMySQLは必須? WordPressを使う場合、データベースが必要なので一般的にはMySQLを使うと思います。(本でも紹介されてたり) ですが、この「nrjlog」はWordPressにも関わらずMySQLを使わずに運用しています。 以前、WordPressブログのお引っ越し記事でちょっと触れたのですが、「SQLite」というファイルタイプのデータベースを採用しています。 Azure WebSitesで本気でMySQLを構築して使うとなると、仮想マシンを使用する必要が有るため実質的にコストが高くなるキケンがあります。 (WebSitesで仮想マシンを使用せず使えるMySQLはclearDBという、予めチューニングしたMySQLを貸してくれるクラウドのものでアプリ的なイメージ) なので、小~中規模サイトだったら「SQLite」を使った方が運用的にメリットが多いかなと思い
AzureにはAzure Media Servicesという機能があります。 Azure Media Servicesは、ざっくり説明すると自分のWebサイトでYouTubeのように早送り巻き戻し、全画面表示などの制御ができる動画を配信できる機能。 今回も @kazumihirose さんに全面的に技術指導していただき、実際に試してみました。 今回はCDNを使わず、Azure Media Servicesで基本的な動画配信を試します。 Azure Media Services(メディアサービス)とは? クライアントから動画マニュアルやe-ラーニングなどの動画を「自分のサイトで動画配信をしたい」と相談をされた場合、「YouTubeを使うよう勧める」場合が多いと思うんですけど、企業の中にはYoutubeなどの動画サイトへのアクセスが禁止されている場合もあります。(あとは動画再生時に広告が出るの
前回の「Azure WebSitesにWordPressを1,000サイト詰め放題可能な「仕組み」を勉強してみた話。」に引き続き、 @kazumihirose さんに全面的に技術指導していただき、クラウドサービスの本領発揮と言われるAzure WebSitesの「スケールアウト」を実際に試してみました! WordPressを1,000サイト詰め放題にしたWebSitesでスケールアウトをやってみたらどうなるか、をまとめます。 スケールアウトって何? 「スケールアウト」とは、WebSitesのコピーを複数個作成しロードバランサを導入して負荷を分散させるイメージです。 図解してみるとこんな感じ。 1.ロードバランサは配下のサーバが増えると2分の1の確率で振り分ける。 (クライアントからのアクセスは50%づつ振り分けされ分散) 2.複数ドメイン分(1000サイトあったら、それぞれ1000サイト入
FUKUOKA MEETUP COMMUNITYでお話させていただいた後、「どうしてAzure WebSitesにWordPressが1000サイト詰め放題できるのか」というところをちゃんと理解してないなーと思ったので、改めて勉強しなおしてみました。 今回はさすがに私1人で理解するのは無理すぎたので、 @kazumihirose さんに全面的に技術指導していただきましたが。 (というか、これ1人でわかったらジョブチェンジしてるレベル) 私的に理解できたとこをまとめますー! Azure WebSitesの概念 レンタルサーバーと原理は同じというか、元々Azure WebSitesはレンタルサーバー業者向けの設計をクラウドにしたもの、だそうです。 例えば、サイトAにアクセスしてその後アクセスがない場合、Aはプロセスが止められてCPUもメモリも食わない状態になる。 WebSitesって全サイト常
WordPressをMicrosoft Azureにお引っ越ししたときに「Azure BLOB ストレージ」について軽く触れましたが、「Azure Blob ストレージ」って何ぞや?ってところを勉強しておこうと思いまして。 2015年のお正月は、そこをガッツリやっておりましたw(今年も安定の引きこもり属性) ブログのお引越時には「画像のみAzure BLOB ストレージから配信」にしたんですが(プラグイン「Windows Azure Storage for WordPress」使用)、Azure BLOB ストレージはWebサーバー代わりに使えるとのこと。 というわけで、実際にAzure BLOB ストレージをWebサーバー代わりに使ってみましたよ。 Azure ストレージ サービスとは? Azure Storage サービスには、BLOB ストレージ、テーブル ストレージ、キュー ストレ
最近クラウドサービスの話をよくみるのですが、実際自分で触ったことないから「クラウドって何?」というのが正直なところで実際使ってみたいなーと思ってました。 私、一応肩書は「Webデザイナー」ですけども、色々な知識は持っていてムダではないし、クライアントに間違ってない情報をお伝えするのも仕事の一貫だよなぁと。 そのためには自分が実際に触ってみないとね、と思うところもありまして。 Microsoft Azureコミュニティ「ふくあず」のロゴ制作をさせていただいた経緯もありますし「webデザイナーはAzureから使ってみると馴染みやすいかも?」とアドバイスもらったのもあって、まずはMicrosoft Azureから勉強してみることにしました! 今回利用したのはMicrosoft Azureの「WebSites」というサービス。 勉強がてら、自分のブログをロリポップからAzureにガッツリお引っ越し
ユニバーサル アナリティクスは Google アナリティクスの新たな運用基準になります。ユニバーサル アナリティクスにアップグレードしても、現在使用している同じレポートで過去のデータをすべて利用できますが、さらに次のこともできるようになります。 ・カスタム ディメンション/指標 ・ 新しいトラッキング コード ・詳細なレポート機能 Google アナリティクスのすべてのプロパティは、ユニバーサル アナリティクスを使用する際に必須のプロパティになる予定です。移行されていないプロパティは、将来、ユニバーサル アナリティクスに自動的に移行されます。 ユニバーサル アナリティクスはとても便利なものになるようですね! 今回の移行は根本的な変更になるらしく、3段階で行われるとのこと。 これはすぐ移行しないと!って思ったんですが…。 コレが適応されるタグは現時点では「ga.js」のみのようです。 まずは
12/21に北九州で行われた「商店街を参加型デザインで変えるUXワークショップ(UX Fukuoka vol.14)」に参加してきました! 場所は北九州市小倉北区にある「魚町銀天街」。 参加型デザインで『商店街に訪れる体験』について考える、というテーマで思いっきり地元ということもあり、興味津々でした。 ▼ワークショップについての詳細はこちら http://uxfukuoka.info/seminar/uxf14.html 今回、浅野先生の講義を初めてお聞きましたし、「参加型デザイン」というものも初めての体験でした。 正直「UXとは何ぞや?」というモヤっとした知識しかない私は今回のワークショップに参加するのが不安だったのですが、そんな不安も何のその、本当に素晴らしい体験ばかりで有意義な1日を過ごすことができましたー! またもや私の脳みそでは理解できないことばかりだったのですが、そんな状態でも
今回はちょっと強気なタイトルですw web業界って次から次に新しい技術が出てきますし、そこで生き抜こうとするとホント多くのことを知っておかないといけないなーと思う今日この頃。 私は現在、webデザイナーという肩書きを名乗らせてもらってますが、webデザイナーがデザインやコーディングといった基礎的な部分以外で持っておくと良い思う知識はなんだろう?と思ったときに「アクセス解析」こそwebデザイナーが理解しておくと幸せになれるかなぁと思ったので、その理由を自分的にまとめてみようと思います。 1:本当に意味のあるサイトになっているかの確認ができる クライアントにお金を払ってもらって作ったサイトなので、キチンと成果が出て欲しいもの。 サイトの運用や報告書の作成はディレクターや営業がやります、という会社も多いとは思います。 が、結果もわからずただ作り続けるって「何のために作ってるんだろう…」的なむなし
Googleアナリティクスに新しく追加された「ユーザーの分布」と「インタレスト カテゴリ」で ユーザーの年齢 ユーザーの性別 ユーザーの興味、関心 が見れるようになりましたね! 初めは一部アカウントのみ表示になっていた項目だったようですが、現在では全てのアカウントで表示されるようになっています。 というわけで、「ユーザーの分布」と「インタレスト カテゴリ」が見れるように設定しなおしてみました!以下、やり方の備忘録です。 設定方法 「ユーザー」>「ユーザー分布」>「サマリー」をクリック。 「有効化」をクリック。 思わず「トラッキングコードを確認」をクリックしてしまうんですが、トラッキングコードを張る前だと何も起こりません。 ですので、表示されたページ中の「こちらの手順に沿って〜」の「こちら」をクリック。 (画像中だと①の部分です) すると、トラッキングコードが表示されますので、指示に従って張
最近「Yahoo!アクセス解析」が無料で提供と開始となりましたね。 ▼Yahoo!アクセス解析の説明はこちら http://analytics.yahoo.co.jp/ 話題になっているけど結局Googleアナリティクスとどう違うの?どんなデータが見れるの!?と気になりまくってましたので、自分のブログに導入してみました! が。 ホントに導入が大変でした…(遠い目) 途中で「これは完全にyahooさんに本気度を試されてるわー(泣)」って思って心折れかかったレベル。 よく最後までがんばった自分!w 色々大変だったので、導入方法を忘れないよう、自分用にメモっておきます。 まずは「Yahoo!JapanビジネスID」を取得 私は、yahoo!IDはあるけどyahoo!ビジネスIDは持っていませんでした。 なので、まずはYahoo!JapanビジネスIDから取得する必要がありました。 「Yahoo!
11月16日に北九州のMIKAGE1881 で行われた「実務で使うためのレスポンシブWebデザインの基礎・実践」に参加してきました〜! 今回は「レスポンシブWebデザイン マルチデバイス時代のコンセプトとテクニック (WEB PROFESSIONAL)」の著者である菊池崇さんにお越しいただき、とても濃い内容の勉強会となりました♪ ▼菊池崇さんの略歴はこちら http://all-web.org/instructors/#satoshi-kikuchi 今回は北九州の開催であったにもかかわらず、福岡からの参加者の方も多く、大盛況! 私はまたもや受付をお手伝いさせていただきましたよw 期待通り、参加してよかったー!と思えるセミナーでした♪ 私の脳みそでは理解できないことが多すぎたのですが、自分用にメモった内容をまとめます。 RWD(レスポンシブWebデザイン)導入の障壁 1.クライアントの理解
クライアントさんから素材をもらうとき、ExcelやWordに写真を貼り付けてて「それを使ってください」みたいに言われることって結構ないですか? 「いやあの、この貼付ける前の画像が欲しいんですけど…」と言ってみたところで「いやぁ、元画像無くなっててコレしかなくてー」と言われたり、10枚以上写真が貼ってあったりすると、一枚ずつコピペはちょっと…みたいな気分になると思うのです。 ついでに、エクセルやワードでギュッと縮小されてるとホントつらさ倍増なわけですが…。 で、それを「サクッと元画像のサイズで取り出す方法あるよ!」と会社の雑学王に教えてもらったので、忘れないようにメモしときます♪ Microsoft Excel 2007以降で作成されたデータならサクッと画像が取り出せる! ファイルの拡張子がエクセルなら「.xlsx」の形式であることが前提となります。 (コレ以前の拡張子のファイルには適用され
そして、「1日中パック級のうるおい」と「0円」の文字。 !? 迷わずお申し込みするしかないでしょう…!! と、ユーザーの求めるモノとページ内容がマッチングしていれば、ノリノリでお申し込みフォームへと移動するのです。(身をもって体験) お申し込みフォームが素敵だった件 せっかくユーザーがノリノリで申し込む気になっているのですから、お申し込みフォームでそれを逃してはいけません。 LP(ランディングページ)は売りたい物が売れてナンボ。 コンバージョン上げてナンボ。 お申し込みフォームで成約率が変動するのは事実なので、ページ内容はもちろんですが「お申し込みフォーム」こそしっかり考え、最適化していくべきだと思います。 お申し込みフォームでよく言われることは、 フォームはLP(ランディングページ)の下方に入れる(一体型) フォームの入力項目を減らし、ユーザーのストレスを軽減する とかですかね。 今回の
W3Qさんの「ここ最近読んで勉強になったWeb制作関連のスライド10選(2013年6月~7月) 」という記事で、勉強会で発表した「LPデザインの話 〜作成のセオリーとコツ〜」のスライドを紹介していただきましたー! 「掲載されてるよー!」と教えてもらったときは「え…?」みたいな感想しかなかったけど、冷静に記事を読んでみたら他に紹介されてる方々が凄すぎて、その事実を認識してから手が震えまくったという…。 人間、理解できないことが起こると認識するのに時間がかかるみたいですよ(遠い目) もうこんな光栄なことは二度とないだろうと思いますので、記事にさせていただきますw スライドについて このスライドは、「福岡マークアップ勉強会」と「webっちゃ」での発表用に作成しました。 スライドの構成は、 LPって何? LPの基本的な構成 LPデザインの注意点 7秒ルール 3秒で心を掴む ファーストビューの作り方
「いいね!」ボタンを押したとき、ウォールに表示されるタイトルや文章、画像。 何も指定しなければ、そのページのtitleタグとdescriptionの値が表示され、ページ内にある「50px×50px以上、縦横比が3:1以下のPNG、GIF、JPEGファイル」画像がランダムに選ばれるらしいです。 それは困る!と言う場合は、以下のタグを追加。 <meta property="og:title" content="表示したいタイトル"></meta> <meta property="og:type" content=website></meta> <meta property="og:url" content="http://xxxxxxxxxx.com"></meta> <meta property="og:image" content="http://xxxxxxxxxx.com/images
と、このようにCSSで揃えられる! ソースはこちら。 <p style="padding-left:90px;text-indent:-5em;"> <strong>【ご注意】</strong>一行で収まったらいいですけど、何か色々書いてたら2行になりました。<br /> って、これで2行目の始まりが揃ったでしょ!?やったー! </p> 言われてみればその通りなんですけど、よく気づいたねー!と。 コーディング苦手な私からすると、全く考え及ばないですが…。 他にも方法はあると思うんですが、コーディング苦手な私でも使いやすいなと思った方法でした。 <追記> @かなっぷる に「こういう方法で対応してるー」と教えてもらったので、追記します。 margin-left:1em;text-indent:-1em; @かなっぷる ありがと~♪
執筆にあたって監修及び寄稿くださったのは @twit_ahfさんです。 本当にありがとうございました!! さて本書は、翔泳社さんから既にリリース済みのMicrosoft Power BI入門とMicrosoft Power Apps入門のシリーズ本になっていますので、これらの本もぜひチェックしてみてください。 どんな内容? Microsoft Power Automate は、DPA機能(クラウドフロー)と RPA機能(デスクトップフロー)両方の機能を持つプロセスオートメーションです。 本書は自動化の基礎となる考え方に始まり、MicrosoftのiPaaSサービスとして提供されている「Azure Logic Apps」と「Power Automate」の比較、Power Automate(クラウドフロー)とPower Automate for desktop(デスクトップフロー)両機能の基
このページを最初にブックマークしてみませんか?
『zuvuyalink.net』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く