Webサイト制作
liginc.co.jp photoshopvip.net uxmilk.jp 最近は、トップページに全画面サイズの画像や動画を表示させているサイトも珍しくありません。アイキャッチとしては非常に有効ですが、どうしてもデータサイズが大きくなり、表示に時間がかかってしまいます。また…
<body> <header> <h1>ナビボタン</h1> <p class="btn"><span class="icon"></span></p> </header> <nav id="menu"> <ul> <li><a href="#">ホーム</a></li> <li><a href="#">メニュー</a></li> <li><a href="#">お店について</a></li> <li><a href="#">アクセス</a></li> </ul> </nav> </body>
東京池袋のフェリカテクニカルアカデミーでは、只今平成29年7月10日より 開講する「Webサイト制作科」の受講生を募集しています。 600時間を超える講座を無料で受講出来、プロになるために必要なスキルを身につける事が出来ます。また、職業訓練受講給付金と…
基本的にFacebookのページプラグインは作成する際にプラグインの幅を決めなければいけません。（最小値は180、最大値は500です）空白にしてもデフォルト値である340pxが指定されます。 指定したwidthの値はコードの中にエンベッドで「data-width=""」と記述…
Webサイト上で新着情報や更新頻度の高い情報を表示させたい時には、TwitterやFacebookなど既存のSNSのプラグインを使うのが非常に便利です。SNSのプラグインを使用すれば、わざわざHTML内のデータを触る事無く、SNSに記事を投稿するだけでWebサイト内の情報…
納期のある作業を行う際に、余裕時間があればあるほど、実際に作業を開始する時期を遅らせてしまうという、多くの人間に見られる心理的行動特性のこと。 人間は、やるべき仕事に時間的な余裕を感じると、「後でやっても間に合う」と考えてしまい、すぐに着手…
Googleフォームに自動返信機能を付ける 以前作ったフォームをカスタマイズして、フォームを記入してくれた人に自動でメール返信が出来る機能を追加します。 自動返信機能を付ける事でフォームを利用したユーザーにタスクの進行状況を伝える事が出来るので、…
Googleが提供しているGoogleAPIを使うことで簡単に様々な便利な機能をwebサイトに導入する事が出来ます。 Webサイトにスケジュール表やメールフォームを追加したい場合、PHPで作成する事が可能ですが、「Googleカレンダー」と「Googleフォーム」を使うのも選…
現在、ロリポップ！レンタルサーバーでは、通常1500円かかる初期費用が無料になるキャンペーンを開催中。 締め切りは4月28日までです。（※エコノミープランを除く） ロリポップ！レンタルサーバー |今だけ初期費用無料キャンペーン中！ ◆内容 サーバー新規ご…
制作したデータをインターネット上で表示させるためには作ったデータをサーバーにアップロードする必要があります。 サーバーには無料のものと有料のものがありますが、授業では無料サーバーを使用していきます。 webサイト制作においてサーバーは必須のもの…
レスポンシブサイトのタブレット・PCレイアウトを完成させます。 作例http://yachin29.webcrow.jp/sp-pc/ タブレット・PCレイアウトを完成させる為に行うことHTMLにタブレット・PC専用のコンテンツを挿入する。 ブレイクポイントを指定し、タブレット・PC用…
ー宿題ー 以下の内容を読み、メールで提出 インターネットについてなるべく 200 文字に近い文字数で記述して下さい。（200 文字を越えてはいけません） ＊キーワードは必ず文章内で使用して下さい。 ＊書き出し例文を参考にして文章を書いてください。書き出…
以前はFacebookが発信しているRSS/XML形式のfeed情報を取得し、比較的簡単に自身のWEBサイト等にFacebookページの投稿データなどを表示させる事が出来ましたが、Facebookのfeed配信の機能が2015年6月に仕様変更してしまい、現在はJSON （JavaScript Object N…
ベクター形式であるSVG画像は拡大・縮小が可能で、非常に使い勝手が良いのですが、元データがビットマップ画像（JPEG, GIF, PNG）などの場合、ペンツール等でパスに変更する必要があります。 ペンツールに慣れていない人にとって、この作業は意外と大変です…
もちろん、常に最新のトレンドを入れなければいけない訳では無いですが、やはり見る事、知る事は非常に大事です。下記のブログでは、最新のトレンドとして主に5点のポイントを上げています。1. ブラウザいっぱいに表示して、スクロール無し 2. 固定表示は見…
ベクターデータで出来ているsvgデータは背景画像で使う事でより使いやすさが増します。 background-sizeで拡大・縮小も自由で出来るので、今後ますます使われる機会が増えていきます。しかし、サーバーによってはSVGが上手く表示されない場合があります。 we…
illustratorで作ったカンプを実際にコーディングしてみましょう。 要素や文字の大きさや色、マージンなどの値もカンプのデータをベースに作っていきます。しかし、全てカンプと完全に同じに作っていくのは非常に難しいので、コーディング段階での微調整は必…
Webサイトを制作するうえで、実際に今のwebサイトにはどういう見せ方・動きがあるのかを知る、という事はとても大事です。PCサイトのUIデザインにおける12のトレンド | sogilog サイト制作の勉強をする際にインターネット上から情報を得る、という事も非常に…
カンプが完成して、コーディング作業に入りたい！けれどまだクライアントから画像データが送られてこない！ こんな事がよく起こります。だからと言ってデータがクライアントから送られて来るまで、ただ待っていては締め切りに間に合わなくなってしまいます。…
Webサイト上で新着情報や更新頻度の高い情報を表示させたい時には、TwitterやFacebookなど既存のSNSのプラグインを使うのが非常に便利です。SNSのプラグインを使用すれば、わざわざHTML内のデータを触る事無く、SNSに記事を投稿するだけでWebサイト内の情報…
Webフォントとは？ 元来、ブラウザは端末にインストールされているフォントを呼び出し文字を表示する。端末のフォント如何では、Webデザイナーが意図しないフォントが表示されてしまい、デザインに制約が生じてしまう。フォントを画像にして表示するという手…
Webフォントとは？ 元来、ブラウザは端末にインストールされているフォントを呼び出し文字を表示する。端末のフォント如何では、Webデザイナーが意図しないフォントが表示されてしまい、デザインに制約が生じてしまう。フォントを画像にして表示するという手…
レスポンシブデザインサイトの制作ではスマホサイズでどのように見えているかを確認する為にスマートフォンのエミュレーターが必須です。 この「RWD Tester」は無料で利用できるChromeの機能拡張で、インストールするとツールバーから簡単に利用できます。 …
前回の授業で制作したCafeサイトの他のページを作成し、複数ページのサイトに作り直しましょう。 複数ページの場合になるとファイル数が一気に増え、各ファイルのデータ管理、ディレクトリ管理がこれまでに比べて難しくなりパスの間違いが増えるのでディレク…
WEBサイトを制作するにあたり、GoogleフォームやGoogleカレンダーなどのWEBサービスを上手に使う事でHTML・CSSやjQueryでは出来ない事が可能になり、クライアントの要望にも答えられるようになります。 また、FacebookやTwirterなどのSNSをWEBサイトに埋め込…
Google検索エンジン最適化スターターガイド Googleのアルゴリズムにおける検索順位に影響を与える200+個の要因のまとめcoliss.com <html lang="ja"> <head> <meta charset="UTF-8"> <title>サイトのタイトル</title> <meta name="description" content="サイトの説明文"> <meta name="keywords" content="サイトのキーワード"> h1の重要性 h1タグはGoogleに強いシグナルをおくるもので、必ずテキストで入れましょう。ロゴなど…</meta></meta></meta></head></html>
表示したい文字がゴシック体か明朝体かで指定するフォントファミリーが変わります。 ゴシック体の場合 font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; ゴシック体の場合で、Windowsで英数字は「Verdana」、Macで英数字は「Lucida Grande」…
4 月 21 日に実施されるモバイル フレンドリー アップデートについてのよくある質問とその回答をご紹介します。Google ではこの 2 月にモバイル フレンドリー アップデートを発表し、モバイル版の検索結果におけるモバイル フレンドリー ページ（スマートフ…
Webサイトを作る際には、ユーザーが迷うこと無く目的地に辿り着けるようなレイアウトや導線をしっかり考えます。 ユーザーがストレスを感じないように、ナビゲーションボタンの位置などにも気を配り、必要ならjQueryなどの動きをつけましょう。今回の場合は …
Webサイトを作る際には、ユーザーが迷うこと無く目的地に辿り着けるようなレイアウトや導線をしっかり考えます。 ユーザーがストレスを感じないように、ナビゲーションボタンの位置などにも気を配り、必要ならjQueryなどの動きをつけましょう。今回の場合は …
