【初心者向け】 Webデザイン制作で役立つサイトまとめ

デザイナーではない私ですが、自分でサイト運営をしていくにあたっては やはりWebデザインのことを知っておいたほうがよいなと思って いろいろなサイトから学ばさせてもらいました。 検索エンジンのおかげで、自分が好きな時にいつでも知りたい情報が 調べられる。このメリットは大きいです。 ただ、限りなく表示されるサイトの中で、どのサイトに絞り込んで学習をすればよいか 迷ってしまうこともしばしばですよね(笑) […]

HTML・CSSでコーディングする時に大切な知識

少し情報が古いところもあると思いますが、HTML・CSSでコーディングする時に 知っておいたほうがよい知識をご紹介しますね。 HTML→文書構造を組み立てるもの CSS→見た目、レイアウトを調整するもの という役割分担をしっかり意識することが実はウェブを作る時には大切なんです。 ぜひ以下をご参考にしてくださいね。 HTML 編 HTML は文書構造に従ってコーディングする 【参考サイト】 「論理的 […]

デザインの原則 基礎知識 「わかりやすさ」「見やすさ」を実現するために

ウェブサイトを作ったり、オフィスソフトを使って資料制作をするときには、 「わかりやすさ」や「見やすさ」が重要になります。 この「わかりやすさ」「見やすさ」を実現するために役立つ デザインの基本原則を今回はご紹介しますね。 「デザイン」という言葉を聞くと、センス勝負という捉え方になってしまいがち。 しかし、センス勝負の前におさえておくべき原則があるのです。 その基本的ルールを適用することで「わかりや […]

アメブロのメッセージボード編集画面 Google ChromeとFirefoxでブラウザ表示が異なるのでご注意を。

アメブロを運営する上で欠かせない機能がメッセージボードですよね。 ブログのトップ画面のみに表示される表示領域ですが、 様々な告知を伝える部分として有効活用できるのがメッセージボードです。 さて、このメッセージボード。 アメブロの管理画面で記事内容を編集するのですが、 編集画面の表示は使用するブラウザによって若干の違いが出るんです。 注意するポイントは以下の2つ。 編集機能を並べたツールバーが表示さ […]

写真データを一発で年・月・日ごとのフォルダに分けて整理する方法

スマホやガラケー、デジタルカメラなどで撮影した写真データは増え続けるばかりですよね。 どのように整理するかは頭を悩ませる問題かと思います。 今回は撮り貯めた写真データを年・月・日ごとのフォルダに分ける方法をご紹介します。     使用するのはWindows用のソフト「デジカメ写真整理くん ver.1.0.0」。 このソフトを使えばドラッグ操作一発で簡単に写真をフォルダに整理する […]

アメブロでの定型文入力(パソコン編)は、無料ソフトCliborの利用が便利!

アメブロは記事を投稿する時に毎回決まった文章を自動挿入できません。 これが結構痛いですよね。。。 自分のお店案内であったり、連絡先であったりを 毎回毎回記入するのも面倒なところです。     まあ、アメブロ以外のブログサービスでは、定型文を自動挿入できるような 記事テンプレート機能が備わっているものもあります。 今回の記事はアメブロに狙いを定めたアドオン機能になるかもですね。 […]

【フォトショップ画像加工時の注意点】元素材画像からWeb用画像を作る大まかなプロセス

フォトショップを使った画像加工の大まかなプロセスをまとめてみますね。 今回のケースは、元素材がすでにあるということを想定したものです。 自分が撮影した写真データであったり、 無料の素材サイトからダウンロードした画像であったり。 そのようなデータを加工するときの作業手順として 参考にしていただければと思います。 以下が大まかな流れとなります。 jpg形式、png形式、gif形式などの拡張子を持った画 […]

アメブロのメッセージボード内容を見る。スマホでの表示はどこ?

アメブロのメッセージボード内容を見る。スマホでの表示はどこ? アメブロのトップページにはメッセージボードという 表示エリアがあります。 パソコン画面では記事一覧の上部に配置されていて、 ・ブログ管理者からのお知らせ ・様々なキャンペーン情報 ・その他特に伝えたいサービス内容 などまとめられているようです。 このメッセージボードの情報ですが、スマホとパソコンでは 表示される場所が違っています。 スマ […]

アメブロ スマホ版のデザインを変更する方法(アンドロイド編)

アメブロの画面デザインは、パソコンとスマホでは まったく別々の管理となっています。 【アメブロ スマホ版デザインの特徴】 ・スマホやタブレットからアメブロアプリを開いて作業する ・パソコン版のデザインとは連動していない ・既成テンプレートを利用したデザイン変更 ・HTML、CSSなど細かい調整はできない このように、アメブロではパソコン画面のデザインだけでなく スマホ版のテンプレートを自分好みに設 […]

情報をわかりやすく「整理する・まとめる」

情報のパーツとは 文章 写真・イラスト 図形 →長方形、楕円形、星形、直線、ギザギザマークなど 色  →ベタ塗り、グラデーションなど   情報をわかりやすくまとめるための原則 グループ化 →同じ性質、同じ意味、同じ形など、似たもの同士は近くに集める。 揃える →左揃え、中央揃え、右揃え、上揃え、下揃えなどがある。基本は左揃え。 コントラスト(対比) →主役と脇役の違いをはっきり目立たせる […]