Webサイト制作初心者用質問スレ part237

1 ：2013/10/04 〜 最終レス ：2013/10/20

初心者だろうが誰だろうが、
まず >>>■ 検索してから ■<<< 質問すること
ネタ・煽り・自演・荒らしは完全放置
【質問時の注意】
　 1. 質問する前に >>2-4 にも目を通すこと
　 2. メール欄に何も入れないことを推奨 （IDを出して騙りを防止するため）
　 3. 質問者が返信する際は「最初に質問したレス番号」を名前欄に入れること
　 4. 携帯サイトについては携帯専用スレで質問すること
　 5. ブログについてはブログ板で質問すること
　 　 　●ブログ板 http://pc11.2ch.net/blog/
　 6. SEO、アドセンス、検索サイトに登録しても検索結果に引っかからないといったことは SEO関連スレで質問すること
　 　 　http://find.2ch.net/?STR=seo&TYPE=TITLE
　 7. アクセス解析については該当スレで質問すること
　 　 　http://find.2ch.net/?STR=%A5%A2%A5%AF%A5%BB%A5%B9%B2%F2%C0%CF&TYPE=TITLE
　 8. 製作ソフト（Dreamweaver DW、ホームページビルダー、等）を使用した場合の質問は該当スレで質問すること
　 9. CGI、PHP, Perl, Ruby 等のプログラミング関連や CMS, Wiki は Webprog板、またはこの板の該当スレで質問すること
　 　 　●WEBプログラミング板 http://pc11.2ch.net/php/
　10. JavaScript はこの板の該当スレで質問すること
　11. 画像作成ソフト（Photoshop 、Illustrator、等）については該当スレで質問すること
　12. Flash ついては Flash板で質問すること
　 　 　●FLASH・動画板 http://pc11.2ch.net/swf/
　13. xHTML, CSS, CGI, 制作ソフトなどのどんな本を買えばいい？といったことは書籍についての質問スレで質問すること
　 　 　http://find.2ch.net/?STR=%CC%F2%A4%CB%CE%A9%A4%C4%BD%F1%C0%D2%A4%CF&TYPE=TITLE
　14. 質問内容を吟味して、正しい日本語で第三者が読んでも分かるように質問を書くこと
　15. 間違った回答をする人もいることに注意
【前スレ】
Webサイト制作初心者用質問スレ part236
http://toro.2ch.net/test/read.cgi/hp/1375249110/

2 ：

■HTML・CSSについて
・ごく簡単なHTMLの説明
　　http://www.kanzaki.com/docs/htminfo
・PC Tips
　　http://members.jcom.home.ne.jp/pctips/
・脱初心者をめざす人のためのホームページ作成講座
　　http://az-store.nrym.org/archive/mynotes/lecture/
■文法チェッカー
・Another HTML-lint
　　http://openlab.ring.gr.jp/k16/htmllint/htmllint.html
・The W3C Markup Validation Service
　　http://validator.w3.org/
・CSS検証サービス
　　http://jigsaw.w3.org/css-validator/

3 ：

■散々既出な質問
Q1. アップロードしたファイルが表示されません
A1. ・ブラウザのキャッシュを削除してから再度確認すること
　　 ・ファイルがアップロードされているか、ファイルのパス（絶対パス？相対パス？）があっているか確認すること
　　 ・画像などのコンテンツなら、xHTMLソースで指定したファイル名と拡張子の大文字・小文字の一致を確認すること
　　 ・画像であれば「バイナリモード」で転送されたか確認し、そうでなければテキストモードに設定を変えること
Q2. ホームページを作成しようと思いソフトウェアの購入を検討しています。おすすめのソフトは何でしょうか？
A2. 体験版があればそれを使用することを勧めます
　　 個人で好みが違うので、一概に「これ」が良いと推奨することはできません
　　 あなたが購入を検討している物を天秤にかけ、自分がしたい事が実現できるような物を購入すれば OK です
Q3. 「http://www.〜.com/」で○○したときのような効果を出すには、どうしたらいいのでしょうか
A3. ソースを見て理解する努力を惜しまないことがあなたを救います
　　 初心者だからといってソースを理解する努力をおしめば、期待する効果を実現することは難しいでしょう
Q4. あるURLにアクセスしたとき、携帯とPCで表示するページを変えたいのですが
A4. 「携帯 振り分け」などのキーワードで検索してください
Q5. 正しく書いたつもりなのですが、うまく表示されません
A5. 油断は禁物です
　　 HTML の文法を専用サイトでチェックしてみましょう
　 　http://openlab.jp/k16/htmllint/htmllint.html

