fm315のブックマーク - はてなブックマーク

コーディングを超加速するBrackets便利エクステンションまとめ

最近色んなところでBrackets使ってますの声を聞けて嬉しい感じなんですが、Bracketsのアドベントカレンダーも余裕で挫折しているのでまた仕切り直して、せっせと紹介記事書いていきますね。今回は新しく知った拡張機能のなかでコーディング関連のものを紹介します。これまでの紹介したものはいくつかありますので見てみてくださいー。 Bracketsだって激しく進化してますよ！メインエディターとして1年使ってみて – WEBCRE8.jp PSDデザインカンプからのコーディングに超便利！Extract for Brackets – WEBCRE8.jp SVGをBracketsで使用・作成・編集するのに便利な拡張機能 – WEBCRE8.jp Brackets CSS Class Code hint 便利過ぎワロタ系のやつです。編集中のHTMLが読み込んでいるCSSのセレクターに書かれているcla

fm315 2015/03/06

リンク

Web制作（コーダー）の実務で個人的に使っている技術やツールと今後使いたいもの

コマンドラインツールターミナルからnpmでファイルをさくっとダウンロードしたり、ちょっとした繰り返し作業も一発で実行してくれるツールが色々あって、やっと苦手意識も減ってきました。まだ全然使いこなせてはいないんですが、前に比べて意味が分からず門前払いを食らっていた便利なツールがちょっとづつ使えるようになってきました。気になったのでこもりさん（@chiper）が販売しているDevelopment Environments for Web Designersというのを買ってみました。今あまりWebデザイナーではないけどw Brackets メインで使っているエディターです。もともとはエディターの移行を考えていてSublime Textがあまりなじまなかったときに、プラグインが入れられリアルタイムリロードが簡単にできるエディターとして触ってみました。以降ずっと使っています。Advent Ca

fm315 2015/01/06

リンク

[SEO]大手サイトもやっているカテゴリーを使った内部リンク構築術

Webサイトを上位表示させるためにはコンテンツの質が良いことは当然として、外部リンクの獲得、近年ではソーシャルの活用等も重要になってきています。ですがそれだけではなく、特にWebサイトの設計段階においては検索エンジンによるWebページの評価の仕組みを理解して、適切にWebサイト内のリンクを構築していくということが重要です。今回はその内部リンクについて、どういう内部リンクがその機能を果たしつつ検索エンジンに正当に評価されやすいのか、私の経験からその考え方をSEO初心者の方にも分かりやすく解説しようと思います。内部リンク(Internal Link)とは内部リンクとは、同じドメイン内から張られたそのドメイン内部のページへのリンクのことです。違うドメインから張られたリンクは外部リンク(External Link)といいます。内部リンクの果たす役割 SEO的な観点で言うと、内部リンクは外

fm315 2013/07/25

SEO

リンク

[Web制作]お昼に盛り上がったWebデザインや情報発信についての雑談

比べる。 WEBCRE8.jpとその仲間達で、web制作における「選択」において最良だと思われるものを考察していくカテゴリです。お昼からTwitterで直接は話すことなく、なぜかWeb制作の話題でちょっと盛り上がっていたのでツイートをつまんでみます。今Webではデザイナーにもフロントエンドだったりサーバーサイドだったりの技術が求められてる風潮があるけど、ガチでこの人にならデザイン面で全てを任せられるって人に頼むとなると、その人にはデザインに専念していいものを作って欲しいと思うような気がする。知っとくに越したことはないけど。 — 優 (@glatyou) June 22, 2013 だから「デザインだけじゃこの先生き残れないよなー」と思って他の技術を身につけようとしている人は自然とデザインで突出することから離れていくような気がする。周りの人に「これはこの人に任せて置けば間違いなし」と思

fm315 2013/06/23

リンク

デザイン怖い話「これは本当に私の頭で考えて生み出されたものなのか？」

