タグ検索の該当結果が少ないため、タイトル検索結果を表示しています。
【新曲MVアリ】あいみょんさんの、多彩な音楽性に魅了されました - Hobby ＆ WorkのFree Styleブログ
今さらって言われそうなのですが、昨年の９月頃から「あいみょん」さんにハマっています。と、言っても、Rockabillyみたいにドはまりしている訳ではないのですが、久しぶりに日本人の素晴らしいミュージシャンに出会いました。 この記事では、私があいみょんさんを知ったきっかけと、ハマったきっかけについて書いてみます。まだまだ、勉強不足なのですが、しばらくハマりそうなので、このブログでもふれていく予定です。是非、最後まで読んでみてください。 きっかけはテレビからでした きっかけは、土曜日の深夜に放映されている「カウントダウンTV」でした。普段から見ている訳ではないのですが、その日はたまたま観ていたんです。 その時に流れていた「マリーゴールド」の雰囲気に興味が湧きました。私が知った時は、既に超有名人だったようです。私は初めてだったので衝撃的でしたね(笑) 翌日、やっぱり気になっていたようです。早速、
Googleが提供してくれる無料ブログ「blogger」の始め方。-3104writerのFree Styleブログ
今回はGoogleが提供してくれている無料ブログサービス「blogger」について解説します。こちらのブログも、商用利用可能なので、我々アフィリエイターも使いやすいですね。 この記事では、bloggerについての解説と、アカウントの登録～ブログ開設までのやり方をお伝えします。是非、最後まで読んでくださいね。 Googleが提供してくれているbloggerとはGoogleが提供してくれている「無料ブログ」サービスです。こちらのブログの特徴は、無料ブログなのに、広告が全く入らない所ですね。 無料ブログの場合、通常はこちらが意図しない広告が勝手に入ってきます。無料ブログサイトによっては、広告を表示させなくする設定があります。 でも、bloggerだと、最初から勝手に入る広告を気にすることなくブログを運営することが出来ます。 bloggerにはこんな魅力があるんです。 ・無料で使える ・Googl
SafariのデベロッパーツールとiOS SimulatorでWebサイトやアプリをデバッグ | Free Style
Web開発しているとデバッグは欠かせないのですが、スマホの確認、デバッグとなるとGoogle ChromeやFire Foxのデベロッパーツールがある。 ある日、Google Chromeのデベロッパーツールは問題ないのに実機ではうまくいっていないことがあった。もしやと思いiOS Simulatorを立ち上げて確認するとうまくいっていない。 やはりスマートフォン表示はスマートフォン専用のシミュレーターで確認しないと、Webブラウザでは正確に表示・デバッグは出来ないですよね。 iOS Simulatorはアプリ開発のデバッグしか出来ないの？と思ってしまいますが、Webサイトも表示できますし、Safariブラウザを使うことでデバッグも可能です。 iOS Simulatorとは iOS Simulatorとは、Xcodeに付属されていてアプリケーションのテストができるもの。MacはApp Sto
WebデザインでWebフォントを利用してデザインを構築していくことがよくあります。 そこで使えるのがCSSの@font-face規則です。 @font-face規則はWebフォントを利用するために用意された規則です。Webフォントで有名なのがGoogle Fontsではないでしょうか。 他にもたくさん提供されているフォントや自作のフォントなどのデータを、CSSで読み込んで利用することができます。 Webサイトのデザインでこだわりのあるフォントを利用すると、PhotoshopやIllustrator等で作成したデザインカンプから、Webで表現できない場合があるので、こだわりのあるフォントの部分だけ画像で書き出すしかありません。 もちろん画像として扱っていくのは問題ないのですが、レスポンシブWebデザインに対応しようとすると、画像よりもできるだけHTMLのマークアップとCSSで表現したいところ
Webサイトの各ページのURLの末尾にある拡張子。表示があったり表示がないWebページがあったり気になったことはあるでしょう。 Webに詳しい方は、どの言語でどのように作られているかがだいたい想像できますが、この拡張子は特に表示させる必要がないのであれば、表示させなくてもいいでしょう。 拡張子の表示をなくすことで、WebページのURLを短くスッキリさせることができます。 また、Webページがどのように作られたのかが閲覧者にわかってしまうので、気になる方は非表示にすると良いでしょう。 他、拡張子を判別して処理をするようなプログラムがないのであれば。。。 WordPressなどのCMSでは、すでに拡張子が表示されないように設定がされていることが多いですが、別でWeb制作を行う場合は設定が必要となります。 ランディングページなどで特に頻繁に更新するコンテンツがなければ、WordPressで構築す
ぶ・ち・か・ま・せ。山口俊投手（32）が、5日のプレミア12の1次ラウンド、ベネズエラ戦に開幕投手として先発する。4日、大一番に向けて意気込んだ。信条は「Free Style」。16年オフからグラブに刻んだ言葉を胸に、型にはまらず、日本に勝利をもたらす。そんな思いを、独断と偏見で、勝手にラップ調で、ぶちかましてみました。行くぜ、東京、つかむぜ、頂上。【取材、構成・栗田尚樹】 ◇ ◇ ◇ 見つめるグローブ。記したSoul。欲しいのは、「Globe」のゴール。型にはまらず抑える、それが日本のエース。 ペースなんて、握らせない。待ってろ、ベネズエラ。見とけよ、世界のベースボールマニア。俺がYAMAGUCHI。「しっかり状態も上がって来ているし、いい調整が出来ている」。 侍の18なんだ。 じだんだ踏むのも忘れる速球。かわす相手の研究。「相手は外国人特有の直球に強いイメージ。両サイドに投
WordPressのSMTP認証でGmailやGoogle Workspaceのメールを設定 | Free Style
WordPressなどのwebサイトやブログでGmailやGoogle Workspaceのメールを利用していくには、SMTPの設定でGoogleアカウントのアプリパスワード（アプリID）を設定していきます。 SMTPとはSimple Mail Transfer Protocol（シンプル・メール・トランスファー・プロトコル）の略で、メールを送信する仕組みでありWebサイトからメールサーバに送るために設定が必要になります。 多く利用されているWordPressでもコンタクトフォームからお問い合わせを受けると思いますが、SMTPを設定していないとメールサーバ側のセキュリティの関係でメールのやり取りができないといった状態になることがあります。 現在運用しているwebサイトでSMTPをしっかり設定している方は多いと思いますが、Gmailや独自ドメインでGoogleのサーバが使えるビジネス用のGo
Webサイトで利用する画像フォーマットとして拡大・縮小しても劣化しなく軽量なデータなので、SVGはこれからのWebサイトで多く利用されていくでしょう。そんな中、SVGの利用にあたって少し手こずるのが様々なデバイスで利用するためのレスポンシブ対応です。 SVGをレスポンシブ対応させるにはviewBox属性を利用します。 viewBox属性はレスポンシブ対応する際に利用するviewport（ビューポート）と同じ働きをします。 viewportは画面サイズの表示領域での指定をしていきますがviewBox相対的な表示領域、要するにSVGの領域でコンテンツを描画します。 SVGをwidthやheightで幅と高さを指定してCSSで親要素に%などで幅の可変に対応しようとしても、描画される領域はwidthやheightで指定した数値になりますので幅と高さが足りていないと表示が途切れたりします。これはSV
Gmailを利用していてメールの自動転送が必要になる時、それも特定のメールを複数のアドレスに転送したい場合があります。 何かのWebサービスを利用していて、通知メールを複数のアドレスで確認したい時などはとても便利です。 メールは受信したら、後から手動で転送することはできます。 でも、その手動も何度も作業が必要であれば手間です。そうした場合は、自動転送の設定をしておくと手間もかからず楽です。特定のメールをとなるとなおさら便利です。 ここでは、Gmailで特定のメールを複数のアドレスに自動転送する方法をご紹介します。 特定のメールを自動転送する Gmailの設定に転送設定がありますので、見ていきましょう。 画面右上の歯車アイコンから、「設定」を選択します。
CSSコーディングの作業効率を上げることができるSassは、コンパイルするのにGUIツールやコマンド操作といろんな方法があります。 Visual Studio Codeでは手軽にターミナルやコマンドプロンプトが利用できて、コマンド操作を慣れている方であればコンパイルしてCSSファイルを生成する作業もそれほど苦ではないですが、それでもその少しの手間も省きたいところです。 そこで便利なのが「Live Sass Compiler」という拡張機能です。 Live Sass Compilerは、Sassファイルを監視して自動でコンパイルしてくれます。 コマンド操作が苦手という方にはとても便利な拡張機能です。 Live Sass Compilerのインストール 拡張機能のメニューから、「Live Sass Compiler」を検索して選択し、「Install」ボタンをクリックします。 インストールが完
Web制作でSassを導入してCSSを生成していく中、ディレクトリ構造（フォルダ・ファイル構成）をしっかり作っておくと、Sass(scss)ファイルの管理がしやすくなります。 Sassを複数ファイルとして分割管理することで、編集する箇所へのアクセスがスムーズに行えるので、プロジェクトの大きさによっては、作業効率を上げることもできます。 ここでは、Sassファイルを分割管理する方法について見ていきます。 Sassの記法はいくつかありますが、公式も推奨しているDart Sass（ダートサス）の記法で、記述方法も含めてご紹介していきます。 今後は、Dart Sassベースで新機能が追加されていきますので、覚えておくと良いでしょう。 また後半には、Dart Sassの自動コンパイルについても少し触れていきます。 Sassファイルの分割管理 Sass(scss)ファイルの分割管理を、サンプルを交
「Microsoft Edge Tools for VS Code」拡張機能で快適なWeb開発 | Free Style
高機能で人気のMicrosoft製のコードエディタのVisual Studio Code。無料で提供されていますので、多くのデベロッパーが利用していることでしょう。 デフォルトの機能のみで利用してもいいですし、かゆい所に手が届く拡張機能も使って、作業効率を高めてWeb開発を進めることもできます。 ここでご紹介するのは、Visual Studio Codeエディタの拡張機能「Microsoft Edge Tools for VS Code」です。 Edgeブラウザの開発ツールを、エディタに統合して開発が行えるとても便利な拡張機能です。 WebサイトやWebアプリケーションの開発の際には、コードエディタとWebブラウザを行き来しながら作業する手間が省けるので、とてもスムーズに開発ができるでしょう。 また、XAMPPやMAMPなどのローカル開発環境でのWeb開発も、デバッグしながら作業を行えます
Webサイトやブログで画像や動画を使う際、コンテンツの中で綺麗に見せていくには、素材の品質もそうですがアスペクト比も重要な要素になります。 Web制作では画像や動画コンテンツを多くのデバイスに対応していくため、特に動画ですが、アスペクト比の調整に慣れていない方は、意外と大変だったりします。 こうした少し面倒な調整手軽に行えるよう、CSSの新機能としてアスペクト比を設定するaspect-ratioプロパティが追加されました。 気になる対応ブラウザですが、 主要ブラウザでは、最新バージョンですべてサポートされています。 （IEは未対応） Can I use (aspect-ratio) https://caniuse.com/?search=aspect-ratio ここでは、サンプルをもとにaspect-ratioプロパティの使い方をご紹介します。 WebブラウザのGoogle Chrome
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CSSの@font-faceでGoogle FontsのWebフォントを利用する方法 | Free Style
サイトURLから.htmlや.phpなどの拡張子を非表示にする方法 | Free Style
侍開幕投手の山口俊、Ｆｒｅｅ Ｓｔｙｌｅでかます - プロ野球 : 日刊スポーツ
viewBox属性でSVGをレスポンシブ対応させる | Free Style
Gmailで特定のメールを複数のアドレスに自動転送する方法 | Free Style
Visual Studio CodeでSassを自動でコンパイルする | Free Style
Sassファイルの管理方法。ディレクトリ構造（フォルダ・ファイル構成） | Free Style
CSSのaspect-ratioプロパティで手軽にアスペクト比を設定する | Free Style
x.com
solomeshi.net
comic-walker.com
style-pedia.com
newsdig.tbs.co.jp
fujisankei.com