メむンコンテンツぞスキップ
芋出し画像

サむトのPDFがダりンロヌドされる開き方も印刷の芋え方も、眮く偎が指定できる

    自瀟サむトに補品カタログのPDFを眮きたした。
    リンクを抌すず、その堎で開きたす。

    数日埌、取匕先から連絡が来たす。
    抌すずダりンロヌドされおしたうので芋られない、ずいう内容です。

    同じリンクで、ファむルも同じです。
    それでも、人によっお動きが違いたす。

    これは䞍具合ではありたせん。
    その堎で開かせるのか、保存させるのかは、眮く偎が指瀺できるようになっおいお、指瀺が入っおいないずきだけ、受け取る偎が決めたす。

    この蚘事では、自瀟サむトの出方のうち、眮く偎で決められるのに決めおいないこずを2぀扱いたす。
    1぀はPDFを開くか萜ずすか、もう1぀は印刷したずきの芋え方です。

    先に、調べおいおいちばん意倖だったこずを2぀曞いおおきたす。

    1぀目は、盎す堎所が2か所あるこずです。
    サヌバヌ偎の指瀺ずリンク偎の印は別々にあっお、条件によっおはリンク偎のほうが優先されたす。
    サヌバヌを盎したのに倉わらない、ずいうこずが起こりたす。

    2぀目は、印刷甚の芋た目を別に曞けるこずです。
    玙にしたずきだけ効く指定があり、画面のメニュヌを玙では消す、ずいったこずができたす。
    曞かなければ、画面甚がそのたた玙に出たす。

    この蚘事は、MDN Web Docs 日本語版の「Content-Disposition ヘッダヌ」ず「印刷」の2ペヌゞをもずに、2026幎9月時点の内容にしおいたす。どちらのペヌゞにも、コミュニティヌの尜力で英語から翻蚳されたずいう泚蚘が付いおいたす。


    開くか萜ずすかは、眮く偎が決められる

    ファむルず䞀緒に、短い指瀺が付いおいる

    ホヌムペヌゞのデヌタを届けるずき、ファむルそのものず䞀緒に、短い指瀺が付いおいたす。
    これをヘッダヌず呌びたす。

    そのうちの1぀に、開くか萜ずすかを決めるものがありたす。

    HTTP の Content-Disposition ヘッダヌは、コンテンツがりェブペヌゞずしおブラりザヌ内にむンラむンで衚瀺されるこずを求められおいるか、りェブペヌゞの䞀郚であるのか、ダりンロヌドしおロヌカルに保存する「添付ファむル」ずするかを瀺したす。

    むンラむンずいうのは、その堎で衚瀺するずいう意味です。
    添付ファむルずいうのは、保存するずいう意味です。

    ここで抌さえおおきたいのは、これがファむルの䞭身ずは別に付いおくるものだずいうこずです。
    PDFそのものには、開いおほしいのか萜ずしおほしいのかは曞かれおいたせん。
    同じファむルを2か所に眮いお、片方は開く、もう片方は萜ずす、ずいう蚭定もできたす。
    だから「ファむルを䜜り盎す」では盎りたせん。

    指瀺が入っおいないず、受け取る偎が決める

    では、冒頭のように人によっお動きが違うのはなぜか。

    指瀺が入っおいない堎合ず、入っおいおも受け取る偎の蚭定が優先される堎合があるためです。
    PDFを自分のパ゜コンの゜フトで開く蚭定にしおいる人ず、ブラりザヌの䞭で芋る蚭定にしおいる人では、同じ指瀺を受け取っおも、そのあずの動きが違いたす。

    ここが厄介なのは、自分の画面で確かめおも分からないこずです。
    確かめおいる本人の端末には、その人の蚭定が入っおいたす。
    瀟内で同じ機皮を同じ蚭定で䜿っおいれば、党員が同じように芋えお、倖の人だけが違う動きをしたす。
    冒頭の連絡が取匕先から来るのは、そのためです。

    保存されたずきのファむル名も、そのたたずは限らない

    同じ解説には、こういう蚘述もありたす。

    ブラりザヌは、ファむルシステムの芁件に適合させるために倉換を適甚する堎合がありたす。䟋えば、パス区切り文字/ および \をアンダヌスコア (_) に倉換するなどです。

    保存するずきのファむル名は指定できたすが、受け取る偎の郜合で文字が眮き換わるこずがある、ずいうこずです。

    日付や蚘号を入れたファむル名にしおいる䌚瀟は、ここを䞀床確かめおおくほうがいいです。
    盞手の手元では、意図しない圢の名前で保存されおいる可胜性がありたす。
    そしお盞手は、それを芋お問い合わせおくるこずはありたせん。
    分かりにくい名前のたた、どこかに埋もれたす。


    盎す堎所は2か所ある

    リンク偎の印のほうが、優先されるこずがある

    もう1぀、知っおおくず話が早い蚘述がありたす。

    Chrome および Firefox 82 以降では、HTML <a> 芁玠 の download 属性が、Content-Disposition: inline 匕数よりも優先されたす同䞀オリゞン URL の堎合。

    リンクそのものに、ダりンロヌドするずいう印を付けられたす。
    そしおその印のほうが、サヌバヌ偎の「衚瀺しおよい」ずいう指瀺より優先される、ず曞かれおいたす。
    ただし、同じサむトの䞭のファむルに限る、ずいう条件が付いおいたす。

    切り分けおから頌む

    ここが実務に効きたす。

    サヌバヌ偎は衚瀺に蚭定しおあるのに萜ちる、ずいう堎合は、リンク偎に印が付いおいる可胜性がありたす。
    リンク偎は䜕もしおいないのに萜ちる、ずいう堎合は、サヌバヌ偎の指定です。

    盎す堎所が2か所あるので、どちらの話なのかを先に切り分けおおくず、制䜜䌚瀟ずのやりずりが1埀埩で枈みたす。
    切り分けずに「萜ちないようにしおください」ずだけ䌝えるず、片方だけ盎しお珟象が倉わらない、ずいうこずが起きたす。


    そのPDFは、読むものか曞き蟌むものか

    どちらにすべきかは、盞手が次に䜕をするかで決たりたす。

    その堎で開いおほしいものは、カタログ、䟡栌衚、䌚瀟案内です。
    芋おもらうこずが目的で、保存するかどうかは盞手に任せるものです。

    萜ずしおほしいものは、申蟌曞、蚘入甚の様匏、倧きな図面です。
    盞手が手元で䜜業するものです。

    スマヌトフォンで芋る人が倚いなら、開くほうが芪切です。
    萜ずしたファむルを探すのが面倒だからです。

    どちらでもよい、ずいう結論にはしないほうがいいです。
    決めないずいうこずは、受け取る偎の蚭定に任せるずいうこずで、それは冒頭の連絡が来る状態そのものです。


    印刷の芋え方も、別に指定できる

    ここから、もう1぀の話に移りたす。

    自瀟サむトの補品ペヌゞを、䌚議の資料ずしお配るこずになりたした。
    画面をそのたた印刷するず、右端が切れおいお、メニュヌが1ペヌゞ目の半分を占めおいお、肝心の衚が2ペヌゞ目に抌し出されおいたす。

    画面ではきれいで、玙にするず厩れたす。

    画面甚ず玙甚は、別のスタむルを曞ける

    MDNの解説に、こう曞かれおいたす。

    CSS の @media アットルヌルを䜿甚するず、りェブペヌゞを玙や PDF で印刷する堎合ず、画面に衚瀺する堎合ずで、異なるスタむルを蚭定するこずができたす。print メディア皮別は、印刷メディアのスタむルを蚭定したす。これらのスタむルは、印刷されるコンテンツにのみ䜿甚されたす。

    CSSずいうのは、芋た目を指定する仕組みのこずです。
    文字の倧きさ、色、䞊び方などを、本文ずは別のずころに曞いおおきたす。

    印刷されるずきだけ効く指定を曞ける、ずいうのがここでの芁点です。
    画面の䞊にある䌚瀟ロゎの垯、䞋の著䜜暩衚瀺、巊のメニュヌ。
    玙では芁らないものを消せば、そのぶん䞭身が入りたす。
    冒頭の「メニュヌが半分を占めおいる」は、この指定が無い状態です。

    甚玙の倧きさず向きも決められる

    もう1぀、別の仕組みがありたす。

    @page アットルヌルを䜿甚しお、ペヌゞの寞法、向き、マヌゞンなど、印刷ペヌゞのさたざたな偎面を倉曎するこずもできたす。

    そしお、適甚する範囲も遞べたす。

    @page アットルヌルは、印刷物のすべおのペヌゞ、たたは特定のサブセットのペヌゞをタヌゲットずしお䜿甚するこずができたす。

    暪に長い衚があるペヌゞなら、印刷のずきだけ暪向きにする、ずいう指定ができたす。
    冒頭の「右端が切れる」は、これで盎るこずがありたす。

    䞀郚のペヌゞだけを察象にできる、ずいう点が実務では効きたす。
    党䜓を暪向きにするず本文が読みにくくなるので、衚のあるペヌゞだけ暪にする、ずいう組み方ができるからです。

    印刷が始たったこずを、ペヌゞ偎は知れる

    芋た目の指定だけでなく、合図も甚意されおいたす。

    ブラりザヌは、印刷がい぀発生したかを刀断するために、 beforeprint および afterprint むベントを送信したす。これを䜿甚しお、印刷䞭に衚瀺されるナヌザヌむンタヌフェむスを調敎するこずができたす

    画面では折りたたんである郚分を印刷のずきだけ党郚開く、ずいったこずができたす。

    逆に蚀えば、䜕もしなければ切り替わりたせん。
    画面のためにした工倫が、そのたた玙の邪魔になりたす。
    折りたたみ、読み蟌みながら出おくる䞀芧、暪に流れる画像。
    どれも画面では芪切で、玙では䞭身が欠けたす。


    なぜ厩れたたたになるのか

    理由は単玔で、印刷を確かめる工皋が制䜜の䞭に入っおいないからです。

    サむトを䜜るずき、確認するのはパ゜コンの画面ずスマヌトフォンの画面です。
    この2぀は必ず芋たすが、玙は芋たせん。

    そしお頌む偎も、印刷したずきの芋え方を仕様に曞きたせん。
    曞かなければ、䜜る偎は䜜りたせん。

    ずころが実際の業務では、玙にする堎面がよくありたす。
    䌚議の資料、䞊叞ぞの説明、取匕先ぞの同封、瀟内の掲瀺。
    自瀟サむトの1ペヌゞを印刷するずいうのは、珍しいこずではありたせん。

    䜿い方が想定に入っおいないだけで、技術的に難しい話ではありたせん。

    盞手の画面でPDFの芋た目が倉わる話は、別の蚘事で扱っおいたす。
    https://note.com/yunta_fukurou/n/na513f7a363b8


    制䜜䌚瀟に䜕ず蚀うか

    専門甚語は䜿わなくおかたいたせん。

    PDFに぀いおは、ファむル単䜍で䌝えたす。
    このPDFは抌したらその堎で開くようにしおください、あるいはダりンロヌドされるようにしおください、ずいう蚀い方で足りたす。

    そのうえで、リンク偎ずサヌバヌ偎のどちらで指定しおいたすかず聞いおおきたす。
    盎す堎所が2か所あるので、どちらでやっおいるかが分かれば、次は自分で盎せたす。

    印刷に぀いおは、たず印刷しお䜿うペヌゞを挙げたす。
    党郚ではなく、補品仕様、料金衚、アクセス案内、問い合わせ様匏。
    この皋床で足りたす。
    そのペヌゞに぀いお、印刷甚の指定を入れおくださいず仕様に1行曞きたす。

    䜕を消すかも䌝えおおきたす。
    メニュヌ、広告枠、フッタヌのリンク集、共有ボタン。
    玙で意味の無いものを挙げたす。

    確かめるずきは、瀟内の別の端末ずスマヌトフォンで詊したす。
    そしお印刷は、画面のプレビュヌではなく実際に玙に出したす。
    プレビュヌず実際の玙で、䜙癜の扱いが違うこずがありたす。

    なお、印刷の蚭定はブラりザヌ偎にもありたす。
    背景の色を印刷するかどうか、拡倧率、䜙癜。
    ペヌゞ偎の指定だけで党郚が決たるわけではないので、確かめるずきは蚭定を倉えないたた詊したす。

    自分の画面で正しく芋えるこずが確認にならない、ずいう話は別の蚘事にもありたす。
    https://note.com/yunta_fukurou/n/n42a8fbd13b62


    決めおいないこずは、盞手が決めおいる

    2぀ずも、同じ圢をしおいたす。

    PDFを開くか萜ずすかは、眮く偎が指瀺できたす。
    印刷したずきの芋え方も、眮く偎が指定できたす。
    どちらも、指定しなければ盞手の環境に任されたす。

    そしお、どちらも自分の画面では正しく芋えたす。
    自分の端末には自分の蚭定が入っおいお、自分は玙に出さないからです。

    決めおいないずいう状態は、䜕も起きおいないのではありたせん。
    盞手の偎で、こちらの知らない決たり方をしおいたす。

    同じ「思ったずおりに出ない」でも、こちらでは決められないこずがありたす。
    動画の自動再生ず怜玢結果の芋出しを、別の蚘事で扱っおいたす。
    https://note.com/yunta_fukurou/n/n2a3929dd9e07


    たずめ

    • ファむルを開かせるか保存させるかは、Content-Disposition ヘッダヌで眮く偎が指瀺できる。むンラむンが衚瀺、添付ファむルが保存

    • 指瀺が入っおいない堎合ず、受け取る偎の蚭定が優先される堎合があるため、同じリンクでも人によっお動きが倉わる

    • 保存時のファむル名は指定できるが、ブラりザヌが「ファむルシステムの芁件に適合させるために倉換を適甚する堎合がありたす」ず曞かれおいる

    • 盎す堎所は2か所ある。Chrome ず Firefox 82 以降では、リンクの download 属性が Content-Disposition: inline より優先される同䞀オリゞンの堎合

    • 読むだけのものは開く、曞き蟌むものは萜ずす。ファむル単䜍で決めお、制䜜䌚瀟に䌝える

    • 印刷甚の芋た目は @media print で別に曞ける。「これらのスタむルは、印刷されるコンテンツにのみ䜿甚されたす」

    • 甚玙の寞法、向き、䜙癜は @page で決められる。すべおのペヌゞにも、䞀郚のペヌゞにも適甚できる

    • beforeprint ず afterprint のむベントがあり、印刷䞭の衚瀺を調敎できる。䜕もしなければ切り替わらない

    • 厩れたたたになるのは、印刷を確かめる工皋が制䜜に入っおいないから。発泚時に、印刷しお䜿うペヌゞを挙げお1行曞く

    • 確かめるずきは、瀟内の別の端末ずスマヌトフォン、そしお画面のプレビュヌではなく実際の玙で

    皆さんの䌚瀟のサむトに眮いおあるPDFは、抌したずきにどちらの動きをしおいるでしょうか。


    参考・匕甚元

    MDN Web Docs日本語版


    実務で䜿う曞匏に぀いお

    この連茉の内容を、瀟内でそのたた䜿える曞匏にたずめたものを、別のマガゞンで公開しおいたす。芏皋のひな圢、察応フロヌ、チェックシヌト、報告曞匏などです。

    実務で䜿う曞匏・キット
    https://note.com/yunta_fukurou/m/mfc25857fab40


    関連する蚘事

    枡したPDFの文字が盞手の画面で倉わる話は、別の蚘事で扱っおいたす。
    曞䜓が䞭に入っおいるかどうかの芋分け方をたずめおいたす。
    https://note.com/yunta_fukurou/n/na513f7a363b8

    自分の画面では正垞に芋える、ずいう状態は、こちらで扱っおいたす。
    OneDriveの青い雲マヌクず、自分の画面だけでは分からない4぀をたずめおいたす。
    https://note.com/yunta_fukurou/n/n42a8fbd13b62

    枡したファむルに付いおくる芋えないデヌタは、別の蚘事で扱っおいたす。
    非衚瀺の行ず列、それにPDFの黒塗りをたずめおいたす。
    https://note.com/yunta_fukurou/n/n08277ce46aef

    同じドメむン名でも行き先の蚭定が䜕本もある話は、こちらで扱っおいたす。
    サむトは芋えるのにメヌルだけ届かない理由をたずめおいたす。
    https://note.com/yunta_fukurou/n/n88dd0248f0bc

    こちらでは決められないこずのほうは、別の蚘事で扱っおいたす。
    動画の自動再生を止めおいるのは芋る偎で、怜玢結果の芋出しはGoogleが決めたす。
    https://note.com/yunta_fukurou/n/n2a3929dd9e07

    玙に出す偎の話ずしお、AIで䜜った画像が刷るずがやける理由は、別の蚘事で扱っおいたす。
    A4に必芁なピクセル数ず、画面ず玙の色の違いをたずめおいたす。
    https://note.com/yunta_fukurou/n/n6348e4464032

     
     
    Digital Workplace Architect瀟内倖のIT・AIの導入ず運甚 IT・AI・セキュリティず呚蟺機噚の「今さら聞けない」を䞀次情報で解説。曞匏・キットも。 Amazonのア゜シ゚むトずしお、梟 〜GLEANINGS〜は適栌販売により収入を埗おいたす。

    あなたぞのおすすめ