これはどうでもいい話なんですけどなんかこう考えると怖いなー、と思った話です。あと念のために言っておくと「パクリ」とか「本当に新しいアイディアなんてない」とかそういう話ではないです。規則性と不規則性を使いこなす先週[webデザイン]規則性と不規則性を使いこなすという記事を書いたんですけど。この記事は、基本的に人の目は規則性のあるものに安心や調和、洗練された印象を受けるので規則性にしたがって整ってた方がいいんだけど、上手いタイミングでそれを外したりしないと印象にも残らないし面白くないものになるし、個性も出せないよねという話でした。ちなみに規則性の効果については以下の記事でも述べています。 [フォント・デザイン]水平・垂直・傾斜・円弧・不規則 – WEBCRE8.jp 自由なようでいて法則を持ったもので、なんとなく、普段の制作で自分の発想に基づき規則性から外れた不規則性を作ったと思って

fm315 2013/05/13

デザイン

リンク

ゴールデンウィークに試そう！！ 2013年上半期webサービス100連発！！

http://zzhh.jp/ ゼゼヒヒは、生活における様々なことについて賛成か反対か、どちらがいいか等の決とその理由を投稿する生活に関する投稿サイトです。 SoundGator ジャンル：音声種別：素材サイト SoundGatorは、フリーで効果音を視聴・ダウンロードし制作に使う事が出来る音声に関する素材サイトです。楽しいBADUIの世界ジャンル：デザイン種別：情報サイト楽しいBADUIの世界は、世の中にある使いづらいUIのものを紹介するデザインに関する情報サイトです。ブコメヨム！ジャンル：情報収集種別：webサービスブコメヨム！は、はてなブックマークで話題になった記事のブックマークコメントを手軽に読める情報収集に関するwebサービスです。 paprika　images ジャンル：写真種別：素材サイト paprika　imagesは、カメラマンが撮影したあまり出回らな

fm315 2013/05/03

リンク

[デザイン]角丸を使う理由、不自然な角丸について徹底的に分析した

角丸の話題が盛り上がってましたね先々週webデザイナーである彩さん(@maritime_color)のブログDesign Colorで、角丸をどういう場合に使うか、という記事がすごい話題になってました！デザイン時に注意したい角丸の使いかた | Design Color そしてその後、ナナメウエの変態イラレラー(褒めてます)すずきさん(@suzukisan__)もそれに続き角丸に触れる記事を書いたりしていました。 illustratorで角丸を扱う際の注意点 ※追記しました | ナナメウエblog 私も以前デザインが苦手な人も分かる「デザインは全て意味がある」6つの要素という記事を書いたとき、角丸についてはさらっと触れるに留めたのですが、いずれもっとがっつり言語化したいものだと考えていました。気になることもあったし、ちょうど良いので今回便乗して記事にしてみようと思います。形状としての

fm315 2013/02/27

リンク

[ブログ]SEOに強い、Googleサービスで誰でも出来るコンテンツの作り方2つ

SEOを意識してブログの記事やコンテンツを考える場合、皆さんはどうやってネタを出すでしょうか。SEOがわからなくても、ある程度コンテンツを戦略的に作ることはできます。検索に引っかかるコンテンツを作るブログの記事を考えていて、なんにも思いつかないとき、どうしていますか？webcre8は幸いなことにまだ書くことが思いつかないと言う現象に遭遇したことがないんですが…ｗブログをどう始めたらいいか分からない人へ。目的とテーマ – WEBCRE8.jp [クリエイティブ]私が意識している、無難かつ人の興味を惹き効果を最大化するコンテンツ制作のヒント – WEBCRE8.jp ブログの書き方に関してはこの辺の記事もどうぞ！また、今ある記事へのアクセスを上げたいけどどうやったら上がるのか、サイトを盛り上げるために記事をどうすればいいのかって考えちゃうこともありますよね。今回はこの二点についてちょ

fm315 2013/02/19

リンク

ここ数年でのGoogleの検索結果(SERPs)の大きな変化と地味な変化