4 ：

■文法チェッカー （HTML5対応）
Validator.nu Living Validator
http://validator.nu/

5 ：

>>4は俺じゃないからな一応

6 ：

xhtmlやcss、pho、javascriptのソースはだいたい書けるんですが
webデザイン(サイト全体の絵や画像作成など)が苦手で、その時点でサイトがうまく作れません。
イラストレータやファイアーワークスでサイトデザイン起こしから、その起こした絵を素材としてスライスして使っていくなど
サイト作成の手順というか一連の流れがよくわかるサイトや動画知りませんか？
これってサイト作成でめちゃくちゃ重要だと思うんです。
で、コーディングなんかはそのあとの話だと思っています。
みなさんらどうやっていますか？

7 ：

サイトを作ってようやく公開したんですが人が来ません。
公開して直ぐの時ってどんな宣伝方法がありますか？

8 ：

>>6
完成予想のラフスケッチくらいは書くけど、最初から素材になるような絵を描いたりはしないな。
既にあるものをどう組み合わせるかが主題になる。

9 ：

>>7
ツイッターやフェイスブックや掲示板じゃね

10 ：

>>6
いまはサイズ指定すると適当なサイズの写真用意してくれる便利なサイトもあるからまずそれらで作ってしまう
それをクライアントに見せて細部の手直しをして写真を用意してもらう
画像やロゴデザインは平行してやる
会社に寄っては指定のロゴデザインがあるからそれを取り込む
まず適当な物で代用してこんな感じでって言うのを３パターン用意して選んでもらうと顧客受けもいいよ
まあ私はホームページ作った経験も無いですけどねw

11 ：

わかりました。
デザインは苦手なのでリストとdivとcssだけでテキストオンリーなサイトにしてみます。
つまり、ちょくちょく写真はあっても
サイト全体のデザインやタイトル素材などの見栄えのこだわりはやめて、
コンテンツ重視(テキストベース)でやってみます。

12 ：

ブログの方が良さそうな案件だな。デザインのテンプレートも豊富だし。

13 ：

JavaScriptのオブジェクトとして保持しているデータをIndexed DBに移行することを検討しているのですが
HTML5のWeb StorateやIndexed DBってブラウザ起動中はずっとデータをメモリに持ってるんでしょうか？

14 ：

フォームマスターいますか？
幅高さマージンとか効かないクロスブラウザできないと困ってます。
いい勉強法ないでしょうか

15 ：

>>13
特に決まってません。
>>14
そんな人いません。CSSの勉強がんばってください。

16 ：

前スレで、2ちゃんねるみたいな掲示板やyoutubeみたいな動画共有サイトやgoogleみたいな検索エンジンを作りたいと言ってた者です。
前スレで、「そもそもすでに存在するサイトの類似サービスを作りたいって時点で希望はない」と言われたので、
何か別の新しいモノを作ろうと思うのですが、
どのようなモノなら、googleやyoutubeみたいにヒットすると思われますか？教えてください。

17 ：

そんなのあったら自分でやってる
お前ここで聞いて金儲けに使うんだろ？
図々しいよ

18 ：

>>16
人が欲しいものすべてを無料で提供してくれるものがいいです。
amazonみたいなサイトでオール0円みたいな。

19 ：

>>16
人に言われたからやめる、次は何がいいですかとか。
こういう考えだと、何やっても駄目だな。
松下幸之助氏の言葉にこういうのがある。
ある人から「どうやったらあなたみたいに成功するのですか？」
という問いに対して、こう答えたそうだ。
「あんた、雨の日には傘をさすでしょう」
別になぞなぞではないし、煙に巻いた言葉でもない。

20 ：

>>16
「そもそもすでに存在するサイトの類似サービスを作りたいって時点で希望はない」なんていう戯言はスルーして
自分の作りたいもの作るといいよ

21 ：

>>19
説明が下手って話だね。

22 ：

http://www.hp-pf.com/

23 ：

横幅をwidth100%-200pxみたいに設定する事は出来ないのでしょうか？

24 ：

>>23
幅指定しないで左右のマージンでやれ

25 ：

>>24
すみまｓねん、言い忘れてました
position:absolute;なんですが出来るんでしょうか？

26 ：

>>25
箱を重ねてpaddingを使おう
<div style="width:100%; padding:100px;"> <div style="width:100%">こんてんつ </div> </div>

27 ：

firefox用のcssにそういうのあったような
思い出せねぇなんだっけ

