Guide to HTML Semantic Markup
2014年8月17日 HTML, Webサイト制作 連載企画「実践で学ぶWebサイト制作ガイド」も佳境を迎え、今回いよいよHTMLマークアップの段階に突入します！「デザインは好きだけど、コーディングは苦手…」という人も、焦らず少しずつ記述していけばちゃんと形になります！お手持ちの「TextEdit」や「メモ帳」などのテキストエディタツールを開いて、さっそく始めましょう！ ↑私が10年以上利用している会計ソフト！ 実践で学ぶWebサイト制作ガイド：その6 目標：正しいページ構造のHTMLが書ける 必要なもの：Windows メモ帳 や、Mac OS Text Editなどの文章エディタツール。もちろんAdobe DreamweaverなどのWeb系オーサリングソフトがあるならそれでOK 対象レベル：HTMLの基礎知識がある・基本的なHTMLタグが手打ちで書ける 目次 誰のため？何のため？We
誰のため？何のため？Webサイトを作り始める前に。 | Webクリエイターボックス
2020年8月4日 Webサイト制作 こんにちは！ついにWebクリエイターボックスのサイトが完成しました！これからこのサイトと、制作者のManaをよろしくお願いします！さて、さっそくですが最初の記事、Webサイトを作る前にすること。突然Photoshopを立ち上げてデザインを始めても、ユーザーが必要とするWebサイトが出来上がる可能性は極めて低いと思います。デザインやコーディングを始める前に、「このWebサイトは何のために作るのか」「誰がどのようにこのサイトを使うのか」をまとめておきましょう！ ↑私が10年以上利用している会計ソフト！ 実践で学ぶWebサイト制作ガイド：その1 目標：Webサイトを作る目的を明確にする 必要なもの：紙とペン 対象レベル：超初心者OK！ 目次 誰のため？何のため？Webサイトを作り始める前に。 ←今ここ Webサイトの構成図を簡単に作れる便利ツール Webサイ
WordPressのテーマを変更してスマートフォンサイトを作成。Media Queriesとどっちがいいの？
WordPressのテーマを変更してスマートフォンサイトを作成。Media Queriesとどっちがいいの？ 2013年3月23日 Webサイト制作, Wordpress, スマートフォン 以前「WebサイトをiPhoneで見やすくする5つの方法」という記事でWebサイトをスマートフォンに対応させる方法を紹介しました。当時はそこで紹介しているMobifyというサービスでスマートフォンに対応させていたのですが、JavaScriptが使えないので、リデザインを期に別の方法でスマートフォンに対応させる事にしました。タイトルにあるとおり、WordPressのテーマを変更する方法とCSS Media Queriesを使った方法の２通りを試したので、その比較についても書いてみようと思います。 ↑私が10年以上利用している会計ソフト！ 最初に試した方法はCSSのMedia Queries（メディア クエ
15 Useful Code Snippets for Smartphone Website
2014年8月22日 Webサイト制作, スマートフォン スマートフォンが普及してきて、Webサイトを作る時、スマートフォンサイトも一緒に制作している方も多くなってきていると思います。私もスマホサイトを制作する機会が増え、だんだんEvernoteに保存していたスマートフォンサイトを作る時の小技がたまってきたので、iPhoneで使える小技を中心にまとめて記事にしてみます。いくつかサンプルも作っているので、スマートフォンからあわせてご覧下さい！ ↑私が10年以上利用している会計ソフト！ スマートフォンサイト用小技集 目次 いくつかサンプルも作ったのでスマートフォンから、もしくはブラウザーからユーザーエージェントをiPhoneなどに切り替えてご覧ください！ 横幅をデバイスの幅にあわせる 文字サイズの自動調整をオフ リストのクリック（タップ）範囲を広げる 画面の幅にあわせてCSSを変える リンクテ
Webデザイナーさんにおすすめの無料で読める電子書籍いろいろ
2014年2月25日 Web関連記事, インスピレーション 私は普段紙の本をほとんど読みません。年に１冊読むか読まないか…。しかし、iPadを購入してからはなぜか電子書籍なら読むようになりました。ディスプレイで読む事の方が慣れているからですかね…？という事で私が最近読んだ無料の電子書籍をいくつか紹介します。日本語のものは比較的サクサク読めるものばかりなので、空いた時間に読んでみてください！ ↑私が10年以上利用している会計ソフト！ インタラクティブPDFでつくったインタラクティブPDFのつくりかた〜動画/音声再生・ページ効果編〜 ダウンロード InDesignで動画や音声付きのPDFファイルの作り方を説明してます。サンプルもついています。紙の本では表現できない、電子書籍の魅力はこういった点にあると思うので、これから電子書籍の出版を考えている人には参考になると思います。 地域でメディアづくり
Web業界でよく使う用語の英語辞典
2014年8月22日 Web関連記事, 英語 英語のサイトにはたくさんの素敵情報が溢れていますが、なんだかハードルが高く感じていませんか？頑張って読んでみたけどわからない単語につまづいたり。という事でWeb業界でよく使う英単語を、過去のメールのやり取りを読み返したりして思いつく限り書いてしました（そのままカタカナになっている単語は省きます）。ポイントをおさえれば「「英語だから…」なんて拒否っちゃ駄目なWEB屋が知っておくべき厳選ブログ、WEBマガジン色々」で紹介されているようなサイトもスラスラ読めるようになるかも！？ ↑私が10年以上利用している会計ソフト！ 目次 あ行 か行 さ行 た行 は行 ま行 や行 ら行 あ行 値 – Value HTML、CSS、JavaScriptなどなど、いろんな場面で出てきますね。 You can get the value of a form elemen
WebサイトをiPhoneで見やすくする5つの方法
2017年6月29日 Webサイト制作, Webデザイン, 便利ツール iPhone持ってないくせにWebクリエイターボックスをiPhoneで見やすいよう改良しました。iPhoneからhttp://webcreatorbox.comにアクセスすると自動的にhttp://webcreatorbox.mobify.meにリダイレクトされます。（されてなかったら直接http://webcreatorbox.mobify.meからドウゾ…）今回は下記に説明するmobifyというサイトからiPhone用サイトを作りましたが、他にも便利な方法があったので紹介してみます。 ↑私が10年以上利用している会計ソフト！ 1. CSSのみで切り替える iPhone用に作成したCSSを作り、デバイスの幅によって使用するCSSを切り替えます。 <link rel
WordPressの管理ページをより便利にカスタマイズする方法13
2014年8月22日 Wordpress WordPressを使ってWebサイトを作る際、自分のサイトならさほど気にならない管理画面も、クライアントに納品するのであれば少し手を加えて使いやすくしておきたいところ。少しデザインを変えるだけ、機能を追加・削除するだけで「オリジナル感」がでますよね。今回はそんなWordPressの裏側、管理ページのカスタマイズ方法を紹介します。 ↑私が10年以上利用している会計ソフト！ WordPressの管理ページをカスタマイズ 目次 管理バーを消す コメントに「削除」「スパム」ボタンを追加 ログイン画面：ロゴを変更する ログイン画面：CSSを変更する 管理画面左上の「W」ロゴマークを変更 投稿画面の項目を非表示 サイドバーのメニューを非表示に フッターテキストを変更 ユーザープロフィールの項目を追加 ビジュアルリッチエディターを非表示 投稿画面のビジュアルリ
空いた時間でお小遣い稼ぎ！フリーランスWeb屋さんにおすすめのサブプロジェクト
2017年7月14日 フリーランス フリーランスWeb屋さんの皆さん、フリーランスの仕事はどうやって探していますか？また、依頼がない時のサブプロジェクトは持っていますか？会社をやめ、フリーランサーとして仕事を始めたばかりの頃は、多くの人が「依頼のない、空白の時間」を体験してしまいがちです。そんな期間を有効活用すれば、フリーランスとしての収入も増えると同時に自分のスキルを磨く事もできます。今回はフリーランサーさんの「サブプロジェクト」に焦点をあててみたいと思います。 ↑私が10年以上利用している会計ソフト！ まずはブログ・Twitterをはじめよう まだ自分のブログとTwitterアカウントを持っていない人は、今すぐはじめてください。なぜならこれらのツールは自分を宣伝する道具としてとても有効だからです。例えばサブプロジェクトとしてWebサイト用デザインテンプレートを作ったとしても、宣伝するツ
Firefoxで使用していた＆Chromeで使用中の拡張機能 計36個
2017年6月30日 便利ツール 以前「ChromeからFirefoxに戻した6つのくだらない理由」という記事を書いてから約８ヶ月。久しぶりにChromeをいじってみると、エクステンションの数も増え、いろいろと進化しているようです。「Firefoxにあるこの機能がChromeであれば移行するのに…」と思っていた事がだいぶ解消されたので再びChromeに復帰しました！そこでFirefoxに入れていたアドオンと、Chromeで使用し始めたエクステンションを紹介します。Firefox派の人も、Chrome派の人も、移行検討中の人も、ぜひ参考にしてみてください！ ↑私が10年以上利用している会計ソフト！ Firefoxアドオンに代わるChromeエクステンション 私のようにもともとFirefoxユーザーの場合、一番のネックは便利なアドオン。それに代わるエクステンションがないと移行の決意はできません
Facebookページを自由にカスタマイズする方法 | Webクリエイターボックス
2017年6月29日 Webサイト制作, Webデザイン 最近会社でFacebookページを作成する事があり、楽しくてすっかりハマってしまったManaです。そのノリでここWebクリエイターボックスのFacebookページも作ってみました。そこで、Facebookページ作成中に役にたったコードやプラグイン・サイトを紹介します。 ↑私が10年以上利用している会計ソフト！ ※これは2010年に書かれた古い記事です。更新記事「Facebookページの作り方 2012年1月版」をご覧ください。 Facebookページのカスタマイズ概要 Facebookページの基本的な作成手順についてはかちびと.netさんが詳しく解説しています。なので、ここではFacebookページをHTMLやCSSでカスタマイズできるFBMLというアプリケーションやその他のプラグインを使った、もう少し踏み込んだFacebookペー
オリジナルテーマの作り方 3.0+
2014年8月22日 Wordpress WordPressのオリジナルテーマの作り方について説明していきます。2010年1月に書いた記事とはバージョンが違い、コードも変更されたため、新たに記事にしてみました。慣れると簡単なのですが、初心者には少し難しいWordpressのカスタムデザイン。Wordpressのテーマがどのように動くのか、スタティックのHTMLテンプレートにどうやってWordpressの機能をつけるのかを説明していきます。PHPの知識は必要ありませんが（もちろんあった方が楽ですが）、自分でデザインをするためのPhotoshopとCSSの知識は必要です。 ↑私が10年以上利用している会計ソフト！ WordPress オリジナルテーマの作り方 3.0+ WordPress オリジナルテーマ作成 完璧ガイド WordPressをローカルにインストールする WordPress オリ
デザインの要素と原則
2017年6月29日 Webデザイン 今回はデザインの基礎をお勉強しましょう！デザインは複数の要素（エレメント）と原則（プリンシプル）から成り立っています。それらを簡単に説明するとともに、要素と原則を生かしたWebサイトを一諸に紹介します。私は「デザインセンスは才能」とは考えていません。デザインセンスはそれらの要素をどう組み合わせるか、という閃きとその引き出しの多さによるものだと思います。ぜひ参考にしてみてください！ ↑私が10年以上利用している会計ソフト！ デザインの要素（エレメント）と原則（プリンシプル）は全てのビジュアルデザインの基礎と言われています。要素はデザインの「表現手段」を形成し、原則は「構造的特徴」を構成します。デザインにおける要素と原則の認識は、視覚構成をすることにおいての最初のステップ。Webデザイン、グラフィックデザイン、プロダクトデザインなど、すべてのビジュアルデザ
コーディングのスピードを上げる為の6つの方法
2017年7月25日 Webサイト制作, 便利ツール 今より少しでもコーディングを早くできれば、細かいデザインや機能にも時間をかけて取り組めそう…という事で今回はコーディングのスピードを上げるためにできる事を紹介します。便利なツールを使ったり、ちょっとやり方を変えるだけでより早くコーディングができるようになると思います！ ↑私が10年以上利用している会計ソフト！ 1. コーディング手順を簡略化する これは自分のコーディング能力を高めて手順を省く、便利なツールを使って手間を省くという事です。例えば私は昔このような手順でコーディングを進めていました。 CSSのレイアウトをノートに書き出す レイアウト部分（ヘッダー・メイン・サイド・フッター）のHTMLマークアップ CSSでレイアウト部分のスタイリング 表示確認 うまく表示できない箇所の修正 ヘッダー内のHTMLマークアップ CSSでヘッダー内の
初心者さんのためのWebサイト制作に役立つリンク集
2017年6月29日 Webサイト制作 「Webサイト勉強するのにおすすめのサイトを教えてください！」との声が多いのですが、日本のWeb関連チュートリアルサイトをあまり見たことがなかったので、今までおすすめできませんでした…。ということでちょっとググって初心者さんによさそうなサイトをいくつか紹介します。小難しい単語が並んであるようなサイトは避けているつもりですが、わかりにくかったらすみません。他にもおすすめサイトがあればぜひコメント欄にて教えてください！ ↑私が10年以上利用している会計ソフト！ Webサイトを作る流れ まずはWebサイトを作る目的を考える 誰のため？何のため？Webサイトを作り始める前に。 サイトマップと呼ばれる構成図を作成 Webサイトの構成図を簡単に作れる便利ツール ワイヤーフレーム（Webサイトのレイアウト）を作成 Webサイトの骨組み: ワイヤーフレームを素早く・
配色パターンからWebデザインを考える
2017年6月29日 Webデザイン, 色彩 ページを開いた瞬間にそのWebサイトのイメージを左右するほど重要な要素「色」。しかし色の組み合わせ、配色には無限のパターンがあり、正しい配色を見つけるのは簡単なことではありません。ここでは色彩の基礎と配色パターンの見つけ方の一例を紹介します。 ↑私が10年以上利用している会計ソフト！ まずは色彩の三属性について 色は彩度・明度・色相の三属性（三要素とも呼ぶ）から成り立っています。 彩度 色の鮮やかさの度合いを表します。彩度の高い色は派手・華やか・目立つ色といえます。子供服やキャラクターグッズ関連のサイトには彩度の高い色が使われることが多いです。逆に彩度の低い色は地味・おだやか・上品であるといえるでしょう。和食・ヴィンテージ風デザインのサイトには彩度の低い色がよく使われます。 明度 色の明るさの度合いを表します。明度が高い＝明るい色はさわやかで爽
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