Google便利ですよね Google先生にはいつもお世話になっています。最近はどんどん進化していて、検索結果だけでもかなりの情報が分かるようになっています。Googleのいいところはそういう便利さだけでなく、Doodleみたいなものや変な動き等、遊び心を仕込むのも忘れないところですね！ Googleのなんかあんまり注目されない面白いページ2つこういうのとか。で、そういう目立った動きもありますし、SEO担当者からすると普通の人なら気にしない(気にならない)地味ーな変化もあります。ていうか、調べてみると結構前からそうだったとか、驚くこともあります。そういうのをちょっと挙げてみます。 GoogleのSERPsにおける目立つ変化まずは目立つ変化の方に触れてみます。サイトリンクサイトリンクは、webサイトのトップページが検索結果に表示された場合、そのページのメインコンテンツと思われるリン

fm315 2013/02/06

リンク

iGoogleの代替RSSサービス「iSoople」を組み込んだ情報収集のしかた

http://isoople.digi-popeye.jp/ これはiGoogleの様にRSSを受信してリスト上に表示してくれるサービスで、単機能のリンクや検索窓、ガジェットの追加こそ出来ませんが(お願いしますｗ)iGoogleの実用的なメイン機能であるRSS受信が出来ます。実はベータ版のころからこっそり使っていましたｗ一応ベータ版の時とはCookieによるデータの管理だったのが、会員登録をしてユーザー情報をとっておくようになりました。それによって同じホームページを別のパソコンでも使えるようになりました。Cookieではさすがに心もとないですしねｗ iSoopleのちょっといいとこ見てみたい iGoogleの機能限定版なので不自由なところはあるにしても、iSoopleの方が勝っている機能があります。それは RSSで受信する記事の数を選べることタブ管理できること RSSの受信に特化してい

fm315 2013/01/28

リンク

知らないといつまでたってもHTMLとCSSが理解できない暗黙の仕様4つ

調べる。備忘録としてwebやデザインについて調べたり新しく知ったことなどを書き残していくカテゴリです。

fm315 2013/01/26

リンク

デザインが苦手な人も分かる「デザインは全て意味がある」6つの要素

元々これはwebcre8が人にデザインを教えるとき、「細部まで考えて考えて決定するからこそデザイナなんだよ」と言う事を伝えたいが為に書こうと思ったものです。熟練者の方も、読んで同様に思われましたら是非教育に使ってみてくださいｗはじめに：デザインとは webcre8は「webデザイン」の門扉を叩いてから3年程。まだまだこの世界ではwebの先輩方から学ばせてもらうばかりですが、曲がりなりにも「デザイン」というもの自体とは長く向き合ってきたつもりです。 webcre8の考えでは、例えばゲームのキャラクタの服の飾りであろうと、安売りの札の配色であろうと、webデザインのレイアウトであろうと、とにかく「デザイン」という作業は「なぜそれをそうするのか」という思考の戦いであると、今はそうなっています。だから今webcre8自身が向き合っているのはたまたまwebデザインですが、このこと自体は建築デザイ

fm315 2012/02/28

リンク

シンプルで重厚。webcre8の愛するフォント「Impact」 #LOVEFONT

サンセリフセリフ(飾り)のない書体です。スッキリしてますよね。限界まで線が太い太字の代表格かなーと思ってます。ただ使ってみると意外と癖があったり…太字で標準フォントって考えるとこれじゃなくてもAlial Blackとかでも良くないかなーと思うときはありますｗ縦長そのくせすごい縦長。ギュッと横につぶされてますよね。カーニングも詰まり気味。アセンダとディセンダが超狭い縦長に見えるのを更に助長している特徴ですが、アセンダ(小文字の頭から大文字の頭まで)とディセンダ(文字の下のラインから小文字のpやjの下のラインまで)が狭い。なので小文字を混ぜても文字の高さが変わらず、みっしりした印象を受けますね。 IMPACTの使いどころロゴタイプ企業のロゴタイプとして使われたりしています。名前の通り、どっしりとした印象を与えるのかなと思います。小文字の背もあんまり変わらないという特徴を持って