28 ：

>>25
何故試さない
absoluteならleftとmargin-rightを200pxにしてやればいいだけだろ

29 ：

試して失敗すると死ぬ呪いをかけられているんだろう

30 ：

それだと200px分切れるからだろ
俺が考えたのは
・tableのセル使って100%の枠作ってから200pxとその他に分ける
・-moz-でそういうのがあった（忘れた）
この二つ、素直に上の使うがよろし

31 ：

>>28
absoluteだと、widthか中身によって本体の幅が決まる

32 ：

3回もレスしてごめん、思い出した
width:calc(100% - 200px);
はいこれで終了。お疲れ様でした買い物行って来る

33 ：

>>31
そんな中身少ないのを100%でやるのかっつー

34 ：

けっこうページの多いサイトだと、メニュー部分をインラインフレームにするのと
インクルードで呼び出すのってどっちがいい？
インクルードだと.htacsessでhtmlにリネームする予定だけど。
MTもWordPressもNucluesも設置してちょっと使ってはみたけど、結局は思い通りに
しようとするとかえって大変なので、後々のこと考えて静的なサイトで作ることにした。

35 ：

メニューだけ見る奴なんてそうは居ないんだから、インラインフレームでいいんじゃない？

36 ：

>>34
何したいかわからんけど Middleman なり Jekyll なり使えばいいんじゃないの

37 ：

>>34
インクルードでおｋ

38 ：

以前に誰かが公開したサイトをちょこちょこ弄ることになりました初心者です。
・・・で、メインページのソースを確認してるんですが、
画面右クリックで表示されるソースと
Alt→表示→　で表示されるソースが違うのですが、
これは、どのような違いなのでしょうか？
また、右クリックで表示されるソースには、サイト紹介文等が記載されてあるんですが
検索には反映されておりません。
Alt→表示→　側にそれらを打ち込むべきなのでしょうか？

39 ：

何のブラウザか知らないけど、フレームの内容でも出てるんじゃないの。

40 ：

bootstrap3のサンプル見てると
roleタグがいっぱい入ってるんですがこのタグ何の意味があるんですか？
これ書かないといけないんですか？

41 ：

sage質問なのに、こんな即レスとは・・・。
もう少しだけお願いします。
>>39
のとおりフレームを使用したページです。
サイト解説文、キーワードタグは
indexのフレーム外ページに打ち込んであります。
以来一年ほど経ってるようですが、未だ検索には反映されてません。
この書式であっているのか、
フレーム側にタグ打ちする or Alt→表示→　に入力なのか、
ご教示の程お願い致します。

42 ：

サイトオープンして1ヶ月位です。
宣伝目的でツイッターで1時間起きに自動発言＋自動リフォローするプログラムを組んでフォロワーが1000位までは増えました。
アナリティクスとかアクセスログを見ていると、ツイッターからの流入はそこそこ増えてきつつありますが、検索からはさっぱりです。
検索を強くする方法ありませんか？

43 ：

>>41
https://support.google.com/webmasters/answer/34445?hl=ja
>>42
https://www.google.com/webmasters/

44 ：

a

45 ：

使ってもないhttp://rebelmouse.comからアクセスが定期的に来るんだけど何でですか？

46 ：

質問です。
free-letters.com/
上記のような立体的な文字を
自分の好きな文字で作りたいのですが
その場合どのようなソフトを使えばいいのでしょうか？
よろしくお願いします
(忍者修行中はリンク禁止ですとでましたので省略しています)

47 ：

初歩的な質問ですいません。
Dreamweaverでサイトを作成した場合、私のDreamweaverを持たない遠方の人間がサイトを更新出来る方法はありますか？
又作ったファイルをコピーし、相手がDreamweaverを持っていた場合、更新は可能なんでしょうか？
初歩的過ぎると思った為こちらのスレにしたのですが、ドリーム〜スレ向きの質問でしたらすいません。

48 ：

windows付属のメモ帳でも更新出来るよ

49 ：

>>46
フォトショ

50 ：

>>48
ヒントを元に検索したらやり方は分かったんですが、難しいですね…
出来る事だけでも分かって良かったです。レス有り難うございました。

51 ：

>>47の二つ目の質問
(Dreamweaverで作ったサイトのフォルダをコピーして別のDreamweaverで開いてサイトの更新が出来るか)
何方か分かりましたら宜しくお願い致します。

52 ：

ある
できる

53 ：

>>52
出来るんですね、良かったです。
有り難うございました。

54 ：

http://jsbin.com/ebEpiCo/1/edit
afterを使って吹き出しを書く手法が、
overflow: auto;
にすると出来ません
何故か、消えてしまいます
うまく表示するにはどうしたらいいでしょうか？

55 ：

>>54
overflow: visible; であきらめて、中にもう一つdivブロック作ってそれをautoにするのが吉。

56 ：

ありがとうございます
消える原理は何なのでしょうか？
chromeでもfirefoxでもIEでも消えるので、ブラウザごとの挙動のクセというより
仕様的に消えている気がするのですが・・

57 ：

>>56
overflowでvisible以外を設定すると、枠からはみ出た部分は表示されない。
噴出し（test1:after)はtop:-6px;なので枠の外。
top:0px;などにして実験してみるといい。

58 ：

なるほど〜
ありがとうございました

59 ：

そもそもフレームがダメなのか・・・
勉強になりました
ありがとうございました

60 ：

フレームのサイトは最近は少なくなったよね
ちゃんと作ればそれなりに便利ではあるんだけど
SEO対策でフレームは敬遠されるようになっちゃった

61 ：

SEOに関係なくメリットが無かったからなあ

62 ：

今はフレームよりもレスポンシブルWebデザインですよ
もう完璧に使いこなしてますレスポンシブル

63 ：

ttp://webdesignerwork.jp/internetwork/twitter_header_img/
このサイトの.titles2というクラスには
background-image: url(../../img/caption2.jpg)
という画像が設定されているのですが、どうやってダウンロードするのでしょうか？
ブラウザはダウンロードできているのはずなのですが・・・
http://webdesignerwork.jp/img/caption2.jpg
では無理でした

64 ：

>>63
設定がある場所を基点にして考えるべし。

65 ：

>>63
http://webdesignerwork.jp/wp-content/themes/wp_webdesignwork/img/caption2.jpg

66 ：

>>64-65
ありがとうございます。

67 ：

bootstrapのpopoverっていくらでも長くできて画面から平気ではみ出していくのですが
高さ制限は自分でやらないといけないのでしょうか？
レスポンシブデザインだからそのへんもうまく調整してくれると思っていたのですが・・

68 ：

<br/>みたいな書き方を最近はしなくなったのでしょうか？

69 ：

position:relativeにして要素の位置を左にズラした時
後続の要素も間が詰まって欲しいのですが
そんな時はどうやったらいいですか？

70 ：

>>68
普通にするけど

71 ：

>>68
HTML5 では互換性のために許容されてる
HTML で空要素タグってのはどうも気持ち悪いし、意味もないから
わざわざそんな記述にする人はいないだろうね
HTML5 以前の HTML では構文エラーだし、最終出力で今更 XHTML 使うやつはただの馬鹿だから気にしないでいい

72 ：

>>68
スペース忘れてる
改行「だけ」が必要なケースなんて存在しない（あるとしたらpre使う）から
brはしないというより必要ない
改行はpで囲めばおｋ

73 ：

>>69
後続もposition:relative

74 ：

>改行「だけ」が必要なケースなんて存在しない
なにいってんだこいつ

75 ：

というかあれだな、スペースを忘れてるって指摘しちゃうってのが
すでに XML を使ったことないですって言ってるようなもの
手書き（）で XHTML 書いてたかわいそうな人なんだろう
こういう XML をまったく書かない人間が Strict うんぬん語るのって
小学生が社会構造を語るのとかわりない

76 ：

>>71
最近見ないので気になっていたのです
ありがとうございました

77 ：

>>76
待てそのクソコテの話は聞いちゃいけない

78 ：

chromeでDOM要素の絶対座標を知る方法はありますか？

79 ：

>>77
どこが不満なんだ？
XHTML についてならベンダのサポートが期待できないからもう完全に終わったものだよ
FireFox なんかはかなり酷いし、IE はそもそも XML をサポートするつもりがない
XML の利点が享受できないことが確定した現状
いま XHTML を最終出力として選択するのはただのバカ
文書データとしてならまぁいいかもしれないけど、
XHTML1.0,1.1 のゴミみたいな語彙じゃ採用するメリットなんて皆無だし
XHTML5 は変換と学習コスト考えると、ギリギリ許せる

80 ：

グラフを生成するページで単位を「日/月/年」で選ばさせるところがあって
クライアントはセレクトボックスではなくて
　日　/　月　/　年
という形で選択させてくれと言ってるんです
日と月と年には、リンクを貼って、リンクをクリックしたらサーバーにパラメーター(日と月と年のどれか)が渡るんですが
ここで問題なのは、選択してないもの以外は、青にするってことです
どうすればいいのでしょうか

81 ：

>>80
プロなら自分でやれ。
出来ないことは、出来ないと謝れ。

82 ：

>>80
そういうどうでもいいくせにコストのかかる独自仕様じゃなくて、
ラジオボタンを提案し返すのがプロの仕事。

83 ：

入力形式にするのがいいんじゃね
空の場合や有り得ない時間を設定された場合はJavaScriptで一度処理しておくのがお勧めです
色に関しても上記の応用、JavaScriptで例外の値が設定された時に背景色を変更するという手法があります
更にサーバーサイドスクリプト、PerlやPHP等でも同じ処理を施す事で更に安定性を上げられるよ

84 ：

要するにスレ違い

85 ：

別にスレ違いではないけど
ここに限らず専門板の多くは、仕事関係の質問には基本的に冷たい

86 ：

スレ違いじゃねーよ
>>85
金もらってたらどんな低脳でもプロだしな
>>80 とか金もらっていいレベルじゃねーもん

87 ：

レベルとか難度の問題じゃない。
人や資源を使ったならばそれはコスト。
すべて料金に跳ね返ると思え。

88 ：

プロは初心者と言わない気がするよ
未経験者が興味を持ってくれたらいいなとは思うけど、
ううん、金を受け取る事で責任感伝々って考えは前世紀の遺物だし、金を受け取っていいレベルじゃないと断言するよ

89 ：

初心者っぽいコードの方が金になる

90 ：

なるほど、しかしレベルは下げない

91 ：

デジタルガジェットのサイトでこりゃかっけ〜なというサイト晒して

92 ：

<div>
<p/>
<img/>
</div>
<p>と<img>を水平垂直に中央真ん中に並べる方法教えて下さい。

93 ：

position:absolute;
top:50%;
left:50%;
margin:-15% 0 0 -15%;
text-align:center;
CSSでこんな感じでwidthとheight指定かな

94 ：

ありがとうございました

95 ：

ここでいいのかな？
質問させてください。
FC2ブログでRSSを読み込んで表示したいのですが、
ttp://blog.loaferz.com/?eid=670516　のブログの手順通りに
行いましたが、[/item1/title][/item1/dc:date]と表示されてしまい
難航しております。
単純に値が取れていないだけなのでしょうか。

96 ：

divテーブルにして子をテーブルセルにしてミドルにする

97 ：

webで飯食っていけるスレ教えてください。
仕事はしたいですが会社という組織がとても嫌いなので在宅で食っていきます。
web制作を含め、いわゆる他のネットビジネスです。

98 ：

そんな事を堂々と聞いてる時点で100%無理だろうね

99 ：

ねえ、>>92はどうやって読めばいいの

100read 1read

1read 100read
TOP カテ一覧 スレ一覧 2ch元 削除依頼 ▲

SEOのパワーテクノロジー (708)
【ウェブログ】blog 用途は無限大！ 3【日記】 (323)
Strict-HTML スレッド 43 (542)
■ﾃｷｽﾄｴﾃﾞｨﾀだけで製作してる人って・・・■ (343)
HTMLは狂っている (516)
好きな色をカラーコードで書け (349)
--log9.info------------------
■東京外国語大学しょぼすぎワロタ■ (121)
【真の王者】岐阜大学医学部医学科7【名古屋の隣】 (580)
大阪大学医学部医学科 (974)
英語の質問[文法・構文限定]Part67 (744)
数学は暗記じゃない厨のウザさは異常 (256)
【九工大】九州工業大学18 (753)
【旧東水大】東京海洋大学海洋科学部 ９【遠泳】 (704)
山口大学医学部 (218)
どっちの大学ショー part-193 (130)
東海大学医学部編入学試験 (625)
帝京大学スレッド part2 (679)
日東駒専にしか受からなかった時の虚無感は異常 (355)
【ICU】国際基督教大学part43 (723)
◆東京四大学◆part11【学習院 成蹊 成城 武蔵】 (722)
徳島大学◇医・歯・薬学部（蔵本キャンパス） (280)
佐賀大学 (839)
--log55.com------------------
zsh その７
☆☆minix☆☆
こんなStallmanは嫌だ 第6サティアン
ItaniumをUNIXで使うスレ
Windows用の無料Xサーバが欲しい
【地球シミュレータ】NECのスパコン【SXシリーズ】
Tru64とAlphaってどう思いますか？
【間違いない】長井秀和inUNIX板